@furystack/shades-common-components 3.6.1 → 4.0.1

package/dist/components/command-palette/index.js

@@ -22,23 +22,38 @@ const command_palette_manager_1 = require("./command-palette-manager");
 const command_palette_input_1 = require("./command-palette-input");
 const command_palette_suggestion_list_1 = require("./command-palette-suggestion-list");
 const click_away_service_1 = require("../../services/click-away-service");
+const services_1 = require("../../services");
 __exportStar(require("./command-palette-input"), exports);
 __exportStar(require("./command-palette-manager"), exports);
 __exportStar(require("./command-palette-suggestion-list"), exports);
 __exportStar(require("./command-provider"), exports);
 exports.CommandPalette = (0, shades_1.Shade)({
     shadowDomName: 'shade-command-palette',
-    getInitialState: ({ props }) => ({
-        manager: new command_palette_manager_1.CommandPaletteManager(props.commandProviders),
-    }),
-    resources: ({ getState, element: rootElement }) => {
-        const { manager } = getState();
-        const element = rootElement.querySelector('.input-container');
-        const clickAwayListener = new click_away_service_1.ClickAwayService(rootElement, () => manager.isOpened.setValue(false));
-        return [
-            manager.isOpened.subscribe((isOpened) => {
-                const suggestions = rootElement.querySelector('.close-suggestions');
-                const postControls = rootElement.querySelector('.post-controls');
+    render: ({ props, injector, element, useState, useDisposable, useObservable }) => {
+        element.style.flexGrow = '1';
+        const [manager] = useState('manager', new command_palette_manager_1.CommandPaletteManager(props.commandProviders));
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
+        useDisposable('clickAwayService', () => new click_away_service_1.ClickAwayService(element, () => manager.isOpened.setValue(false)));
+        const [isLoadingAtRender] = useObservable('isLoading', manager.isLoading, async (isLoading) => {
+            const loader = element.querySelector('.loader-container');
+            if (isLoading) {
+                (0, promisify_animation_1.promisifyAnimation)(loader, [{ opacity: 0 }, { opacity: 1 }], {
+                    duration: 100,
+                    fill: 'forwards',
+                });
+            }
+            else {
+                (0, promisify_animation_1.promisifyAnimation)(loader, [{ opacity: 1 }, { opacity: 0 }], {
+                    duration: 100,
+                    fill: 'forwards',
+                });
+            }
+        });
+        const [isOpenedAtRender, setIsOpened] = useObservable('isOpened', manager.isOpened, (isOpened) => {
+            {
+                const suggestions = element.querySelector('.close-suggestions');
+                const postControls = element.querySelector('.post-controls');
+                const inputContainer = element.querySelector('.input-container');
                 if (isOpened) {
                     (0, promisify_animation_1.promisifyAnimation)(suggestions, [{ opacity: 0 }, { opacity: 1 }], {
                         duration: 500,
@@ -48,7 +63,7 @@ exports.CommandPalette = (0, shades_1.Shade)({
                         duration: 100,
                         fill: 'forwards',
                     });
-                    (0, promisify_animation_1.promisifyAnimation)(element, [{ background: 'transparent' }, { background: 'rgba(128,128,128,0.1)' }], {
+                    (0, promisify_animation_1.promisifyAnimation)(inputContainer, [{ background: 'transparent' }, { background: theme.background.default }], {
                         duration: 500,
                         fill: 'forwards',
                         easing: 'cubic-bezier(0.050, 0.570, 0.840, 1.005)',
@@ -64,35 +79,14 @@ exports.CommandPalette = (0, shades_1.Shade)({
                         fill: 'forwards',
                         delay: 300,
                     });
-                    (0, promisify_animation_1.promisifyAnimation)(element, [{ background: 'rgba(128,128,128,0.1)' }, { background: 'transparent' }], {
+                    (0, promisify_animation_1.promisifyAnimation)(inputContainer, [{ background: theme.background.default }, { background: 'transparent' }], {
                         duration: 300,
                         fill: 'forwards',
                         easing: 'cubic-bezier(0.000, 0.245, 0.190, 0.790)',
                     });
                 }
-            }),
-            manager.isLoading.subscribe(async (isLoading) => {
-                const loader = rootElement.querySelector('.loader-container');
-                if (isLoading) {
-                    (0, promisify_animation_1.promisifyAnimation)(loader, [{ opacity: 0 }, { opacity: 1 }], {
-                        duration: 100,
-                        fill: 'forwards',
-                    });
-                }
-                else {
-                    (0, promisify_animation_1.promisifyAnimation)(loader, [{ opacity: 1 }, { opacity: 0 }], {
-                        duration: 100,
-                        fill: 'forwards',
-                    });
-                }
-            }),
-            clickAwayListener,
-            manager,
-        ];
-    },
-    render: ({ props, injector, element, getState }) => {
-        element.style.flexGrow = '1';
-        const { manager } = getState();
+            }
+        });
         return ((0, shades_1.createComponent)("div", { style: { display: 'flex', flexDirection: 'column' }, onkeyup: (ev) => {
                 if (ev.key === 'Enter') {
                     ev.preventDefault();
@@ -123,18 +117,18 @@ exports.CommandPalette = (0, shades_1.Shade)({
                         color: '#aaa',
                         fontWeight: 'bolder',
                         textShadow: '0 0 1px #aaa',
-                    }, onclick: () => manager.isOpened.setValue(true) }, props.defaultPrefix),
+                    }, onclick: () => setIsOpened(true) }, props.defaultPrefix),
                 (0, shades_1.createComponent)(command_palette_input_1.CommandPaletteInput, { manager: manager }),
                 (0, shades_1.createComponent)("div", { className: "post-controls", style: {
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: 'space-between',
-                        width: manager.isOpened.getValue() ? '50px' : '0px',
+                        width: isOpenedAtRender ? '50px' : '0px',
                         overflow: 'hidden',
                     } },
-                    (0, shades_1.createComponent)("div", { className: "loader-container", style: { width: '20px', height: '20px', opacity: manager.isLoading.getValue() ? '1' : '0' } },
+                    (0, shades_1.createComponent)("div", { className: "loader-container", style: { width: '20px', height: '20px', opacity: isLoadingAtRender ? '1' : '0' } },
                         (0, shades_1.createComponent)(loader_1.Loader, { style: { width: '100%', height: '100%' } })),
-                    (0, shades_1.createComponent)("div", { className: "close-suggestions", onclick: () => manager.isOpened.setValue(false), style: {
+                    (0, shades_1.createComponent)("div", { className: "close-suggestions", onclick: () => setIsOpened(false), style: {
                             width: '20px',
                             height: '20px',
                             opacity: manager.isOpened.getValue() ? '1' : '0',

package/dist/components/command-palette/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/command-palette/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/command-palette/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/data-grid/body.js

@@ -5,25 +5,18 @@ const shades_1 = require("@furystack/shades");
 const loader_1 = require("../loader");
 const data_grid_row_1 = require("./data-grid-row");
 exports.DataGridBody = (0, shades_1.Shade)({
-    getInitialState: ({ props }) => ({
-        data: props.service.data.getValue().entries,
-        isLoading: props.service.isLoading.getValue(),
-    }),
-    resources: ({ props, updateState }) => [
-        props.service.data.subscribe((data) => updateState({ data: data.entries })),
-        props.service.isLoading.subscribe((isLoading) => updateState({ isLoading })),
-    ],
     shadowDomName: 'shade-data-grid-body',
-    render: ({ getState, props, element }) => {
+    render: ({ props, element, useObservable }) => {
         element.style.display = 'table-row-group';
-        const state = getState();
-        if (state.isLoading) {
+        const [data] = useObservable('data', props.service.data);
+        const [isLoading] = useObservable('isLoading', props.service.isLoading);
+        if (isLoading) {
             return ((0, shades_1.createComponent)("div", { style: { display: 'flex', height: '100%', justifyContent: 'center', alignItems: 'center', width: '100%' } }, props.loaderComponent || (0, shades_1.createComponent)(loader_1.Loader, { style: { height: '128px', width: '128px' } })));
         }
-        if (!state.data?.length) {
+        if (!data?.entries?.length) {
             return props.emptyComponent || (0, shades_1.createComponent)("div", null, " - No Data - ");
         }
-        return ((0, shades_1.createComponent)(shades_1.createFragment, null, state.data.map((entry) => ((0, shades_1.createComponent)(data_grid_row_1.DataGridRow, { columns: props.columns, entry: entry, service: props.service, rowComponents: props.rowComponents, onRowClick: props.onRowClick, onRowDoubleClick: props.onRowDoubleClick, focusedRowStyle: props.focusedRowStyle, unfocusedRowStyle: props.unfocusedRowStyle, selectedRowStyle: props.selectedRowStyle, unselectedRowStyle: props.unselectedRowStyle })))));
+        return ((0, shades_1.createComponent)(shades_1.createComponent, null, data?.entries?.map((entry) => ((0, shades_1.createComponent)(data_grid_row_1.DataGridRow, { columns: props.columns, entry: entry, service: props.service, rowComponents: props.rowComponents, onRowClick: props.onRowClick, onRowDoubleClick: props.onRowDoubleClick, focusedRowStyle: props.focusedRowStyle, unfocusedRowStyle: props.unfocusedRowStyle, selectedRowStyle: props.selectedRowStyle, unselectedRowStyle: props.unselectedRowStyle })))));
     },
 });
 //# sourceMappingURL=body.js.map

package/dist/components/data-grid/body.js.map

@@ -1 +1 @@
-{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/components/data-grid/body.tsx"],"names":[],"mappings":";;;AAEA,8CAA0E;AAE1E,sCAAkC;AAClC,mDAA6C;AAsBhC,QAAA,YAAY,GAAsF,IAAA,cAAK,EAGlH;IACA,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QAC/B,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO;QAC3C,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE;KAC9C,CAAC;IACF,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC;QACrC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;QAC3E,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC;KAC7E;IACD,aAAa,EAAE,sBAAsB;IACrC,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;QACvC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,iBAAiB,CAAA;QACzC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;QAExB,IAAI,KAAK,CAAC,SAAS,EAAE;YACnB,OAAO,CACL,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,IAE3G,KAAK,CAAC,eAAe,IAAI,8BAAC,eAAM,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAI,CAC5E,CACP,CAAA;SACF;QAED,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE;YACvB,OAAO,KAAK,CAAC,cAAc,IAAI,2DAAwB,CAAA;SACxD;QAED,OAAO,CACL,6DACG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACzB,8BAAC,2BAAW,IACV,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,GAC/B,CAChB,CAAC,CACD,CACJ,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../src/components/data-grid/body.tsx"],"names":[],"mappings":";;;AAEA,8CAA0D;AAE1D,sCAAkC;AAClC,mDAA6C;AAiBhC,QAAA,YAAY,GAAiF,IAAA,cAAK,EAE7G;IACA,aAAa,EAAE,sBAAsB;IACrC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,EAAE,EAAE;QAC5C,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,iBAAiB,CAAA;QAEzC,MAAM,CAAC,IAAI,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QACxD,MAAM,CAAC,SAAS,CAAC,GAAG,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;QAEvE,IAAI,SAAS,EAAE;YACb,OAAO,CACL,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,IAE3G,KAAK,CAAC,eAAe,IAAI,8BAAC,eAAM,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAI,CAC5E,CACP,CAAA;SACF;QAED,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE;YAC1B,OAAO,KAAK,CAAC,cAAc,IAAI,2DAAwB,CAAA;SACxD;QAED,OAAO,CACL,8DACG,IAAI,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC7B,8BAAC,2BAAW,IACV,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,UAAU,EAAE,KAAK,CAAC,UAAU,EAC5B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,kBAAkB,EAAE,KAAK,CAAC,kBAAkB,GAC/B,CAChB,CAAC,CACD,CACJ,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/data-grid/data-grid-row.js

@@ -2,18 +2,31 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataGridRow = void 0;
 const shades_1 = require("@furystack/shades");
+const services_1 = require("../../services");
 exports.DataGridRow = (0, shades_1.Shade)({
-    getInitialState: ({ props }) => ({
-        focus: props.service.focusedEntry.getValue(),
-        selection: props.service.selection.getValue(),
-    }),
     shadowDomName: 'shades-data-grid-row',
-    resources: ({ props, element }) => [
-        props.service.focusedEntry.subscribe((newEntry) => {
+    render: ({ props, element, useObservable, injector }) => {
+        const { entry, rowComponents, columns, service } = props;
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
+        const attachSelectedStyles = (selection) => {
+            if (selection.includes(entry)) {
+                element.classList.add('selected');
+                (0, shades_1.attachStyles)(element, { style: props.selectedRowStyle || { backgroundColor: theme.background.default } });
+                element.setAttribute('aria-selected', 'true');
+            }
+            else {
+                element.classList.remove('selected');
+                (0, shades_1.attachStyles)(element, { style: props.unselectedRowStyle || { backgroundColor: 'transparent' } });
+                element.setAttribute('aria-selected', 'false');
+            }
+        };
+        const [selection] = useObservable('isSelected', service.selection, attachSelectedStyles, true);
+        attachSelectedStyles(selection);
+        const [focus] = useObservable('focus', service.focusedEntry, (newEntry) => {
             if (newEntry === props.entry) {
                 (0, shades_1.attachStyles)(element, {
                     style: props.focusedRowStyle || {
-                        filter: 'brightness(1.5)',
+                        boxShadow: `0 0 0 1px ${theme.palette.primary.main}`,
                         fontWeight: 'bolder',
                     },
                 });
@@ -25,8 +38,8 @@ exports.DataGridRow = (0, shades_1.Shade)({
                 if (maxTop < currentTop) {
                     parent.scrollTo({ top: maxTop, behavior: 'smooth' });
                 }
-                const footerHeight = element.closest('shade-data-grid')?.querySelector('shade-data-grid-footer')?.getBoundingClientRect().height ||
-                    42;
+                const footerHeight = element.closest('shade-data-grid')?.querySelector('shade-data-grid-footer')?.getBoundingClientRect()
+                    .height || 42;
                 const visibleMaxTop = parent.clientHeight - footerHeight;
                 const desiredMaxTop = element.offsetTop + element.clientHeight;
                 if (desiredMaxTop > visibleMaxTop) {
@@ -37,40 +50,25 @@ exports.DataGridRow = (0, shades_1.Shade)({
                 element.classList.remove('focused');
                 (0, shades_1.attachStyles)(element, {
                     style: props.unfocusedRowStyle || {
-                        filter: 'brightness(1)',
+                        boxShadow: 'none',
                         fontWeight: 'inherit',
                     },
                 });
             }
-        }, true),
-        props.service.selection.subscribe((selection) => {
-            if (selection.includes(props.entry)) {
-                element.classList.add('selected');
-                (0, shades_1.attachStyles)(element, { style: props.selectedRowStyle || { backgroundColor: 'rgba(128,128,128,0.1)' } });
-                element.setAttribute('aria-selected', 'true');
-            }
-            else {
-                element.classList.remove('selected');
-                (0, shades_1.attachStyles)(element, { style: props.unselectedRowStyle || { backgroundColor: 'transparent' } });
-                element.setAttribute('aria-selected', 'false');
-            }
-        }, true),
-    ],
-    render: ({ getState, props, element }) => {
-        const state = getState();
-        const { entry, rowComponents, columns } = props;
+        }, true);
         element.style.display = 'table-row';
         element.style.cursor = 'default';
         element.style.userSelect = 'none';
-        if (state.selection?.includes(entry)) {
+        if (selection?.includes(entry)) {
             element.setAttribute('aria-selected', 'true');
             element.classList.add('selected');
         }
-        if (state.focus === entry) {
+        if (focus === entry) {
             element.classList.add('focused');
         }
-        element.setAttribute('aria-selected', state.selection?.includes(entry).toString() || 'false');
-        return ((0, shades_1.createComponent)(shades_1.createFragment, null, columns.map((column) => ((0, shades_1.createComponent)("td", { style: { padding: '0.5em' }, onclick: (ev) => props.onRowClick?.(entry, ev), ondblclick: (ev) => props.onRowDoubleClick?.(entry, ev) }, rowComponents?.[column]?.(entry, state) || rowComponents?.default?.(entry, state) || ((0, shades_1.createComponent)("span", null, entry[column])))))));
+        element.setAttribute('aria-selected', selection?.includes(entry).toString() || 'false');
+        return ((0, shades_1.createComponent)(shades_1.createComponent, null, columns.map((column) => ((0, shades_1.createComponent)("td", { style: { padding: '0.5em' }, onclick: (ev) => props.onRowClick?.(entry, ev), ondblclick: (ev) => props.onRowDoubleClick?.(entry, ev) }, rowComponents?.[column]?.(entry, { selection, focus }) ||
+            rowComponents?.default?.(entry, { selection, focus }) || (0, shades_1.createComponent)("span", null, entry[column]))))));
     },
 });
 //# sourceMappingURL=data-grid-row.js.map

package/dist/components/data-grid/data-grid-row.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-grid-row.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid-row.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-grid-row.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid-row.tsx"],"names":[],"mappings":"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"}

package/dist/components/data-grid/data-grid.js

@@ -8,21 +8,17 @@ const footer_1 = require("./footer");
 const services_1 = require("../../services");
 exports.DataGrid = (0, shades_1.Shade)({
     shadowDomName: 'shade-data-grid',
-    resources: ({ element, props }) => {
-        return [
-            new services_1.ClickAwayService(element, () => {
-                props.service.hasFocus.setValue(false);
-            }),
-        ];
-    },
     constructed: ({ props }) => {
         const listener = (ev) => props.service.handleKeyDown(ev);
         window.addEventListener('keydown', listener);
         return () => window.removeEventListener('keydown', listener);
     },
-    render: ({ props, injector }) => {
+    render: ({ props, injector, useDisposable, element }) => {
         const tp = injector.getInstance(services_1.ThemeProviderService);
         const { theme } = tp;
+        useDisposable('clickAway', () => new services_1.ClickAwayService(element, () => {
+            props.service.hasFocus.setValue(false);
+        }));
         const headerStyle = {
             backdropFilter: 'blur(12px)',
             padding: '12px 0',

package/dist/components/data-grid/data-grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid.tsx"],"names":[],"mappings":"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"}

package/dist/components/data-grid/footer.js

@@ -6,19 +6,14 @@ const services_1 = require("../../services");
 exports.dataGridItemsPerPage = [10, 20, 25, 50, 100, Infinity];
 exports.DataGridFooter = (0, shades_1.Shade)({
     shadowDomName: 'shade-data-grid-footer',
-    getInitialState: ({ props }) => ({
-        data: props.service.data.getValue(),
-    }),
-    constructed: ({ props, updateState }) => {
-        const disposables = [props.service.data.subscribe((data) => updateState({ data }))];
-        return () => disposables.forEach((d) => d.dispose());
-    },
-    render: ({ props, getState, injector }) => {
-        const state = getState();
-        const currentQuerySettings = props.service.querySettings.getValue();
-        const currentPage = Math.ceil(currentQuerySettings.skip || 0) / (currentQuerySettings.top || 1);
-        const currentEntriesPerPage = currentQuerySettings.top || Infinity;
+    render: ({ props, injector, useObservable }) => {
         const { theme } = injector.getInstance(services_1.ThemeProviderService);
+        const [currentData] = useObservable('dataUpdater', props.service.data);
+        const [currentQuerySettings] = useObservable('querySettings', props.service.querySettings);
+        const top = currentQuerySettings.top || Infinity;
+        const skip = currentQuerySettings.skip || 0;
+        const currentPage = Math.ceil(skip) / (top || 1);
+        const currentEntriesPerPage = top;
         return ((0, shades_1.createComponent)("div", { className: "pager", style: {
                 backdropFilter: 'blur(10px)',
                 color: theme.text.secondary,
@@ -36,7 +31,7 @@ exports.DataGridFooter = (0, shades_1.Shade)({
                         const currentQuery = props.service.querySettings.getValue();
                         props.service.querySettings.setValue({ ...currentQuery, skip: (currentQuery.top || 0) * value });
                     } }, [
-                    ...new Array(Math.ceil(state.data.count / (props.service.querySettings.getValue().top || Infinity))),
+                    ...new Array(Math.ceil(currentData.count / (props.service.querySettings.getValue().top || Infinity))),
                 ].map((_val, index) => ((0, shades_1.createComponent)("option", { value: index.toString(), selected: currentPage === index }, (index + 1).toString())))))),
             (0, shades_1.createComponent)("div", null,
                 "Show",

package/dist/components/data-grid/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,6CAAqD;AAGxC,QAAA,oBAAoB,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,QAAQ,CAAC,CAAA;AAEtD,QAAA,cAAc,GAAG,IAAA,cAAK,EAAsC;IACvE,aAAa,EAAE,wBAAwB;IACvC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;QAC7C,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAE5D,MAAM,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QAEtE,MAAM,CAAC,oBAAoB,CAAC,GAAG,aAAa,CAAC,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,CAAA;QAE1F,MAAM,GAAG,GAAG,oBAAoB,CAAC,GAAG,IAAI,QAAQ,CAAA;QAChD,MAAM,IAAI,GAAG,oBAAoB,CAAC,IAAI,IAAI,CAAC,CAAA;QAC3C,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC,CAAA;QAChD,MAAM,qBAAqB,GAAG,GAAG,CAAA;QAEjC,OAAO,CACL,uCACE,SAAS,EAAC,OAAO,EACjB,KAAK,EAAE;gBACL,cAAc,EAAE,YAAY;gBAC5B,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS;gBAC3B,QAAQ,EAAE,QAAQ;gBAClB,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,UAAU;gBAC1B,OAAO,EAAE,KAAK;gBACd,UAAU,EAAE,QAAQ;aACrB;YAEA,qBAAqB,KAAK,QAAQ,IAAI,CACrC;;gBAEE,0CACE,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAC1B,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;wBACf,MAAM,KAAK,GAAG,QAAQ,CAAE,EAAE,CAAC,MAAc,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;wBACpD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAA;wBAC3D,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,GAAG,YAAY,EAAE,IAAI,EAAE,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,CAAA;oBAClG,CAAC,IAEA;oBACC,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,GAAG,IAAI,QAAQ,CAAC,CAAC,CAAC;iBACtG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACrB,0CAAQ,KAAK,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,WAAW,KAAK,KAAK,IAC7D,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,CAChB,CACV,CAAC,CACK,CACL,CACP;YACD;;gBAEE,0CACE,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAC1B,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;wBACf,MAAM,KAAK,GAAG,QAAQ,CAAE,EAAE,CAAC,aAAqB,CAAC,KAAe,EAAE,EAAE,CAAC,CAAA;wBACrE,KAAK,CAAC,OAAO,CAAC,aAAa,CAAC,QAAQ,CAAC;4BACnC,GAAG,oBAAoB;4BACvB,GAAG,EAAE,KAAK;4BACV,IAAI,EAAE,WAAW,GAAG,KAAK;yBAC1B,CAAC,CAAA;oBACJ,CAAC,IAEA,4BAAoB,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAChC,0CAAQ,KAAK,EAAE,EAAE,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,KAAK,qBAAqB,IACjE,EAAE,CAAC,QAAQ,EAAE,CACP,CACV,CAAC,CACK;iCAEL,CACF,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/data-grid/header.js

@@ -6,10 +6,17 @@ const utils_1 = require("@furystack/utils");
 const input_1 = require("../inputs/input");
 exports.DataGridHeader = (0, shades_1.Shade)({
     shadowDomName: 'data-grid-header',
-    getInitialState: ({ props }) => ({
-        querySettings: props.collectionService.querySettings.getValue(),
-        isSearchOpened: false,
-        updateSearchValue: (0, utils_1.debounce)((value) => {
+    // getInitialState: ({ props }) => ({
+    //   querySettings: props.collectionService.querySettings.getValue(),
+    //   isSearchOpened: false,
+    // updateSearchValue: ,
+    // }),
+    render: ({ props, element, useState, useObservable }) => {
+        const [querySettings, setQuerySettings] = useObservable('querySettings', props.collectionService.querySettings);
+        const currentOrder = Object.keys(querySettings.order || {})[0];
+        const currentOrderDirection = Object.values(querySettings.order || {})[0];
+        const [isSearchOpened, setIsSearchOpened] = useState('isSearchOpened', false);
+        const [updateSearchValue] = useState('updateSearchValue', (0, utils_1.debounce)((value) => {
             const currentSettings = props.collectionService.querySettings.getValue();
             const newSettings = {
                 ...currentSettings,
@@ -19,26 +26,20 @@ exports.DataGridHeader = (0, shades_1.Shade)({
                 },
             };
             props.collectionService.querySettings.setValue(newSettings);
-        }),
-    }),
-    constructed: ({ props, updateState, getState }) => {
-        const disposable = props.collectionService.querySettings.subscribe((querySettings) => updateState({ querySettings }, getState().isSearchOpened));
-        return () => disposable.dispose();
-    },
-    render: ({ getState, props, updateState, element }) => {
-        const currentState = getState();
-        const currentOrder = Object.keys(currentState.querySettings.order || {})[0];
-        const currentOrderDirection = Object.values(currentState.querySettings.order || {})[0];
+        }));
         const filterValue = props.collectionService.querySettings.getValue().filter?.[props.field]?.$regex || '';
-        if (currentState.isSearchOpened) {
+        useObservable('querySettingsChange', props.collectionService.querySettings, (newSettings) => {
+            setQuerySettings(newSettings);
+        });
+        if (isSearchOpened) {
             setTimeout(() => {
                 element.querySelector('input')?.focus();
             }, 1);
-            return ((0, shades_1.createComponent)(input_1.Input, { style: { padding: '0px' }, value: filterValue, placeholder: props.field, autofocus: true, onblur: () => updateState({ isSearchOpened: false }), onkeyup: (ev) => currentState.updateSearchValue(ev.target.value), labelProps: {
+            return ((0, shades_1.createComponent)(input_1.Input, { style: { padding: '0px' }, value: filterValue, placeholder: props.field, autofocus: true, onblur: () => setIsSearchOpened(false), onkeyup: (ev) => updateSearchValue(ev.target.value), labelProps: {
                     style: { padding: '0px 2em' },
                 } }));
         }
-        return ((0, shades_1.createComponent)("div", { style: { display: 'flex', width: '100%', height: '100%', justifyContent: 'space-around' }, onclick: () => updateState({ isSearchOpened: true }) },
+        return ((0, shades_1.createComponent)("div", { style: { display: 'flex', width: '100%', height: '100%', justifyContent: 'space-around' }, onclick: () => setIsSearchOpened(true) },
             (0, shades_1.createComponent)("div", null, props.field),
             (0, shades_1.createComponent)("div", { className: "header-controls", style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
                 (0, shades_1.createComponent)("div", { title: "Change order", style: { padding: '0 1em', cursor: 'pointer', opacity: currentOrder === props.field ? '1' : '0.5' }, onclick: (ev) => {
@@ -50,7 +51,7 @@ exports.DataGridHeader = (0, shades_1.Shade)({
                         }
                         newOrder[props.field] = newDirection;
                         props.collectionService.querySettings.setValue({
-                            ...currentState.querySettings,
+                            ...querySettings,
                             order: newOrder,
                         });
                     } }, (currentOrder === props.field && (currentOrderDirection === 'ASC' ? '⬇' : '⬆')) || '↕'))));

package/dist/components/data-grid/header.js.map

@@ -1 +1 @@
-{"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/data-grid/header.tsx"],"names":[],"mappings":";;;AAEA,8CAA0D;AAC1D,4CAA2C;AAE3C,2CAAuC;AAa1B,QAAA,cAAc,GAGE,IAAA,cAAK,EAA0D;IAC1F,aAAa,EAAE,kBAAkB;IACjC,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QAC/B,aAAa,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE;QAC/D,cAAc,EAAE,KAAK;QACrB,iBAAiB,EAAE,IAAA,gBAAQ,EAAC,CAAC,KAAa,EAAE,EAAE;YAC5C,MAAM,eAAe,GAAG,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAA;YACxE,MAAM,WAAW,GAA8B;gBAC7C,GAAG,eAAe;gBAClB,MAAM,EAAE;oBACN,GAAG,eAAe,CAAC,MAAM;oBACzB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE;iBACjC;aACF,CAAA;YACD,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAA;QAC7D,CAAC,CAAC;KACH,CAAC;IACF,WAAW,EAAE,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE;QAChD,MAAM,UAAU,GAAG,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,aAAa,EAAE,EAAE,CACnF,WAAW,CAAC,EAAE,aAAa,EAAE,EAAE,QAAQ,EAAE,CAAC,cAAc,CAAC,CAC1D,CAAA;QACD,OAAO,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,CAAA;IACnC,CAAC;IACD,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,EAAE,EAAE;QACpD,MAAM,YAAY,GAAG,QAAQ,EAAE,CAAA;QAC/B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QAC3E,MAAM,qBAAqB,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QAEtF,MAAM,WAAW,GAAI,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,MAAc,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,MAAM,IAAI,EAAE,CAAA;QAEjH,IAAI,YAAY,CAAC,cAAc,EAAE;YAC/B,UAAU,CAAC,GAAG,EAAE;gBACd,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAA;YACzC,CAAC,EAAE,CAAC,CAAC,CAAA;YACL,OAAO,CACL,8BAAC,aAAK,IACJ,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,EACzB,KAAK,EAAE,WAAW,EAClB,WAAW,EAAE,KAAK,CAAC,KAAK,EACxB,SAAS,QACT,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,EAAE,cAAc,EAAE,KAAK,EAAE,CAAC,EACpD,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAE,EAAE,CAAC,MAA2B,CAAC,KAAK,CAAC,EACtF,UAAU,EAAE;oBACV,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;iBAC9B,GACD,CACH,CAAA;SACF;QAED,OAAO,CACL,uCACE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,EACzF,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;YAEpD,2CAAM,KAAK,CAAC,KAAK,CAAO;YACxB,uCAAK,SAAS,EAAC,iBAAiB,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE;gBACzG,uCACE,KAAK,EAAC,cAAc,EACpB,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,EACnG,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE;wBACd,EAAE,CAAC,eAAe,EAAE,CAAA;wBACpB,IAAI,YAAY,GAAmB,KAAK,CAAA;wBACxC,MAAM,QAAQ,GAAyC,EAAE,CAAA;wBAEzD,IAAI,YAAY,KAAK,KAAK,CAAC,KAAK,EAAE;4BAChC,YAAY,GAAG,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAA;yBAChE;wBACD,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,YAAY,CAAA;wBACpC,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC;4BAC7C,GAAG,YAAY,CAAC,aAAa;4BAC7B,KAAK,EAAE,QAAQ;yBAChB,CAAC,CAAA;oBACJ,CAAC,IAEA,CAAC,YAAY,KAAK,KAAK,CAAC,KAAK,IAAI,CAAC,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,CACnF,CACF,CACF,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/data-grid/header.tsx"],"names":[],"mappings":";;;AAEA,8CAA0D;AAC1D,4CAA2C;AAE3C,2CAAuC;AAa1B,QAAA,cAAc,GAGH,IAAA,cAAK,EAAgC;IAC3D,aAAa,EAAE,kBAAkB;IACjC,qCAAqC;IACrC,qEAAqE;IACrE,2BAA2B;IAC3B,uBAAuB;IACvB,MAAM;IACN,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;QACtD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,aAAa,CAAC,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,CAAA;QAC/G,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QAC9D,MAAM,qBAAqB,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;QAEzE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAA;QAC7E,MAAM,CAAC,iBAAiB,CAAC,GAAG,QAAQ,CAClC,mBAAmB,EACnB,IAAA,gBAAQ,EAAC,CAAC,KAAa,EAAE,EAAE;YACzB,MAAM,eAAe,GAAG,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAA;YACxE,MAAM,WAAW,GAA8B;gBAC7C,GAAG,eAAe;gBAClB,MAAM,EAAE;oBACN,GAAG,eAAe,CAAC,MAAM;oBACzB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE;iBACjC;aACF,CAAA;YACD,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAA;QAC7D,CAAC,CAAC,CACH,CAAA;QAED,MAAM,WAAW,GAAI,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC,MAAc,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,MAAM,IAAI,EAAE,CAAA;QAEjH,aAAa,CAAC,qBAAqB,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,EAAE,CAAC,WAAW,EAAE,EAAE;YAC1F,gBAAgB,CAAC,WAAW,CAAC,CAAA;QAC/B,CAAC,CAAC,CAAA;QAEF,IAAI,cAAc,EAAE;YAClB,UAAU,CAAC,GAAG,EAAE;gBACd,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAA;YACzC,CAAC,EAAE,CAAC,CAAC,CAAA;YACL,OAAO,CACL,8BAAC,aAAK,IACJ,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,EACzB,KAAK,EAAE,WAAW,EAClB,WAAW,EAAE,KAAK,CAAC,KAAK,EACxB,SAAS,QACT,MAAM,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,EACtC,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,iBAAiB,CAAE,EAAE,CAAC,MAA2B,CAAC,KAAK,CAAC,EACzE,UAAU,EAAE;oBACV,KAAK,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;iBAC9B,GACD,CACH,CAAA;SACF;QAED,OAAO,CACL,uCACE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,EACzF,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,IAAI,CAAC;YAEtC,2CAAM,KAAK,CAAC,KAAK,CAAO;YACxB,uCAAK,SAAS,EAAC,iBAAiB,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE;gBACzG,uCACE,KAAK,EAAC,cAAc,EACpB,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,EACnG,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE;wBACd,EAAE,CAAC,eAAe,EAAE,CAAA;wBACpB,IAAI,YAAY,GAAmB,KAAK,CAAA;wBACxC,MAAM,QAAQ,GAAyC,EAAE,CAAA;wBAEzD,IAAI,YAAY,KAAK,KAAK,CAAC,KAAK,EAAE;4BAChC,YAAY,GAAG,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAA;yBAChE;wBACD,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,YAAY,CAAA;wBACpC,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAAC,QAAQ,CAAC;4BAC7C,GAAG,aAAa;4BAChB,KAAK,EAAE,QAAQ;yBAChB,CAAC,CAAA;oBACJ,CAAC,IAEA,CAAC,YAAY,KAAK,KAAK,CAAC,KAAK,IAAI,CAAC,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,CACnF,CACF,CACF,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/data-grid/selection-cell.js

@@ -4,29 +4,15 @@ exports.SelectionCell = void 0;
 const shades_1 = require("@furystack/shades");
 exports.SelectionCell = (0, shades_1.Shade)({
     shadowDomName: 'shades-data-grid-selection-cell',
-    resources: ({ props, element }) => [
-        props.service.selection.subscribe((selection) => {
-            if (selection.includes(props.entry)) {
-                ;
-                element.firstChild.checked = true;
-            }
-            else {
-                ;
-                element.firstChild.checked = false;
-            }
-        }),
-    ],
-    render: ({ props }) => {
-        return ((0, shades_1.createComponent)("input", { onchange: (ev) => {
-                if (ev.target.checked) {
-                    props.service.selection.setValue([...props.service.selection.getValue(), props.entry]);
-                }
-                else {
-                    props.service.selection.setValue([
-                        ...props.service.selection.getValue().filter((entry) => entry !== props.entry),
-                    ]);
-                }
-            }, type: "checkbox", checked: props.service.selection.getValue().includes(props.entry) ? true : false }));
+    render: ({ props, useObservable, element }) => {
+        const [selection] = useObservable('selection', props.service.selection, (newSelection) => {
+            ;
+            element.querySelector('input').checked = newSelection.includes(props.entry);
+        });
+        const isSelected = selection.includes(props.entry);
+        return ((0, shades_1.createComponent)("input", { onchange: () => {
+                props.service.toggleSelection(props.entry);
+            }, type: "checkbox", checked: isSelected }));
     },
 });
 //# sourceMappingURL=selection-cell.js.map

package/dist/components/data-grid/selection-cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-cell.js","sourceRoot":"","sources":["../../../src/components/data-grid/selection-cell.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAG7C,QAAA,aAAa,GAAG,IAAA,cAAK,EAAkD;IAClF,aAAa,EAAE,iCAAiC;IAChD,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACjC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,EAAE;YAC9C,IAAI,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;gBACnC,CAAC;gBAAC,OAAO,CAAC,UAA+B,CAAC,OAAO,GAAG,IAAI,CAAA;aACzD;iBAAM;gBACL,CAAC;gBAAC,OAAO,CAAC,UAA+B,CAAC,OAAO,GAAG,KAAK,CAAA;aAC1D;QACH,CAAC,CAAC;KACH;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;QACpB,OAAO,CACL,yCACE,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;gBACf,IAAK,EAAE,CAAC,MAA2B,CAAC,OAAO,EAAE;oBAC3C,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAA;iBACvF;qBAAM;oBACL,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC;wBAC/B,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC;qBAC/E,CAAC,CAAA;iBACH;YACH,CAAC,EACD,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAChF,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"selection-cell.js","sourceRoot":"","sources":["../../../src/components/data-grid/selection-cell.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAG7C,QAAA,aAAa,GAAG,IAAA,cAAK,EAAkD;IAClF,aAAa,EAAE,iCAAiC;IAChD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,EAAE,EAAE;QAC5C,MAAM,CAAC,SAAS,CAAC,GAAG,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC,YAAY,EAAE,EAAE;YACvF,CAAC;YAAC,OAAO,CAAC,aAAa,CAAC,OAAO,CAAsB,CAAC,OAAO,GAAG,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;QACpG,CAAC,CAAC,CAAA;QACF,MAAM,UAAU,GAAG,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;QAElD,OAAO,CACL,yCACE,QAAQ,EAAE,GAAG,EAAE;gBACb,KAAK,CAAC,OAAO,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;YAC5C,CAAC,EACD,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,UAAU,GACnB,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/fab.js

@@ -2,10 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Fab = void 0;
 const shades_1 = require("@furystack/shades");
-exports.Fab = (0, shades_1.Shade)({
+const shades_2 = require("@furystack/shades");
+exports.Fab = (0, shades_2.Shade)({
     shadowDomName: 'shade-fab',
-    render: ({ props, children }) => {
-        return ((0, shades_1.createComponent)("div", { ...props, style: {
+    render: ({ props, children, element }) => {
+        (0, shades_1.attachProps)(element, {
+            ...props,
+            style: {
                 position: 'fixed',
                 bottom: '32px',
                 right: '32px',
@@ -18,8 +21,10 @@ exports.Fab = (0, shades_1.Shade)({
                 borderRadius: '50%',
                 boxShadow: '2px 2px 4px rgba(0,0,0,0.3)',
                 cursor: 'pointer',
-                ...props.style,
-            } }, children));
+                ...props?.style,
+            },
+        });
+        return (0, shades_2.createComponent)(shades_2.createComponent, null, children);
     },
 });
 //# sourceMappingURL=fab.js.map

package/dist/components/fab.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/components/fab.tsx"],"names":[],"mappings":";;;AACA,8CAA0D;AAE7C,QAAA,GAAG,GAAG,IAAA,cAAK,EAAiC;IACvD,aAAa,EAAE,WAAW;IAC1B,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,OAAO,CACL,0CACM,KAAK,EACT,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;gBACjB,MAAM,EAAE,MAAM;gBACd,KAAK,EAAE,MAAM;gBACb,UAAU,EAAE,MAAM;gBAClB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,QAAQ;gBACxB,UAAU,EAAE,QAAQ;gBACpB,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,6BAA6B;gBACxC,MAAM,EAAE,SAAS;gBACjB,GAAG,KAAK,CAAC,KAAK;aACf,IAEA,QAAQ,CACL,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/components/fab.tsx"],"names":[],"mappings":";;;AACA,8CAA+C;AAC/C,8CAA0D;AAE7C,QAAA,GAAG,GAAG,IAAA,cAAK,EAAiC;IACvD,aAAa,EAAE,WAAW;IAC1B,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACvC,IAAA,oBAAW,EAAC,OAAO,EAAE;YACnB,GAAG,KAAK;YACR,KAAK,EAAE;gBACL,QAAQ,EAAE,OAAO;gBACjB,MAAM,EAAE,MAAM;gBACd,KAAK,EAAE,MAAM;gBACb,UAAU,EAAE,MAAM;gBAClB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,QAAQ;gBACxB,UAAU,EAAE,QAAQ;gBACpB,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,6BAA6B;gBACxC,MAAM,EAAE,SAAS;gBACjB,GAAG,KAAK,EAAE,KAAK;aAChB;SACF,CAAC,CAAA;QACF,OAAO,8DAAG,QAAQ,CAAI,CAAA;IACxB,CAAC;CACF,CAAC,CAAA"}

package/dist/components/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/components/grid.tsx"],"names":[],"mappings":";;;AACA,8CAA0D;AAC1D,0CAAkD;AAuBrC,QAAA,IAAI,GAA8E,IAAA,cAAK,EAAC;IACnG,aAAa,EAAE,YAAY;IAC3B,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAC5D,MAAM,WAAW,GAAiC;YAChD,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK;YACvC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS;YAC3B,YAAY,EAAE,KAAK;YACnB,GAAG,EAAE,GAAG;YACR,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,SAAS;YACjB,WAAW,EAAE,iBAAiB;YAC9B,GAAG,KAAK,CAAC,MAAM,EAAE,MAAM;SACxB,CAAA;QACD,OAAO,CACL,uCACE,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE;gBACL,GAAG,KAAK,CAAC,MAAM,EAAE,OAAO;gBACxB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,QAAQ,EAAE,MAAM;aACjB;YAED,yCAAO,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE;gBACnD;oBACE,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;wBAC5B,OAAO,CACL,sCAAI,KAAK,EAAE,WAAW,IACnB,KAAK,CAAC,gBAAgB,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,MAAM,CAAC,IAAI,CAC1F,4CAAO,MAAM,CAAQ,CACtB,CACE,CACN,CAAA;oBACH,CAAC,CAAC,CACC,CACC;gBACR,6CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC5B,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC7B,sCAAI,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,IAAI,IAC1B,KAAK,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,aAAa,EAAE,OAAO,EAAE,CAAC,KAAK,CAAC,IAAI,CAClF,4CAAO,KAAK,CAAC,MAAM,CAAC,CAAQ,CAC7B,CACE,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACJ,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/components/grid.tsx"],"names":[],"mappings":";;;AACA,8CAA0D;AAC1D,0CAAkD;AAuBrC,QAAA,IAAI,GAAyE,IAAA,cAAK,EAAC;IAC9F,aAAa,EAAE,YAAY;IAC3B,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAC5D,MAAM,WAAW,GAAiC;YAChD,OAAO,EAAE,UAAU;YACnB,eAAe,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK;YACvC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS;YAC3B,YAAY,EAAE,KAAK;YACnB,GAAG,EAAE,GAAG;YACR,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,SAAS;YACjB,WAAW,EAAE,iBAAiB;YAC9B,GAAG,KAAK,CAAC,MAAM,EAAE,MAAM;SACxB,CAAA;QACD,OAAO,CACL,uCACE,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE;gBACL,GAAG,KAAK,CAAC,MAAM,EAAE,OAAO;gBACxB,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,QAAQ,EAAE,MAAM;aACjB;YAED,yCAAO,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE;gBACnD;oBACE,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;wBAC5B,OAAO,CACL,sCAAI,KAAK,EAAE,WAAW,IACnB,KAAK,CAAC,gBAAgB,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,MAAM,CAAC,IAAI,CAC1F,4CAAO,MAAM,CAAQ,CACtB,CACE,CACN,CAAA;oBACH,CAAC,CAAC,CACC,CACC;gBACR,6CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAC5B,0CACG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC7B,sCAAI,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,IAAI,IAC1B,KAAK,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,aAAa,EAAE,OAAO,EAAE,CAAC,KAAK,CAAC,IAAI,CAClF,4CAAO,KAAK,CAAC,MAAM,CAAC,CAAQ,CAC7B,CACE,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACJ,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}