@furystack/shades-common-components 3.6.0 → 4.0.0

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

@@ -5,17 +5,8 @@ const shades_1 = require("@furystack/shades");
 const services_1 = require("../services");
 exports.Grid = (0, shades_1.Shade)({
     shadowDomName: 'shade-grid',
-    resources: ({ injector, element }) => [
-        injector.getInstance(services_1.ThemeProviderService).theme.subscribe((t) => {
-            const headers = element.querySelectorAll('th');
-            headers.forEach((header) => {
-                header.style.color = t.text.secondary;
-                header.style.background = t.background.paper;
-            });
-        }),
-    ],
     render: ({ props, injector }) => {
-        const theme = injector.getInstance(services_1.ThemeProviderService).theme.getValue();
+        const { theme } = injector.getInstance(services_1.ThemeProviderService);
         const headerStyle = {
             padding: '0 0.51em',
             backgroundColor: theme.background.paper,

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,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YAC/D,MAAM,OAAO,GAAG,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAA;YAC9C,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;gBACzB,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,CAAA;gBACrC,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,UAAU,CAAC,KAAK,CAAA;YAC9C,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC;KACH;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC9B,MAAM,KAAK,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAA;QACzE,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"}

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 {
@@ -11,29 +12,29 @@ const getLabelStyle = ({ themeProvider, props, state, }) => {
         justifyContent: 'space-between',
         fontSize: '10px',
         color: props.disabled
-            ? state.theme.text.disabled
+            ? themeProvider.theme.text.disabled
             : state.validity?.valid === false
-                ? state.theme.palette.error.main
+                ? themeProvider.theme.palette.error.main
                 : state.focused
-                    ? state.theme.text.primary
-                    : state.theme.text.secondary,
+                    ? themeProvider.theme.text.primary
+                    : themeProvider.theme.text.secondary,
         marginBottom: '1em',
         padding: '1em',
         borderRadius: '5px',
         background: props.variant === 'contained'
             ? themeProvider
                 .getRgbFromColorString(state.validity?.valid === false
-                ? state.theme.palette.error.main
-                : state.theme.palette[props.defaultColor || 'primary'].main)
+                ? themeProvider.theme.palette.error.main
+                : themeProvider.theme.palette[props.defaultColor || 'primary'].main)
                 .update('a', state.focused ? 0.1 : 0.2)
                 .toString()
             : 'transparent',
         boxShadow: props.variant === 'outlined' || props.variant === 'contained'
             ? `0 0 0 1px ${state.validity?.valid === false
-                ? state.theme.palette.error.main
+                ? themeProvider.theme.palette.error.main
                 : state.focused
-                    ? state.theme.palette[props.defaultColor || 'primary'].main
-                    : state.theme.text.primary}`
+                    ? themeProvider.theme.palette[props.defaultColor || 'primary'].main
+                    : themeProvider.theme.text.primary}`
             : 'none',
         filter: props.disabled ? 'grayscale(100%)' : 'none',
         opacity: props.disabled ? '0.5' : '1',
@@ -43,32 +44,23 @@ const getLabelStyle = ({ themeProvider, props, state, }) => {
 };
 exports.Input = (0, shades_1.Shade)({
     shadowDomName: 'shade-input',
-    getInitialState: ({ injector, props }) => ({
-        theme: injector.getInstance(__1.ThemeProviderService).theme.getValue(),
-        value: props.value || '',
-        focused: props.autofocus || false,
-        validity: { valid: true },
-    }),
-    resources: ({ injector, updateState }) => [
-        injector.getInstance(__1.ThemeProviderService).theme.subscribe((theme) => updateState({ theme })),
-    ],
-    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: {
@@ -80,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',
@@ -104,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":";;;AACA,8CAAwE;AACxE,6BAA4C;AAqD5C,MAAM,aAAa,GAAG,CAAC,EACrB,aAAa,EACb,KAAK,EACL,KAAK,GAKN,EAAgC,EAAE;IACjC,OAAO;QACL,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,UAAU,EAAE,YAAY;QACxB,cAAc,EAAE,eAAe;QAC/B,QAAQ,EAAE,MAAM;QAChB,KAAK,EAAE,KAAK,CAAC,QAAQ;YACnB,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ;YAC3B,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,KAAK,KAAK;gBACjC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;gBAChC,CAAC,CAAC,KAAK,CAAC,OAAO;oBACf,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;oBAC1B,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS;QAC9B,YAAY,EAAE,KAAK;QACnB,OAAO,EAAE,KAAK;QACd,YAAY,EAAE,KAAK;QACnB,UAAU,EACR,KAAK,CAAC,OAAO,KAAK,WAAW;YAC3B,CAAC,CAAC,aAAa;iBACV,qBAAqB,CACpB,KAAK,CAAC,QAAQ,EAAE,KAAK,KAAK,KAAK;gBAC7B,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;gBAChC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,IAAI,SAAS,CAAC,CAAC,IAAI,CAC9D;iBACA,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;iBACtC,QAAQ,EAAE;YACf,CAAC,CAAC,aAAa;QACnB,SAAS,EACP,KAAK,CAAC,OAAO,KAAK,UAAU,IAAI,KAAK,CAAC,OAAO,KAAK,WAAW;YAC3D,CAAC,CAAC,aACE,KAAK,CAAC,QAAQ,EAAE,KAAK,KAAK,KAAK;gBAC7B,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;gBAChC,CAAC,CAAC,KAAK,CAAC,OAAO;oBACf,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,IAAI,SAAS,CAAC,CAAC,IAAI;oBAC3D,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OACvB,EAAE;YACJ,CAAC,CAAC,MAAM;QACZ,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,MAAM;QACnD,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG;QACrC,UAAU,EACR,uIAAuI;QACzI,GAAG,KAAK,CAAC,UAAU,EAAE,KAAK;KAC3B,CAAA;AACH,CAAC,CAAA;AAEY,QAAA,KAAK,GAAG,IAAA,cAAK,EAAiC;IACzD,aAAa,EAAE,aAAa;IAC5B,eAAe,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QACzC,KAAK,EAAE,QAAQ,CAAC,WAAW,CAAC,wBAAoB,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE;QAClE,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE;QACxB,OAAO,EAAE,KAAK,CAAC,SAAS,IAAI,KAAK;QACjC,QAAQ,EAAE,EAAE,KAAK,EAAE,IAAI,EAAmB;KAC3C,CAAC;IACF,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC;QACxC,QAAQ,CAAC,WAAW,CAAC,wBAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;KAC9F;IACD,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvD,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,wBAAoB,CAAC,CAAA;QAChE,MAAM,KAAK,GAAG,OAAO,CAAC,aAAa,CAAC,OAAO,CAAqB,CAAA;QAChE,IAAA,qBAAY,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,aAAa,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAA;QAExF,MAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAkB,iBAAiB,CAAC,CAAA;QACxE,MAAM,UAAU,GAAG,KAAK,CAAC,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAA;QACnE,MAAM,EAAE,eAAe,CAAC,UAAU,CAAC,CAAA;QAEnC,MAAM,SAAS,GAAG,OAAO,CAAC,aAAa,CAAkB,gBAAgB,CAAC,CAAA;QAC1E,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,CAAA;QAC3E,MAAM,OAAO,GAAG,OAAO,CAAC,aAAa,CAAkB,cAAc,CAAC,CAAA;QACtE,OAAO,EAAE,eAAe,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,CAAA;QAEvE,OAAO,KAAK,CAAA;IACd,CAAC;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE;QACrD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;QACxB,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;QACvB,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,wBAAoB,CAAC,CAAA;QAEhE,OAAO,CACL,4CAAW,KAAK,CAAC,UAAU,EAAE,KAAK,EAAE,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;YAC/E,KAAK,CAAC,UAAU;YAEjB,uCACE,KAAK,EAAE;oBACL,OAAO,EAAE,MAAM;oBACf,UAAU,EAAE,QAAQ;oBACpB,KAAK,EAAE,MAAM;iBACd;gBAEA,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,wCAAM,SAAS,EAAC,WAAW,IAAE,KAAK,CAAC,YAAY,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAQ,CAAC,CAAC,CAAC,IAAI;gBACjG,yCACE,SAAS,EAAE,CAAC,EAAE,EAAE,EAAE;wBAChB,EAAE,CAAC,cAAc,EAAE,CAAA;wBACnB,MAAM,EAAE,GAAG,EAAE,CAAC,MAA0B,CAAA;wBACxC,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAA;oBACxC,CAAC,EACD,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;wBACf,MAAM,EAAE,GAAG,EAAE,CAAC,MAA0B,CAAA;wBACxC,MAAM,QAAQ,GAAG,EAAE,CAAC,KAAK,CAAA;wBACzB,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAA;wBACxD,KAAK,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,CAAA;wBAC9B,KAAK,CAAC,QAAQ,IAAK,KAAK,CAAC,QAAgB,CAAC,EAAE,CAAC,CAAA;oBAC/C,CAAC,EACD,OAAO,EAAE,GAAG,EAAE;wBACZ,WAAW,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAA;oBAChC,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;wBACX,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAA;oBACjC,CAAC,KACG,KAAK,EACT,KAAK,EAAE;wBACL,KAAK,EAAE,SAAS;wBAChB,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,aAAa;wBAC9B,OAAO,EAAE,MAAM;wBACf,QAAQ,EAAE,MAAM;wBAChB,KAAK,EAAE,MAAM;wBACb,YAAY,EAAE,UAAU;wBACxB,OAAO,EAAE,GAAG;wBACZ,SAAS,EAAE,OAAO;wBAClB,YAAY,EAAE,OAAO;wBACrB,QAAQ,EAAE,GAAG;wBACb,GAAG,KAAK,CAAC,KAAK;qBACf,EACD,KAAK,EAAE,KAAK,GACZ;gBACD,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,wCAAM,SAAS,EAAC,SAAS,IAAE,KAAK,CAAC,UAAU,CAAC,EAAE,KAAK,EAAE,CAAC,CAAQ,CAAC,CAAC,CAAC,IAAI,CACrF;YACN,wCAAM,SAAS,EAAC,YAAY,IAAE,KAAK,CAAC,aAAa,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAQ,CAChE,CACT,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}
+{"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,17 +6,9 @@ const services_1 = require("../../services");
 const utils_1 = require("../../utils");
 exports.TextArea = (0, shades_1.Shade)({
     shadowDomName: 'shade-text-area',
-    getInitialState: ({ injector, props }) => ({
-        theme: injector.getInstance(services_1.ThemeProviderService).theme.getValue(),
-        value: props.value,
-    }),
-    resources: ({ injector, updateState }) => {
+    render: ({ props, element, injector }) => {
         const themeProvider = injector.getInstance(services_1.ThemeProviderService);
-        return [themeProvider.theme.subscribe((theme) => updateState({ theme }))];
-    },
-    render: ({ props, element, injector, getState }) => {
-        const themeProvider = injector.getInstance(services_1.ThemeProviderService);
-        const { theme, value } = getState();
+        const { theme } = themeProvider;
         const { palette } = theme;
         return ((0, shades_1.createComponent)("label", { ...props.labelProps, style: {
                 display: 'flex',
@@ -70,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":";;;AACA,8CAA0D;AAC1D,6CAAqD;AACrD,uCAAgD;AASnC,QAAA,QAAQ,GAAG,IAAA,cAAK,EAAgB;IAC3C,aAAa,EAAE,iBAAiB;IAChC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAA;QAChE,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,CAAA;QAC/B,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAA;QAEzB,OAAO,CACL,4CACM,KAAK,CAAC,UAAU,EACpB,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,aAAa,EAAE,QAAQ;gBACvB,UAAU,EAAE,YAAY;gBACxB,cAAc,EAAE,eAAe;gBAC/B,QAAQ,EAAE,MAAM;gBAChB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,MAAM;gBACrD,YAAY,EAAE,KAAK;gBACnB,OAAO,EAAE,KAAK;gBACd,YAAY,EAAE,KAAK;gBACnB,MAAM,EAAE,KAAK,CAAC,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM;gBAChE,GAAG,KAAK,CAAC,UAAU,EAAE,KAAK;aAC3B;YAED,4CAAO,KAAK,CAAC,UAAU,CAAQ;YAE/B,uCACE,eAAe,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,IAAI,KAAK,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,KACpF,KAAK,EACT,KAAK,EAAE;oBACL,MAAM,EAAE,MAAM;oBACd,eAAe,EAAE,aAAa;oBAC9B,OAAO,EAAE,MAAM;oBACf,QAAQ,EAAE,MAAM;oBAChB,KAAK,EAAE,MAAM;oBACb,YAAY,EAAE,UAAU;oBACxB,GAAG,KAAK,CAAC,KAAK;iBACf,EACD,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;wBACnB,IAAA,0BAAkB,EAChB,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,EAC9B,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAClG;4BACE,QAAQ,EAAE,GAAG;4BACb,MAAM,EAAE,0CAA0C;4BAClD,IAAI,EAAE,UAAU;yBACjB,CACF,CAAA;wBACD,IAAA,0BAAkB,EAChB,OAAO,CAAC,aAAa,CAAC,6BAA6B,CAAC,EACpD;4BACE,EAAE,SAAS,EAAE,mCAAmC,EAAE;4BAClD,EAAE,SAAS,EAAE,eAAe,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE;yBACrD,EACD;4BACE,QAAQ,EAAE,GAAG;4BACb,IAAI,EAAE,UAAU;yBACjB,CACF,CAAA;qBACF;gBACH,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;oBACX,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;wBACnB,IAAA,0BAAkB,EAChB,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,EAC9B,CAAC,EAAE,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAClG;4BACE,QAAQ,EAAE,GAAG;4BACb,MAAM,EAAE,0CAA0C;4BAClD,IAAI,EAAE,UAAU;yBACjB,CACF,CAAA;wBACD,IAAA,0BAAkB,EAChB,OAAO,CAAC,aAAa,CAAC,6BAA6B,CAAC,EACpD;4BACE,EAAE,SAAS,EAAE,mCAAmC,EAAE;4BAClD,EAAE,SAAS,EAAE,mCAAmC,EAAE;yBACnD,EACD;4BACE,QAAQ,EAAE,GAAG;4BACb,IAAI,EAAE,UAAU;yBACjB,CACF,CAAA;qBACF;gBACH,CAAC,IAEA,KAAK,CAAC,KAAK,CACR,CACA,CACT,CAAA;IACH,CAAC;CACF,CAAC,CAAA"}

package/dist/components/loader.js

@@ -6,20 +6,14 @@ const services_1 = require("../services");
 const utils_1 = require("../utils");
 exports.Loader = (0, shades_1.Shade)({
     shadowDomName: 'shade-loader',
-    resources: ({ injector, element }) => [
-        injector.getInstance(services_1.ThemeProviderService).theme.subscribe((theme) => {
-            const el = element.firstElementChild;
-            if (el) {
-                ;
-                el.style.borderBottom = `15px solid ${theme.palette.primary.main}`;
-            }
-        }, true),
-    ],
-    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,
@@ -34,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,0CAAkD;AAClD,oCAA6C;AAahC,QAAA,MAAM,GAAG,IAAA,cAAK,EAAc;IACvC,aAAa,EAAE,cAAc;IAC7B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;QACpC,QAAQ,CAAC,WAAW,CAAC,+BAAoB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;YACnE,MAAM,EAAE,GAAG,OAAO,CAAC,iBAAiB,CAAA;YACpC,IAAI,EAAE,EAAE;gBACN,CAAC;gBAAC,EAAkB,CAAC,KAAK,CAAC,YAAY,GAAG,cAAc,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,CAAA;aACrF;QACH,CAAC,EAAE,IAAI,CAAC;KACT;IACD,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` },
             ], {
@@ -39,13 +38,12 @@ exports.NotyComponent = (0, shades_1.Shade)({
     },
     render: ({ props, injector, element }) => {
         const themeProvider = injector.getInstance(theme_provider_service_1.ThemeProviderService);
-        const colors = themeProvider.theme.getValue().palette[props.model.type];
+        const colors = themeProvider.theme.palette[props.model.type];
         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,30 +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',
-    resources: ({ injector, element }) => {
+    render: ({ injector, props, children, element }) => {
         const themeProvider = injector.getInstance(theme_provider_service_1.ThemeProviderService);
-        return [
-            themeProvider.theme.subscribe((newTheme) => {
-                ;
-                element.firstChild.style.background = newTheme.background.paper;
-                element.firstChild.style.color = themeProvider.theme.getValue().text.secondary;
-            }),
-        ];
-    },
-    render: ({ injector, props, children }) => {
-        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)` : '',
-                backgroundColor: themeProvider.theme.getValue().background.paper,
-                color: themeProvider.theme.getValue().text.secondary,
+                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;IAC5B,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE;QACnC,MAAM,aAAa,GAAG,QAAQ,CAAC,WAAW,CAAC,6CAAoB,CAAC,CAAA;QAChE,OAAO;YACL,aAAa,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,EAAE;gBACzC,CAAC;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CACnF;gBAAC,OAAO,CAAC,UAA6B,CAAC,KAAK,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS,CAAA;YACrG,CAAC,CAAC;SACH,CAAA;IACH,CAAC;IACD,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,QAAQ,EAAE,CAAC,UAAU,CAAC,KAAK;gBAChE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS;gBACpD,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"}