Merge branch '4.x' into Feature-Reorderable-columns

docs/09-advanced/02-assets.md

@@ -247,7 +247,7 @@ const defaultOptions = {
     minify: !isDev,
     plugins: [{
         name: 'watchPlugin',
-        setup: function (build) {
+        setup(build) {
             build.onStart(() => {
                 console.log(`Build started at ${new Date(Date.now()).toLocaleTimeString()}: ${build.initialOptions.outfile}`)
             })
@@ -285,7 +285,7 @@ export default function testComponent({
         
         // You can define any other Alpine.js properties here.
 
-        init: function () {
+        init() {
             // Initialise the Alpine component here, if you need to.
         },
         

packages/actions/dist/index.js

@@ -1 +1 @@
-(()=>{var i=({livewireId:n})=>({actionNestingIndex:null,init:function(){window.addEventListener("sync-action-modals",t=>{t.detail.id===n&&this.syncActionModals(t.detail.newActionNestingIndex)})},syncActionModals:function(t){if(this.actionNestingIndex!==t&&(this.actionNestingIndex!==null&&this.closeModal(),this.actionNestingIndex=t,this.actionNestingIndex!==null)){if(!this.$el.querySelector(`#${this.generateModalId(t)}`)){this.$nextTick(()=>this.openModal());return}this.openModal()}},generateModalId:function(t){return`fi-${n}-action-`+t},openModal:function(){let t=this.generateModalId(this.actionNestingIndex);this.$dispatch("open-modal",{id:t})},closeModal:function(){let t=this.generateModalId(this.actionNestingIndex);this.$dispatch("close-modal-quietly",{id:t})}});document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentActionModals",i)});})();
+(()=>{var n=({livewireId:i})=>({actionNestingIndex:null,init(){window.addEventListener("sync-action-modals",t=>{t.detail.id===i&&this.syncActionModals(t.detail.newActionNestingIndex)})},syncActionModals(t){if(this.actionNestingIndex!==t&&(this.actionNestingIndex!==null&&this.closeModal(),this.actionNestingIndex=t,this.actionNestingIndex!==null)){if(!this.$el.querySelector(`#${this.generateModalId(t)}`)){this.$nextTick(()=>this.openModal());return}this.openModal()}},generateModalId(t){return`fi-${i}-action-`+t},openModal(){let t=this.generateModalId(this.actionNestingIndex);this.$dispatch("open-modal",{id:t})},closeModal(){let t=this.generateModalId(this.actionNestingIndex);this.$dispatch("close-modal-quietly",{id:t})}});document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentActionModals",n)});})();

packages/actions/resources/js/components/modals.js

@@ -1,7 +1,7 @@
 export default ({ livewireId }) => ({
     actionNestingIndex: null,
 
-    init: function () {
+    init() {
         window.addEventListener('sync-action-modals', (event) => {
             if (event.detail.id !== livewireId) {
                 return
@@ -11,7 +11,7 @@ export default ({ livewireId }) => ({
         })
     },
 
-    syncActionModals: function (newActionNestingIndex) {
+    syncActionModals(newActionNestingIndex) {
         if (this.actionNestingIndex === newActionNestingIndex) {
             return
         }
@@ -39,19 +39,19 @@ export default ({ livewireId }) => ({
         this.openModal()
     },
 
-    generateModalId: function (actionNestingIndex) {
+    generateModalId(actionNestingIndex) {
         // HTML IDs must start with a letter, so if the Livewire component ID starts
         // with a number, we need to make sure it does not fail by prepending `fi-`.
         return `fi-${livewireId}-action-` + actionNestingIndex
     },
 
-    openModal: function () {
+    openModal() {
         const id = this.generateModalId(this.actionNestingIndex)
 
         this.$dispatch('open-modal', { id })
     },
 
-    closeModal: function () {
+    closeModal() {
         const id = this.generateModalId(this.actionNestingIndex)
 
         this.$dispatch('close-modal-quietly', { id })

packages/forms/dist/components/checkbox-list.js

@@ -1 +1 @@
-function s({livewireId:c}){return{areAllCheckboxesChecked:!1,checkboxListOptions:[],search:"",visibleCheckboxListOptions:[],init:function(){this.checkboxListOptions=Array.from(this.$root.querySelectorAll(".fi-fo-checkbox-list-option")),this.updateVisibleCheckboxListOptions(),this.$nextTick(()=>{this.checkIfAllCheckboxesAreChecked()}),Livewire.hook("commit",({component:e,commit:t,succeed:i,fail:o,respond:h})=>{i(({snapshot:r,effect:n})=>{this.$nextTick(()=>{e.id===c&&(this.checkboxListOptions=Array.from(this.$root.querySelectorAll(".fi-fo-checkbox-list-option")),this.updateVisibleCheckboxListOptions(),this.checkIfAllCheckboxesAreChecked())})})}),this.$watch("search",()=>{this.updateVisibleCheckboxListOptions(),this.checkIfAllCheckboxesAreChecked()})},checkIfAllCheckboxesAreChecked:function(){this.areAllCheckboxesChecked=this.visibleCheckboxListOptions.length===this.visibleCheckboxListOptions.filter(e=>e.querySelector("input[type=checkbox]:checked")).length},toggleAllCheckboxes:function(){this.checkIfAllCheckboxesAreChecked();let e=!this.areAllCheckboxesChecked;this.visibleCheckboxListOptions.forEach(t=>{let i=t.querySelector("input[type=checkbox]");i.disabled||(i.checked=e,i.dispatchEvent(new Event("change")))}),this.areAllCheckboxesChecked=e},updateVisibleCheckboxListOptions:function(){this.visibleCheckboxListOptions=this.checkboxListOptions.filter(e=>["",null,void 0].includes(this.search)||e.querySelector(".fi-fo-checkbox-list-option-label")?.innerText.toLowerCase().includes(this.search.toLowerCase())?!0:e.querySelector(".fi-fo-checkbox-list-option-description")?.innerText.toLowerCase().includes(this.search.toLowerCase()))}}}export{s as default};
+function c({livewireId:s}){return{areAllCheckboxesChecked:!1,checkboxListOptions:[],search:"",visibleCheckboxListOptions:[],init(){this.checkboxListOptions=Array.from(this.$root.querySelectorAll(".fi-fo-checkbox-list-option")),this.updateVisibleCheckboxListOptions(),this.$nextTick(()=>{this.checkIfAllCheckboxesAreChecked()}),Livewire.hook("commit",({component:e,commit:t,succeed:i,fail:o,respond:h})=>{i(({snapshot:r,effect:l})=>{this.$nextTick(()=>{e.id===s&&(this.checkboxListOptions=Array.from(this.$root.querySelectorAll(".fi-fo-checkbox-list-option")),this.updateVisibleCheckboxListOptions(),this.checkIfAllCheckboxesAreChecked())})})}),this.$watch("search",()=>{this.updateVisibleCheckboxListOptions(),this.checkIfAllCheckboxesAreChecked()})},checkIfAllCheckboxesAreChecked(){this.areAllCheckboxesChecked=this.visibleCheckboxListOptions.length===this.visibleCheckboxListOptions.filter(e=>e.querySelector("input[type=checkbox]:checked")).length},toggleAllCheckboxes(){this.checkIfAllCheckboxesAreChecked();let e=!this.areAllCheckboxesChecked;this.visibleCheckboxListOptions.forEach(t=>{let i=t.querySelector("input[type=checkbox]");i.disabled||(i.checked=e,i.dispatchEvent(new Event("change")))}),this.areAllCheckboxesChecked=e},updateVisibleCheckboxListOptions(){this.visibleCheckboxListOptions=this.checkboxListOptions.filter(e=>["",null,void 0].includes(this.search)||e.querySelector(".fi-fo-checkbox-list-option-label")?.innerText.toLowerCase().includes(this.search.toLowerCase())?!0:e.querySelector(".fi-fo-checkbox-list-option-description")?.innerText.toLowerCase().includes(this.search.toLowerCase()))}}}export{c as default};

packages/forms/dist/components/key-value.js

@@ -1 +1 @@
-function r({state:n}){return{state:n,rows:[],init:function(){this.updateRows(),this.rows.length<=0?this.rows.push({key:"",value:""}):this.updateState(),this.$watch("state",(e,t)=>{let s=i=>i===null?0:Array.isArray(i)?i.length:typeof i!="object"?0:Object.keys(i).length;s(e)===0&&s(t)===0||this.updateRows()})},addRow:function(){this.rows.push({key:"",value:""}),this.updateState()},deleteRow:function(e){this.rows.splice(e,1),this.rows.length<=0&&this.addRow(),this.updateState()},reorderRows:function(e){let t=Alpine.raw(this.rows);this.rows=[];let s=t.splice(e.oldIndex,1)[0];t.splice(e.newIndex,0,s),this.$nextTick(()=>{this.rows=t,this.updateState()})},updateRows:function(){let t=Alpine.raw(this.state).map(({key:s,value:i})=>({key:s,value:i}));this.rows.forEach(s=>{(s.key===""||s.key===null)&&t.push({key:"",value:s.value})}),this.rows=t},updateState:function(){let e=[];this.rows.forEach(t=>{t.key===""||t.key===null||e.push({key:t.key,value:t.value})}),JSON.stringify(this.state)!==JSON.stringify(e)&&(this.state=e)}}}export{r as default};
+function h({state:r}){return{state:r,rows:[],init(){this.updateRows(),this.rows.length<=0?this.rows.push({key:"",value:""}):this.updateState(),this.$watch("state",(e,t)=>{let s=i=>i===null?0:Array.isArray(i)?i.length:typeof i!="object"?0:Object.keys(i).length;s(e)===0&&s(t)===0||this.updateRows()})},addRow(){this.rows.push({key:"",value:""}),this.updateState()},deleteRow(e){this.rows.splice(e,1),this.rows.length<=0&&this.addRow(),this.updateState()},reorderRows(e){let t=Alpine.raw(this.rows);this.rows=[];let s=t.splice(e.oldIndex,1)[0];t.splice(e.newIndex,0,s),this.$nextTick(()=>{this.rows=t,this.updateState()})},updateRows(){let t=Alpine.raw(this.state).map(({key:s,value:i})=>({key:s,value:i}));this.rows.forEach(s=>{(s.key===""||s.key===null)&&t.push({key:"",value:s.value})}),this.rows=t},updateState(){let e=[];this.rows.forEach(t=>{t.key===""||t.key===null||e.push({key:t.key,value:t.value})}),JSON.stringify(this.state)!==JSON.stringify(e)&&(this.state=e)}}}export{h as default};

packages/forms/dist/components/tags-input.js

@@ -1 +1 @@
-function i({state:a,splitKeys:n}){return{newTag:"",state:a,createTag:function(){if(this.newTag=this.newTag.trim(),this.newTag!==""){if(this.state.includes(this.newTag)){this.newTag="";return}this.state.push(this.newTag),this.newTag=""}},deleteTag:function(t){this.state=this.state.filter(e=>e!==t)},reorderTags:function(t){let e=this.state.splice(t.oldIndex,1)[0];this.state.splice(t.newIndex,0,e),this.state=[...this.state]},input:{"x-on:blur":"createTag()","x-model":"newTag","x-on:keydown"(t){["Enter",...n].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.createTag())},"x-on:paste"(){this.$nextTick(()=>{if(n.length===0){this.createTag();return}let t=n.map(e=>e.replace(/[/\-\\^$*+?.()|[\]{}]/g,"\\$&")).join("|");this.newTag.split(new RegExp(t,"g")).forEach(e=>{this.newTag=e,this.createTag()})})}}}}export{i as default};
+function s({state:n,splitKeys:a}){return{newTag:"",state:n,createTag(){if(this.newTag=this.newTag.trim(),this.newTag!==""){if(this.state.includes(this.newTag)){this.newTag="";return}this.state.push(this.newTag),this.newTag=""}},deleteTag(t){this.state=this.state.filter(e=>e!==t)},reorderTags(t){let e=this.state.splice(t.oldIndex,1)[0];this.state.splice(t.newIndex,0,e),this.state=[...this.state]},input:{"x-on:blur":"createTag()","x-model":"newTag","x-on:keydown"(t){["Enter",...a].includes(t.key)&&(t.preventDefault(),t.stopPropagation(),this.createTag())},"x-on:paste"(){this.$nextTick(()=>{if(a.length===0){this.createTag();return}let t=a.map(e=>e.replace(/[/\-\\^$*+?.()|[\]{}]/g,"\\$&")).join("|");this.newTag.split(new RegExp(t,"g")).forEach(e=>{this.newTag=e,this.createTag()})})}}}}export{s as default};

packages/forms/dist/components/textarea.js

@@ -1 +1 @@
-function r({initialHeight:t,shouldAutosize:i,state:s}){return{state:s,wrapperEl:null,init:function(){this.wrapperEl=this.$el.parentNode,this.setInitialHeight(),i?this.$watch("state",()=>{this.resize()}):this.setUpResizeObserver()},setInitialHeight:function(){this.$el.scrollHeight<=0||(this.wrapperEl.style.height=t+"rem")},resize:function(){if(this.setInitialHeight(),this.$el.scrollHeight<=0)return;let e=this.$el.scrollHeight+"px";this.wrapperEl.style.height!==e&&(this.wrapperEl.style.height=e)},setUpResizeObserver:function(){new ResizeObserver(()=>{this.wrapperEl.style.height=this.$el.style.height}).observe(this.$el)}}}export{r as default};
+function r({initialHeight:t,shouldAutosize:i,state:s}){return{state:s,wrapperEl:null,init(){this.wrapperEl=this.$el.parentNode,this.setInitialHeight(),i?this.$watch("state",()=>{this.resize()}):this.setUpResizeObserver()},setInitialHeight(){this.$el.scrollHeight<=0||(this.wrapperEl.style.height=t+"rem")},resize(){if(this.setInitialHeight(),this.$el.scrollHeight<=0)return;let e=this.$el.scrollHeight+"px";this.wrapperEl.style.height!==e&&(this.wrapperEl.style.height=e)},setUpResizeObserver(){new ResizeObserver(()=>{this.wrapperEl.style.height=this.$el.style.height}).observe(this.$el)}}}export{r as default};

packages/forms/resources/js/components/checkbox-list.js

@@ -8,7 +8,7 @@ export default function checkboxListFormComponent({ livewireId }) {
 
         visibleCheckboxListOptions: [],
 
-        init: function () {
+        init() {
             this.checkboxListOptions = Array.from(
                 this.$root.querySelectorAll('.fi-fo-checkbox-list-option'),
             )
@@ -48,7 +48,7 @@ export default function checkboxListFormComponent({ livewireId }) {
             })
         },
 
-        checkIfAllCheckboxesAreChecked: function () {
+        checkIfAllCheckboxesAreChecked() {
             this.areAllCheckboxesChecked =
                 this.visibleCheckboxListOptions.length ===
                 this.visibleCheckboxListOptions.filter((checkboxLabel) =>
@@ -56,7 +56,7 @@ export default function checkboxListFormComponent({ livewireId }) {
                 ).length
         },
 
-        toggleAllCheckboxes: function () {
+        toggleAllCheckboxes() {
             this.checkIfAllCheckboxesAreChecked()
 
             const inverseAreAllCheckboxesChecked = !this.areAllCheckboxesChecked
@@ -77,7 +77,7 @@ export default function checkboxListFormComponent({ livewireId }) {
             this.areAllCheckboxesChecked = inverseAreAllCheckboxesChecked
         },
 
-        updateVisibleCheckboxListOptions: function () {
+        updateVisibleCheckboxListOptions() {
             this.visibleCheckboxListOptions = this.checkboxListOptions.filter(
                 (checkboxListItem) => {
                     if (['', null, undefined].includes(this.search)) {

packages/forms/resources/js/components/code-editor.js

@@ -19,7 +19,7 @@ export default function codeEditorFormComponent({
         themeCompartment: new Compartment(),
         state,
 
-        init: function () {
+        init() {
             const languageExtension = this.getLanguageExtension()
 
             this.editor = new EditorView({
@@ -72,15 +72,15 @@ export default function codeEditorFormComponent({
             })
         },
 
-        isDarkMode: function () {
+        isDarkMode() {
             return document.documentElement.classList.contains('dark')
         },
 
-        getThemeExtensions: function () {
+        getThemeExtensions() {
             return this.isDarkMode() ? [oneDark] : []
         },
 
-        getLanguageExtension: function () {
+        getLanguageExtension() {
             if (!language) {
                 return null
             }
@@ -96,7 +96,7 @@ export default function codeEditorFormComponent({
             return extensions[language]?.() || null
         },
 
-        destroy: function () {
+        destroy() {
             if (this.themeObserver) {
                 this.themeObserver.disconnect()
                 this.themeObserver = null

packages/forms/resources/js/components/color-picker.js

@@ -15,7 +15,7 @@ export default function colorPickerFormComponent({
     return {
         state,
 
-        init: function () {
+        init() {
             if (!(this.state === null || this.state === '')) {
                 this.setState(this.state)
             }
@@ -57,7 +57,7 @@ export default function colorPickerFormComponent({
             }
         },
 
-        togglePanelVisibility: function () {
+        togglePanelVisibility() {
             if (isDisabled) {
                 return
             }
@@ -65,18 +65,18 @@ export default function colorPickerFormComponent({
             this.$refs.panel.toggle(this.$refs.input)
         },
 
-        setState: function (value) {
+        setState(value) {
             this.state = value
 
             this.$refs.input.value = value
             this.$refs.panel.color = value
         },
 
-        isOpen: function () {
+        isOpen() {
             return this.$refs.panel.style.display === 'block'
         },
 
-        commitState: function () {
+        commitState() {
             if (
                 JSON.stringify(this.$wire.__instance.canonical) ===
                 JSON.stringify(this.$wire.__instance.ephemeral)

packages/forms/resources/js/components/date-time-picker.js

@@ -50,7 +50,7 @@ export default function dateTimePickerFormComponent({
 
         months: [],
 
-        init: function () {
+        init() {
             dayjs.locale(locales[locale] ?? locales['en'])
 
             this.focusedDate = dayjs().tz(timezone)
@@ -242,7 +242,7 @@ export default function dateTimePickerFormComponent({
             })
         },
 
-        clearState: function () {
+        clearState() {
             this.isClearingState = true
 
             this.setState(null)
@@ -254,7 +254,7 @@ export default function dateTimePickerFormComponent({
             this.$nextTick(() => (this.isClearingState = false))
         },
 
-        dateIsDisabled: function (date) {
+        dateIsDisabled(date) {
             if (
                 this.$refs?.disabledDates &&
                 JSON.parse(this.$refs.disabledDates.value ?? []).some(
@@ -282,13 +282,13 @@ export default function dateTimePickerFormComponent({
             return false
         },
 
-        dayIsDisabled: function (day) {
+        dayIsDisabled(day) {
             this.focusedDate ??= dayjs().tz(timezone)
 
             return this.dateIsDisabled(this.focusedDate.date(day))
         },
 
-        dayIsSelected: function (day) {
+        dayIsSelected(day) {
             let selectedDate = this.getSelectedDate()
 
             if (selectedDate === null) {
@@ -304,7 +304,7 @@ export default function dateTimePickerFormComponent({
             )
         },
 
-        dayIsToday: function (day) {
+        dayIsToday(day) {
             let date = dayjs().tz(timezone)
             this.focusedDate ??= date
 
@@ -315,31 +315,31 @@ export default function dateTimePickerFormComponent({
             )
         },
 
-        focusPreviousDay: function () {
+        focusPreviousDay() {
             this.focusedDate ??= dayjs().tz(timezone)
 
             this.focusedDate = this.focusedDate.subtract(1, 'day')
         },
 
-        focusPreviousWeek: function () {
+        focusPreviousWeek() {
             this.focusedDate ??= dayjs().tz(timezone)
 
             this.focusedDate = this.focusedDate.subtract(1, 'week')
         },
 
-        focusNextDay: function () {
+        focusNextDay() {
             this.focusedDate ??= dayjs().tz(timezone)
 
             this.focusedDate = this.focusedDate.add(1, 'day')
         },
 
-        focusNextWeek: function () {
+        focusNextWeek() {
             this.focusedDate ??= dayjs().tz(timezone)
 
             this.focusedDate = this.focusedDate.add(1, 'week')
         },
 
-        getDayLabels: function () {
+        getDayLabels() {
             const labels = dayjs.weekdaysShort()
 
             if (firstDayOfWeek === 0) {
@@ -352,19 +352,19 @@ export default function dateTimePickerFormComponent({
             ]
         },
 
-        getMaxDate: function () {
+        getMaxDate() {
             let date = dayjs(this.$refs.maxDate?.value)
 
             return date.isValid() ? date : null
         },
 
-        getMinDate: function () {
+        getMinDate() {
             let date = dayjs(this.$refs.minDate?.value)
 
             return date.isValid() ? date : null
         },
 
-        getSelectedDate: function () {
+        getSelectedDate() {
             if (this.state === undefined) {
                 return null
             }
@@ -382,7 +382,7 @@ export default function dateTimePickerFormComponent({
             return date
         },
 
-        togglePanelVisibility: function () {
+        togglePanelVisibility() {
             if (!this.isOpen()) {
                 this.focusedDate =
                     this.getSelectedDate() ??
@@ -395,7 +395,7 @@ export default function dateTimePickerFormComponent({
             this.$refs.panel.toggle(this.$refs.button)
         },
 
-        selectDate: function (day = null) {
+        selectDate(day = null) {
             if (day) {
                 this.setFocusedDay(day)
             }
@@ -409,21 +409,21 @@ export default function dateTimePickerFormComponent({
             }
         },
 
-        setDisplayText: function () {
+        setDisplayText() {
             this.displayText = this.getSelectedDate()
                 ? this.getSelectedDate().format(displayFormat)
                 : ''
         },
 
-        setMonths: function () {
+        setMonths() {
             this.months = dayjs.months()
         },
 
-        setDayLabels: function () {
+        setDayLabels() {
             this.dayLabels = this.getDayLabels()
         },
 
-        setupDaysGrid: function () {
+        setupDaysGrid() {
             this.focusedDate ??= dayjs().tz(timezone)
 
             this.emptyDaysInFocusedMonth = Array.from(
@@ -441,13 +441,13 @@ export default function dateTimePickerFormComponent({
             )
         },
 
-        setFocusedDay: function (day) {
+        setFocusedDay(day) {
             this.focusedDate = (this.focusedDate ?? dayjs().tz(timezone)).date(
                 day,
             )
         },
 
-        setState: function (date) {
+        setState(date) {
             if (date === null) {
                 this.state = null
                 this.setDisplayText()
@@ -468,7 +468,7 @@ export default function dateTimePickerFormComponent({
             this.setDisplayText()
         },
 
-        isOpen: function () {
+        isOpen() {
             return this.$refs.panel?.style.display === 'block'
         },
     }

packages/forms/resources/js/components/file-upload.js

@@ -346,14 +346,14 @@ export default function fileUploadFormComponent({
             }
         },
 
-        destroy: function () {
+        destroy() {
             this.destroyEditor()
 
             FilePond.destroy(this.$refs.input)
             this.pond = null
         },
 
-        dispatchFormEvent: function (name, detail = {}) {
+        dispatchFormEvent(name, detail = {}) {
             this.$el.closest('form')?.dispatchEvent(
                 new CustomEvent(name, {
                     composed: true,
@@ -411,7 +411,7 @@ export default function fileUploadFormComponent({
             return shouldAppendFiles ? files : files.reverse()
         },
 
-        insertDownloadLink: function (file) {
+        insertDownloadLink(file) {
             if (file.origin !== FilePond.FileOrigin.LOCAL) {
                 return
             }
@@ -428,7 +428,7 @@ export default function fileUploadFormComponent({
                 .prepend(anchor)
         },
 
-        insertOpenLink: function (file) {
+        insertOpenLink(file) {
             if (file.origin !== FilePond.FileOrigin.LOCAL) {
                 return
             }
@@ -445,7 +445,7 @@ export default function fileUploadFormComponent({
                 .prepend(anchor)
         },
 
-        getDownloadLink: function (file) {
+        getDownloadLink(file) {
             let fileSource = file.source
 
             if (!fileSource) {
@@ -460,7 +460,7 @@ export default function fileUploadFormComponent({
             return anchor
         },
 
-        getOpenLink: function (file) {
+        getOpenLink(file) {
             let fileSource = file.source
 
             if (!fileSource) {
@@ -475,7 +475,7 @@ export default function fileUploadFormComponent({
             return anchor
         },
 
-        initEditor: function () {
+        initEditor() {
             if (isDisabled) {
                 return
             }
@@ -508,7 +508,7 @@ export default function fileUploadFormComponent({
             })
         },
 
-        closeEditor: function () {
+        closeEditor() {
             this.editingFile = {}
 
             this.isEditorOpen = false
@@ -516,7 +516,7 @@ export default function fileUploadFormComponent({
             this.destroyEditor()
         },
 
-        fixImageDimensions: function (file, callback) {
+        fixImageDimensions(file, callback) {
             if (file.type !== 'image/svg+xml') {
                 return callback(file)
             }
@@ -575,7 +575,7 @@ export default function fileUploadFormComponent({
             svgReader.readAsText(file)
         },
 
-        loadEditor: function (file) {
+        loadEditor(file) {
             if (isDisabled) {
                 return
             }
@@ -624,7 +624,7 @@ export default function fileUploadFormComponent({
             })
         },
 
-        getRoundedCanvas: function (sourceCanvas) {
+        getRoundedCanvas(sourceCanvas) {
             let width = sourceCanvas.width
             let height = sourceCanvas.height
 
@@ -651,7 +651,7 @@ export default function fileUploadFormComponent({
             return canvas
         },
 
-        saveEditor: function () {
+        saveEditor() {
             if (isDisabled) {
                 return
             }
@@ -745,7 +745,7 @@ export default function fileUploadFormComponent({
             )
         },
 
-        destroyEditor: function () {
+        destroyEditor() {
             if (this.editor && typeof this.editor.destroy === 'function') {
                 this.editor.destroy()
             }

packages/forms/resources/js/components/key-value.js

@@ -4,7 +4,7 @@ export default function keyValueFormComponent({ state }) {
 
         rows: [],
 
-        init: function () {
+        init() {
             this.updateRows()
 
             if (this.rows.length <= 0) {
@@ -38,13 +38,13 @@ export default function keyValueFormComponent({ state }) {
             })
         },
 
-        addRow: function () {
+        addRow() {
             this.rows.push({ key: '', value: '' })
 
             this.updateState()
         },
 
-        deleteRow: function (index) {
+        deleteRow(index) {
             this.rows.splice(index, 1)
 
             if (this.rows.length <= 0) {
@@ -54,7 +54,7 @@ export default function keyValueFormComponent({ state }) {
             this.updateState()
         },
 
-        reorderRows: function (event) {
+        reorderRows(event) {
             const rows = Alpine.raw(this.rows)
 
             this.rows = []
@@ -71,7 +71,7 @@ export default function keyValueFormComponent({ state }) {
 
         // https://github.com/filamentphp/filament/issues/1107
         // https://github.com/filamentphp/filament/issues/12824
-        updateRows: function () {
+        updateRows() {
             const state = Alpine.raw(this.state)
             const mergedRows = state.map(({ key, value }) => ({ key, value }))
 
@@ -87,7 +87,7 @@ export default function keyValueFormComponent({ state }) {
             this.rows = mergedRows
         },
 
-        updateState: function () {
+        updateState() {
             let state = []
 
             this.rows.forEach((row) => {

packages/forms/resources/js/components/markdown-editor.js

@@ -216,12 +216,12 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        destroy: function () {
+        destroy() {
             this.editor.cleanup()
             this.editor = null
         },
 
-        getToolbar: function () {
+        getToolbar() {
             let toolbar = []
 
             toolbarButtons.forEach((buttonGroup) => {
@@ -241,7 +241,7 @@ export default function markdownEditorFormComponent({
             return toolbar
         },
 
-        getToolbarButton: function (name) {
+        getToolbarButton(name) {
             if (name === 'bold') {
                 return this.getBoldToolbarButton()
             }
@@ -297,7 +297,7 @@ export default function markdownEditorFormComponent({
             console.error(`Markdown editor toolbar button "${name}" not found.`)
         },
 
-        getBoldToolbarButton: function () {
+        getBoldToolbarButton() {
             return {
                 name: 'bold',
                 action: EasyMDE.toggleBold,
@@ -305,7 +305,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getItalicToolbarButton: function () {
+        getItalicToolbarButton() {
             return {
                 name: 'italic',
                 action: EasyMDE.toggleItalic,
@@ -313,7 +313,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getStrikeToolbarButton: function () {
+        getStrikeToolbarButton() {
             return {
                 name: 'strikethrough',
                 action: EasyMDE.toggleStrikethrough,
@@ -321,7 +321,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getLinkToolbarButton: function () {
+        getLinkToolbarButton() {
             return {
                 name: 'link',
                 action: EasyMDE.drawLink,
@@ -329,7 +329,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getHeadingToolbarButton: function () {
+        getHeadingToolbarButton() {
             return {
                 name: 'heading',
                 action: EasyMDE.toggleHeadingSmaller,
@@ -337,7 +337,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getBlockquoteToolbarButton: function () {
+        getBlockquoteToolbarButton() {
             return {
                 name: 'quote',
                 action: EasyMDE.toggleBlockquote,
@@ -345,7 +345,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getCodeBlockToolbarButton: function () {
+        getCodeBlockToolbarButton() {
             return {
                 name: 'code',
                 action: EasyMDE.toggleCodeBlock,
@@ -353,7 +353,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getBulletListToolbarButton: function () {
+        getBulletListToolbarButton() {
             return {
                 name: 'unordered-list',
                 action: EasyMDE.toggleUnorderedList,
@@ -361,7 +361,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getOrderedListToolbarButton: function () {
+        getOrderedListToolbarButton() {
             return {
                 name: 'ordered-list',
                 action: EasyMDE.toggleOrderedList,
@@ -369,7 +369,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getTableToolbarButton: function () {
+        getTableToolbarButton() {
             return {
                 name: 'table',
                 action: EasyMDE.drawTable,
@@ -377,7 +377,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getAttachFilesToolbarButton: function () {
+        getAttachFilesToolbarButton() {
             return {
                 name: 'upload-image',
                 action: EasyMDE.drawUploadedImage,
@@ -385,7 +385,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getUndoToolbarButton: function () {
+        getUndoToolbarButton() {
             return {
                 name: 'undo',
                 action: EasyMDE.undo,
@@ -393,7 +393,7 @@ export default function markdownEditorFormComponent({
             }
         },
 
-        getRedoToolbarButton: function () {
+        getRedoToolbarButton() {
             return {
                 name: 'redo',
                 action: EasyMDE.redo,

packages/forms/resources/js/components/rich-editor.js

@@ -154,15 +154,15 @@ export default function richEditorFormComponent({
             )
         },
 
-        getEditor: function () {
+        getEditor() {
             return editor
         },
 
-        $getEditor: function () {
+        $getEditor() {
             return this.getEditor()
         },
 
-        setEditorSelection: function (selection) {
+        setEditorSelection(selection) {
             if (!selection) {
                 return
             }
@@ -184,7 +184,7 @@ export default function richEditorFormComponent({
                 .run()
         },
 
-        runEditorCommands: function ({ commands, editorSelection }) {
+        runEditorCommands({ commands, editorSelection }) {
             this.setEditorSelection(editorSelection)
 
             let commandChain = editor.chain()
@@ -199,7 +199,7 @@ export default function richEditorFormComponent({
             commandChain.run()
         },
 
-        togglePanel: function (id = null) {
+        togglePanel(id = null) {
             if (this.isPanelActive(id)) {
                 this.activePanel = null
 
@@ -209,7 +209,7 @@ export default function richEditorFormComponent({
             this.activePanel = id
         },
 
-        isPanelActive: function (id = null) {
+        isPanelActive(id = null) {
             if (id === null) {
                 return this.activePanel !== null
             }
@@ -217,7 +217,7 @@ export default function richEditorFormComponent({
             return this.activePanel === id
         },
 
-        insertMergeTag: function (id) {
+        insertMergeTag(id) {
             editor
                 .chain()
                 .focus()

packages/forms/resources/js/components/rich-editor/extension-custom-block.js

@@ -105,7 +105,7 @@ export default Node.create({
         }
     },
 
-    addOptions: function () {
+    addOptions() {
         return {
             deleteCustomBlockButtonIconHtml: null,
             editCustomBlockButtonIconHtml: null,
@@ -114,7 +114,7 @@ export default Node.create({
         }
     },
 
-    addAttributes: function () {
+    addAttributes() {
         return {
             config: {
                 default: null,
@@ -150,7 +150,7 @@ export default Node.create({
         }
     },
 
-    parseHTML: function () {
+    parseHTML() {
         return [
             {
                 tag: `div[data-type="${this.name}"]`,
@@ -162,7 +162,7 @@ export default Node.create({
         return ['div', mergeAttributes(HTMLAttributes)]
     },
 
-    addKeyboardShortcuts: function () {
+    addKeyboardShortcuts() {
         return {
             Backspace: () =>
                 this.editor.commands.command(({ tr, state }) => {
@@ -192,7 +192,7 @@ export default Node.create({
         }
     },
 
-    addProseMirrorPlugins: function () {
+    addProseMirrorPlugins() {
         const { insertCustomBlockUsing } = this.options
 
         return [

packages/forms/resources/js/components/rich-editor/extension-merge-tag.js

@@ -60,14 +60,14 @@ export default Node.create({
 
     priority: 101,
 
-    addStorage: function () {
+    addStorage() {
         return {
             suggestions: [],
             getSuggestionFromChar: () => null,
         }
     },
 
-    addOptions: function () {
+    addOptions() {
         return {
             HTMLAttributes: {},
             renderText({ node }) {
@@ -97,7 +97,7 @@ export default Node.create({
 
     atom: true,
 
-    addAttributes: function () {
+    addAttributes() {
         return {
             id: {
                 default: null,
@@ -129,7 +129,7 @@ export default Node.create({
         }
     },
 
-    parseHTML: function () {
+    parseHTML() {
         return [
             {
                 tag: `span[data-type="${this.name}"]`,
@@ -137,7 +137,7 @@ export default Node.create({
         ]
     },
 
-    renderHTML: function ({ node, HTMLAttributes }) {
+    renderHTML({ node, HTMLAttributes }) {
         // We cannot use the `this.storage` property here because, when accessed this method,
         // it returns the initial value of the extension storage
         const suggestion =
@@ -173,7 +173,7 @@ export default Node.create({
         return html
     },
 
-    renderText: function ({ node }) {
+    renderText({ node }) {
         const args = {
             options: this.options,
             node,
@@ -186,7 +186,7 @@ export default Node.create({
         return this.options.renderText(args)
     },
 
-    addKeyboardShortcuts: function () {
+    addKeyboardShortcuts() {
         return {
             Backspace: () =>
                 this.editor.commands.command(({ tr, state }) => {
@@ -224,7 +224,7 @@ export default Node.create({
         }
     },
 
-    addProseMirrorPlugins: function () {
+    addProseMirrorPlugins() {
         return [
             ...this.storage.suggestions.map(Suggestion), // Create a plugin for each suggestion configuration
             new Plugin({
@@ -262,7 +262,7 @@ export default Node.create({
         ]
     },
 
-    onBeforeCreate: function () {
+    onBeforeCreate() {
         this.storage.suggestions = (
             this.options.suggestions.length
                 ? this.options.suggestions

packages/forms/resources/js/components/select.js

@@ -160,7 +160,7 @@ export default function selectFormComponent({
             })
         },
 
-        destroy: function () {
+        destroy() {
             this.select.destroy()
             this.select = null
         },
@@ -194,7 +194,7 @@ export default function selectFormComponent({
             }
         },
 
-        setChoices: function (choices) {
+        setChoices(choices) {
             this.select.setChoices(choices, 'value', 'label', true)
         },
 
@@ -242,7 +242,7 @@ export default function selectFormComponent({
             })
         },
 
-        refreshPlaceholder: function () {
+        refreshPlaceholder() {
             if (isMultiple) {
                 return
             }
@@ -259,7 +259,7 @@ export default function selectFormComponent({
                 }</div>`
         },
 
-        formatState: function (state) {
+        formatState(state) {
             if (isMultiple) {
                 return (state ?? []).map((item) => item?.toString())
             }

packages/forms/resources/js/components/slider.js

@@ -27,7 +27,7 @@ export default function sliderFormComponent({
 
         slider: null,
 
-        init: function () {
+        init() {
             this.slider = noUiSlider.create(this.$el, {
                 behaviour: behavior,
                 direction: isRtl ? 'rtl' : 'ltr',
@@ -72,7 +72,7 @@ export default function sliderFormComponent({
             })
         },
 
-        destroy: function () {
+        destroy() {
             this.slider.destroy()
             this.slider = null
         },

packages/forms/resources/js/components/tags-input.js

@@ -4,7 +4,7 @@ export default function tagsInputFormComponent({ state, splitKeys }) {
 
         state,
 
-        createTag: function () {
+        createTag() {
             this.newTag = this.newTag.trim()
 
             if (this.newTag === '') {
@@ -22,11 +22,11 @@ export default function tagsInputFormComponent({ state, splitKeys }) {
             this.newTag = ''
         },
 
-        deleteTag: function (tagToDelete) {
+        deleteTag(tagToDelete) {
             this.state = this.state.filter((tag) => tag !== tagToDelete)
         },
 
-        reorderTags: function (event) {
+        reorderTags(event) {
             const reordered = this.state.splice(event.oldIndex, 1)[0]
             this.state.splice(event.newIndex, 0, reordered)
 

packages/forms/resources/js/components/textarea.js

@@ -8,7 +8,7 @@ export default function textareaFormComponent({
 
         wrapperEl: null,
 
-        init: function () {
+        init() {
             this.wrapperEl = this.$el.parentNode
 
             this.setInitialHeight()
@@ -22,7 +22,7 @@ export default function textareaFormComponent({
             }
         },
 
-        setInitialHeight: function () {
+        setInitialHeight() {
             if (this.$el.scrollHeight <= 0) {
                 return
             }
@@ -30,7 +30,7 @@ export default function textareaFormComponent({
             this.wrapperEl.style.height = initialHeight + 'rem'
         },
 
-        resize: function () {
+        resize() {
             this.setInitialHeight()
 
             if (this.$el.scrollHeight <= 0) {
@@ -46,7 +46,7 @@ export default function textareaFormComponent({
             this.wrapperEl.style.height = newHeight
         },
 
-        setUpResizeObserver: function () {
+        setUpResizeObserver() {
             const observer = new ResizeObserver(() => {
                 this.wrapperEl.style.height = this.$el.style.height
             })

packages/forms/resources/views/components/select.blade.php

@@ -113,7 +113,7 @@
                 class="fi-hidden"
                 x-data="{
                     isDisabled: @js($isDisabled),
-                    init: function () {
+                    init() {
                         const container = $el.nextElementSibling
                         container.dispatchEvent(
                             new CustomEvent('set-select-property', {

packages/notifications/resources/js/components/notification.js

@@ -10,7 +10,7 @@ export default (Alpine) => {
 
         transitionEasing: null,
 
-        init: function () {
+        init() {
             this.computedStyle = window.getComputedStyle(this.$el)
 
             this.transitionDuration =
@@ -39,7 +39,7 @@ export default (Alpine) => {
             this.isShown = true
         },
 
-        configureTransitions: function () {
+        configureTransitions() {
             const display = this.computedStyle.display
 
             const show = () => {
@@ -73,7 +73,7 @@ export default (Alpine) => {
             Alpine.effect(() => toggle(this.isShown))
         },
 
-        configureAnimations: function () {
+        configureAnimations() {
             let animation
 
             Livewire.hook(
@@ -128,7 +128,7 @@ export default (Alpine) => {
             )
         },
 
-        close: function () {
+        close() {
             this.isShown = false
 
             setTimeout(
@@ -144,7 +144,7 @@ export default (Alpine) => {
             )
         },
 
-        markAsRead: function () {
+        markAsRead() {
             window.dispatchEvent(
                 new CustomEvent('markedNotificationAsRead', {
                     detail: {
@@ -154,7 +154,7 @@ export default (Alpine) => {
             )
         },
 
-        markAsUnread: function () {
+        markAsUnread() {
             window.dispatchEvent(
                 new CustomEvent('markedNotificationAsUnread', {
                     detail: {

packages/panels/resources/js/stores/sidebar.js

@@ -3,11 +3,11 @@ export default () => ({
 
     collapsedGroups: window.Alpine.$persist(null).as('collapsedGroups'),
 
-    groupIsCollapsed: function (group) {
+    groupIsCollapsed(group) {
         return this.collapsedGroups.includes(group)
     },
 
-    collapseGroup: function (group) {
+    collapseGroup(group) {
         if (this.collapsedGroups.includes(group)) {
             return
         }
@@ -15,7 +15,7 @@ export default () => ({
         this.collapsedGroups = this.collapsedGroups.concat(group)
     },
 
-    toggleCollapsedGroup: function (group) {
+    toggleCollapsedGroup(group) {
         this.collapsedGroups = this.collapsedGroups.includes(group)
             ? this.collapsedGroups.filter(
                   (collapsedGroup) => collapsedGroup !== group,
@@ -23,11 +23,11 @@ export default () => ({
             : this.collapsedGroups.concat(group)
     },
 
-    close: function () {
+    close() {
         this.isOpen = false
     },
 
-    open: function () {
+    open() {
         this.isOpen = true
     },
 })

packages/panels/resources/views/livewire/global-search.blade.php

@@ -44,11 +44,11 @@
                 x-data="{
                     isOpen: false,
 
-                    open: function (event) {
+                    open(event) {
                         this.isOpen = true
                     },
 
-                    close: function (event) {
+                    close(event) {
                         this.isOpen = false
                     },
                 }"

packages/schemas/dist/components/actions.js

@@ -1 +1 @@
-var n=()=>({isSticky:!1,init:function(){this.evaluatePageScrollPosition()},evaluatePageScrollPosition:function(){let i=this.$el.getBoundingClientRect(),t=i.top>window.innerHeight,e=i.top<window.innerHeight&&i.bottom>window.innerHeight;this.isSticky=t||e}});export{n as default};
+var o=()=>({isSticky:!1,init(){this.evaluatePageScrollPosition()},evaluatePageScrollPosition(){let i=this.$el.getBoundingClientRect(),t=i.top>window.innerHeight,e=i.top<window.innerHeight&&i.bottom>window.innerHeight;this.isSticky=t||e}});export{o as default};

packages/schemas/dist/components/tabs.js

@@ -1 +1 @@
-function u({activeTab:i,isTabPersistedInQueryString:e,livewireId:a,tab:n,tabQueryStringKey:r}){return{tab:n,init:function(){this.$watch("tab",()=>this.updateQueryString());let t=this.getTabs();(!this.tab||!t.includes(this.tab))&&(this.tab=t[i-1]),Livewire.hook("commit",({component:o,commit:c,succeed:h,fail:f,respond:b})=>{h(({snapshot:l,effect:d})=>{this.$nextTick(()=>{if(o.id!==a)return;let s=this.getTabs();s.includes(this.tab)||(this.tab=s[i-1]??this.tab)})})})},getTabs:function(){return this.$refs.tabsData?JSON.parse(this.$refs.tabsData.value):[]},updateQueryString:function(){if(!e)return;let t=new URL(window.location.href);t.searchParams.set(r,this.tab),history.replaceState(null,document.title,t.toString())}}}export{u as default};
+function u({activeTab:i,isTabPersistedInQueryString:e,livewireId:a,tab:r,tabQueryStringKey:n}){return{tab:r,init(){this.$watch("tab",()=>this.updateQueryString());let t=this.getTabs();(!this.tab||!t.includes(this.tab))&&(this.tab=t[i-1]),Livewire.hook("commit",({component:h,commit:b,succeed:o,fail:c,respond:f})=>{o(({snapshot:l,effect:d})=>{this.$nextTick(()=>{if(h.id!==a)return;let s=this.getTabs();s.includes(this.tab)||(this.tab=s[i-1]??this.tab)})})})},getTabs(){return this.$refs.tabsData?JSON.parse(this.$refs.tabsData.value):[]},updateQueryString(){if(!e)return;let t=new URL(window.location.href);t.searchParams.set(n,this.tab),history.replaceState(null,document.title,t.toString())}}}export{u as default};

packages/schemas/dist/components/wizard.js

@@ -1 +1 @@
-function p({isSkippable:s,isStepPersistedInQueryString:i,key:n,startStep:r,stepQueryStringKey:o}){return{step:null,init:function(){this.$watch("step",()=>this.updateQueryString()),this.step=this.getSteps().at(r-1),this.autofocusFields()},requestNextStep:async function(){await this.$wire.callSchemaComponentMethod(n,"nextStep",{currentStepIndex:this.getStepIndex(this.step)})},goToNextStep:function(){let t=this.getStepIndex(this.step)+1;t>=this.getSteps().length||(this.step=this.getSteps()[t],this.autofocusFields(),this.scroll())},goToPreviousStep:function(){let t=this.getStepIndex(this.step)-1;t<0||(this.step=this.getSteps()[t],this.autofocusFields(),this.scroll())},scroll:function(){this.$nextTick(()=>{this.$refs.header.children[this.getStepIndex(this.step)].scrollIntoView({behavior:"smooth",block:"start"})})},autofocusFields:function(){this.$nextTick(()=>this.$refs[`step-${this.step}`].querySelector("[autofocus]")?.focus())},getStepIndex:function(t){let e=this.getSteps().findIndex(h=>h===t);return e===-1?0:e},getSteps:function(){return JSON.parse(this.$refs.stepsData.value)},isFirstStep:function(){return this.getStepIndex(this.step)<=0},isLastStep:function(){return this.getStepIndex(this.step)+1>=this.getSteps().length},isStepAccessible:function(t){return s||this.getStepIndex(this.step)>this.getStepIndex(t)},updateQueryString:function(){if(!i)return;let t=new URL(window.location.href);t.searchParams.set(o,this.step),history.replaceState(null,document.title,t.toString())}}}export{p as default};
+function o({isSkippable:s,isStepPersistedInQueryString:i,key:n,startStep:r,stepQueryStringKey:h}){return{step:null,init(){this.$watch("step",()=>this.updateQueryString()),this.step=this.getSteps().at(r-1),this.autofocusFields()},requestNextStep:async function(){await this.$wire.callSchemaComponentMethod(n,"nextStep",{currentStepIndex:this.getStepIndex(this.step)})},goToNextStep(){let t=this.getStepIndex(this.step)+1;t>=this.getSteps().length||(this.step=this.getSteps()[t],this.autofocusFields(),this.scroll())},goToPreviousStep(){let t=this.getStepIndex(this.step)-1;t<0||(this.step=this.getSteps()[t],this.autofocusFields(),this.scroll())},scroll(){this.$nextTick(()=>{this.$refs.header.children[this.getStepIndex(this.step)].scrollIntoView({behavior:"smooth",block:"start"})})},autofocusFields(){this.$nextTick(()=>this.$refs[`step-${this.step}`].querySelector("[autofocus]")?.focus())},getStepIndex(t){let e=this.getSteps().findIndex(p=>p===t);return e===-1?0:e},getSteps(){return JSON.parse(this.$refs.stepsData.value)},isFirstStep(){return this.getStepIndex(this.step)<=0},isLastStep(){return this.getStepIndex(this.step)+1>=this.getSteps().length},isStepAccessible(t){return s||this.getStepIndex(this.step)>this.getStepIndex(t)},updateQueryString(){if(!i)return;let t=new URL(window.location.href);t.searchParams.set(h,this.step),history.replaceState(null,document.title,t.toString())}}}export{o as default};

packages/schemas/dist/index.js

@@ -1 +1 @@
-(()=>{var c=()=>({isSticky:!1,init:function(){this.evaluatePageScrollPosition()},evaluatePageScrollPosition:function(){let n=this.$el.getBoundingClientRect(),e=n.top>window.innerHeight,i=n.top<window.innerHeight&&n.bottom>window.innerHeight;this.isSticky=e||i}});var m=function(n,e,i){let t=n;if(e.startsWith("/")&&(i=!0,e=e.slice(1)),i)return e;for(;e.startsWith("../");)t=t.includes(".")?t.slice(0,t.lastIndexOf(".")):null,e=e.slice(3);return["",null,void 0].includes(t)?e:`${t}.${e}`},w=n=>{let e=Alpine.findClosest(n,i=>i.__livewire);if(!e)throw"Could not find Livewire component in DOM tree.";return e.__livewire};document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentSchema",({livewireId:n})=>({handleFormValidationError:function(e){e.detail.livewireId===n&&this.$nextTick(()=>{let i=this.$el.querySelector("[data-validation-error]");if(!i)return;let t=i;for(;t;)t.dispatchEvent(new CustomEvent("expand")),t=t.parentNode;setTimeout(()=>i.closest("[data-field-wrapper]").scrollIntoView({behavior:"smooth",block:"start",inline:"start"}),200)})}})),window.Alpine.data("filamentSchemaComponent",({path:n,containerPath:e,isLive:i,$wire:t})=>({$statePath:n,$get:(r,l)=>t.$get(m(e,r,l)),$set:(r,l,a,o=null)=>(o??(o=i),t.$set(m(e,r,a),l,o)),get $state(){return t.$get(n)}})),window.Alpine.data("filamentActionsSchemaComponent",c),Livewire.hook("commit",({component:n,commit:e,respond:i,succeed:t,fail:r})=>{t(({snapshot:l,effects:a})=>{a.dispatches?.forEach(o=>{if(!o.params?.awaitSchemaComponent)return;let s=Array.from(n.el.querySelectorAll(`[wire\\:partial="schema-component::${o.params.awaitSchemaComponent}"]`)).filter(d=>w(d)===n);if(s.length!==1){if(s.length>1)throw`Multiple schema components found with key [${o.params.awaitSchemaComponent}].`;window.addEventListener(`schema-component-${n.id}-${o.params.awaitSchemaComponent}-loaded`,()=>{window.dispatchEvent(new CustomEvent(o.name,{detail:o.params}))},{once:!0})}})})})});})();
+(()=>{var m=()=>({isSticky:!1,init(){this.evaluatePageScrollPosition()},evaluatePageScrollPosition(){let n=this.$el.getBoundingClientRect(),e=n.top>window.innerHeight,i=n.top<window.innerHeight&&n.bottom>window.innerHeight;this.isSticky=e||i}});var c=function(n,e,i){let t=n;if(e.startsWith("/")&&(i=!0,e=e.slice(1)),i)return e;for(;e.startsWith("../");)t=t.includes(".")?t.slice(0,t.lastIndexOf(".")):null,e=e.slice(3);return["",null,void 0].includes(t)?e:`${t}.${e}`},w=n=>{let e=Alpine.findClosest(n,i=>i.__livewire);if(!e)throw"Could not find Livewire component in DOM tree.";return e.__livewire};document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentSchema",({livewireId:n})=>({handleFormValidationError(e){e.detail.livewireId===n&&this.$nextTick(()=>{let i=this.$el.querySelector("[data-validation-error]");if(!i)return;let t=i;for(;t;)t.dispatchEvent(new CustomEvent("expand")),t=t.parentNode;setTimeout(()=>i.closest("[data-field-wrapper]").scrollIntoView({behavior:"smooth",block:"start",inline:"start"}),200)})}})),window.Alpine.data("filamentSchemaComponent",({path:n,containerPath:e,isLive:i,$wire:t})=>({$statePath:n,$get:(r,l)=>t.$get(c(e,r,l)),$set:(r,l,a,o=null)=>(o??(o=i),t.$set(c(e,r,a),l,o)),get $state(){return t.$get(n)}})),window.Alpine.data("filamentActionsSchemaComponent",m),Livewire.hook("commit",({component:n,commit:e,respond:i,succeed:t,fail:r})=>{t(({snapshot:l,effects:a})=>{a.dispatches?.forEach(o=>{if(!o.params?.awaitSchemaComponent)return;let s=Array.from(n.el.querySelectorAll(`[wire\\:partial="schema-component::${o.params.awaitSchemaComponent}"]`)).filter(d=>w(d)===n);if(s.length!==1){if(s.length>1)throw`Multiple schema components found with key [${o.params.awaitSchemaComponent}].`;window.addEventListener(`schema-component-${n.id}-${o.params.awaitSchemaComponent}-loaded`,()=>{window.dispatchEvent(new CustomEvent(o.name,{detail:o.params}))},{once:!0})}})})})});})();

packages/schemas/resources/js/components/actions.js

@@ -1,11 +1,11 @@
 export default () => ({
     isSticky: false,
 
-    init: function () {
+    init() {
         this.evaluatePageScrollPosition()
     },
 
-    evaluatePageScrollPosition: function () {
+    evaluatePageScrollPosition() {
         const rect = this.$el.getBoundingClientRect()
 
         const isBelowViewport = rect.top > window.innerHeight

packages/schemas/resources/js/components/tabs.js

@@ -8,7 +8,7 @@ export default function tabsSchemaComponent({
     return {
         tab,
 
-        init: function () {
+        init() {
             this.$watch('tab', () => this.updateQueryString())
 
             const tabs = this.getTabs()
@@ -37,7 +37,7 @@ export default function tabsSchemaComponent({
             )
         },
 
-        getTabs: function () {
+        getTabs() {
             if (!this.$refs.tabsData) {
                 return []
             }
@@ -45,7 +45,7 @@ export default function tabsSchemaComponent({
             return JSON.parse(this.$refs.tabsData.value)
         },
 
-        updateQueryString: function () {
+        updateQueryString() {
             if (!isTabPersistedInQueryString) {
                 return
             }

packages/schemas/resources/js/components/wizard.js

@@ -8,7 +8,7 @@ export default function wizardSchemaComponent({
     return {
         step: null,
 
-        init: function () {
+        init() {
             this.$watch('step', () => this.updateQueryString())
 
             this.step = this.getSteps().at(startStep - 1)
@@ -22,7 +22,7 @@ export default function wizardSchemaComponent({
             })
         },
 
-        goToNextStep: function () {
+        goToNextStep() {
             let nextStepIndex = this.getStepIndex(this.step) + 1
 
             if (nextStepIndex >= this.getSteps().length) {
@@ -35,7 +35,7 @@ export default function wizardSchemaComponent({
             this.scroll()
         },
 
-        goToPreviousStep: function () {
+        goToPreviousStep() {
             let previousStepIndex = this.getStepIndex(this.step) - 1
 
             if (previousStepIndex < 0) {
@@ -48,7 +48,7 @@ export default function wizardSchemaComponent({
             this.scroll()
         },
 
-        scroll: function () {
+        scroll() {
             this.$nextTick(() => {
                 this.$refs.header.children[
                     this.getStepIndex(this.step)
@@ -56,7 +56,7 @@ export default function wizardSchemaComponent({
             })
         },
 
-        autofocusFields: function () {
+        autofocusFields() {
             this.$nextTick(() =>
                 this.$refs[`step-${this.step}`]
                     .querySelector('[autofocus]')
@@ -64,7 +64,7 @@ export default function wizardSchemaComponent({
             )
         },
 
-        getStepIndex: function (step) {
+        getStepIndex(step) {
             let index = this.getSteps().findIndex(
                 (indexedStep) => indexedStep === step,
             )
@@ -76,26 +76,26 @@ export default function wizardSchemaComponent({
             return index
         },
 
-        getSteps: function () {
+        getSteps() {
             return JSON.parse(this.$refs.stepsData.value)
         },
 
-        isFirstStep: function () {
+        isFirstStep() {
             return this.getStepIndex(this.step) <= 0
         },
 
-        isLastStep: function () {
+        isLastStep() {
             return this.getStepIndex(this.step) + 1 >= this.getSteps().length
         },
 
-        isStepAccessible: function (stepKey) {
+        isStepAccessible(stepKey) {
             return (
                 isSkippable ||
                 this.getStepIndex(this.step) > this.getStepIndex(stepKey)
             )
         },
 
-        updateQueryString: function () {
+        updateQueryString() {
             if (!isStepPersistedInQueryString) {
                 return
             }

packages/schemas/resources/js/index.js

@@ -39,7 +39,7 @@ const findClosestLivewireComponent = (el) => {
 
 document.addEventListener('alpine:init', () => {
     window.Alpine.data('filamentSchema', ({ livewireId }) => ({
-        handleFormValidationError: function (event) {
+        handleFormValidationError(event) {
             if (event.detail.livewireId !== livewireId) {
                 return
             }

packages/support/resources/js/components/dropdown.js

@@ -1,13 +1,13 @@
 export default () => ({
-    toggle: function (event) {
+    toggle(event) {
         this.$refs.panel.toggle(event)
     },
 
-    open: function (event) {
+    open(event) {
         this.$refs.panel.open(event)
     },
 
-    close: function (event) {
+    close(event) {
         this.$refs.panel.close(event)
     },
 })

packages/support/resources/js/components/form-button.js

@@ -5,7 +5,7 @@ export default () => ({
 
     processingMessage: null,
 
-    init: function () {
+    init() {
         const formElement = this.$el.closest('form')
 
         formElement?.addEventListener('form-processing-started', (event) => {

packages/support/resources/js/components/modal.js

@@ -5,7 +5,7 @@ export default ({ id }) => ({
 
     livewire: null,
 
-    init: function () {
+    init() {
         this.$nextTick(() => {
             this.isWindowVisible = this.isOpen
 
@@ -13,17 +13,17 @@ export default ({ id }) => ({
         })
     },
 
-    close: function () {
+    close() {
         this.closeQuietly()
 
         this.$dispatch('modal-closed', { id })
     },
 
-    closeQuietly: function () {
+    closeQuietly() {
         this.isOpen = false
     },
 
-    open: function () {
+    open() {
         this.$nextTick(() => {
             this.isOpen = true
 

packages/tables/dist/components/columns/checkbox.js

@@ -1 +1 @@
-function o({name:r,recordKey:s,state:n}){return{error:void 0,isLoading:!1,state:n,init:function(){Livewire.hook("commit",({component:e,commit:i,succeed:a,fail:u,respond:f})=>{a(({snapshot:h,effect:d})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||Alpine.raw(this.state)===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||Alpine.raw(this.state)===e)return;this.isLoading=!0;let i=await this.$wire.updateTableColumnState(r,s,this.state);this.error=i?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.state?"1":"0"),this.isLoading=!1})},getServerState:function(){if(this.$refs.serverState)return[1,"1"].includes(this.$refs.serverState.value)}}}export{o as default};
+function o({name:i,recordKey:s,state:a}){return{error:void 0,isLoading:!1,state:a,init(){Livewire.hook("commit",({component:e,commit:r,succeed:n,fail:h,respond:u})=>{n(({snapshot:f,effect:d})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||Alpine.raw(this.state)===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||Alpine.raw(this.state)===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.state?"1":"0"),this.isLoading=!1})},getServerState(){if(this.$refs.serverState)return[1,"1"].includes(this.$refs.serverState.value)}}}export{o as default};

packages/tables/dist/components/columns/select.js

@@ -1 +1 @@
-function o({name:i,recordKey:s,state:n}){return{error:void 0,isLoading:!1,state:n,init:function(){Livewire.hook("commit",({component:e,commit:r,succeed:a,fail:u,respond:d})=>{a(({snapshot:f,effect:l})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||this.getNormalizedState()===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||this.getNormalizedState()===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.getNormalizedState()),this.isLoading=!1})},getServerState:function(){if(this.$refs.serverState)return[null,void 0].includes(this.$refs.serverState.value)?"":this.$refs.serverState.value.replaceAll('\\"','"')},getNormalizedState:function(){let e=Alpine.raw(this.state);return[null,void 0].includes(e)?"":e}}}export{o as default};
+function o({name:i,recordKey:s,state:a}){return{error:void 0,isLoading:!1,state:a,init(){Livewire.hook("commit",({component:e,commit:r,succeed:n,fail:d,respond:u})=>{n(({snapshot:f,effect:l})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||this.getNormalizedState()===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||this.getNormalizedState()===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.getNormalizedState()),this.isLoading=!1})},getServerState(){if(this.$refs.serverState)return[null,void 0].includes(this.$refs.serverState.value)?"":this.$refs.serverState.value.replaceAll('\\"','"')},getNormalizedState(){let e=Alpine.raw(this.state);return[null,void 0].includes(e)?"":e}}}export{o as default};

packages/tables/dist/components/columns/text-input.js

@@ -1 +1 @@
-function o({name:i,recordKey:s,state:n}){return{error:void 0,isLoading:!1,state:n,init:function(){Livewire.hook("commit",({component:e,commit:r,succeed:a,fail:u,respond:d})=>{a(({snapshot:f,effect:h})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||this.getNormalizedState()===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||this.getNormalizedState()===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.getNormalizedState()),this.isLoading=!1})},getServerState:function(){if(this.$refs.serverState)return[null,void 0].includes(this.$refs.serverState.value)?"":this.$refs.serverState.value.replaceAll('\\"','"')},getNormalizedState:function(){let e=Alpine.raw(this.state);return[null,void 0].includes(e)?"":e}}}export{o as default};
+function o({name:i,recordKey:s,state:a}){return{error:void 0,isLoading:!1,state:a,init(){Livewire.hook("commit",({component:e,commit:r,succeed:n,fail:d,respond:u})=>{n(({snapshot:f,effect:h})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||this.getNormalizedState()===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||this.getNormalizedState()===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.getNormalizedState()),this.isLoading=!1})},getServerState(){if(this.$refs.serverState)return[null,void 0].includes(this.$refs.serverState.value)?"":this.$refs.serverState.value.replaceAll('\\"','"')},getNormalizedState(){let e=Alpine.raw(this.state);return[null,void 0].includes(e)?"":e}}}export{o as default};

packages/tables/dist/components/columns/toggle.js

@@ -1 +1 @@
-function o({name:r,recordKey:s,state:n}){return{error:void 0,isLoading:!1,state:n,init:function(){Livewire.hook("commit",({component:e,commit:i,succeed:a,fail:u,respond:f})=>{a(({snapshot:h,effect:d})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||Alpine.raw(this.state)===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||Alpine.raw(this.state)===e)return;this.isLoading=!0;let i=await this.$wire.updateTableColumnState(r,s,this.state);this.error=i?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.state?"1":"0"),this.isLoading=!1})},getServerState:function(){if(this.$refs.serverState)return[1,"1"].includes(this.$refs.serverState.value)}}}export{o as default};
+function o({name:i,recordKey:s,state:a}){return{error:void 0,isLoading:!1,state:a,init(){Livewire.hook("commit",({component:e,commit:r,succeed:n,fail:h,respond:u})=>{n(({snapshot:f,effect:d})=>{this.$nextTick(()=>{if(this.isLoading||e.id!==this.$root.closest("[wire\\:id]").attributes["wire:id"].value)return;let t=this.getServerState();t===void 0||Alpine.raw(this.state)===t||(this.state=t)})})}),this.$watch("state",async()=>{let e=this.getServerState();if(e===void 0||Alpine.raw(this.state)===e)return;this.isLoading=!0;let r=await this.$wire.updateTableColumnState(i,s,this.state);this.error=r?.error??void 0,!this.error&&this.$refs.serverState&&(this.$refs.serverState.value=this.state?"1":"0"),this.isLoading=!1})},getServerState(){if(this.$refs.serverState)return[1,"1"].includes(this.$refs.serverState.value)}}}export{o as default};

packages/tables/dist/index.js

@@ -1 +1 @@
-(()=>{var n=({canSelectMultipleRecords:l,canTrackDeselectedRecords:h,currentSelectionLivewireProperty:i,$wire:s})=>({checkboxClickController:null,collapsedGroups:[],isLoading:!1,selectedRecords:new Set,deselectedRecords:new Set,isTrackingDeselectedRecords:!1,shouldCheckUniqueSelection:!0,lastCheckedRecord:null,livewireId:null,entangledSelectedRecords:i?s.$entangle(i):null,init:function(){this.livewireId=this.$root.closest("[wire\\:id]").attributes["wire:id"].value,s.$on("deselectAllTableRecords",()=>this.deselectAllRecords()),i&&(l?this.selectedRecords=new Set(this.entangledSelectedRecords):this.selectedRecords=new Set(this.entangledSelectedRecords?[this.entangledSelectedRecords]:[])),this.$nextTick(()=>this.watchForCheckboxClicks()),Livewire.hook("element.init",({component:e})=>{e.id===this.livewireId&&this.watchForCheckboxClicks()})},mountAction:function(...e){s.set("isTrackingDeselectedTableRecords",this.isTrackingDeselectedRecords,!1),s.set("selectedTableRecords",[...this.selectedRecords],!1),s.set("deselectedTableRecords",[...this.deselectedRecords],!1),s.mountAction(...e)},toggleSelectRecordsOnPage:function(){let e=this.getRecordsOnPage();if(this.areRecordsSelected(e)){this.deselectRecords(e);return}this.selectRecords(e)},toggleSelectRecordsInGroup:async function(e){if(this.isLoading=!0,this.areRecordsSelected(this.getRecordsInGroupOnPage(e))){this.deselectRecords(await s.getGroupedSelectableTableRecordKeys(e));return}this.selectRecords(await s.getGroupedSelectableTableRecordKeys(e)),this.isLoading=!1},getRecordsInGroupOnPage:function(e){let t=[];for(let c of this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[])c.dataset.group===e&&t.push(c.value);return t},getSelectedRecordsCount:function(){return this.isTrackingDeselectedRecords?(this.$refs.allSelectableRecordsCount?.value??this.deselectedRecords.size)-this.deselectedRecords.size:this.selectedRecords.size},getRecordsOnPage:function(){let e=[];for(let t of this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[])e.push(t.value);return e},selectRecords:function(e){l||(this.deselectAllRecords(),e=e.slice(0,1));for(let t of e)if(!this.isRecordSelected(t)){if(this.isTrackingDeselectedRecords){this.deselectedRecords.delete(t);continue}this.selectedRecords.add(t)}this.updatedSelectedRecords()},deselectRecords:function(e){for(let t of e){if(this.isTrackingDeselectedRecords){this.deselectedRecords.add(t);continue}this.selectedRecords.delete(t)}this.updatedSelectedRecords()},updatedSelectedRecords:function(){if(l){this.entangledSelectedRecords=[...this.selectedRecords];return}this.entangledSelectedRecords=[...this.selectedRecords][0]??null},toggleSelectedRecord:function(e){if(this.isRecordSelected(e)){this.deselectRecords([e]);return}this.selectRecords([e])},selectAllRecords:async function(){if(!h){this.isLoading=!0,this.selectedRecords=new Set(await s.getAllSelectableTableRecordKeys()),this.updatedSelectedRecords(),this.isLoading=!1;return}this.isTrackingDeselectedRecords=!0,this.selectedRecords=new Set,this.deselectedRecords=new Set,this.updatedSelectedRecords()},deselectAllRecords:function(){this.isTrackingDeselectedRecords=!1,this.selectedRecords=new Set,this.deselectedRecords=new Set,this.updatedSelectedRecords()},isRecordSelected:function(e){return this.isTrackingDeselectedRecords?!this.deselectedRecords.has(e):this.selectedRecords.has(e)},areRecordsSelected:function(e){return e.every(t=>this.isRecordSelected(t))},toggleCollapseGroup:function(e){if(this.isGroupCollapsed(e)){this.collapsedGroups.splice(this.collapsedGroups.indexOf(e),1);return}this.collapsedGroups.push(e)},isGroupCollapsed:function(e){return this.collapsedGroups.includes(e)},resetCollapsedGroups:function(){this.collapsedGroups=[]},watchForCheckboxClicks:function(){this.checkboxClickController&&this.checkboxClickController.abort(),this.checkboxClickController=new AbortController;let{signal:e}=this.checkboxClickController;this.$root?.addEventListener("click",t=>t.target?.matches(".fi-ta-record-checkbox")&&this.handleCheckboxClick(t,t.target),{signal:e})},handleCheckboxClick:function(e,t){if(!this.lastChecked){this.lastChecked=t;return}if(e.shiftKey){let c=Array.from(this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[]);if(!c.includes(this.lastChecked)){this.lastChecked=t;return}let a=c.indexOf(this.lastChecked),u=c.indexOf(t),r=[a,u].sort((d,R)=>d-R),o=[];for(let d=r[0];d<=r[1];d++)c[d].checked=t.checked,o.push(c[d].value);t.checked?this.selectRecords(o):this.deselectRecords(o)}this.lastChecked=t}});document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentTable",n)});})();
+(()=>{var h=({canSelectMultipleRecords:l,canTrackDeselectedRecords:a,currentSelectionLivewireProperty:i,$wire:t})=>({checkboxClickController:null,collapsedGroups:[],isLoading:!1,selectedRecords:new Set,deselectedRecords:new Set,isTrackingDeselectedRecords:!1,shouldCheckUniqueSelection:!0,lastCheckedRecord:null,livewireId:null,entangledSelectedRecords:i?t.$entangle(i):null,init(){this.livewireId=this.$root.closest("[wire\\:id]").attributes["wire:id"].value,t.$on("deselectAllTableRecords",()=>this.deselectAllRecords()),i&&(l?this.selectedRecords=new Set(this.entangledSelectedRecords):this.selectedRecords=new Set(this.entangledSelectedRecords?[this.entangledSelectedRecords]:[])),this.$nextTick(()=>this.watchForCheckboxClicks()),Livewire.hook("element.init",({component:e})=>{e.id===this.livewireId&&this.watchForCheckboxClicks()})},mountAction(...e){t.set("isTrackingDeselectedTableRecords",this.isTrackingDeselectedRecords,!1),t.set("selectedTableRecords",[...this.selectedRecords],!1),t.set("deselectedTableRecords",[...this.deselectedRecords],!1),t.mountAction(...e)},toggleSelectRecordsOnPage(){let e=this.getRecordsOnPage();if(this.areRecordsSelected(e)){this.deselectRecords(e);return}this.selectRecords(e)},toggleSelectRecordsInGroup:async function(e){if(this.isLoading=!0,this.areRecordsSelected(this.getRecordsInGroupOnPage(e))){this.deselectRecords(await t.getGroupedSelectableTableRecordKeys(e));return}this.selectRecords(await t.getGroupedSelectableTableRecordKeys(e)),this.isLoading=!1},getRecordsInGroupOnPage(e){let s=[];for(let c of this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[])c.dataset.group===e&&s.push(c.value);return s},getSelectedRecordsCount(){return this.isTrackingDeselectedRecords?(this.$refs.allSelectableRecordsCount?.value??this.deselectedRecords.size)-this.deselectedRecords.size:this.selectedRecords.size},getRecordsOnPage(){let e=[];for(let s of this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[])e.push(s.value);return e},selectRecords(e){l||(this.deselectAllRecords(),e=e.slice(0,1));for(let s of e)if(!this.isRecordSelected(s)){if(this.isTrackingDeselectedRecords){this.deselectedRecords.delete(s);continue}this.selectedRecords.add(s)}this.updatedSelectedRecords()},deselectRecords(e){for(let s of e){if(this.isTrackingDeselectedRecords){this.deselectedRecords.add(s);continue}this.selectedRecords.delete(s)}this.updatedSelectedRecords()},updatedSelectedRecords(){if(l){this.entangledSelectedRecords=[...this.selectedRecords];return}this.entangledSelectedRecords=[...this.selectedRecords][0]??null},toggleSelectedRecord(e){if(this.isRecordSelected(e)){this.deselectRecords([e]);return}this.selectRecords([e])},selectAllRecords:async function(){if(!a){this.isLoading=!0,this.selectedRecords=new Set(await t.getAllSelectableTableRecordKeys()),this.updatedSelectedRecords(),this.isLoading=!1;return}this.isTrackingDeselectedRecords=!0,this.selectedRecords=new Set,this.deselectedRecords=new Set,this.updatedSelectedRecords()},deselectAllRecords(){this.isTrackingDeselectedRecords=!1,this.selectedRecords=new Set,this.deselectedRecords=new Set,this.updatedSelectedRecords()},isRecordSelected(e){return this.isTrackingDeselectedRecords?!this.deselectedRecords.has(e):this.selectedRecords.has(e)},areRecordsSelected(e){return e.every(s=>this.isRecordSelected(s))},toggleCollapseGroup(e){if(this.isGroupCollapsed(e)){this.collapsedGroups.splice(this.collapsedGroups.indexOf(e),1);return}this.collapsedGroups.push(e)},isGroupCollapsed(e){return this.collapsedGroups.includes(e)},resetCollapsedGroups(){this.collapsedGroups=[]},watchForCheckboxClicks(){this.checkboxClickController&&this.checkboxClickController.abort(),this.checkboxClickController=new AbortController;let{signal:e}=this.checkboxClickController;this.$root?.addEventListener("click",s=>s.target?.matches(".fi-ta-record-checkbox")&&this.handleCheckboxClick(s,s.target),{signal:e})},handleCheckboxClick(e,s){if(!this.lastChecked){this.lastChecked=s;return}if(e.shiftKey){let c=Array.from(this.$root?.getElementsByClassName("fi-ta-record-checkbox")??[]);if(!c.includes(this.lastChecked)){this.lastChecked=s;return}let n=c.indexOf(this.lastChecked),R=c.indexOf(s),r=[n,R].sort((d,u)=>d-u),o=[];for(let d=r[0];d<=r[1];d++)c[d].checked=s.checked,o.push(c[d].value);s.checked?this.selectRecords(o):this.deselectRecords(o)}this.lastChecked=s}});document.addEventListener("alpine:init",()=>{window.Alpine.data("filamentTable",h)});})();

packages/tables/resources/js/components/columns/checkbox.js

@@ -6,7 +6,7 @@ export default function checkboxTableColumn({ name, recordKey, state }) {
 
         state,
 
-        init: function () {
+        init() {
             Livewire.hook(
                 'commit',
                 ({ component, commit, succeed, fail, respond }) => {
@@ -68,7 +68,7 @@ export default function checkboxTableColumn({ name, recordKey, state }) {
             })
         },
 
-        getServerState: function () {
+        getServerState() {
             if (!this.$refs.serverState) {
                 return undefined
             }

packages/tables/resources/js/components/columns/select.js

@@ -6,7 +6,7 @@ export default function selectTableColumn({ name, recordKey, state }) {
 
         state,
 
-        init: function () {
+        init() {
             Livewire.hook(
                 'commit',
                 ({ component, commit, succeed, fail, respond }) => {
@@ -68,7 +68,7 @@ export default function selectTableColumn({ name, recordKey, state }) {
             })
         },
 
-        getServerState: function () {
+        getServerState() {
             if (!this.$refs.serverState) {
                 return undefined
             }
@@ -81,7 +81,7 @@ export default function selectTableColumn({ name, recordKey, state }) {
                   )
         },
 
-        getNormalizedState: function () {
+        getNormalizedState() {
             const state = Alpine.raw(this.state)
 
             if ([null, undefined].includes(state)) {

packages/tables/resources/js/components/columns/text-input.js

@@ -6,7 +6,7 @@ export default function textInputTableColumn({ name, recordKey, state }) {
 
         state,
 
-        init: function () {
+        init() {
             Livewire.hook(
                 'commit',
                 ({ component, commit, succeed, fail, respond }) => {
@@ -68,7 +68,7 @@ export default function textInputTableColumn({ name, recordKey, state }) {
             })
         },
 
-        getServerState: function () {
+        getServerState() {
             if (!this.$refs.serverState) {
                 return undefined
             }
@@ -81,7 +81,7 @@ export default function textInputTableColumn({ name, recordKey, state }) {
                   )
         },
 
-        getNormalizedState: function () {
+        getNormalizedState() {
             const state = Alpine.raw(this.state)
 
             if ([null, undefined].includes(state)) {

packages/tables/resources/js/components/columns/toggle.js

@@ -6,7 +6,7 @@ export default function toggleTableColumn({ name, recordKey, state }) {
 
         state,
 
-        init: function () {
+        init() {
             Livewire.hook(
                 'commit',
                 ({ component, commit, succeed, fail, respond }) => {
@@ -68,7 +68,7 @@ export default function toggleTableColumn({ name, recordKey, state }) {
             })
         },
 
-        getServerState: function () {
+        getServerState() {
             if (!this.$refs.serverState) {
                 return undefined
             }

packages/tables/resources/js/components/table.js

@@ -26,7 +26,7 @@ export default ({
         ? $wire.$entangle(currentSelectionLivewireProperty)
         : null,
 
-    init: function () {
+    init() {
         this.livewireId =
             this.$root.closest('[wire\\:id]').attributes['wire:id'].value
 
@@ -53,7 +53,7 @@ export default ({
         })
     },
 
-    mountAction: function (...args) {
+    mountAction(...args) {
         $wire.set(
             'isTrackingDeselectedTableRecords',
             this.isTrackingDeselectedRecords,
@@ -65,7 +65,7 @@ export default ({
         $wire.mountAction(...args)
     },
 
-    toggleSelectRecordsOnPage: function () {
+    toggleSelectRecordsOnPage() {
         const keys = this.getRecordsOnPage()
 
         if (this.areRecordsSelected(keys)) {
@@ -95,7 +95,7 @@ export default ({
         this.isLoading = false
     },
 
-    getRecordsInGroupOnPage: function (group) {
+    getRecordsInGroupOnPage(group) {
         const keys = []
 
         for (let checkbox of this.$root?.getElementsByClassName(
@@ -111,7 +111,7 @@ export default ({
         return keys
     },
 
-    getSelectedRecordsCount: function () {
+    getSelectedRecordsCount() {
         if (this.isTrackingDeselectedRecords) {
             return (
                 (this.$refs.allSelectableRecordsCount?.value ??
@@ -122,7 +122,7 @@ export default ({
         return this.selectedRecords.size
     },
 
-    getRecordsOnPage: function () {
+    getRecordsOnPage() {
         const keys = []
 
         for (let checkbox of this.$root?.getElementsByClassName(
@@ -134,7 +134,7 @@ export default ({
         return keys
     },
 
-    selectRecords: function (keys) {
+    selectRecords(keys) {
         if (!canSelectMultipleRecords) {
             this.deselectAllRecords()
 
@@ -158,7 +158,7 @@ export default ({
         this.updatedSelectedRecords()
     },
 
-    deselectRecords: function (keys) {
+    deselectRecords(keys) {
         for (let key of keys) {
             if (this.isTrackingDeselectedRecords) {
                 this.deselectedRecords.add(key)
@@ -172,7 +172,7 @@ export default ({
         this.updatedSelectedRecords()
     },
 
-    updatedSelectedRecords: function () {
+    updatedSelectedRecords() {
         if (canSelectMultipleRecords) {
             this.entangledSelectedRecords = [...this.selectedRecords]
 
@@ -182,7 +182,7 @@ export default ({
         this.entangledSelectedRecords = [...this.selectedRecords][0] ?? null
     },
 
-    toggleSelectedRecord: function (key) {
+    toggleSelectedRecord(key) {
         if (this.isRecordSelected(key)) {
             this.deselectRecords([key])
 
@@ -214,7 +214,7 @@ export default ({
         this.updatedSelectedRecords()
     },
 
-    deselectAllRecords: function () {
+    deselectAllRecords() {
         this.isTrackingDeselectedRecords = false
         this.selectedRecords = new Set()
         this.deselectedRecords = new Set()
@@ -222,7 +222,7 @@ export default ({
         this.updatedSelectedRecords()
     },
 
-    isRecordSelected: function (key) {
+    isRecordSelected(key) {
         if (this.isTrackingDeselectedRecords) {
             return !this.deselectedRecords.has(key)
         }
@@ -230,11 +230,11 @@ export default ({
         return this.selectedRecords.has(key)
     },
 
-    areRecordsSelected: function (keys) {
+    areRecordsSelected(keys) {
         return keys.every((key) => this.isRecordSelected(key))
     },
 
-    toggleCollapseGroup: function (group) {
+    toggleCollapseGroup(group) {
         if (this.isGroupCollapsed(group)) {
             this.collapsedGroups.splice(this.collapsedGroups.indexOf(group), 1)
 
@@ -244,15 +244,15 @@ export default ({
         this.collapsedGroups.push(group)
     },
 
-    isGroupCollapsed: function (group) {
+    isGroupCollapsed(group) {
         return this.collapsedGroups.includes(group)
     },
 
-    resetCollapsedGroups: function () {
+    resetCollapsedGroups() {
         this.collapsedGroups = []
     },
 
-    watchForCheckboxClicks: function () {
+    watchForCheckboxClicks() {
         if (this.checkboxClickController) {
             this.checkboxClickController.abort()
         }
@@ -270,7 +270,7 @@ export default ({
         )
     },
 
-    handleCheckboxClick: function (event, checkbox) {
+    handleCheckboxClick(event, checkbox) {
         if (!this.lastChecked) {
             this.lastChecked = checkbox
 

packages/widgets/resources/js/components/chart.js

@@ -3,7 +3,7 @@ import 'chartjs-adapter-luxon'
 
 export default function chart({ cachedData, options, type }) {
     return {
-        init: function () {
+        init() {
             this.initChart()
 
             this.$wire.$on('updateChartData', ({ data }) => {
@@ -39,7 +39,7 @@ export default function chart({ cachedData, options, type }) {
                 })
         },
 
-        initChart: function (data = null) {
+        initChart(data = null) {
             if (
                 !this.$refs.canvas ||
                 !this.$refs.backgroundColorElement ||
@@ -107,7 +107,7 @@ export default function chart({ cachedData, options, type }) {
             })
         },
 
-        getChart: function () {
+        getChart() {
             if (!this.$refs.canvas) {
                 return null
             }

packages/widgets/resources/js/components/stats-overview/stat/chart.js

@@ -8,7 +8,7 @@ export default function statsOverviewStatChart({
     return {
         dataChecksum,
 
-        init: function () {
+        init() {
             Alpine.effect(() => {
                 Alpine.store('theme')
 
@@ -40,7 +40,7 @@ export default function statsOverviewStatChart({
                 })
         },
 
-        initChart: function () {
+        initChart() {
             if (
                 !this.$refs.canvas ||
                 !this.$refs.backgroundColorElement ||
@@ -98,7 +98,7 @@ export default function statsOverviewStatChart({
             })
         },
 
-        getChart: function () {
+        getChart() {
             if (!this.$refs.canvas) {
                 return null
             }

packages/widgets/resources/views/stats-overview-widget/stat.blade.php

@@ -59,7 +59,7 @@
 
     @if ($chart = $getChart())
         {{-- An empty function to initialize the Alpine component with until it's loaded with `x-load`. This removes the need for `x-ignore`, allowing the chart to be updated via Livewire polling. --}}
-        <div x-data="{ statsOverviewStatChart: function () {} }">
+        <div x-data="{ statsOverviewStatChart() {} }">
             <div
                 @if (FilamentView::hasSpaMode())
                     x-load="visible"