@brytdesigns/web-component-drawer 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { createContext, provide, consume } from 'component-register';
|
|
2
|
-
import { splitProps, createEffect, on, batch, mergeProps } from 'solid-js';
|
|
2
|
+
import { splitProps, createEffect, on, batch, untrack, mergeProps } from 'solid-js';
|
|
3
3
|
import { createStore } from 'solid-js/store';
|
|
4
4
|
import { toHyphenated, getContextFromProvider } from '@brytdesigns/web-component-utils';
|
|
5
5
|
|
|
@@ -23,12 +23,15 @@ function initializeDrawerContext(props) {
|
|
|
23
23
|
)
|
|
24
24
|
);
|
|
25
25
|
function setElementState(key, value) {
|
|
26
|
+
const currentValue = untrack(() => props[key]);
|
|
26
27
|
if (typeof value === "function") {
|
|
27
|
-
const
|
|
28
|
-
const result = value(
|
|
28
|
+
const currentValue2 = untrack(() => props[key]);
|
|
29
|
+
const result = value(currentValue2 || false);
|
|
30
|
+
if (`${currentValue2}` === `${value}`) return;
|
|
29
31
|
element.root.setAttribute(toHyphenated(key), `${result}`);
|
|
30
32
|
return;
|
|
31
33
|
}
|
|
34
|
+
if (`${currentValue}` === `${value}`) return;
|
|
32
35
|
return element.root.setAttribute(toHyphenated(key), `${value}`);
|
|
33
36
|
}
|
|
34
37
|
return [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/hooks/useDrawer.ts"],"names":["state","open"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"sources":["../../../src/hooks/useDrawer.ts"],"names":["currentValue","state","open"],"mappings":";;;;;AAkCA,SAAS,wBAAwB,KAA6B,EAAA;AAC5D,EAAM,MAAA,CAAC,SAAS,UAAU,CAAA,GAAI,WAAW,KAAO,EAAA,CAAC,MAAM,CAAC,CAAA;AACxD,EAAM,MAAA,CAAC,OAAO,QAAQ,CAAA,GAAI,YAA0B,EAAE,cAAA,EAAgB,EAAC,EAAG,CAAA;AAE1E,EAAA,YAAA;AAAA,IACE,EAAA;AAAA,MACE,MAAM,KAAM,CAAA,cAAA;AAAA,MACZ,CAAC,cAAmB,KAAA;AAClB,QAAI,IAAA,CAAC,eAAe,MAAQ,EAAA;AAC5B,QAAA,MAAM,UAAa,GAAA,OAAA,CAAQ,GAAI,CAAA,KAAA,CAAM,cAAc,CAAA;AACnD,QAAA,eAAA,CAAgB,eAAe,IAAI,CAAA;AACnC,QAAA,UAAA,CAAW,KAAK,MAAM;AACpB,UAAA,KAAA,CAAM,MAAM;AACV,YAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AACpC,YAAS,QAAA,CAAA,gBAAA,EAAkB,EAAE,CAAA;AAAA,WAC9B,CAAA;AAAA,SACF,CAAA;AAAA;AACH;AACF,GACF;AAEA,EAAS,SAAA,eAAA,CACP,KACA,KACA,EAAA;AACA,IAAA,MAAM,YAAe,GAAA,OAAA,CAAQ,MAAM,KAAA,CAAM,GAAG,CAAC,CAAA;AAC7C,IAAI,IAAA,OAAO,UAAU,UAAY,EAAA;AAC/B,MAAA,MAAMA,aAAe,GAAA,OAAA,CAAQ,MAAM,KAAA,CAAM,GAAG,CAAC,CAAA;AAC7C,MAAM,MAAA,MAAA,GAAS,KAAMA,CAAAA,aAAAA,IAAgB,KAAK,CAAA;AAC1C,MAAA,IAAI,CAAGA,EAAAA,aAAY,CAAO,CAAA,KAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA;AACtC,MAAA,OAAA,CAAQ,KAAK,YAAa,CAAA,YAAA,CAAa,GAAG,CAAG,EAAA,CAAA,EAAG,MAAM,CAAE,CAAA,CAAA;AACxD,MAAA;AAAA;AAEF,IAAA,IAAI,CAAG,EAAA,YAAY,CAAO,CAAA,KAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA;AACtC,IAAO,OAAA,OAAA,CAAQ,KAAK,YAAa,CAAA,YAAA,CAAa,GAAG,CAAG,EAAA,CAAA,EAAG,KAAK,CAAE,CAAA,CAAA;AAAA;AAGhE,EAAO,OAAA;AAAA,IACL,UAAA,CAAW,OAAO,UAAU,CAAA;AAAA,IAC5B,EAAE,iBAAiB,QAAS;AAAA,GAC9B;AACF;AAEA,MAAM,kBAAA,GAAqB,cAAc,uBAAuB,CAAA;AAEnD,MAAA,oBAAA,GAAuB,CAClC,YAAA,EACA,OACkB,KAAA;AAClB,EAAA,MAAM,QAAQ,UAAW,CAAA,YAAA,EAAc,EAAE,IAAA,EAAM,SAAS,CAAA;AACxD,EAAO,OAAA,OAAA,CAAQ,kBAAoB,EAAA,KAAA,EAAO,OAAO,CAAA;AACnD;AAEa,MAAA,gBAAA,GAAmB,CAAC,OAA2B,KAAA;AAC1D,EAAA,MAAM,CAAC,KAAO,EAAA,EAAE,iBAAiB,QAAU,EAAA,QAAA,EAAU,CAAI,GAAA,OAAA;AAEzD,EAAA,SAAS,qBAAqB,SAA6B,EAAA;AACzD,IAAA,QAAA,CAAS,kBAAkB,CAACC,MAAAA,KAAU,CAAC,GAAGA,MAAAA,EAAO,SAAS,CAAC,CAAA;AAAA;AAG7D,EAAA,SAAS,KAAQ,GAAA;AACf,IAAA,eAAA,CAAgB,UAAU,KAAK,CAAA;AAAA;AAGjC,EAAA,SAAS,IAAO,GAAA;AACd,IAAA,eAAA,CAAgB,UAAU,IAAI,CAAA;AAAA;AAGhC,EAAA,SAAS,MAAS,GAAA;AAChB,IAAA,eAAA,CAAgB,QAAU,EAAA,CAACC,KAAS,KAAA,CAACA,KAAI,CAAA;AAAA;AAG3C,EAAA,OAAO,CAAC,KAAO,EAAA,EAAE,sBAAsB,KAAO,EAAA,IAAA,EAAM,QAAQ,CAAA;AAC9D;AAEa,MAAA,SAAA,GAAY,CAAC,OAA0C,KAAA;AAClE,EAAM,MAAA,OAAA,GAAyB,OAAQ,CAAA,kBAAA,EAAoB,OAAO,CAAA;AAElE,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,OAAQ,CAAA,KAAA;AAAA,MACZ;AAAA,KACF;AAAA;AAGF,EAAA,OAAO,iBAAiB,OAAO,CAAA;AACjC;AAEa,MAAA,gBAAA,GAAmB,CAAC,OAAqB,KAAA;AACpD,EAAA,MAAM,OAAU,GAAA,sBAAA;AAAA,IACd,kBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,OAAO,iBAAiB,OAAO,CAAA;AACjC","file":"useDrawer.js","sourcesContent":["import {\n type ICustomElement,\n createContext,\n provide,\n consume,\n} from \"component-register\";\nimport {\n createEffect,\n mergeProps,\n on,\n batch,\n splitProps,\n untrack,\n} from \"solid-js\";\nimport { createStore } from \"solid-js/store\";\nimport {\n toHyphenated,\n getContextFromProvider,\n} from \"@brytdesigns/web-component-utils\";\n\ntype StoreContext = {\n animationQueue: Promise<unknown>[];\n};\n\ntype CreateContextOptions = {\n root: HTMLElement & ICustomElement;\n isOpen: boolean;\n isAnimating: boolean;\n};\n\ntype WalkableNode = Parameters<typeof provide>[2];\n\ntype DrawerContext = ReturnType<typeof initializeDrawerContext>;\n\nfunction initializeDrawerContext(props: CreateContextOptions) {\n const [element, stateProps] = splitProps(props, [\"root\"]);\n const [store, setStore] = createStore<StoreContext>({ animationQueue: [] });\n\n createEffect(\n on(\n () => store.animationQueue,\n (animationQueue) => {\n if (!animationQueue.length) return;\n const animations = Promise.all(store.animationQueue);\n setElementState(\"isAnimating\", true);\n animations.then(() => {\n batch(() => {\n setElementState(\"isAnimating\", false);\n setStore(\"animationQueue\", []);\n });\n });\n },\n ),\n );\n\n function setElementState(\n key: keyof Omit<CreateContextOptions, \"root\">,\n value: boolean | ((v: boolean) => boolean),\n ) {\n const currentValue = untrack(() => props[key]);\n if (typeof value === \"function\") {\n const currentValue = untrack(() => props[key]);\n const result = value(currentValue || false);\n if (`${currentValue}` === `${value}`) return;\n element.root.setAttribute(toHyphenated(key), `${result}`);\n return;\n }\n if (`${currentValue}` === `${value}`) return;\n return element.root.setAttribute(toHyphenated(key), `${value}`);\n }\n\n return [\n mergeProps(store, stateProps),\n { setElementState, setStore },\n ] as const;\n}\n\nconst DrawerContextState = createContext(initializeDrawerContext);\n\nexport const provideDrawerContext = (\n initialState: Omit<CreateContextOptions, \"root\">,\n element: WalkableNode,\n): DrawerContext => {\n const props = mergeProps(initialState, { root: element });\n return provide(DrawerContextState, props, element);\n};\n\nexport const useDrawerContext = (context: DrawerContext) => {\n const [state, { setElementState, setStore: setState }] = context;\n\n function updateAnimationQueue(animation: Promise<unknown>) {\n setState(\"animationQueue\", (state) => [...state, animation]);\n }\n\n function close() {\n setElementState(\"isOpen\", false);\n }\n\n function open() {\n setElementState(\"isOpen\", true);\n }\n\n function toggle() {\n setElementState(\"isOpen\", (open) => !open);\n }\n\n return [state, { updateAnimationQueue, close, open, toggle }] as const;\n};\n\nexport const useDrawer = (element: HTMLElement & ICustomElement) => {\n const context: DrawerContext = consume(DrawerContextState, element);\n\n if (!context) {\n throw console.error(\n \"DrawerContext not found! Please ensure to wrap your custom element with drawer-context element.\",\n );\n }\n\n return useDrawerContext(context);\n};\n\nexport const getDrawerContext = (element: Element) => {\n const context = getContextFromProvider<DrawerContext>(\n DrawerContextState,\n element,\n );\n return useDrawerContext(context);\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brytdesigns/web-component-drawer",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "Headless drawer web component",
|
|
5
5
|
"main": "./dist/main/index.js",
|
|
6
6
|
"module": "./dist/main/index.js",
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"motion": "^12.5.0",
|
|
26
26
|
"observe-element-in-viewport": "^0.0.15",
|
|
27
27
|
"solid-element": "^1.9.1",
|
|
28
|
-
"solid-js": "^1.9.
|
|
29
|
-
"@brytdesigns/web-component-utils": "0.1.
|
|
28
|
+
"solid-js": "^1.9.6",
|
|
29
|
+
"@brytdesigns/web-component-utils": "0.1.9"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"dts-bundle-generator": "^9.5.1",
|