@furystack/shades-common-components 3.6.1 → 4.0.1

package/dist/components/inputs/autocomplete.js

@@ -4,21 +4,11 @@ exports.Autocomplete = void 0;
 const shades_1 = require("@furystack/shades");
 const input_1 = require("./input");
 exports.Autocomplete = (0, shades_1.Shade)({
-    getInitialState: () => ({
-        dataListId: (Math.random() + 1).toString(36).substring(3),
-    }),
-    constructed: ({ getState, element }) => {
-        const { dataListId } = getState();
-        const input = element.querySelector('input');
-        if (input) {
-            input.setAttribute('list', dataListId);
-        }
-    },
     shadowDomName: 'shade-autocomplete',
-    render: ({ props, getState }) => {
-        const { dataListId } = getState();
+    render: ({ props, useState }) => {
+        const [dataListId] = useState('dataListId', (Math.random() + 1).toString(36).substring(3));
         return ((0, shades_1.createComponent)("div", null,
-            (0, shades_1.createComponent)(input_1.Input, { ...props.inputProps, onchange: (ev) => {
+            (0, shades_1.createComponent)(input_1.Input, { ...props.inputProps, list: dataListId, onchange: (ev) => {
                     const { value } = ev.target;
                     if (props.strict) {
                         if (!props.suggestions.includes(value)) {

package/dist/components/inputs/autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.js","sourceRoot":"","sources":["../../../src/components/inputs/autocomplete.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAE1D,mCAA+B;AAElB,QAAA,YAAY,GAAG,IAAA,cAAK,EAG/B;IACA,eAAe,EAAE,GAAG,EAAE,CAAC,CAAC;QACtB,UAAU,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;KAC1D,CAAC;IACF,WAAW,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACrC,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAA;QACjC,MAAM,KAAK,GAAG,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;QAC5C,IAAI,KAAK,EAAE;YACT,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAA;SACvC;IACH,CAAC;IACD,aAAa,EAAE,oBAAoB;IACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,EAAE,CAAA;QACjC,OAAO,CACL;YACE,8BAAC,aAAK,OACA,KAAK,CAAC,UAAU,EACpB,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;oBACf,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,MAAa,CAAA;oBAClC,IAAI,KAAK,CAAC,MAAM,EAAE;wBAChB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;4BACtC,CAAC;4BAAC,EAAE,CAAC,MAA2B,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,CAAA;4BAClF,OAAM;yBACP;qBACF;oBACD,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAA;gBACzB,CAAC,GACD;YACF,4CAAU,EAAE,EAAE,UAAU,IACrB,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAC5B,0CAAQ,KAAK,EAAE,CAAC,GAAI,CACrB,CAAC,CACO,CACP,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"autocomplete.js","sourceRoot":"","sources":["../../../src/components/inputs/autocomplete.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAE1D,mCAA+B;AAElB,QAAA,YAAY,GAAG,IAAA,cAAK,EAK9B;IACD,aAAa,EAAE,oBAAoB;IACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,MAAM,CAAC,UAAU,CAAC,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAA;QAE1F,OAAO,CACL;YACE,8BAAC,aAAK,OACA,KAAK,CAAC,UAAU,EACpB,IAAI,EAAE,UAAiB,EACvB,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;oBACf,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,MAAa,CAAA;oBAClC,IAAI,KAAK,CAAC,MAAM,EAAE;wBAChB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;4BACtC,CAAC;4BAAC,EAAE,CAAC,MAA2B,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,CAAA;4BAClF,OAAM;yBACP;qBACF;oBACD,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAA;gBACzB,CAAC,GACD;YACF,4CAAU,EAAE,EAAE,UAAU,IACrB,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAC5B,0CAAQ,KAAK,EAAE,CAAC,GAAI,CACrB,CAAC,CACO,CACP,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/inputs/input.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Input = void 0;
 const shades_1 = require("@furystack/shades");
+const utils_1 = require("@furystack/utils");
 const __1 = require("../..");
 const getLabelStyle = ({ themeProvider, props, state, }) => {
     return {
@@ -43,28 +44,23 @@ const getLabelStyle = ({ themeProvider, props, state, }) => {
 };
 exports.Input = (0, shades_1.Shade)({
     shadowDomName: 'shade-input',
-    getInitialState: ({ props }) => ({
-        value: props.value || '',
-        focused: props.autofocus || false,
-        validity: { valid: true },
-    }),
-    compareState: ({ newState, element, props, injector }) => {
-        const themeProvider = injector.getInstance(__1.ThemeProviderService);
-        const label = element.querySelector('label');
-        (0, shades_1.attachStyles)(label, { style: getLabelStyle({ themeProvider, props, state: newState }) });
-        const helper = element.querySelector('span.helperText');
-        const helperNode = props.getHelperText?.({ state: newState }) || '';
-        helper?.replaceChildren(helperNode);
-        const startIcon = element.querySelector('span.startIcon');
-        startIcon?.replaceChildren(props.getStartIcon?.({ state: newState }) || '');
-        const endIcon = element.querySelector('span.endIcon');
-        endIcon?.replaceChildren(props.getEndIcon?.({ state: newState }) || '');
-        return false;
-    },
-    render: ({ props, getState, updateState, injector }) => {
-        const state = getState();
-        const { value } = state;
+    render: ({ props, injector, useObservable, element }) => {
         const themeProvider = injector.getInstance(__1.ThemeProviderService);
+        const [state, setState] = useObservable('inputState', new utils_1.ObservableValue({
+            value: props.value || '',
+            focused: props.autofocus || false,
+            validity: { valid: true },
+        }), (newState) => {
+            const label = element.querySelector('label');
+            (0, shades_1.attachStyles)(label, { style: getLabelStyle({ themeProvider, props, state: newState }) });
+            const helper = element.querySelector('span.helperText');
+            const helperNode = props.getHelperText?.({ state: newState }) || '';
+            helper?.replaceChildren(helperNode);
+            const startIcon = element.querySelector('span.startIcon');
+            startIcon?.replaceChildren(props.getStartIcon?.({ state: newState }) || '');
+            const endIcon = element.querySelector('span.endIcon');
+            endIcon?.replaceChildren(props.getEndIcon?.({ state: newState }) || '');
+        });
         return ((0, shades_1.createComponent)("label", { ...props.labelProps, style: getLabelStyle({ props, state, themeProvider }) },
             props.labelTitle,
             (0, shades_1.createComponent)("div", { style: {
@@ -76,17 +72,17 @@ exports.Input = (0, shades_1.Shade)({
                 (0, shades_1.createComponent)("input", { oninvalid: (ev) => {
                         ev.preventDefault();
                         const el = ev.target;
-                        updateState({ validity: el.validity });
+                        setState({ ...state, validity: el.validity });
                     }, onchange: (ev) => {
                         const el = ev.target;
                         const newValue = el.value;
-                        updateState({ value: newValue, validity: el?.validity });
+                        setState({ ...state, value: newValue, validity: el?.validity });
                         props.onTextChange?.(newValue);
                         props.onchange && props.onchange(ev);
                     }, onfocus: () => {
-                        updateState({ focused: true });
+                        setState({ ...state, focused: true });
                     }, onblur: () => {
-                        updateState({ focused: false });
+                        setState({ ...state, focused: false });
                     }, ...props, style: {
                         color: 'inherit',
                         border: 'none',
@@ -100,7 +96,7 @@ exports.Input = (0, shades_1.Shade)({
                         marginBottom: '0.4em',
                         flexGrow: '1',
                         ...props.style,
-                    }, value: value }),
+                    }, value: state.value }),
                 props.getEndIcon ? (0, shades_1.createComponent)("span", { className: "endIcon" }, props.getEndIcon({ state })) : null),
             (0, shades_1.createComponent)("span", { className: "helperText" }, props.getHelperText?.({ state }))));
     },

package/dist/components/inputs/input.js.map

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

package/dist/components/inputs/text-area.js

@@ -6,13 +6,9 @@ const services_1 = require("../../services");
 const utils_1 = require("../../utils");
 exports.TextArea = (0, shades_1.Shade)({
     shadowDomName: 'shade-text-area',
-    getInitialState: ({ props }) => ({
-        value: props.value,
-    }),
-    render: ({ props, element, injector, getState }) => {
+    render: ({ props, element, injector }) => {
         const themeProvider = injector.getInstance(services_1.ThemeProviderService);
         const { theme } = themeProvider;
-        const { value } = getState();
         const { palette } = theme;
         return ((0, shades_1.createComponent)("label", { ...props.labelProps, style: {
                 display: 'flex',
@@ -66,7 +62,7 @@ exports.TextArea = (0, shades_1.Shade)({
                             fill: 'forwards',
                         });
                     }
-                } }, value)));
+                } }, props.value)));
     },
 });
 //# sourceMappingURL=text-area.js.map

package/dist/components/inputs/text-area.js.map

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

package/dist/components/loader.js

@@ -2,14 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Loader = void 0;
 const shades_1 = require("@furystack/shades");
+const services_1 = require("../services");
 const utils_1 = require("../utils");
 exports.Loader = (0, shades_1.Shade)({
     shadowDomName: 'shade-loader',
-    render: ({ element, props }) => {
+    render: ({ element, props, injector }) => {
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
         element.style.display = 'inline-block';
         element.style.transformOrigin = 'center';
         element.style.opacity = '0';
         const { delay = 500 } = props;
+        const { borderWidth = 15 } = props;
+        const { borderColor = theme.palette.primary.main } = props;
         setTimeout(() => {
             (0, utils_1.promisifyAnimation)(element, [{ opacity: '0' }, { opacity: '1' }], {
                 duration: 500,
@@ -24,10 +28,10 @@ exports.Loader = (0, shades_1.Shade)({
         }, 1);
         return ((0, shades_1.createComponent)("div", { style: {
                 position: 'relative',
-                width: 'calc(100% - 30px)',
-                height: 'calc(100% - 30px)',
-                border: '15px solid rgba(128,128,128,0.1)',
-                borderBottom: '15px solid red',
+                width: `calc(100% - ${borderWidth * 2}px)`,
+                height: `calc(100% - ${borderWidth * 2}px)`,
+                border: `${borderWidth}px solid rgba(128,128,128,0.1)`,
+                borderBottom: `${borderWidth}px solid ${borderColor}`,
                 borderRadius: '50%',
             } }));
     },

package/dist/components/loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader.js","sourceRoot":"","sources":["../../src/components/loader.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,oCAA6C;AAahC,QAAA,MAAM,GAAG,IAAA,cAAK,EAAc;IACvC,aAAa,EAAE,cAAc;IAC7B,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;QAC7B,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAA;QACtC,OAAO,CAAC,KAAK,CAAC,eAAe,GAAG,QAAQ,CAAA;QACxC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;QAC3B,MAAM,EAAE,KAAK,GAAG,GAAG,EAAE,GAAG,KAAK,CAAA;QAE7B,UAAU,CAAC,GAAG,EAAE;YACd,IAAA,0BAAkB,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE;gBAChE,QAAQ,EAAE,GAAG;gBACb,KAAK;gBACL,IAAI,EAAE,UAAU;aACjB,CAAC,CAAA;YACF,IAAA,0BAAkB,EAChB,OAAO,CAAC,iBAAiB,EACzB,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,EACjG;gBACE,QAAQ,EAAE,IAAI;gBACd,MAAM,EAAE,aAAa;gBACrB,UAAU,EAAE,QAAQ;aACrB,CACF,CAAA;QACH,CAAC,EAAE,CAAC,CAAC,CAAA;QACL,OAAO,CACL,uCACE,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,KAAK,EAAE,mBAAmB;gBAC1B,MAAM,EAAE,mBAAmB;gBAC3B,MAAM,EAAE,kCAAkC;gBAC1C,YAAY,EAAE,gBAAgB;gBAC9B,YAAY,EAAE,KAAK;aACpB,GACD,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"loader.js","sourceRoot":"","sources":["../../src/components/loader.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,0CAAkD;AAClD,oCAA6C;AAuBhC,QAAA,MAAM,GAAG,IAAA,cAAK,EAAc;IACvC,aAAa,EAAE,cAAc;IAC7B,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvC,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAE5D,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,cAAc,CAAA;QACtC,OAAO,CAAC,KAAK,CAAC,eAAe,GAAG,QAAQ,CAAA;QACxC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;QAC3B,MAAM,EAAE,KAAK,GAAG,GAAG,EAAE,GAAG,KAAK,CAAA;QAC7B,MAAM,EAAE,WAAW,GAAG,EAAE,EAAE,GAAG,KAAK,CAAA;QAClC,MAAM,EAAE,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,KAAK,CAAA;QAE1D,UAAU,CAAC,GAAG,EAAE;YACd,IAAA,0BAAkB,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE;gBAChE,QAAQ,EAAE,GAAG;gBACb,KAAK;gBACL,IAAI,EAAE,UAAU;aACjB,CAAC,CAAA;YACF,IAAA,0BAAkB,EAChB,OAAO,CAAC,iBAAiB,EACzB,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,EACjG;gBACE,QAAQ,EAAE,IAAI;gBACd,MAAM,EAAE,aAAa;gBACrB,UAAU,EAAE,QAAQ;aACrB,CACF,CAAA;QACH,CAAC,EAAE,CAAC,CAAC,CAAA;QACL,OAAO,CACL,uCACE,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,KAAK,EAAE,eAAe,WAAW,GAAG,CAAC,KAAK;gBAC1C,MAAM,EAAE,eAAe,WAAW,GAAG,CAAC,KAAK;gBAC3C,MAAM,EAAE,GAAG,WAAW,gCAAgC;gBACtD,YAAY,EAAE,GAAG,WAAW,YAAY,WAAW,EAAE;gBACrD,YAAY,EAAE,KAAK;aACpB,GACD,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/modal.js

@@ -3,24 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Modal = void 0;
 const shades_1 = require("@furystack/shades");
 exports.Modal = (0, shades_1.Shade)({
-    getInitialState: ({ props }) => ({ isVisible: props.isVisible.getValue() }),
     shadowDomName: 'shade-modal',
-    resources: ({ props, element, updateState }) => [
-        props.isVisible.subscribe(async (visible) => {
-            if (visible) {
-                updateState({ isVisible: visible });
-                await props.showAnimation?.(element);
-            }
-            else {
-                props.hideAnimation
-                    ? await props.hideAnimation?.(element).finally(() => updateState({ isVisible: visible }))
-                    : updateState({ isVisible: visible });
-            }
-        }),
-    ],
-    render: ({ props, getState, children }) => {
-        const { isVisible } = getState();
-        return isVisible ? ((0, shades_1.createComponent)("div", { className: "shade-backdrop", onclick: () => {
+    render: ({ props, children, useObservable, element }) => {
+        const [isVisible] = useObservable('isVisible', props.isVisible);
+        if (isVisible) {
+            props.showAnimation?.(element);
+        }
+        return isVisible ? ((0, shades_1.createComponent)("div", { className: "shade-backdrop", onclick: async () => {
+                await props.hideAnimation?.(element);
                 props.onClose?.();
             }, style: {
                 width: '100%',

package/dist/components/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAW7C,QAAA,KAAK,GAAG,IAAA,cAAK,EAAsC;IAC9D,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,CAAC;IAC3E,aAAa,EAAE,aAAa;IAC5B,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC;QAC9C,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE;YAC1C,IAAI,OAAO,EAAE;gBACX,WAAW,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;gBACnC,MAAM,KAAK,CAAC,aAAa,EAAE,CAAC,OAAO,CAAC,CAAA;aACrC;iBAAM;gBACL,KAAK,CAAC,aAAa;oBACjB,CAAC,CAAC,MAAM,KAAK,CAAC,aAAa,EAAE,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAC;oBACzF,CAAC,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;aACxC;QACH,CAAC,CAAC;KACH;IAED,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,MAAM,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,CAAA;QAChC,OAAO,SAAS,CAAC,CAAC,CAAC,CACjB,uCACE,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,OAAO,EAAE,EAAE,CAAA;YACnB,CAAC,EACD,KAAK,EAAE;gBACL,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,OAAO;gBAChB,QAAQ,EAAE,OAAO;gBACjB,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,GAAG;gBACT,GAAG,KAAK,CAAC,aAAa;aACvB,IAEA,QAAQ,CACL,CACP,CAAC,CAAC,CAAC,IAAI,CAAA;IACV,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../src/components/modal.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAW7C,QAAA,KAAK,GAAG,IAAA,cAAK,EAAa;IACrC,aAAa,EAAE,aAAa;IAC5B,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,OAAO,EAAE,EAAE,EAAE;QACtD,MAAM,CAAC,SAAS,CAAC,GAAG,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;QAE/D,IAAI,SAAS,EAAE;YACb,KAAK,CAAC,aAAa,EAAE,CAAC,OAAO,CAAC,CAAA;SAC/B;QAED,OAAO,SAAS,CAAC,CAAC,CAAC,CACjB,uCACE,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,KAAK,IAAI,EAAE;gBAClB,MAAM,KAAK,CAAC,aAAa,EAAE,CAAC,OAAO,CAAC,CAAA;gBACpC,KAAK,CAAC,OAAO,EAAE,EAAE,CAAA;YACnB,CAAC,EACD,KAAK,EAAE;gBACL,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,OAAO;gBAChB,QAAQ,EAAE,OAAO;gBACjB,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,GAAG;gBACT,GAAG,KAAK,CAAC,aAAa;aACvB,IAEA,QAAQ,CACL,CACP,CAAC,CAAC,CAAC,IAAI,CAAA;IACV,CAAC;CACF,CAAC,CAAA"}

package/dist/components/noty-list.js

@@ -25,9 +25,8 @@ exports.NotyComponent = (0, shades_1.Shade)({
     shadowDomName: 'shade-noty',
     constructed: ({ element }) => {
         setTimeout(() => {
-            const container = element.querySelector('div');
-            const height = container?.scrollHeight || 80;
-            (0, utils_1.promisifyAnimation)(container, [
+            const height = element.scrollHeight || 80;
+            (0, utils_1.promisifyAnimation)(element, [
                 { opacity: '0', height: '0px' },
                 { opacity: '1', height: `${height}px` },
             ], {
@@ -43,9 +42,8 @@ exports.NotyComponent = (0, shades_1.Shade)({
         const headerTextColor = themeProvider.getTextColor(colors.dark);
         const textColor = themeProvider.getTextColor(colors.main);
         const removeSelf = async () => {
-            const container = element.querySelector('div');
-            await (0, utils_1.promisifyAnimation)(container, [
-                { opacity: '1', height: `${container?.scrollHeight || 0}px`, margin: '8px 8px' },
+            await (0, utils_1.promisifyAnimation)(element, [
+                { opacity: '1', height: `${element?.scrollHeight || 0}px`, margin: '8px 8px' },
                 { opacity: '0', height: '0px', margin: '0px 8px' },
             ], {
                 fill: 'forwards',
@@ -58,7 +56,9 @@ exports.NotyComponent = (0, shades_1.Shade)({
         if (timeout) {
             setTimeout(removeSelf, timeout);
         }
-        return ((0, shades_1.createComponent)("div", { className: `noty ${props.model.type}`, style: {
+        (0, shades_1.attachProps)(element, {
+            className: `noty ${props.model.type}`,
+            style: {
                 width: '300px',
                 display: 'flex',
                 flexDirection: 'column',
@@ -69,7 +69,9 @@ exports.NotyComponent = (0, shades_1.Shade)({
                 overflow: 'hidden',
                 borderRadius: '6px',
                 boxShadow: '1px 3px 6px rgba(0,0,0,0.3)',
-            } },
+            },
+        });
+        return ((0, shades_1.createComponent)(shades_1.createComponent, null,
             (0, shades_1.createComponent)("div", { style: {
                     display: 'flex',
                     justifyContent: 'space-between',
@@ -91,32 +93,28 @@ exports.NotyComponent = (0, shades_1.Shade)({
     },
 });
 exports.NotyList = (0, shades_1.Shade)({
-    getInitialState: ({ injector }) => ({ currentNotys: injector.getInstance(noty_service_1.NotyService).notys.getValue() }),
-    constructed: ({ injector, element }) => {
-        const notyService = injector.getInstance(noty_service_1.NotyService);
-        const observables = [
-            notyService.onNotyAdded.subscribe((n) => {
-                element.querySelector('div')?.append((0, shades_1.createComponent)(exports.NotyComponent, { model: n, onDismiss: () => notyService.removeNoty(n) }));
-            }),
-            notyService.onNotyRemoved.subscribe((n) => {
-                element.querySelectorAll('shade-noty').forEach((e) => {
-                    if (e.props.model === n) {
-                        e.remove();
-                    }
-                });
-            }),
-        ];
-        return () => observables.forEach((o) => o.dispose());
-    },
     shadowDomName: 'shade-noty-list',
-    render: ({ getState, injector }) => {
-        return ((0, shades_1.createComponent)("div", { style: {
+    render: ({ useObservable, injector, element }) => {
+        const notyService = injector.getInstance(noty_service_1.NotyService);
+        (0, shades_1.attachProps)(element, {
+            style: {
                 position: 'fixed',
                 bottom: '1em',
                 right: '1em',
                 display: 'flex',
                 flexDirection: 'column',
-            } }, getState().currentNotys.map((n) => ((0, shades_1.createComponent)(exports.NotyComponent, { model: n, onDismiss: () => injector.getInstance(noty_service_1.NotyService).removeNoty(n) })))));
+            },
+        });
+        const currentNotys = notyService.notys.getValue();
+        useObservable('addNoty', notyService.onNotyAdded, (n) => element.append((0, shades_1.createComponent)(exports.NotyComponent, { model: n, onDismiss: () => notyService.removeNoty(n) })));
+        useObservable('removeNoty', notyService.onNotyRemoved, (n) => {
+            element.querySelectorAll('shade-noty').forEach((e) => {
+                if (e.props.model === n) {
+                    e.remove();
+                }
+            });
+        });
+        return ((0, shades_1.createComponent)(shades_1.createComponent, null, currentNotys.map((n) => ((0, shades_1.createComponent)(exports.NotyComponent, { model: n, onDismiss: () => injector.getInstance(noty_service_1.NotyService).removeNoty(n) })))));
     },
 });
 //# sourceMappingURL=noty-list.js.map

package/dist/components/noty-list.js.map

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

package/dist/components/paper.js

@@ -2,20 +2,26 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Paper = void 0;
 const shades_1 = require("@furystack/shades");
+const shades_2 = require("@furystack/shades");
 const theme_provider_service_1 = require("../services/theme-provider-service");
-exports.Paper = (0, shades_1.Shade)({
+exports.Paper = (0, shades_2.Shade)({
     shadowDomName: 'shade-paper',
-    render: ({ injector, props, children }) => {
+    render: ({ injector, props, children, element }) => {
         const themeProvider = injector.getInstance(theme_provider_service_1.ThemeProviderService);
-        return ((0, shades_1.createComponent)("div", { ...props, style: {
+        const { elevation = 1 } = props;
+        (0, shades_1.attachProps)(element, {
+            ...props,
+            style: {
                 borderRadius: '3px',
-                boxShadow: props.elevation ? `1px ${props.elevation}px ${props.elevation}px rgba(0,0,0,0.3)` : '',
+                boxShadow: elevation ? `1px ${elevation}px ${elevation}px rgba(0,0,0,0.3)` : '',
                 backgroundColor: themeProvider.theme.background.paper,
                 color: themeProvider.theme.text.secondary,
                 margin: '8px',
                 padding: '6px 16px',
                 ...props?.style,
-            } }, children));
+            },
+        });
+        return (0, shades_2.createComponent)(shades_2.createComponent, null, children);
     },
 });
 //# sourceMappingURL=paper.js.map

package/dist/components/paper.js.map

@@ -1 +1 @@
-{"version":3,"file":"paper.js","sourceRoot":"","sources":["../../src/components/paper.tsx"],"names":[],"mappings":";;;AACA,8CAA0D;AAC1D,+EAAyE;AAE5D,QAAA,KAAK,GAAG,IAAA,cAAK,EAA6D;IACrF,aAAa,EAAE,aAAa;IAE5B,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACxC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO,CACL,0CACM,KAAK,EACT,KAAK,EAAE;gBACL,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,SAAS,MAAM,KAAK,CAAC,SAAS,oBAAoB,CAAC,CAAC,CAAC,EAAE;gBACjG,eAAe,EAAE,aAAa,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK;gBACrD,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS;gBACzC,MAAM,EAAE,KAAK;gBACb,OAAO,EAAE,UAAU;gBACnB,GAAG,KAAK,EAAE,KAAK;aAChB,IAEA,QAAQ,CACL,CACP,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"paper.js","sourceRoot":"","sources":["../../src/components/paper.tsx"],"names":[],"mappings":";;;AACA,8CAA+C;AAC/C,8CAA0D;AAC1D,+EAAyE;AAE5D,QAAA,KAAK,GAAG,IAAA,cAAK,EAA6D;IACrF,aAAa,EAAE,aAAa;IAE5B,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACjD,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,MAAM,EAAE,SAAS,GAAG,CAAC,EAAE,GAAG,KAAK,CAAA;QAE/B,IAAA,oBAAW,EAAC,OAAO,EAAE;YACnB,GAAG,KAAK;YACR,KAAK,EAAE;gBACL,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,SAAS,MAAM,SAAS,oBAAoB,CAAC,CAAC,CAAC,EAAE;gBAC/E,eAAe,EAAE,aAAa,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK;gBACrD,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS;gBACzC,MAAM,EAAE,KAAK;gBACb,OAAO,EAAE,UAAU;gBACnB,GAAG,KAAK,EAAE,KAAK;aAChB;SACF,CAAC,CAAA;QAEF,OAAO,8DAAG,QAAQ,CAAI,CAAA;IACxB,CAAC;CACF,CAAC,CAAA"}

package/dist/components/suggest/index.js

@@ -21,22 +21,22 @@ const loader_1 = require("../loader");
 const suggest_manager_1 = require("./suggest-manager");
 const suggest_input_1 = require("./suggest-input");
 const suggestion_list_1 = require("./suggestion-list");
+const services_1 = require("../../services");
 __exportStar(require("./suggest-input"), exports);
 __exportStar(require("./suggest-manager"), exports);
 __exportStar(require("./suggestion-list"), exports);
 __exportStar(require("./suggestion-result"), exports);
 exports.Suggest = (0, shades_1.Shade)({
     shadowDomName: 'shade-suggest',
-    getInitialState: ({ props }) => ({
-        manager: new suggest_manager_1.SuggestManager(props.getEntries, props.getSuggestionEntry),
-    }),
-    constructed: ({ element: el, getState, props }) => {
-        const { manager } = getState();
-        const element = el.querySelector('.input-container');
-        manager.element = el;
+    render: ({ props, injector, element, useDisposable, useObservable }) => {
+        element.style.flexGrow = '1';
+        const manager = useDisposable('manager', () => new suggest_manager_1.SuggestManager(props.getEntries, props.getSuggestionEntry));
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
+        const inputContainer = element.querySelector('.input-container');
+        manager.element = element;
         manager.isOpened.subscribe((isOpened) => {
-            const suggestions = el.querySelector('.close-suggestions');
-            const postControls = el.querySelector('.post-controls');
+            const suggestions = element.querySelector('.close-suggestions');
+            const postControls = element.querySelector('.post-controls');
             if (isOpened) {
                 (0, promisify_animation_1.promisifyAnimation)(suggestions, [{ opacity: 0 }, { opacity: 1 }], {
                     duration: 500,
@@ -46,7 +46,7 @@ exports.Suggest = (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)',
@@ -62,7 +62,7 @@ exports.Suggest = (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)',
@@ -70,7 +70,7 @@ exports.Suggest = (0, shades_1.Shade)({
             }
         });
         manager.isLoading.subscribe(async (isLoading) => {
-            const loader = el.querySelector('.loader-container');
+            const loader = element.querySelector('shade-loader');
             if (isLoading) {
                 (0, promisify_animation_1.promisifyAnimation)(loader, [{ opacity: 0 }, { opacity: 1 }], {
                     duration: 100,
@@ -84,12 +84,7 @@ exports.Suggest = (0, shades_1.Shade)({
                 });
             }
         });
-        manager.onSelectSuggestion.subscribe((value) => props.onSelectSuggestion(value));
-        return () => manager.dispose();
-    },
-    render: ({ props, injector, element, getState }) => {
-        element.style.flexGrow = '1';
-        const { manager } = getState();
+        useObservable('onSelectSuggestion', manager.onSelectSuggestion, props.onSelectSuggestion);
         return ((0, shades_1.createComponent)("div", { style: { display: 'flex', flexDirection: 'column' }, onkeyup: (ev) => {
                 if (ev.key === 'Enter') {
                     ev.preventDefault();
@@ -130,8 +125,7 @@ exports.Suggest = (0, shades_1.Shade)({
                         width: manager.isOpened.getValue() ? '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)(loader_1.Loader, { style: { width: '100%', height: '100%' } })),
+                    (0, shades_1.createComponent)(loader_1.Loader, { style: { width: '20px', height: '20px', opacity: manager.isLoading.getValue() ? '1' : '0' }, delay: 0, borderWidth: 4 }),
                     (0, shades_1.createComponent)("div", { className: "close-suggestions", onclick: () => manager.isOpened.setValue(false), style: {
                             width: '20px',
                             height: '20px',

package/dist/components/suggest/index.js.map

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

package/dist/components/suggest/suggest-input.js

@@ -2,10 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SuggestInput = void 0;
 const shades_1 = require("@furystack/shades");
+const services_1 = require("../../services");
 exports.SuggestInput = (0, shades_1.Shade)({
-    getInitialState: ({ props }) => ({ isOpened: props.manager.isOpened.getValue() }),
-    resources: ({ element, props }) => [
-        props.manager.isOpened.subscribe(async (isOpened) => {
+    shadowDomName: 'shades-suggest-input',
+    render: ({ element, props, useObservable, injector }) => {
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
+        element.style.width = '100%';
+        element.style.overflow = 'hidden';
+        useObservable('isOpened', props.manager.isOpened, (isOpened) => {
             const input = element.firstChild;
             if (isOpened) {
                 input.focus();
@@ -13,14 +17,9 @@ exports.SuggestInput = (0, shades_1.Shade)({
             else {
                 input.value = '';
             }
-        }),
-    ],
-    shadowDomName: 'shades-suggest-input',
-    render: ({ element }) => {
-        element.style.width = '100%'; //manager.isOpened.getValue() ? '100%' : '0%'
-        element.style.overflow = 'hidden';
+        }, true);
         return ((0, shades_1.createComponent)("input", { autofocus: true, style: {
-                color: 'white',
+                color: theme.text.primary,
                 outline: 'none',
                 padding: '1em',
                 background: 'transparent',

package/dist/components/suggest/suggest-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"suggest-input.js","sourceRoot":"","sources":["../../../src/components/suggest/suggest-input.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAG7C,QAAA,YAAY,GAAG,IAAA,cAAK,EAA0D;IACzF,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,QAAQ,EAAE,EAAE,CAAC;IACjF,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC;QACjC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,EAAE;YAClD,MAAM,KAAK,GAAG,OAAO,CAAC,UAA8B,CAAA;YACpD,IAAI,QAAQ,EAAE;gBACZ,KAAK,CAAC,KAAK,EAAE,CAAA;aACd;iBAAM;gBACL,KAAK,CAAC,KAAK,GAAG,EAAE,CAAA;aACjB;QACH,CAAC,CAAC;KACH;IACD,aAAa,EAAE,sBAAsB;IACrC,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;QACtB,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAA,CAAC,6CAA6C;QAC1E,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;QACjC,OAAO,CACL,yCACE,SAAS,QACT,KAAK,EAAE;gBACL,KAAK,EAAE,OAAO;gBACd,OAAO,EAAE,MAAM;gBACf,OAAO,EAAE,KAAK;gBACd,UAAU,EAAE,aAAa;gBACzB,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,aAAa;gBACtB,KAAK,EAAE,kBAAkB;aAC1B,GACD,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"version":3,"file":"suggest-input.js","sourceRoot":"","sources":["../../../src/components/suggest/suggest-input.tsx"],"names":[],"mappings":";;;AAAA,8CAA0D;AAC1D,6CAAqD;AAGxC,QAAA,YAAY,GAAG,IAAA,cAAK,EAAmC;IAClE,aAAa,EAAE,sBAAsB;IACrC,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,EAAE,EAAE;QACtD,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAE5D,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAA;QAC5B,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;QAEjC,aAAa,CACX,UAAU,EACV,KAAK,CAAC,OAAO,CAAC,QAAQ,EACtB,CAAC,QAAQ,EAAE,EAAE;YACX,MAAM,KAAK,GAAG,OAAO,CAAC,UAA8B,CAAA;YACpD,IAAI,QAAQ,EAAE;gBACZ,KAAK,CAAC,KAAK,EAAE,CAAA;aACd;iBAAM;gBACL,KAAK,CAAC,KAAK,GAAG,EAAE,CAAA;aACjB;QACH,CAAC,EACD,IAAI,CACL,CAAA;QAED,OAAO,CACL,yCACE,SAAS,QACT,KAAK,EAAE;gBACL,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;gBACzB,OAAO,EAAE,MAAM;gBACf,OAAO,EAAE,KAAK;gBACd,UAAU,EAAE,aAAa;gBACzB,MAAM,EAAE,MAAM;gBACd,OAAO,EAAE,aAAa;gBACtB,KAAK,EAAE,kBAAkB;aAC1B,GACD,CACH,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}