@zayne-labs/ui-react 0.11.4 → 0.11.6
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.
- package/dist/components/common/await/index.js.map +1 -1
- package/dist/components/common/suspense-with-boundary/index.js +3 -3
- package/dist/components/common/suspense-with-boundary/index.js.map +1 -1
- package/dist/components/common/teleport/index.js.map +1 -1
- package/dist/components/presence-DkWhm7xu.js.map +1 -1
- package/dist/components/slot-DuwoiC2C.js.map +1 -1
- package/dist/components/ui/carousel/index.d.ts +7 -5
- package/dist/components/ui/carousel/index.js +18 -16
- package/dist/components/ui/carousel/index.js.map +1 -1
- package/dist/components/ui/drag-scroll/index.d.ts +1 -9
- package/dist/components/ui/drag-scroll/index.js +6 -17
- package/dist/components/ui/drag-scroll/index.js.map +1 -1
- package/dist/components/ui/drop-zone/index.js.map +1 -1
- package/dist/style.css +8 -28
- package/package.json +14 -14
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["ReactFragment","Slot.Root"],"sources":["../../../../src/components/common/await/await-context.ts","../../../../src/components/common/await/await.tsx","../../../../src/components/common/await/await-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\n\nexport type AwaitContextType<TValue = unknown> = {\n\tpromise: Promise<TValue>;\n\tresult: TValue;\n};\n\nconst [AwaitContextProvider, useAwaitContextImpl] = createCustomContext<AwaitContextType>({\n\thookName: \"useAwaitContext\",\n\tname: \"AwaitContext\",\n\tproviderName: \"AwaitInner\",\n});\n\nconst useAwaitContext = <TValue>() => useAwaitContextImpl() as AwaitContextType<TValue>;\n\nexport { useAwaitContext, AwaitContextProvider };\n","\"use client\";\n\nimport {\n\tgetSlotMap,\n\twithSlotNameAndSymbol,\n\ttype GetSlotComponentProps,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Fragment as ReactFragment, Suspense, use, useMemo } from \"react\";\nimport { ErrorBoundary, useErrorBoundaryContext, type ErrorBoundaryProps } from \"../error-boundary\";\nimport { Slot } from \"../slot\";\nimport type { SuspenseWithBoundaryProps } from \"../suspense-with-boundary\";\nimport { AwaitContextProvider, useAwaitContext } from \"./await-context\";\n\ntype RenderPropFn<TValue> = (result: TValue) => React.ReactNode;\n\ntype ChildrenType<TValue> = React.ReactNode | RenderPropFn<TValue>;\n\nexport type AwaitRootProps<TValue> = Omit<SuspenseWithBoundaryProps, \"children\"> & {\n\tasChild?: boolean;\n\tchildren: ChildrenType<TValue>;\n\tpromise: Promise<TValue>;\n\twithErrorBoundary?: boolean;\n\twithSuspense?: boolean;\n};\n\nexport function AwaitRoot<TValue>(props: AwaitRootProps<TValue>) {\n\tconst {\n\t\tasChild,\n\t\tchildren,\n\t\terrorFallback,\n\t\terrorResetKeys,\n\t\tfallback,\n\t\tname,\n\t\tonError,\n\t\tonErrorReset,\n\t\tpromise,\n\t\twithErrorBoundary = true,\n\t\twithSuspense = true,\n\t} = props;\n\n\tconst WithErrorBoundary = withErrorBoundary ? ErrorBoundary : ReactFragment;\n\tconst WithSuspense = withSuspense ? Suspense : ReactFragment;\n\n\tconst slots =\n\t\t!isFunction(children) ?\n\t\t\tgetSlotMap<SlotComponentProps>(children)\n\t\t:\t({ default: children } as unknown as ReturnType<typeof getSlotMap<SlotComponentProps>>);\n\n\tconst resolvedPendingFallback = slots.pending ?? fallback;\n\tconst resolvedErrorFallback = slots.error ?? errorFallback;\n\n\treturn (\n\t\t<WithErrorBoundary\n\t\t\t{...(withErrorBoundary && {\n\t\t\t\terrorFallback: resolvedErrorFallback,\n\t\t\t\terrorResetKeys,\n\t\t\t\tonError,\n\t\t\t\tonErrorReset,\n\t\t\t})}\n\t\t>\n\t\t\t<WithSuspense {...(withSuspense && { fallback: resolvedPendingFallback, name })}>\n\t\t\t\t<AwaitRootImpl promise={promise} asChild={asChild}>\n\t\t\t\t\t{slots.default}\n\t\t\t\t</AwaitRootImpl>\n\t\t\t</WithSuspense>\n\t\t</WithErrorBoundary>\n\t);\n}\n\ntype AwaitRootImplProps<TValue> = Pick<AwaitRootProps<TValue>, \"asChild\" | \"children\" | \"promise\">;\n\nfunction AwaitRootImpl<TValue>(props: AwaitRootImplProps<TValue>) {\n\tconst { asChild, children, promise } = props;\n\n\tconst result = use(promise);\n\n\tconst resolvedChildren = isFunction(children) ? children(result) : children;\n\n\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\tconst contextValue = useMemo(() => ({ promise, result }), [promise, result]);\n\n\treturn (\n\t\t<AwaitContextProvider value={contextValue}>\n\t\t\t<Component {...(asChild && contextValue)}>{resolvedChildren}</Component>\n\t\t</AwaitContextProvider>\n\t);\n}\n\ntype SlotComponentProps = AwaitErrorProps | AwaitPendingProps | AwaitSuccessProps;\n\ntype AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<\"default\", ChildrenType<TValue>>;\n\nexport function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(\n\tprops: Pick<AwaitSuccessProps<TValue>, \"children\">\n) {\n\tconst { children } = props;\n\n\tif (isFunction(children)) {\n\t\t// eslint-disable-next-line react
|
|
1
|
+
{"version":3,"file":"index.js","names":["ReactFragment","Slot.Root"],"sources":["../../../../src/components/common/await/await-context.ts","../../../../src/components/common/await/await.tsx","../../../../src/components/common/await/await-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\n\nexport type AwaitContextType<TValue = unknown> = {\n\tpromise: Promise<TValue>;\n\tresult: TValue;\n};\n\nconst [AwaitContextProvider, useAwaitContextImpl] = createCustomContext<AwaitContextType>({\n\thookName: \"useAwaitContext\",\n\tname: \"AwaitContext\",\n\tproviderName: \"AwaitInner\",\n});\n\nconst useAwaitContext = <TValue>() => useAwaitContextImpl() as AwaitContextType<TValue>;\n\nexport { useAwaitContext, AwaitContextProvider };\n","\"use client\";\n\nimport {\n\tgetSlotMap,\n\twithSlotNameAndSymbol,\n\ttype GetSlotComponentProps,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Fragment as ReactFragment, Suspense, use, useMemo } from \"react\";\nimport { ErrorBoundary, useErrorBoundaryContext, type ErrorBoundaryProps } from \"../error-boundary\";\nimport { Slot } from \"../slot\";\nimport type { SuspenseWithBoundaryProps } from \"../suspense-with-boundary\";\nimport { AwaitContextProvider, useAwaitContext } from \"./await-context\";\n\ntype RenderPropFn<TValue> = (result: TValue) => React.ReactNode;\n\ntype ChildrenType<TValue> = React.ReactNode | RenderPropFn<TValue>;\n\nexport type AwaitRootProps<TValue> = Omit<SuspenseWithBoundaryProps, \"children\"> & {\n\tasChild?: boolean;\n\tchildren: ChildrenType<TValue>;\n\tpromise: Promise<TValue>;\n\twithErrorBoundary?: boolean;\n\twithSuspense?: boolean;\n};\n\nexport function AwaitRoot<TValue>(props: AwaitRootProps<TValue>) {\n\tconst {\n\t\tasChild,\n\t\tchildren,\n\t\terrorFallback,\n\t\terrorResetKeys,\n\t\tfallback,\n\t\tname,\n\t\tonError,\n\t\tonErrorReset,\n\t\tpromise,\n\t\twithErrorBoundary = true,\n\t\twithSuspense = true,\n\t} = props;\n\n\tconst WithErrorBoundary = withErrorBoundary ? ErrorBoundary : ReactFragment;\n\tconst WithSuspense = withSuspense ? Suspense : ReactFragment;\n\n\tconst slots =\n\t\t!isFunction(children) ?\n\t\t\tgetSlotMap<SlotComponentProps>(children)\n\t\t:\t({ default: children } as unknown as ReturnType<typeof getSlotMap<SlotComponentProps>>);\n\n\tconst resolvedPendingFallback = slots.pending ?? fallback;\n\tconst resolvedErrorFallback = slots.error ?? errorFallback;\n\n\treturn (\n\t\t<WithErrorBoundary\n\t\t\t{...(withErrorBoundary && {\n\t\t\t\terrorFallback: resolvedErrorFallback,\n\t\t\t\terrorResetKeys,\n\t\t\t\tonError,\n\t\t\t\tonErrorReset,\n\t\t\t})}\n\t\t>\n\t\t\t<WithSuspense {...(withSuspense && { fallback: resolvedPendingFallback, name })}>\n\t\t\t\t<AwaitRootImpl promise={promise} asChild={asChild}>\n\t\t\t\t\t{slots.default}\n\t\t\t\t</AwaitRootImpl>\n\t\t\t</WithSuspense>\n\t\t</WithErrorBoundary>\n\t);\n}\n\ntype AwaitRootImplProps<TValue> = Pick<AwaitRootProps<TValue>, \"asChild\" | \"children\" | \"promise\">;\n\nfunction AwaitRootImpl<TValue>(props: AwaitRootImplProps<TValue>) {\n\tconst { asChild, children, promise } = props;\n\n\tconst result = use(promise);\n\n\tconst resolvedChildren = isFunction(children) ? children(result) : children;\n\n\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\tconst contextValue = useMemo(() => ({ promise, result }), [promise, result]);\n\n\treturn (\n\t\t<AwaitContextProvider value={contextValue}>\n\t\t\t<Component {...(asChild && contextValue)}>{resolvedChildren}</Component>\n\t\t</AwaitContextProvider>\n\t);\n}\n\ntype SlotComponentProps = AwaitErrorProps | AwaitPendingProps | AwaitSuccessProps;\n\ntype AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<\"default\", ChildrenType<TValue>>;\n\nexport function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(\n\tprops: Pick<AwaitSuccessProps<TValue>, \"children\">\n) {\n\tconst { children } = props;\n\n\tif (isFunction(children)) {\n\t\t// eslint-disable-next-line react/rules-of-hooks, react-hooks/hooks -- This hook only uses `use` under the hood so this is safe\n\t\tconst { result } = useAwaitContext<TValue>();\n\n\t\treturn children(result);\n\t}\n\n\treturn children;\n}\n\nObject.assign(AwaitSuccess, withSlotNameAndSymbol<AwaitSuccessProps>(\"default\"));\n\ntype AwaitErrorProps = GetSlotComponentProps<\"error\", ErrorBoundaryProps[\"errorFallback\"]>;\n\nexport const AwaitError = withSlotNameAndSymbol<AwaitErrorProps, { asChild?: boolean }>(\n\t\"error\",\n\t(props) => {\n\t\tconst { asChild, children } = props;\n\n\t\tconst errorBoundaryContext = useErrorBoundaryContext();\n\n\t\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\t\tconst resolvedChildren = isFunction(children) ? children(errorBoundaryContext) : children;\n\n\t\treturn <Component {...(asChild && errorBoundaryContext)}>{resolvedChildren}</Component>;\n\t}\n);\n\ntype AwaitPendingProps = GetSlotComponentProps<\"pending\", React.SuspenseProps[\"fallback\"]>;\n\nexport const AwaitPending = withSlotNameAndSymbol<AwaitPendingProps>(\"pending\");\n","export {\n\tAwaitRoot as Root,\n\tAwaitError as Error,\n\tAwaitPending as Pending,\n\tAwaitSuccess as Success,\n} from \"./await\";\n"],"mappings":";;;;;;;;;;AAOA,MAAM,CAAC,sBAAsB,uBAAuB,oBAAsC;CACzF,UAAU;CACV,MAAM;CACN,cAAc;CACd,CAAC;AAEF,MAAM,wBAAgC,qBAAqB;;;ACa3D,SAAgB,UAAkB,OAA+B;CAChE,MAAM,EACL,SACA,UACA,eACA,gBACA,UACA,MACA,SACA,cACA,SACA,oBAAoB,MACpB,eAAe,SACZ;CAEJ,MAAM,oBAAoB,oBAAoB,gBAAgBA;CAC9D,MAAM,eAAe,eAAe,WAAWA;CAE/C,MAAM,QACL,CAAC,WAAW,SAAS,GACpB,WAA+B,SAAS,GACtC,EAAE,SAAS,UAAU;CAEzB,MAAM,0BAA0B,MAAM,WAAW;CACjD,MAAM,wBAAwB,MAAM,SAAS;AAE7C,QACC,oBAAC,mBAAD;EACC,GAAK,qBAAqB;GACzB,eAAe;GACf;GACA;GACA;GACA;YAED,oBAAC,cAAD;GAAc,GAAK,gBAAgB;IAAE,UAAU;IAAyB;IAAM;aAC7E,oBAAC,eAAD;IAAwB;IAAkB;cACxC,MAAM;IACQ,CAAA;GACF,CAAA;EACI,CAAA;;AAMtB,SAAS,cAAsB,OAAmC;CACjE,MAAM,EAAE,SAAS,UAAU,YAAY;CAEvC,MAAM,SAAS,IAAI,QAAQ;CAE3B,MAAM,mBAAmB,WAAW,SAAS,GAAG,SAAS,OAAO,GAAG;CAEnE,MAAM,YAAY,UAAUC,WAAYD;CAExC,MAAM,eAAe,eAAe;EAAE;EAAS;EAAQ,GAAG,CAAC,SAAS,OAAO,CAAC;AAE5E,QACC,oBAAC,sBAAD;EAAsB,OAAO;YAC5B,oBAAC,WAAD;GAAW,GAAK,WAAW;aAAgB;GAA6B,CAAA;EAClD,CAAA;;AAQzB,SAAgB,aACf,OACC;CACD,MAAM,EAAE,aAAa;AAErB,KAAI,WAAW,SAAS,EAAE;EAEzB,MAAM,EAAE,WAAW,iBAAyB;AAE5C,SAAO,SAAS,OAAO;;AAGxB,QAAO;;AAGR,OAAO,OAAO,cAAc,sBAAyC,UAAU,CAAC;AAIhF,MAAa,aAAa,sBACzB,UACC,UAAU;CACV,MAAM,EAAE,SAAS,aAAa;CAE9B,MAAM,uBAAuB,yBAAyB;CAEtD,MAAM,YAAY,UAAUC,WAAYD;CAExC,MAAM,mBAAmB,WAAW,SAAS,GAAG,SAAS,qBAAqB,GAAG;AAEjF,QAAO,oBAAC,WAAD;EAAW,GAAK,WAAW;YAAwB;EAA6B,CAAA;EAExF;AAID,MAAa,eAAe,sBAAyC,UAAU"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { n as ErrorBoundary } from "../../error-boundary-BOZ3EvMt.js";
|
|
2
2
|
import { Suspense } from "react";
|
|
3
|
-
import { jsx
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/common/suspense-with-boundary/suspense-with-boundary.tsx
|
|
5
5
|
function SuspenseWithBoundary(props) {
|
|
6
6
|
const { children, fallback, name, ...restOfErrorBoundaryProps } = props;
|
|
7
7
|
return /* @__PURE__ */ jsx(ErrorBoundary, {
|
|
8
8
|
...restOfErrorBoundaryProps,
|
|
9
|
-
children: /* @__PURE__ */
|
|
9
|
+
children: /* @__PURE__ */ jsx(Suspense, {
|
|
10
10
|
fallback,
|
|
11
11
|
name,
|
|
12
|
-
children
|
|
12
|
+
children
|
|
13
13
|
})
|
|
14
14
|
});
|
|
15
15
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/suspense-with-boundary/suspense-with-boundary.tsx"],"sourcesContent":["import { Suspense, type SuspenseProps } from \"react\";\nimport { ErrorBoundary, type ErrorBoundaryProps } from \"../error-boundary\";\n\nexport type SuspenseWithBoundaryProps = ErrorBoundaryProps & SuspenseProps;\n\nexport function SuspenseWithBoundary(props: SuspenseWithBoundaryProps) {\n\tconst { children, fallback, name, ...restOfErrorBoundaryProps } = props;\n\n\treturn (\n\t\t<ErrorBoundary {...restOfErrorBoundaryProps}>\n\t\t\t<Suspense fallback={fallback} name={name}>\n\t\t\t\t{
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/suspense-with-boundary/suspense-with-boundary.tsx"],"sourcesContent":["import { Suspense, type SuspenseProps } from \"react\";\nimport { ErrorBoundary, type ErrorBoundaryProps } from \"../error-boundary\";\n\nexport type SuspenseWithBoundaryProps = ErrorBoundaryProps & SuspenseProps;\n\nexport function SuspenseWithBoundary(props: SuspenseWithBoundaryProps) {\n\tconst { children, fallback, name, ...restOfErrorBoundaryProps } = props;\n\n\treturn (\n\t\t<ErrorBoundary {...restOfErrorBoundaryProps}>\n\t\t\t<Suspense fallback={fallback} name={name}>\n\t\t\t\t{children}\n\t\t\t</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n"],"mappings":";;;;AAKA,SAAgB,qBAAqB,OAAkC;CACtE,MAAM,EAAE,UAAU,UAAU,MAAM,GAAG,6BAA6B;AAElE,QACC,oBAAC,eAAD;EAAe,GAAI;YAClB,oBAAC,UAAD;GAAoB;GAAgB;GAClC;GACS,CAAA;EACI,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/teleport/teleport.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { isString, type AnyString } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useLayoutEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ClientGate } from \"../client-gate\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\nexport type TeleportProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto: AnyString | HTMLElement | React.RefObject<HTMLElement> | ValidHtmlTags | null;\n};\n\nconst TELEPORT_KEY = \"teleport-wrapper\";\n\nconst getDestination = (to: NonNullable<TeleportProps[\"to\"]>) => {\n\tif (isString(to)) {\n\t\treturn document.querySelector<HTMLElement>(to);\n\t}\n\n\tif (to instanceof HTMLElement) {\n\t\treturn to;\n\t}\n\n\treturn to.current;\n};\n\nfunction Teleport(props: TeleportProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n\n\tconst stableUpdatePortalContainer = useCallbackRef((destination: HTMLElement | null) => {\n\t\t// eslint-disable-next-line react
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/teleport/teleport.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { isString, type AnyString } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useLayoutEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ClientGate } from \"../client-gate\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\nexport type TeleportProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto: AnyString | HTMLElement | React.RefObject<HTMLElement> | ValidHtmlTags | null;\n};\n\nconst TELEPORT_KEY = \"teleport-wrapper\";\n\nconst getDestination = (to: NonNullable<TeleportProps[\"to\"]>) => {\n\tif (isString(to)) {\n\t\treturn document.querySelector<HTMLElement>(to);\n\t}\n\n\tif (to instanceof HTMLElement) {\n\t\treturn to;\n\t}\n\n\treturn to.current;\n};\n\nfunction Teleport(props: TeleportProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n\n\tconst stableUpdatePortalContainer = useCallbackRef((destination: HTMLElement | null) => {\n\t\t// eslint-disable-next-line react/set-state-in-effect -- Ignore\n\t\tsetPortalContainer(destination);\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (!to) return;\n\n\t\tconst destination = getDestination(to);\n\n\t\tif (!insertPosition) {\n\t\t\tdestination && stableUpdatePortalContainer(destination);\n\t\t\treturn;\n\t\t}\n\n\t\tconst tempWrapper = document.createElement(\"div\");\n\t\ttempWrapper.dataset.id = TELEPORT_KEY;\n\t\ttempWrapper.style.display = \"contents\";\n\n\t\tdestination?.insertAdjacentElement(insertPosition, tempWrapper);\n\n\t\t// const timeoutId = setTimeout(() => {\n\t\t// \ttempWrapper.replaceWith(...tempWrapper.children);\n\t\t// }, 0);\n\n\t\tstableUpdatePortalContainer(tempWrapper);\n\n\t\treturn () => {\n\t\t\ttempWrapper.remove();\n\t\t};\n\t}, [to, insertPosition, stableUpdatePortalContainer]);\n\n\treturn (\n\t\t<ClientGate>\n\t\t\t{() => portalContainer && createPortal(children, portalContainer, TELEPORT_KEY)}\n\t\t</ClientGate>\n\t);\n}\n\nexport { Teleport };\n"],"mappings":";;;;;;;AAgBA,MAAM,eAAe;AAErB,MAAM,kBAAkB,OAAyC;AAChE,KAAI,SAAS,GAAG,CACf,QAAO,SAAS,cAA2B,GAAG;AAG/C,KAAI,cAAc,YACjB,QAAO;AAGR,QAAO,GAAG;;AAGX,SAAS,SAAS,OAAsB;CACvC,MAAM,EAAE,UAAU,gBAAgB,OAAO;CAEzC,MAAM,CAAC,iBAAiB,sBAAsB,SAA6B,KAAK;CAEhF,MAAM,8BAA8B,gBAAgB,gBAAoC;AAEvF,qBAAmB,YAAY;GAC9B;AAEF,uBAAsB;AACrB,MAAI,CAAC,GAAI;EAET,MAAM,cAAc,eAAe,GAAG;AAEtC,MAAI,CAAC,gBAAgB;AACpB,kBAAe,4BAA4B,YAAY;AACvD;;EAGD,MAAM,cAAc,SAAS,cAAc,MAAM;AACjD,cAAY,QAAQ,KAAK;AACzB,cAAY,MAAM,UAAU;AAE5B,eAAa,sBAAsB,gBAAgB,YAAY;AAM/D,8BAA4B,YAAY;AAExC,eAAa;AACZ,eAAY,QAAQ;;IAEnB;EAAC;EAAI;EAAgB;EAA4B,CAAC;AAErD,QACC,oBAAC,YAAD,EAAA,gBACQ,mBAAmB,aAAa,UAAU,iBAAiB,aAAa,EACnE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"presence-DkWhm7xu.js","names":["Slot.Root"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useToggle } from \"@zayne-labs/toolkit-react\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\ntype StateMachineConfig<TState extends string, TEvent extends string> = {\n\tinitial: TState;\n\tstates: Record<TState, Partial<Record<TEvent, TState>>>;\n};\n\nconst useStateMachine = <TState extends string, TEvent extends string>(\n\tconfig: StateMachineConfig<TState, TEvent>\n) => {\n\tconst reducer = (prevState: TState, event: TEvent): TState => {\n\t\tconst newState = config.states[prevState][event] ?? prevState;\n\n\t\treturn newState;\n\t};\n\n\treturn useReducer(reducer, config.initial);\n};\n\nconst getAnimationName = (styles: CSSStyleDeclaration | null) => styles?.animationName ?? \"none\";\n\nexport type UsePresenceOptions = {\n\tonExitComplete?: () => void;\n\tpresent: boolean;\n\t/**\n\t * @default \"animation\"\n\t */\n\tvariant?: \"animation\" | \"transition\";\n};\n\nexport type PresencePropGetters = {\n\tgetPresenceProps: (innerProps: InferProps<HTMLElement>) => InferProps<HTMLElement>;\n};\n\nexport type UsePresenceResult = {\n\tisMounted: boolean;\n\tisTransitionComplete: boolean;\n\tpropGetters: PresencePropGetters;\n\tref: React.Ref<HTMLElement>;\n};\n\n/**\n * React hook that provides the ability to animate the mount/unmount of a component.\n * @see https://github.com/radix-ui/primitives/blob/main/packages/react/presence/src/presence.tsx\n */\n\nconst usePresence = (options: UsePresenceOptions): UsePresenceResult => {\n\tconst { onExitComplete, present: presentProp, variant = \"animation\" } = options;\n\n\tconst stableOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst [isTransitionComplete, toggleIsTransitionComplete] = useToggle(false);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevNodeStateRef = useRef<{\n\t\tprevAnimationName: string;\n\t\tprevPresent: boolean;\n\t}>({\n\t\tprevAnimationName: \"none\",\n\t\tprevPresent: presentProp,\n\t});\n\n\tconst initialState = presentProp ? \"mounted\" : \"unmounted\";\n\n\tconst [mountState, send] = useStateMachine({\n\t\tinitial: initialState,\n\t\tstates: {\n\t\t\tmounted: {\n\t\t\t\tANIMATION_OUT: \"unmountSuspended\",\n\t\t\t\tUNMOUNT: \"unmounted\",\n\t\t\t},\n\t\t\tunmounted: {\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t\tunmountSuspended: {\n\t\t\t\tANIMATION_END: \"unmounted\",\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t},\n\t});\n\n\tuseEffect(() => {\n\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\tprevNodeStateRef.current.prevAnimationName =\n\t\t\tmountState === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [mountState]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevNodeStateRef.current.prevPresent;\n\t\tconst hasPresentChanged = wasPresent !== presentProp;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevNodeStateRef.current.prevAnimationName;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase presentProp: {\n\t\t\t\tsend(\"MOUNT\");\n\n\t\t\t\tif (variant === \"transition\") {\n\t\t\t\t\trequestAnimationFrame(() => toggleIsTransitionComplete(true));\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node): {\n\t\t\t\tif (variant === \"animation\") {\n\t\t\t\t\tconst hasAnimation = currentAnimationName !== \"none\" && styles?.display !== \"none\";\n\n\t\t\t\t\t/**\n\t\t\t\t\t * When `present` changes to `false`, we check changes to animation-name to\n\t\t\t\t\t * determine whether an animation has started. We chose this approach (reading\n\t\t\t\t\t * computed styles) because there is no `animationrun` event (like the `transitionrun` event) and `animationstart`\n\t\t\t\t\t * fires after `animation-delay` has expired which would be too late.\n\t\t\t\t\t */\n\n\t\t\t\t\tconst isAnimationStarted = hasAnimation && prevAnimationName !== currentAnimationName;\n\n\t\t\t\t\tconst isAnimatingOut = wasPresent && isAnimationStarted;\n\n\t\t\t\t\tsend(isAnimatingOut ? \"ANIMATION_OUT\" : \"UNMOUNT\");\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tprevNodeStateRef.current.prevPresent = presentProp;\n\t}, [presentProp, node, send, variant, toggleIsTransitionComplete]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!node) {\n\t\t\t// Transition to the unmounted state if the node is removed prematurely.\n\t\t\t// We avoid doing so during cleanup as the node may change but still exist.\n\t\t\tsend(\"ANIMATION_END\");\n\t\t\treturn;\n\t\t}\n\n\t\tconst setupAnimationListeners = () => {\n\t\t\tlet timeoutId: number;\n\n\t\t\tconst ownerWindow = node.ownerDocument.defaultView ?? globalThis;\n\n\t\t\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t\tprevNodeStateRef.current.prevAnimationName = getAnimationName(stylesRef.current);\n\t\t\t};\n\n\t\t\t/**\n\t\t\t * @description Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n\t\t\t * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n\t\t\t * make sure we only trigger ANIMATION_END for the currently active animation.\n\t\t\t */\n\t\t\tconst handleAnimationEnd = (event: AnimationEvent) => {\n\t\t\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\t\t\t// The event.animationName is unescaped for CSS syntax, so we need to escape it to compare with the animationName computed from the style.\n\t\t\t\tconst isCurrentAnimation = currentAnimationName.includes(CSS.escape(event.animationName));\n\n\t\t\t\tconst isTargetAnimatingNode = event.target === node && isCurrentAnimation;\n\n\t\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t\t// With React 18 concurrency this update is applied a frame after the\n\t\t\t\t// animation ends, creating a flash of visible content. By setting the\n\t\t\t\t// animation fill mode to \"forwards\", we force the node to keep the\n\t\t\t\t// styles of the last keyframe, removing the flash.\n\n\t\t\t\t// Previously we flushed the update via ReactDom.flushSync, but with\n\t\t\t\t// exit animations this resulted in the node being removed from the\n\t\t\t\t// DOM before the synthetic animationEnd event was dispatched, meaning\n\t\t\t\t// user-provided event handlers would not be called.\n\t\t\t\t// https://github.com/radix-ui/primitives/pull/1849\n\t\t\t\tsend(\"ANIMATION_END\");\n\n\t\t\t\tif (!prevNodeStateRef.current.prevPresent) {\n\t\t\t\t\tconst currentFillMode = node.style.animationFillMode;\n\t\t\t\t\tnode.style.animationFillMode = \"forwards\";\n\n\t\t\t\t\t// Reset the style after the node had time to unmount (for cases\n\t\t\t\t\t// where the component chooses not to unmount). Doing this any\n\t\t\t\t\t// sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n\t\t\t\t\t// still causes a flash.\n\t\t\t\t\ttimeoutId = ownerWindow.setTimeout(() => {\n\t\t\t\t\t\tif (node.style.animationFillMode === \"forwards\") {\n\t\t\t\t\t\t\tnode.style.animationFillMode = currentFillMode;\n\t\t\t\t\t\t}\n\t\t\t\t\t}) as never;\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tconst onAnimationStartCleanup = on(node, \"animationstart\", handleAnimationStart);\n\t\t\tconst onAnimationEndCleanup = on(node, \"animationend\", handleAnimationEnd);\n\t\t\tconst onAnimationCancelCleanup = on(node, \"animationcancel\", handleAnimationEnd);\n\n\t\t\tconst cleanup = () => {\n\t\t\t\townerWindow.clearTimeout(timeoutId);\n\t\t\t\tonAnimationStartCleanup();\n\t\t\t\tonAnimationEndCleanup();\n\t\t\t\tonAnimationCancelCleanup();\n\t\t\t};\n\n\t\t\treturn cleanup;\n\t\t};\n\n\t\tconst setupTransitionListeners = () => {\n\t\t\tconst handleTransitionRun = (event: TransitionEvent) => {\n\t\t\t\tconst isTargetTransitioningNode = event.target === node;\n\n\t\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\t\tsend(\"ANIMATION_OUT\");\n\t\t\t};\n\n\t\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\t\tconst isTargetTransitioningNode =\n\t\t\t\t\tevent.target === node && !prevNodeStateRef.current.prevPresent;\n\n\t\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\t\tsend(\"ANIMATION_END\");\n\t\t\t};\n\n\t\t\tconst onTransitionRunCleanup = on(node, \"transitionrun\", handleTransitionRun);\n\t\t\tconst onTransitionEndCleanup = on(node, \"transitionend\", handleTransitionEnd);\n\t\t\tconst onTransitionCancelCleanup = on(node, \"transitioncancel\", handleTransitionEnd);\n\n\t\t\tconst cleanup = () => {\n\t\t\t\tonTransitionRunCleanup();\n\t\t\t\tonTransitionEndCleanup();\n\t\t\t\tonTransitionCancelCleanup();\n\t\t\t};\n\n\t\t\treturn cleanup;\n\t\t};\n\n\t\tswitch (variant) {\n\t\t\tcase \"animation\": {\n\t\t\t\tconst cleanup = setupAnimationListeners();\n\n\t\t\t\treturn cleanup;\n\t\t\t}\n\n\t\t\tcase \"transition\": {\n\t\t\t\tconst cleanup = setupTransitionListeners();\n\n\t\t\t\treturn cleanup;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tvariant satisfies never;\n\t\t\t\tthrow new Error(`Invalid variant: ${variant}`);\n\t\t\t}\n\t\t}\n\t}, [node, send, variant]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = !presentProp && mountState === \"unmounted\";\n\n\t\tif (isExitCompleted) {\n\t\t\ttoggleIsTransitionComplete(false);\n\t\t\tstableOnExitComplete?.();\n\t\t}\n\t}, [mountState, presentProp, stableOnExitComplete, toggleIsTransitionComplete]);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\tsetNode(refNode);\n\n\t\tif (refNode) {\n\t\t\tstylesRef.current = getComputedStyle(refNode);\n\t\t}\n\t});\n\n\tconst MOUNTED_STATES = [\"mounted\", \"unmountSuspended\"] satisfies Array<typeof mountState>;\n\tconst isMounted = MOUNTED_STATES.includes(mountState);\n\tconst transitionPhase = presentProp && isTransitionComplete ? \"enter\" : \"exit\";\n\tconst animationPhase = presentProp ? \"enter\" : \"exit\";\n\n\tconst getPresenceProps: PresencePropGetters[\"getPresenceProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t\"data-mounted\": isMounted,\n\t\t\t\t\"data-present\": presentProp,\n\t\t\t\t\"data-variant\": variant,\n\t\t\t\t...(variant === \"animation\" && { \"data-animation-phase\": animationPhase }),\n\t\t\t\t...(variant === \"transition\" && { \"data-transition-phase\": transitionPhase }),\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: innerProps.className,\n\t\t\t};\n\t\t},\n\t\t[animationPhase, isMounted, presentProp, transitionPhase, variant]\n\t);\n\n\tconst propGetters = useMemo(\n\t\t() => ({\n\t\t\tgetPresenceProps,\n\t\t}),\n\t\t[getPresenceProps]\n\t);\n\n\tconst result = useMemo<UsePresenceResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tisMounted,\n\t\t\t\tisTransitionComplete,\n\t\t\t\tpropGetters,\n\t\t\t\tref,\n\t\t\t}) satisfies UsePresenceResult,\n\t\t[isMounted, isTransitionComplete, propGetters, ref]\n\t);\n\n\treturn result;\n};\n\nexport { usePresence };\n","\"use client\";\n\nimport { useComposeRefs } from \"@zayne-labs/toolkit-react\";\nimport { isFunction, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Slot } from \"../slot\";\nimport { usePresence, type UsePresenceOptions, type UsePresenceResult } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype RenderPropContext = Omit<UsePresenceResult, \"propGetters\" | \"ref\">\n\t& Pick<UsePresenceOptions, \"present\">;\n\nexport type PresenceProps = UsePresenceOptions & {\n\tchildren?: React.ReactElement<RefProp> | ((props: RenderPropContext) => React.ReactElement<RefProp>);\n\tclassName?: string;\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, className, forceMount = false, onExitComplete, present, variant } = props;\n\n\tconst {\n\t\tisMounted,\n\t\tisTransitionComplete,\n\t\tpropGetters,\n\t\tref: presenceRef,\n\t} = usePresence({ onExitComplete, present, variant });\n\n\tconst context = {\n\t\tisMounted,\n\t\tisTransitionComplete,\n\t\tpresent,\n\t} satisfies RenderPropContext;\n\n\tconst resolvedChild = isFunction(children) ? children(context) : children;\n\n\tconst childRef = (resolvedChild?.props.ref\n\t\t?? (resolvedChild as unknown as UnknownObject).ref) as React.Ref<HTMLElement>;\n\n\tconst ref = useComposeRefs(presenceRef, childRef);\n\n\tconst shouldRender =\n\t\tforceMount || (variant === \"transition\" ? isMounted || isTransitionComplete : isMounted);\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Slot.Root ref={ref} {...propGetters.getPresenceProps({ className })}>\n\t\t\t{resolvedChild}\n\t\t</Slot.Root>\n\t);\n}\n\nexport { Presence };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"presence-DkWhm7xu.js","names":["Slot.Root"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useToggle } from \"@zayne-labs/toolkit-react\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from \"react\";\n\ntype StateMachineConfig<TState extends string, TEvent extends string> = {\n\tinitial: TState;\n\tstates: Record<TState, Partial<Record<TEvent, TState>>>;\n};\n\nconst useStateMachine = <TState extends string, TEvent extends string>(\n\tconfig: StateMachineConfig<TState, TEvent>\n) => {\n\tconst reducer = (prevState: TState, event: TEvent): TState => {\n\t\tconst newState = config.states[prevState][event] ?? prevState;\n\n\t\treturn newState;\n\t};\n\n\treturn useReducer(reducer, config.initial);\n};\n\nconst getAnimationName = (styles: CSSStyleDeclaration | null) => styles?.animationName ?? \"none\";\n\nexport type UsePresenceOptions = {\n\tonExitComplete?: () => void;\n\tpresent: boolean;\n\t/**\n\t * @default \"animation\"\n\t */\n\tvariant?: \"animation\" | \"transition\";\n};\n\nexport type PresencePropGetters = {\n\tgetPresenceProps: (innerProps: InferProps<HTMLElement>) => InferProps<HTMLElement>;\n};\n\nexport type UsePresenceResult = {\n\tisMounted: boolean;\n\tisTransitionComplete: boolean;\n\tpropGetters: PresencePropGetters;\n\tref: React.Ref<HTMLElement>;\n};\n\n/**\n * React hook that provides the ability to animate the mount/unmount of a component.\n * @see https://github.com/radix-ui/primitives/blob/main/packages/react/presence/src/presence.tsx\n */\n\nconst usePresence = (options: UsePresenceOptions): UsePresenceResult => {\n\tconst { onExitComplete, present: presentProp, variant = \"animation\" } = options;\n\n\tconst stableOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst [isTransitionComplete, toggleIsTransitionComplete] = useToggle(false);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevNodeStateRef = useRef({\n\t\tprevAnimationName: \"none\",\n\t\tprevPresent: presentProp,\n\t});\n\n\tconst initialState = presentProp ? \"mounted\" : \"unmounted\";\n\n\tconst [mountState, send] = useStateMachine({\n\t\tinitial: initialState,\n\t\tstates: {\n\t\t\tmounted: {\n\t\t\t\tANIMATION_OUT: \"unmountSuspended\",\n\t\t\t\tUNMOUNT: \"unmounted\",\n\t\t\t},\n\t\t\tunmounted: {\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t\tunmountSuspended: {\n\t\t\t\tANIMATION_END: \"unmounted\",\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t},\n\t});\n\n\tuseEffect(() => {\n\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\tprevNodeStateRef.current.prevAnimationName =\n\t\t\tmountState === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [mountState]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevNodeStateRef.current.prevPresent;\n\t\tconst hasPresentChanged = wasPresent !== presentProp;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevNodeStateRef.current.prevAnimationName;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase presentProp: {\n\t\t\t\tsend(\"MOUNT\");\n\n\t\t\t\tif (variant === \"transition\") {\n\t\t\t\t\trequestAnimationFrame(() => toggleIsTransitionComplete(true));\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node): {\n\t\t\t\tif (variant === \"animation\") {\n\t\t\t\t\tconst hasAnimation = currentAnimationName !== \"none\" && styles?.display !== \"none\";\n\n\t\t\t\t\t/**\n\t\t\t\t\t * When `present` changes to `false`, we check changes to animation-name to\n\t\t\t\t\t * determine whether an animation has started. We chose this approach (reading\n\t\t\t\t\t * computed styles) because there is no `animationrun` event (like the `transitionrun` event) and `animationstart`\n\t\t\t\t\t * fires after `animation-delay` has expired which would be too late.\n\t\t\t\t\t */\n\n\t\t\t\t\tconst isAnimationStarted = hasAnimation && prevAnimationName !== currentAnimationName;\n\n\t\t\t\t\tconst isAnimatingOut = wasPresent && isAnimationStarted;\n\n\t\t\t\t\tsend(isAnimatingOut ? \"ANIMATION_OUT\" : \"UNMOUNT\");\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tprevNodeStateRef.current.prevPresent = presentProp;\n\t}, [presentProp, node, send, variant, toggleIsTransitionComplete]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!node) {\n\t\t\t// Transition to the unmounted state if the node is removed prematurely.\n\t\t\t// We avoid doing so during cleanup as the node may change but still exist.\n\t\t\tsend(\"ANIMATION_END\");\n\t\t\treturn;\n\t\t}\n\n\t\tconst setupAnimationListeners = () => {\n\t\t\tlet timeoutId: number;\n\n\t\t\tconst ownerWindow = node.ownerDocument.defaultView ?? globalThis;\n\n\t\t\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t\tprevNodeStateRef.current.prevAnimationName = getAnimationName(stylesRef.current);\n\t\t\t};\n\n\t\t\t/**\n\t\t\t * @description Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n\t\t\t * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n\t\t\t * make sure we only trigger ANIMATION_END for the currently active animation.\n\t\t\t */\n\t\t\tconst handleAnimationEnd = (event: AnimationEvent) => {\n\t\t\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\t\t\t// The event.animationName is unescaped for CSS syntax, so we need to escape it to compare with the animationName computed from the style.\n\t\t\t\tconst isCurrentAnimation = currentAnimationName.includes(CSS.escape(event.animationName));\n\n\t\t\t\tconst isTargetAnimatingNode = event.target === node && isCurrentAnimation;\n\n\t\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t\t// With React 18 concurrency this update is applied a frame after the\n\t\t\t\t// animation ends, creating a flash of visible content. By setting the\n\t\t\t\t// animation fill mode to \"forwards\", we force the node to keep the\n\t\t\t\t// styles of the last keyframe, removing the flash.\n\n\t\t\t\t// Previously we flushed the update via ReactDom.flushSync, but with\n\t\t\t\t// exit animations this resulted in the node being removed from the\n\t\t\t\t// DOM before the synthetic animationEnd event was dispatched, meaning\n\t\t\t\t// user-provided event handlers would not be called.\n\t\t\t\t// https://github.com/radix-ui/primitives/pull/1849\n\t\t\t\tsend(\"ANIMATION_END\");\n\n\t\t\t\tif (!prevNodeStateRef.current.prevPresent) {\n\t\t\t\t\tconst currentFillMode = node.style.animationFillMode;\n\t\t\t\t\tnode.style.animationFillMode = \"forwards\";\n\n\t\t\t\t\t// Reset the style after the node had time to unmount (for cases\n\t\t\t\t\t// where the component chooses not to unmount). Doing this any\n\t\t\t\t\t// sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n\t\t\t\t\t// still causes a flash.\n\t\t\t\t\ttimeoutId = ownerWindow.setTimeout(() => {\n\t\t\t\t\t\tif (node.style.animationFillMode === \"forwards\") {\n\t\t\t\t\t\t\tnode.style.animationFillMode = currentFillMode;\n\t\t\t\t\t\t}\n\t\t\t\t\t}) as never;\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tconst onAnimationStartCleanup = on(node, \"animationstart\", handleAnimationStart);\n\t\t\tconst onAnimationEndCleanup = on(node, \"animationend\", handleAnimationEnd);\n\t\t\tconst onAnimationCancelCleanup = on(node, \"animationcancel\", handleAnimationEnd);\n\n\t\t\tconst cleanup = () => {\n\t\t\t\townerWindow.clearTimeout(timeoutId);\n\t\t\t\tonAnimationStartCleanup();\n\t\t\t\tonAnimationEndCleanup();\n\t\t\t\tonAnimationCancelCleanup();\n\t\t\t};\n\n\t\t\treturn cleanup;\n\t\t};\n\n\t\tconst setupTransitionListeners = () => {\n\t\t\tconst handleTransitionRun = (event: TransitionEvent) => {\n\t\t\t\tconst isTargetTransitioningNode = event.target === node;\n\n\t\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\t\tsend(\"ANIMATION_OUT\");\n\t\t\t};\n\n\t\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\t\tconst isTargetTransitioningNode =\n\t\t\t\t\tevent.target === node && !prevNodeStateRef.current.prevPresent;\n\n\t\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\t\tsend(\"ANIMATION_END\");\n\t\t\t};\n\n\t\t\tconst onTransitionRunCleanup = on(node, \"transitionrun\", handleTransitionRun);\n\t\t\tconst onTransitionEndCleanup = on(node, \"transitionend\", handleTransitionEnd);\n\t\t\tconst onTransitionCancelCleanup = on(node, \"transitioncancel\", handleTransitionEnd);\n\n\t\t\tconst cleanup = () => {\n\t\t\t\tonTransitionRunCleanup();\n\t\t\t\tonTransitionEndCleanup();\n\t\t\t\tonTransitionCancelCleanup();\n\t\t\t};\n\n\t\t\treturn cleanup;\n\t\t};\n\n\t\tswitch (variant) {\n\t\t\tcase \"animation\": {\n\t\t\t\tconst cleanup = setupAnimationListeners();\n\n\t\t\t\treturn cleanup;\n\t\t\t}\n\n\t\t\tcase \"transition\": {\n\t\t\t\tconst cleanup = setupTransitionListeners();\n\n\t\t\t\treturn cleanup;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tvariant satisfies never;\n\t\t\t\tthrow new Error(`Invalid variant: ${variant}`);\n\t\t\t}\n\t\t}\n\t}, [node, send, variant]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = !presentProp && mountState === \"unmounted\";\n\n\t\tif (isExitCompleted) {\n\t\t\ttoggleIsTransitionComplete(false);\n\t\t\tstableOnExitComplete?.();\n\t\t}\n\t}, [mountState, presentProp, stableOnExitComplete, toggleIsTransitionComplete]);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\tsetNode(refNode);\n\n\t\tif (refNode) {\n\t\t\tstylesRef.current = getComputedStyle(refNode);\n\t\t}\n\t});\n\n\tconst MOUNTED_STATES = [\"mounted\", \"unmountSuspended\"] satisfies Array<typeof mountState>;\n\tconst isMounted = MOUNTED_STATES.includes(mountState);\n\tconst transitionPhase = presentProp && isTransitionComplete ? \"enter\" : \"exit\";\n\tconst animationPhase = presentProp ? \"enter\" : \"exit\";\n\n\tconst getPresenceProps: PresencePropGetters[\"getPresenceProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t\"data-mounted\": isMounted,\n\t\t\t\t\"data-present\": presentProp,\n\t\t\t\t\"data-variant\": variant,\n\t\t\t\t...(variant === \"animation\" && { \"data-animation-phase\": animationPhase }),\n\t\t\t\t...(variant === \"transition\" && { \"data-transition-phase\": transitionPhase }),\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: innerProps.className,\n\t\t\t};\n\t\t},\n\t\t[animationPhase, isMounted, presentProp, transitionPhase, variant]\n\t);\n\n\tconst propGetters = useMemo(\n\t\t() => ({\n\t\t\tgetPresenceProps,\n\t\t}),\n\t\t[getPresenceProps]\n\t);\n\n\tconst result = useMemo<UsePresenceResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tisMounted,\n\t\t\t\tisTransitionComplete,\n\t\t\t\tpropGetters,\n\t\t\t\tref,\n\t\t\t}) satisfies UsePresenceResult,\n\t\t[isMounted, isTransitionComplete, propGetters, ref]\n\t);\n\n\treturn result;\n};\n\nexport { usePresence };\n","\"use client\";\n\nimport { useComposeRefs } from \"@zayne-labs/toolkit-react\";\nimport { isFunction, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Slot } from \"../slot\";\nimport { usePresence, type UsePresenceOptions, type UsePresenceResult } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype RenderPropContext = Omit<UsePresenceResult, \"propGetters\" | \"ref\">\n\t& Pick<UsePresenceOptions, \"present\">;\n\nexport type PresenceProps = UsePresenceOptions & {\n\tchildren?: React.ReactElement<RefProp> | ((props: RenderPropContext) => React.ReactElement<RefProp>);\n\tclassName?: string;\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, className, forceMount = false, onExitComplete, present, variant } = props;\n\n\tconst {\n\t\tisMounted,\n\t\tisTransitionComplete,\n\t\tpropGetters,\n\t\tref: presenceRef,\n\t} = usePresence({ onExitComplete, present, variant });\n\n\tconst context = {\n\t\tisMounted,\n\t\tisTransitionComplete,\n\t\tpresent,\n\t} satisfies RenderPropContext;\n\n\tconst resolvedChild = isFunction(children) ? children(context) : children;\n\n\tconst childRef = (resolvedChild?.props.ref\n\t\t?? (resolvedChild as unknown as UnknownObject).ref) as React.Ref<HTMLElement>;\n\n\tconst ref = useComposeRefs(presenceRef, childRef);\n\n\tconst shouldRender =\n\t\tforceMount || (variant === \"transition\" ? isMounted || isTransitionComplete : isMounted);\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Slot.Root ref={ref} {...propGetters.getPresenceProps({ className })}>\n\t\t\t{resolvedChild}\n\t\t</Slot.Root>\n\t);\n}\n\nexport { Presence };\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slot-DuwoiC2C.js","names":["ReactFragment"],"sources":["../../src/components/common/slot/slot.tsx","../../src/components/common/slot/slot-parts.ts"],"sourcesContent":["import { composeRefs, mergeProps, type InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Children, cloneElement, isValidElement, Fragment as ReactFragment } from \"react\";\n\ntype SlotProps = InferProps<HTMLElement> & { ref?: React.Ref<HTMLElement> };\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * ----------------------------------------------------------------------------------------------- */\n\nexport function SlotRoot(props: SlotProps) {\n\tconst { children, ...restOfSlotProps } = props;\n\n\tconst childrenArray = isArray<React.ReactNode>(children) ? children : [children];\n\n\tconst slottable = childrenArray.find((element) => isSlottable(element));\n\n\tif (!slottable) {\n\t\treturn <SlotClone {...restOfSlotProps}>{children}</SlotClone>;\n\t}\n\n\tif (!isValidElement<SlotProps>(slottable)) {\n\t\treturn null;\n\t}\n\n\t// == The new element to render is the one passed as a child of `Slot.Slottable`\n\tconst childToRender = slottable.props.children;\n\n\tif (Children.count(childToRender) > 1) {\n\t\treturn Children.only(null);\n\t}\n\n\tconst resolvedChildToRender = isArray(childToRender) ? childToRender[0] : childToRender;\n\n\tif (!isValidElement(resolvedChildToRender)) {\n\t\
|
|
1
|
+
{"version":3,"file":"slot-DuwoiC2C.js","names":["ReactFragment"],"sources":["../../src/components/common/slot/slot.tsx","../../src/components/common/slot/slot-parts.ts"],"sourcesContent":["import { composeRefs, mergeProps, type InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Children, cloneElement, isValidElement, Fragment as ReactFragment } from \"react\";\n\ntype SlotProps = InferProps<HTMLElement> & { ref?: React.Ref<HTMLElement> };\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * ----------------------------------------------------------------------------------------------- */\n\nexport function SlotRoot(props: SlotProps) {\n\tconst { children, ...restOfSlotProps } = props;\n\n\tconst childrenArray = isArray<React.ReactNode>(children) ? children : [children];\n\n\tconst slottable = childrenArray.find((element) => isSlottable(element));\n\n\tif (!slottable) {\n\t\treturn <SlotClone {...restOfSlotProps}>{children}</SlotClone>;\n\t}\n\n\tif (!isValidElement<SlotProps>(slottable)) {\n\t\treturn null;\n\t}\n\n\t// == The new element to render is the one passed as a child of `Slot.Slottable`\n\tconst childToRender = slottable.props.children;\n\n\tif (Children.count(childToRender) > 1) {\n\t\treturn Children.only(null);\n\t}\n\n\tconst resolvedChildToRender = isArray(childToRender) ? childToRender[0] : childToRender;\n\n\tif (!isValidElement(resolvedChildToRender)) {\n\t\tconsole.error(\"Invalid element passed to Slottable:\", resolvedChildToRender);\n\t\treturn null;\n\t}\n\n\tconst childToRenderChildren = childrenArray.map((child) => {\n\t\tif (child === slottable) {\n\t\t\t// == Because the new element will be the one rendered, we are only interested in grabbing its children (`childToRender.props.children`)\n\t\t\treturn (resolvedChildToRender.props as SlotProps).children;\n\t\t}\n\n\t\treturn child;\n\t});\n\n\treturn (\n\t\t<SlotClone {...restOfSlotProps}>\n\t\t\t{cloneElement(resolvedChildToRender, undefined, childToRenderChildren)}\n\t\t</SlotClone>\n\t);\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * ----------------------------------------------------------------------------------------------- */\n\nexport function SlotSlottable({ children }: Pick<SlotProps, \"children\">) {\n\treturn children;\n}\n\nconst isSlottable = (child: React.ReactNode): child is React.ReactElement => {\n\treturn isValidElement(child) && child.type === SlotSlottable;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * ----------------------------------------------------------------------------------------------- */\ntype SlotCloneProps = Pick<SlotProps, \"children\" | \"ref\">;\n\nfunction SlotClone(props: SlotCloneProps) {\n\tconst { children, ref: forwardedRef, ...restOfSlotProps } = props;\n\n\tif (Children.count(children) > 1) {\n\t\treturn Children.only(null);\n\t}\n\n\tconst resolvedChild = isArray(children) ? children[0] : children;\n\n\tif (!isValidElement<UnknownObject>(resolvedChild)) {\n\t\tconsole.error(\"Invalid element passed to Slot:\", resolvedChild);\n\t\treturn null;\n\t}\n\n\tconst childRef = resolvedChild.props.ref as React.Ref<HTMLElement>;\n\n\tconst ref = composeRefs(forwardedRef, childRef);\n\n\tconst clonedProps = {\n\t\t...mergeProps(restOfSlotProps, resolvedChild.props),\n\t\t...(resolvedChild.type !== ReactFragment && { ref }),\n\t};\n\n\treturn cloneElement(resolvedChild, clonedProps);\n}\n","export { SlotRoot as Root, SlotSlottable as Slottable } from \"./slot\";\n"],"mappings":";;;;;;AAUA,SAAgB,SAAS,OAAkB;CAC1C,MAAM,EAAE,UAAU,GAAG,oBAAoB;CAEzC,MAAM,gBAAgB,QAAyB,SAAS,GAAG,WAAW,CAAC,SAAS;CAEhF,MAAM,YAAY,cAAc,MAAM,YAAY,YAAY,QAAQ,CAAC;AAEvE,KAAI,CAAC,UACJ,QAAO,oBAAC,WAAD;EAAW,GAAI;EAAkB;EAAqB,CAAA;AAG9D,KAAI,CAAC,eAA0B,UAAU,CACxC,QAAO;CAIR,MAAM,gBAAgB,UAAU,MAAM;AAEtC,KAAI,SAAS,MAAM,cAAc,GAAG,EACnC,QAAO,SAAS,KAAK,KAAK;CAG3B,MAAM,wBAAwB,QAAQ,cAAc,GAAG,cAAc,KAAK;AAE1E,KAAI,CAAC,eAAe,sBAAsB,EAAE;AAC3C,UAAQ,MAAM,wCAAwC,sBAAsB;AAC5E,SAAO;;CAGR,MAAM,wBAAwB,cAAc,KAAK,UAAU;AAC1D,MAAI,UAAU,UAEb,QAAQ,sBAAsB,MAAoB;AAGnD,SAAO;GACN;AAEF,QACC,oBAAC,WAAD;EAAW,GAAI;YACb,aAAa,uBAAuB,KAAA,GAAW,sBAAsB;EAC3D,CAAA;;AAQd,SAAgB,cAAc,EAAE,YAAyC;AACxE,QAAO;;AAGR,MAAM,eAAe,UAAwD;AAC5E,QAAO,eAAe,MAAM,IAAI,MAAM,SAAS;;AAQhD,SAAS,UAAU,OAAuB;CACzC,MAAM,EAAE,UAAU,KAAK,cAAc,GAAG,oBAAoB;AAE5D,KAAI,SAAS,MAAM,SAAS,GAAG,EAC9B,QAAO,SAAS,KAAK,KAAK;CAG3B,MAAM,gBAAgB,QAAQ,SAAS,GAAG,SAAS,KAAK;AAExD,KAAI,CAAC,eAA8B,cAAc,EAAE;AAClD,UAAQ,MAAM,mCAAmC,cAAc;AAC/D,SAAO;;CAGR,MAAM,WAAW,cAAc,MAAM;CAErC,MAAM,MAAM,YAAY,cAAc,SAAS;AAO/C,QAAO,aAAa,eALA;EACnB,GAAG,WAAW,iBAAiB,cAAc,MAAM;EACnD,GAAI,cAAc,SAASA,YAAiB,EAAE,KAAK;EACnD,CAE8C"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { PolymorphicPropsStrict } from "@zayne-labs/toolkit-react/utils";
|
|
1
|
+
import { InferProps, PolymorphicPropsStrict } from "@zayne-labs/toolkit-react/utils";
|
|
2
2
|
import { UnionDiscriminator } from "@zayne-labs/toolkit-type-helpers";
|
|
3
3
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
4
|
import { StoreApi } from "@zayne-labs/toolkit-core";
|
|
@@ -46,10 +46,9 @@ type CarouselControlProps = Pick<CarouselButtonsProps, "classNames"> & {
|
|
|
46
46
|
prev?: React.ReactElement;
|
|
47
47
|
}]>;
|
|
48
48
|
};
|
|
49
|
-
type CarouselIndicatorProps = {
|
|
49
|
+
type CarouselIndicatorProps = InferProps<"button"> & {
|
|
50
50
|
classNames?: {
|
|
51
51
|
base?: string;
|
|
52
|
-
button?: string;
|
|
53
52
|
isActive?: string;
|
|
54
53
|
};
|
|
55
54
|
currentIndex: number;
|
|
@@ -71,13 +70,16 @@ type OtherCarouselProps = {
|
|
|
71
70
|
className?: string;
|
|
72
71
|
style?: React.CSSProperties;
|
|
73
72
|
};
|
|
73
|
+
type CarouselItemProps = OtherCarouselProps & {
|
|
74
|
+
currentIndex: number;
|
|
75
|
+
};
|
|
74
76
|
//#endregion
|
|
75
77
|
//#region src/components/ui/carousel/carousel.d.ts
|
|
76
78
|
declare function CarouselRoot<TImages extends ImagesType, TElement extends React.ElementType = "div">(props: PolymorphicPropsStrict<TElement, CarouselRootProps<TImages>>): _$react_jsx_runtime0.JSX.Element;
|
|
77
79
|
declare function CarouselButton(props: CarouselButtonsProps): _$react_jsx_runtime0.JSX.Element;
|
|
78
80
|
declare function CarouselControls(props: CarouselControlProps): _$react_jsx_runtime0.JSX.Element;
|
|
79
81
|
declare function CarouselItemList<TArray extends unknown[]>(props: CarouselWrapperProps<TArray[number]>): _$react_jsx_runtime0.JSX.Element;
|
|
80
|
-
declare function CarouselItem(props:
|
|
82
|
+
declare function CarouselItem(props: CarouselItemProps): _$react_jsx_runtime0.JSX.Element;
|
|
81
83
|
declare function CarouselCaption<TElement extends React.ElementType = "div">(props: PolymorphicPropsStrict<TElement, OtherCarouselProps>): _$react_jsx_runtime0.JSX.Element;
|
|
82
84
|
declare function CarouselIndicatorList<TArray extends unknown[]>(props: CarouselWrapperProps<TArray[number]>): _$react_jsx_runtime0.JSX.Element;
|
|
83
85
|
declare function CarouselIndicator(props: CarouselIndicatorProps): _$react_jsx_runtime0.JSX.Element;
|
|
@@ -85,5 +87,5 @@ declare namespace carousel_parts_d_exports {
|
|
|
85
87
|
export { CarouselButton as Button, CarouselCaption as Caption, CarouselControls as Controls, CarouselIndicator as Indicator, CarouselIndicatorList as IndicatorList, CarouselItem as Item, CarouselItemList as ItemList, CarouselRoot as Root };
|
|
86
88
|
}
|
|
87
89
|
//#endregion
|
|
88
|
-
export { carousel_parts_d_exports as Carousel, CarouselButton, CarouselButtonsProps, CarouselCaption, CarouselControlProps, CarouselControls, CarouselIndicator, CarouselIndicatorList, CarouselIndicatorProps, CarouselItem, CarouselItemList, CarouselRoot, CarouselRootProps, CarouselStore, CarouselStoreApi, CarouselWrapperProps, ImagesType, OtherCarouselProps };
|
|
90
|
+
export { carousel_parts_d_exports as Carousel, CarouselButton, CarouselButtonsProps, CarouselCaption, CarouselControlProps, CarouselControls, CarouselIndicator, CarouselIndicatorList, CarouselIndicatorProps, CarouselItem, CarouselItemList, CarouselItemProps, CarouselRoot, CarouselRootProps, CarouselStore, CarouselStoreApi, CarouselWrapperProps, ImagesType, OtherCarouselProps };
|
|
89
91
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -7,7 +7,7 @@ import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
|
7
7
|
import { useMemo, useState } from "react";
|
|
8
8
|
import { useAnimationInterval, useCallbackRef, useStore } from "@zayne-labs/toolkit-react";
|
|
9
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
-
import { createStore } from "@zayne-labs/toolkit-core";
|
|
10
|
+
import { createStore, dataAttr } from "@zayne-labs/toolkit-core";
|
|
11
11
|
import { createReactStoreContext } from "@zayne-labs/toolkit-react/zustand";
|
|
12
12
|
//#region src/components/ui/carousel/carousel-store-context.ts
|
|
13
13
|
const [CarouselStoreContextProvider, useCarouselStoreContext] = createReactStoreContext({
|
|
@@ -119,14 +119,14 @@ function CarouselRoot(props) {
|
|
|
119
119
|
"data-slot": "carousel-root",
|
|
120
120
|
"data-scope": "carousel",
|
|
121
121
|
"data-part": "root",
|
|
122
|
-
className: cnMerge("
|
|
122
|
+
className: cnMerge("isolate", classNames?.base),
|
|
123
123
|
onMouseEnter: pauseAutoSlide,
|
|
124
124
|
onMouseLeave: resumeAutoSlide,
|
|
125
125
|
children: /* @__PURE__ */ jsx("div", {
|
|
126
126
|
"data-scope": "carousel",
|
|
127
127
|
"data-part": "content",
|
|
128
128
|
"data-slot": "carousel-content",
|
|
129
|
-
className: cnMerge("scrollbar-hidden
|
|
129
|
+
className: cnMerge("relative scrollbar-hidden size-full overflow-x-scroll", classNames?.content),
|
|
130
130
|
children
|
|
131
131
|
})
|
|
132
132
|
})
|
|
@@ -185,7 +185,7 @@ function CarouselItemList(props) {
|
|
|
185
185
|
"data-slot": "carousel-item-list",
|
|
186
186
|
"data-scope": "carousel",
|
|
187
187
|
"data-part": "item-list",
|
|
188
|
-
className: cnMerge(`flex
|
|
188
|
+
className: cnMerge(`flex size-full transform-[translate3d(var(--translate-distance),0,0)] snap-center
|
|
189
189
|
transition-transform duration-800`, className),
|
|
190
190
|
style: { "--translate-distance": `-${currentSlide * 100}%` },
|
|
191
191
|
children: isFunction(children) ? /* @__PURE__ */ jsx(For, {
|
|
@@ -199,12 +199,14 @@ function CarouselItemList(props) {
|
|
|
199
199
|
});
|
|
200
200
|
}
|
|
201
201
|
function CarouselItem(props) {
|
|
202
|
-
const { children, className, ...restOfProps } = props;
|
|
202
|
+
const { children, className, currentIndex, ...restOfProps } = props;
|
|
203
|
+
const isActive = useCarouselStoreContext((state) => state.currentSlide) === currentIndex;
|
|
203
204
|
return /* @__PURE__ */ jsx("li", {
|
|
204
205
|
"data-slot": "carousel-item",
|
|
205
206
|
"data-scope": "carousel",
|
|
206
207
|
"data-part": "item",
|
|
207
|
-
|
|
208
|
+
"data-active": dataAttr(isActive),
|
|
209
|
+
className: cnMerge("relative size-full shrink-0 snap-center overflow-hidden", className),
|
|
208
210
|
...restOfProps,
|
|
209
211
|
children
|
|
210
212
|
});
|
|
@@ -222,11 +224,11 @@ function CarouselCaption(props) {
|
|
|
222
224
|
function CarouselIndicatorList(props) {
|
|
223
225
|
const { children, className, each } = props;
|
|
224
226
|
const images = useCarouselStoreContext((state) => each ?? state.images);
|
|
225
|
-
return /* @__PURE__ */ jsx("
|
|
227
|
+
return /* @__PURE__ */ jsx("div", {
|
|
226
228
|
"data-slot": "carousel-indicator-list",
|
|
227
229
|
"data-scope": "carousel",
|
|
228
230
|
"data-part": "indicator-list",
|
|
229
|
-
className: cnMerge("absolute bottom-
|
|
231
|
+
className: cnMerge("absolute bottom-6 z-2 flex w-full items-center justify-center gap-4", className),
|
|
230
232
|
children: isFunction(children) ? /* @__PURE__ */ jsx(For, {
|
|
231
233
|
each: images,
|
|
232
234
|
renderItem: (image, index, array) => children({
|
|
@@ -238,18 +240,18 @@ function CarouselIndicatorList(props) {
|
|
|
238
240
|
});
|
|
239
241
|
}
|
|
240
242
|
function CarouselIndicator(props) {
|
|
241
|
-
const { classNames, currentIndex } = props;
|
|
243
|
+
const { className, classNames, currentIndex, ...restOfProps } = props;
|
|
242
244
|
const { actions: { goToSlide }, currentSlide } = useCarouselStoreContext((state) => state);
|
|
243
|
-
|
|
245
|
+
const isActive = currentSlide === currentIndex;
|
|
246
|
+
return /* @__PURE__ */ jsx("button", {
|
|
244
247
|
"data-slot": "carousel-indicator",
|
|
245
248
|
"data-scope": "carousel",
|
|
246
249
|
"data-part": "indicator",
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
})
|
|
250
|
+
"data-active": dataAttr(isActive),
|
|
251
|
+
type: "button",
|
|
252
|
+
onClick: () => goToSlide(currentIndex),
|
|
253
|
+
className: cnMerge("size-1.5 rounded-[50%]", className, classNames?.base, isActive && ["w-9 rounded-[6px]", classNames?.isActive]),
|
|
254
|
+
...restOfProps
|
|
253
255
|
});
|
|
254
256
|
}
|
|
255
257
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["Show.Root","Show.Content","Show.Fallback"],"sources":["../../../../src/components/ui/carousel/carousel-store-context.ts","../../../../src/components/ui/carousel/icons.tsx","../../../../src/components/ui/carousel/useCarouselOptions.ts","../../../../src/components/ui/carousel/carousel.tsx","../../../../src/components/ui/carousel/carousel-parts.ts"],"sourcesContent":["import { createStore } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useStore } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { PrettyOmit } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport type { CarouselRootProps, CarouselStore, ImagesType } from \"./types\";\n\nconst [CarouselStoreContextProvider, useCarouselStoreContext] = createReactStoreContext<CarouselStore>({\n\thookName: \"useCarouselStore\",\n\tname: \"CarouselStoreContext\",\n\tproviderName: \"CarouselRoot\",\n});\n\n// CarouselStore Creation\nconst createCarouselStore = <TImages extends ImagesType>(\n\tstoreValues: PrettyOmit<CarouselRootProps<TImages>, \"children\">\n) => {\n\tconst { images, onSlideBtnClick } = storeValues;\n\n\tconst carouselStore = createStore<CarouselStore<TImages>>((set, get) => ({\n\t\tcurrentSlide: 0,\n\t\timages,\n\t\tmaxSlide: images.length - 1,\n\n\t\t/* eslint-disable perfectionist/sort-objects -- actions should be last */\n\t\tactions: {\n\t\t\t/* eslint-enable perfectionist/sort-objects -- actions should be last */\n\n\t\t\tgoToNextSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === maxSlide) {\n\t\t\t\t\tgoToSlide(0);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide + 1);\n\t\t\t},\n\n\t\t\tgoToPreviousSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === 0) {\n\t\t\t\t\tgoToSlide(maxSlide);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide - 1);\n\t\t\t},\n\n\t\t\tgoToSlide: (newValue) => {\n\t\t\t\tonSlideBtnClick?.();\n\n\t\t\t\tset({ currentSlide: newValue });\n\t\t\t},\n\t\t},\n\t}));\n\n\treturn carouselStore;\n};\n\nconst useCarousel = <TImages extends ImagesType>(props: Omit<CarouselRootProps<TImages>, \"children\">) => {\n\tconst { images, onSlideBtnClick } = props;\n\n\tconst savedOnSlideBtnClick = useCallbackRef(onSlideBtnClick);\n\n\tconst carouselStore = useMemo(\n\t\t() => createCarouselStore({ images, onSlideBtnClick: savedOnSlideBtnClick }),\n\t\t[images, savedOnSlideBtnClick]\n\t);\n\n\t// eslint-disable-next-line react-x/component-hook-factories -- Ignore\n\tconst useCarouselStore: typeof useCarouselStoreContext = (selector) => {\n\t\t// eslint-disable-next-line react-hooks/hooks -- Ignore\n\t\treturn useStore(carouselStore, selector);\n\t};\n\n\tconst savedUseCarouselStore = useCallbackRef(useCarouselStore);\n\n\treturn useMemo(\n\t\t() => ({ carouselStore, useCarouselStore: savedUseCarouselStore }),\n\t\t[carouselStore, savedUseCarouselStore]\n\t);\n};\n\nexport { CarouselStoreContextProvider, useCarousel, useCarouselStoreContext };\n","export const ChevronLeftIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<circle cx=\"12\" cy=\"12\" r=\"10\" />\n\t\t\t<path d=\"m14 16l-4-4l4-4\" />\n\t\t</g>\n\t</svg>\n);\n","import { useAnimationInterval, useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useState } from \"react\";\nimport type { CarouselStore } from \"./types\";\n\ntype CarouselOptions = {\n\tactions: CarouselStore[\"actions\"];\n\tautoSlideInterval?: number;\n\thasAutoSlide?: boolean;\n\tshouldPauseOnHover?: boolean;\n};\n\nconst useCarouselOptions = (options: CarouselOptions) => {\n\tconst { actions, autoSlideInterval = 5000, hasAutoSlide = false, shouldPauseOnHover = false } = options;\n\n\tconst [isPaused, setIsPaused] = useState(false);\n\n\tconst shouldAutoSlide = hasAutoSlide && !isPaused;\n\n\tuseAnimationInterval({\n\t\tintervalDuration: shouldAutoSlide ? autoSlideInterval : null,\n\t\tonAnimation: actions.goToNextSlide,\n\t});\n\n\tconst pauseAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(true));\n\n\tconst resumeAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(false));\n\n\treturn { pauseAutoSlide, resumeAutoSlide };\n};\n\nexport { useCarouselOptions };\n","\"use client\";\n\nimport type { CssWithCustomProperties, PolymorphicPropsStrict } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { For } from \"@/components/common/for\";\nimport { Show } from \"@/components/common/show\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport {\n\tCarouselStoreContextProvider,\n\tuseCarousel,\n\tuseCarouselStoreContext,\n} from \"./carousel-store-context\";\nimport { ChevronLeftIcon } from \"./icons\";\nimport type {\n\tCarouselButtonsProps,\n\tCarouselControlProps,\n\tCarouselIndicatorProps,\n\tCarouselRootProps,\n\tCarouselWrapperProps,\n\tImagesType,\n\tOtherCarouselProps,\n} from \"./types\";\nimport { useCarouselOptions } from \"./useCarouselOptions\";\n\n// TODO - Add dragging and swiping support\nexport function CarouselRoot<TImages extends ImagesType, TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, CarouselRootProps<TImages>>\n) {\n\tconst {\n\t\tas: Element = \"div\",\n\t\tautoSlideInterval,\n\t\tchildren,\n\t\tclassNames,\n\t\thasAutoSlide,\n\t\timages,\n\t\tonSlideBtnClick,\n\t\tshouldPauseOnHover,\n\t} = props;\n\n\tconst { carouselStore } = useCarousel({ images, onSlideBtnClick });\n\n\tconst actions = carouselStore.getState().actions;\n\n\tconst { pauseAutoSlide, resumeAutoSlide } = useCarouselOptions({\n\t\tactions,\n\t\tautoSlideInterval,\n\t\thasAutoSlide,\n\t\tshouldPauseOnHover,\n\t});\n\n\treturn (\n\t\t<CarouselStoreContextProvider store={carouselStore}>\n\t\t\t<Element\n\t\t\t\tdata-slot=\"carousel-root\"\n\t\t\t\tdata-scope=\"carousel\"\n\t\t\t\tdata-part=\"root\"\n\t\t\t\tclassName={cnMerge(\"relative isolate\", classNames?.base)}\n\t\t\t\tonMouseEnter={pauseAutoSlide}\n\t\t\t\tonMouseLeave={resumeAutoSlide}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tdata-scope=\"carousel\"\n\t\t\t\t\tdata-part=\"content\"\n\t\t\t\t\tdata-slot=\"carousel-content\"\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"scrollbar-hidden flex size-full overflow-x-scroll\",\n\t\t\t\t\t\tclassNames?.content\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</Element>\n\t\t</CarouselStoreContextProvider>\n\t);\n}\n\nexport function CarouselButton(props: CarouselButtonsProps) {\n\tconst { classNames, icon, variant } = props;\n\n\tconst { goToNextSlide, goToPreviousSlide } = useCarouselStoreContext((state) => state.actions);\n\n\treturn (\n\t\t<button\n\t\t\tdata-slot={`carousel-${variant}-button`}\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"button\"\n\t\t\ttype=\"button\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"absolute inset-y-0 z-20 flex items-center justify-center\",\n\t\t\t\tvariant === \"prev\" && \"left-0\",\n\t\t\t\tvariant === \"next\" && \"right-0\",\n\t\t\t\tclassNames?.base\n\t\t\t)}\n\t\t\tonClick={variant === \"prev\" ? goToPreviousSlide : goToNextSlide}\n\t\t>\n\t\t\t<span className={cnMerge(\"transition-transform active:scale-[1.06]\", classNames?.iconContainer)}>\n\t\t\t\t{icon ?? (\n\t\t\t\t\t<ChevronLeftIcon\n\t\t\t\t\t\tclassName={cnMerge(variant === \"next\" && \"rotate-180\", classNames?.defaultIcon)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t</button>\n\t);\n}\n\nexport function CarouselControls(props: CarouselControlProps) {\n\tconst { classNames, icon } = props;\n\n\treturn (\n\t\t<Show.Root when={icon?.iconType}>\n\t\t\t<Show.Content>\n\t\t\t\t<CarouselButton\n\t\t\t\t\tvariant=\"prev\"\n\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t...classNames,\n\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\ticon?.iconType === \"nextIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t),\n\t\t\t\t\t}}\n\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t/>\n\n\t\t\t\t<CarouselButton\n\t\t\t\t\tvariant=\"next\"\n\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t...classNames,\n\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\ticon?.iconType === \"prevIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t),\n\t\t\t\t\t}}\n\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t/>\n\t\t\t</Show.Content>\n\n\t\t\t<Show.Fallback>\n\t\t\t\t<CarouselButton variant=\"prev\" classNames={classNames} icon={icon?.prev} />\n\n\t\t\t\t<CarouselButton variant=\"next\" classNames={classNames} icon={icon?.next} />\n\t\t\t</Show.Fallback>\n\t\t</Show.Root>\n\t);\n}\n\nexport function CarouselItemList<TArray extends unknown[]>(props: CarouselWrapperProps<TArray[number]>) {\n\tconst { children, className, each } = props;\n\n\tconst currentSlide = useCarouselStoreContext((state) => state.currentSlide);\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArray));\n\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"carousel-item-list\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item-list\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t`flex w-full shrink-0 transform-[translate3d(var(--translate-distance),0,0)] snap-center\n\t\t\t\ttransition-transform duration-800`,\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={\n\t\t\t\t{\n\t\t\t\t\t\"--translate-distance\": `-${currentSlide * 100}%`,\n\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</ul>\n\t);\n}\n\nexport function CarouselItem(props: OtherCarouselProps) {\n\tconst { children, className, ...restOfProps } = props;\n\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"carousel-item\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item\"\n\t\t\tclassName={cnMerge(\"flex w-full shrink-0 snap-center justify-center\", className)}\n\t\t\t{...restOfProps}\n\t\t>\n\t\t\t{children}\n\t\t</li>\n\t);\n}\n\nexport function CarouselCaption<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, OtherCarouselProps>\n) {\n\tconst { as: Element = \"div\", children, className } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-slot=\"carousel-caption\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"caption\"\n\t\t\tclassName={cnMerge(\"absolute z-10\", className)}\n\t\t>\n\t\t\t{children}\n\t\t</Element>\n\t);\n}\n\nexport function CarouselIndicatorList<TArray extends unknown[]>(\n\tprops: CarouselWrapperProps<TArray[number]>\n) {\n\tconst { children, className, each } = props;\n\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArray));\n\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"carousel-indicator-list\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator-list\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"absolute bottom-[25px] z-2 flex w-full items-center justify-center gap-[15px]\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</ul>\n\t);\n}\n\nexport function CarouselIndicator(props: CarouselIndicatorProps) {\n\tconst { classNames, currentIndex } = props;\n\n\tconst {\n\t\tactions: { goToSlide },\n\t\tcurrentSlide,\n\t} = useCarouselStoreContext((state) => state);\n\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"carousel-indicator\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator\"\n\t\t\tclassName={cnMerge(\"inline-flex\", classNames?.base)}\n\t\t>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={() => goToSlide(currentIndex)}\n\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\"size-1.5 rounded-[50%]\",\n\t\t\t\t\tclassNames?.base,\n\t\t\t\t\tcurrentIndex === currentSlide && [\"w-[35px] rounded-[5px]\", classNames?.isActive]\n\t\t\t\t)}\n\t\t\t/>\n\t\t</li>\n\t);\n}\n","export {\n\tCarouselButton as Button,\n\tCarouselCaption as Caption,\n\tCarouselControls as Controls,\n\tCarouselIndicator as Indicator,\n\tCarouselIndicatorList as IndicatorList,\n\tCarouselItem as Item,\n\tCarouselItemList as ItemList,\n\tCarouselRoot as Root,\n} from \"./carousel\";\n"],"mappings":";;;;;;;;;;;;AAOA,MAAM,CAAC,8BAA8B,2BAA2B,wBAAuC;CACtG,UAAU;CACV,MAAM;CACN,cAAc;CACd,CAAC;AAGF,MAAM,uBACL,gBACI;CACJ,MAAM,EAAE,QAAQ,oBAAoB;AA2CpC,QAzCsB,aAAqC,KAAK,SAAS;EACxE,cAAc;EACd;EACA,UAAU,OAAO,SAAS;EAG1B,SAAS;GAGR,qBAAqB;IACpB,MAAM,EAAE,cAAc,aAAa,KAAK;IACxC,MAAM,EAAE,cAAc,KAAK,CAAC;AAE5B,QAAI,iBAAiB,UAAU;AAC9B,eAAU,EAAE;AACZ;;AAGD,cAAU,eAAe,EAAE;;GAG5B,yBAAyB;IACxB,MAAM,EAAE,cAAc,aAAa,KAAK;IACxC,MAAM,EAAE,cAAc,KAAK,CAAC;AAE5B,QAAI,iBAAiB,GAAG;AACvB,eAAU,SAAS;AACnB;;AAGD,cAAU,eAAe,EAAE;;GAG5B,YAAY,aAAa;AACxB,uBAAmB;AAEnB,QAAI,EAAE,cAAc,UAAU,CAAC;;GAEhC;EACD,EAAE;;AAKJ,MAAM,eAA2C,UAAwD;CACxG,MAAM,EAAE,QAAQ,oBAAoB;CAEpC,MAAM,uBAAuB,eAAe,gBAAgB;CAE5D,MAAM,gBAAgB,cACf,oBAAoB;EAAE;EAAQ,iBAAiB;EAAsB,CAAC,EAC5E,CAAC,QAAQ,qBAAqB,CAC9B;CAGD,MAAM,oBAAoD,aAAa;AAEtE,SAAO,SAAS,eAAe,SAAS;;CAGzC,MAAM,wBAAwB,eAAe,iBAAiB;AAE9D,QAAO,eACC;EAAE;EAAe,kBAAkB;EAAuB,GACjE,CAAC,eAAe,sBAAsB,CACtC;;;;ACpFF,MAAa,mBAAmB,UAC/B,oBAAC,OAAD;CAAK,OAAM;CAA6B,OAAM;CAAM,QAAO;CAAM,SAAQ;CAAY,GAAI;WACxF,qBAAC,KAAD;EAAG,MAAK;EAAO,QAAO;EAAe,eAAc;EAAQ,gBAAe;EAAQ,aAAY;YAA9F,CACC,oBAAC,UAAD;GAAQ,IAAG;GAAK,IAAG;GAAK,GAAE;GAAO,CAAA,EACjC,oBAAC,QAAD,EAAM,GAAE,mBAAoB,CAAA,CACzB;;CACC,CAAA;;;ACKP,MAAM,sBAAsB,YAA6B;CACxD,MAAM,EAAE,SAAS,oBAAoB,KAAM,eAAe,OAAO,qBAAqB,UAAU;CAEhG,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;AAI/C,sBAAqB;EACpB,kBAHuB,gBAAgB,CAAC,WAGJ,oBAAoB;EACxD,aAAa,QAAQ;EACrB,CAAC;AAMF,QAAO;EAAE,gBAJc,qBAAqB,sBAAsB,YAAY,KAAK,CAAC;EAI3D,iBAFD,qBAAqB,sBAAsB,YAAY,MAAM,CAAC;EAE5C;;;;ACF3C,SAAgB,aACf,OACC;CACD,MAAM,EACL,IAAI,UAAU,OACd,mBACA,UACA,YACA,cACA,QACA,iBACA,uBACG;CAEJ,MAAM,EAAE,kBAAkB,YAAY;EAAE;EAAQ;EAAiB,CAAC;CAElE,MAAM,UAAU,cAAc,UAAU,CAAC;CAEzC,MAAM,EAAE,gBAAgB,oBAAoB,mBAAmB;EAC9D;EACA;EACA;EACA;EACA,CAAC;AAEF,QACC,oBAAC,8BAAD;EAA8B,OAAO;YACpC,oBAAC,SAAD;GACC,aAAU;GACV,cAAW;GACX,aAAU;GACV,WAAW,QAAQ,oBAAoB,YAAY,KAAK;GACxD,cAAc;GACd,cAAc;aAEd,oBAAC,OAAD;IACC,cAAW;IACX,aAAU;IACV,aAAU;IACV,WAAW,QACV,qDACA,YAAY,QACZ;IAEA;IACI,CAAA;GACG,CAAA;EACoB,CAAA;;AAIjC,SAAgB,eAAe,OAA6B;CAC3D,MAAM,EAAE,YAAY,MAAM,YAAY;CAEtC,MAAM,EAAE,eAAe,sBAAsB,yBAAyB,UAAU,MAAM,QAAQ;AAE9F,QACC,oBAAC,UAAD;EACC,aAAW,YAAY,QAAQ;EAC/B,cAAW;EACX,aAAU;EACV,MAAK;EACL,WAAW,QACV,4DACA,YAAY,UAAU,UACtB,YAAY,UAAU,WACtB,YAAY,KACZ;EACD,SAAS,YAAY,SAAS,oBAAoB;YAElD,oBAAC,QAAD;GAAM,WAAW,QAAQ,4CAA4C,YAAY,cAAc;aAC7F,QACA,oBAAC,iBAAD,EACC,WAAW,QAAQ,YAAY,UAAU,cAAc,YAAY,YAAY,EAC9E,CAAA;GAEG,CAAA;EACC,CAAA;;AAIX,SAAgB,iBAAiB,OAA6B;CAC7D,MAAM,EAAE,YAAY,SAAS;AAE7B,QACC,qBAACA,UAAD;EAAW,MAAM,MAAM;YAAvB,CACC,qBAACC,aAAD,EAAA,UAAA,CACC,oBAAC,gBAAD;GACC,SAAQ;GACR,YAAY;IACX,GAAG;IACH,eAAe,QACd,MAAM,aAAa,cAAc,cACjC,YAAY,cACZ;IACD;GACD,MAAM,MAAM;GACX,CAAA,EAEF,oBAAC,gBAAD;GACC,SAAQ;GACR,YAAY;IACX,GAAG;IACH,eAAe,QACd,MAAM,aAAa,cAAc,cACjC,YAAY,cACZ;IACD;GACD,MAAM,MAAM;GACX,CAAA,CACY,EAAA,CAAA,EAEf,qBAACC,cAAD,EAAA,UAAA,CACC,oBAAC,gBAAD;GAAgB,SAAQ;GAAmB;GAAY,MAAM,MAAM;GAAQ,CAAA,EAE3E,oBAAC,gBAAD;GAAgB,SAAQ;GAAmB;GAAY,MAAM,MAAM;GAAQ,CAAA,CAC5D,EAAA,CAAA,CACL;;;AAId,SAAgB,iBAA2C,OAA6C;CACvG,MAAM,EAAE,UAAU,WAAW,SAAS;CAEtC,MAAM,eAAe,yBAAyB,UAAU,MAAM,aAAa;CAC3E,MAAM,SAAS,yBAAyB,UAAU,QAAS,MAAM,OAAkB;AAEnF,QACC,oBAAC,MAAD;EACC,aAAU;EACV,cAAW;EACX,aAAU;EACV,WAAW,QACV;wCAEA,UACA;EACD,OACC,EACC,wBAAwB,IAAI,eAAe,IAAI,IAC/C;YAGD,WAAW,SAAS,GACpB,oBAAC,KAAD;GAAK,MAAM;GAAQ,aAAa,OAAO,OAAO,UAAU,SAAS;IAAE;IAAO;IAAO;IAAO,CAAC;GAAI,CAAA,GAC5F;EACE,CAAA;;AAIP,SAAgB,aAAa,OAA2B;CACvD,MAAM,EAAE,UAAU,WAAW,GAAG,gBAAgB;AAEhD,QACC,oBAAC,MAAD;EACC,aAAU;EACV,cAAW;EACX,aAAU;EACV,WAAW,QAAQ,mDAAmD,UAAU;EAChF,GAAI;EAEH;EACG,CAAA;;AAIP,SAAgB,gBACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,OAAO,UAAU,cAAc;AAErD,QACC,oBAAC,SAAD;EACC,aAAU;EACV,cAAW;EACX,aAAU;EACV,WAAW,QAAQ,iBAAiB,UAAU;EAE7C;EACQ,CAAA;;AAIZ,SAAgB,sBACf,OACC;CACD,MAAM,EAAE,UAAU,WAAW,SAAS;CAEtC,MAAM,SAAS,yBAAyB,UAAU,QAAS,MAAM,OAAkB;AAEnF,QACC,oBAAC,MAAD;EACC,aAAU;EACV,cAAW;EACX,aAAU;EACV,WAAW,QACV,iFACA,UACA;YAEA,WAAW,SAAS,GACpB,oBAAC,KAAD;GAAK,MAAM;GAAQ,aAAa,OAAO,OAAO,UAAU,SAAS;IAAE;IAAO;IAAO;IAAO,CAAC;GAAI,CAAA,GAC5F;EACE,CAAA;;AAIP,SAAgB,kBAAkB,OAA+B;CAChE,MAAM,EAAE,YAAY,iBAAiB;CAErC,MAAM,EACL,SAAS,EAAE,aACX,iBACG,yBAAyB,UAAU,MAAM;AAE7C,QACC,oBAAC,MAAD;EACC,aAAU;EACV,cAAW;EACX,aAAU;EACV,WAAW,QAAQ,eAAe,YAAY,KAAK;YAEnD,oBAAC,UAAD;GACC,MAAK;GACL,eAAe,UAAU,aAAa;GACtC,WAAW,QACV,0BACA,YAAY,MACZ,iBAAiB,gBAAgB,CAAC,0BAA0B,YAAY,SAAS,CACjF;GACA,CAAA;EACE,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["Show.Root","Show.Content","Show.Fallback"],"sources":["../../../../src/components/ui/carousel/carousel-store-context.ts","../../../../src/components/ui/carousel/icons.tsx","../../../../src/components/ui/carousel/useCarouselOptions.ts","../../../../src/components/ui/carousel/carousel.tsx","../../../../src/components/ui/carousel/carousel-parts.ts"],"sourcesContent":["import { createStore } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useStore } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { PrettyOmit } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport type { CarouselRootProps, CarouselStore, ImagesType } from \"./types\";\n\nconst [CarouselStoreContextProvider, useCarouselStoreContext] = createReactStoreContext<CarouselStore>({\n\thookName: \"useCarouselStore\",\n\tname: \"CarouselStoreContext\",\n\tproviderName: \"CarouselRoot\",\n});\n\n// CarouselStore Creation\nconst createCarouselStore = <TImages extends ImagesType>(\n\tstoreValues: PrettyOmit<CarouselRootProps<TImages>, \"children\">\n) => {\n\tconst { images, onSlideBtnClick } = storeValues;\n\n\tconst carouselStore = createStore<CarouselStore<TImages>>((set, get) => ({\n\t\tcurrentSlide: 0,\n\t\timages,\n\t\tmaxSlide: images.length - 1,\n\n\t\t/* eslint-disable perfectionist/sort-objects -- actions should be last */\n\t\tactions: {\n\t\t\t/* eslint-enable perfectionist/sort-objects -- actions should be last */\n\n\t\t\tgoToNextSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === maxSlide) {\n\t\t\t\t\tgoToSlide(0);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide + 1);\n\t\t\t},\n\n\t\t\tgoToPreviousSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === 0) {\n\t\t\t\t\tgoToSlide(maxSlide);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide - 1);\n\t\t\t},\n\n\t\t\tgoToSlide: (newValue) => {\n\t\t\t\tonSlideBtnClick?.();\n\n\t\t\t\tset({ currentSlide: newValue });\n\t\t\t},\n\t\t},\n\t}));\n\n\treturn carouselStore;\n};\n\nconst useCarousel = <TImages extends ImagesType>(props: Omit<CarouselRootProps<TImages>, \"children\">) => {\n\tconst { images, onSlideBtnClick } = props;\n\n\tconst savedOnSlideBtnClick = useCallbackRef(onSlideBtnClick);\n\n\tconst carouselStore = useMemo(\n\t\t() => createCarouselStore({ images, onSlideBtnClick: savedOnSlideBtnClick }),\n\t\t[images, savedOnSlideBtnClick]\n\t);\n\n\t// eslint-disable-next-line react/component-hook-factories -- Ignore\n\tconst useCarouselStore: typeof useCarouselStoreContext = (selector) => {\n\t\t// eslint-disable-next-line react-hooks/hooks -- Ignore\n\t\treturn useStore(carouselStore, selector);\n\t};\n\n\tconst savedUseCarouselStore = useCallbackRef(useCarouselStore);\n\n\treturn useMemo(\n\t\t() => ({ carouselStore, useCarouselStore: savedUseCarouselStore }),\n\t\t[carouselStore, savedUseCarouselStore]\n\t);\n};\n\nexport { CarouselStoreContextProvider, useCarousel, useCarouselStoreContext };\n","export const ChevronLeftIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<circle cx=\"12\" cy=\"12\" r=\"10\" />\n\t\t\t<path d=\"m14 16l-4-4l4-4\" />\n\t\t</g>\n\t</svg>\n);\n","import { useAnimationInterval, useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useState } from \"react\";\nimport type { CarouselStore } from \"./types\";\n\ntype CarouselOptions = {\n\tactions: CarouselStore[\"actions\"];\n\tautoSlideInterval?: number;\n\thasAutoSlide?: boolean;\n\tshouldPauseOnHover?: boolean;\n};\n\nconst useCarouselOptions = (options: CarouselOptions) => {\n\tconst { actions, autoSlideInterval = 5000, hasAutoSlide = false, shouldPauseOnHover = false } = options;\n\n\tconst [isPaused, setIsPaused] = useState(false);\n\n\tconst shouldAutoSlide = hasAutoSlide && !isPaused;\n\n\tuseAnimationInterval({\n\t\tintervalDuration: shouldAutoSlide ? autoSlideInterval : null,\n\t\tonAnimation: actions.goToNextSlide,\n\t});\n\n\tconst pauseAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(true));\n\n\tconst resumeAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(false));\n\n\treturn { pauseAutoSlide, resumeAutoSlide };\n};\n\nexport { useCarouselOptions };\n","\"use client\";\n\nimport { dataAttr } from \"@zayne-labs/toolkit-core\";\nimport type { CssWithCustomProperties, PolymorphicPropsStrict } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { For } from \"@/components/common/for\";\nimport { Show } from \"@/components/common/show\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport {\n\tCarouselStoreContextProvider,\n\tuseCarousel,\n\tuseCarouselStoreContext,\n} from \"./carousel-store-context\";\nimport { ChevronLeftIcon } from \"./icons\";\nimport type {\n\tCarouselButtonsProps,\n\tCarouselControlProps,\n\tCarouselIndicatorProps,\n\tCarouselItemProps,\n\tCarouselRootProps,\n\tCarouselWrapperProps,\n\tImagesType,\n\tOtherCarouselProps,\n} from \"./types\";\nimport { useCarouselOptions } from \"./useCarouselOptions\";\n\n// TODO - Add dragging and swiping support\nexport function CarouselRoot<TImages extends ImagesType, TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, CarouselRootProps<TImages>>\n) {\n\tconst {\n\t\tas: Element = \"div\",\n\t\tautoSlideInterval,\n\t\tchildren,\n\t\tclassNames,\n\t\thasAutoSlide,\n\t\timages,\n\t\tonSlideBtnClick,\n\t\tshouldPauseOnHover,\n\t} = props;\n\n\tconst { carouselStore } = useCarousel({ images, onSlideBtnClick });\n\n\tconst actions = carouselStore.getState().actions;\n\n\tconst { pauseAutoSlide, resumeAutoSlide } = useCarouselOptions({\n\t\tactions,\n\t\tautoSlideInterval,\n\t\thasAutoSlide,\n\t\tshouldPauseOnHover,\n\t});\n\n\treturn (\n\t\t<CarouselStoreContextProvider store={carouselStore}>\n\t\t\t<Element\n\t\t\t\tdata-slot=\"carousel-root\"\n\t\t\t\tdata-scope=\"carousel\"\n\t\t\t\tdata-part=\"root\"\n\t\t\t\tclassName={cnMerge(\"isolate\", classNames?.base)}\n\t\t\t\tonMouseEnter={pauseAutoSlide}\n\t\t\t\tonMouseLeave={resumeAutoSlide}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tdata-scope=\"carousel\"\n\t\t\t\t\tdata-part=\"content\"\n\t\t\t\t\tdata-slot=\"carousel-content\"\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"relative scrollbar-hidden size-full overflow-x-scroll\",\n\t\t\t\t\t\tclassNames?.content\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</Element>\n\t\t</CarouselStoreContextProvider>\n\t);\n}\n\nexport function CarouselButton(props: CarouselButtonsProps) {\n\tconst { classNames, icon, variant } = props;\n\n\tconst { goToNextSlide, goToPreviousSlide } = useCarouselStoreContext((state) => state.actions);\n\n\treturn (\n\t\t<button\n\t\t\tdata-slot={`carousel-${variant}-button`}\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"button\"\n\t\t\ttype=\"button\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"absolute inset-y-0 z-20 flex items-center justify-center\",\n\t\t\t\tvariant === \"prev\" && \"left-0\",\n\t\t\t\tvariant === \"next\" && \"right-0\",\n\t\t\t\tclassNames?.base\n\t\t\t)}\n\t\t\tonClick={variant === \"prev\" ? goToPreviousSlide : goToNextSlide}\n\t\t>\n\t\t\t<span className={cnMerge(\"transition-transform active:scale-[1.06]\", classNames?.iconContainer)}>\n\t\t\t\t{icon ?? (\n\t\t\t\t\t<ChevronLeftIcon\n\t\t\t\t\t\tclassName={cnMerge(variant === \"next\" && \"rotate-180\", classNames?.defaultIcon)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t</button>\n\t);\n}\n\nexport function CarouselControls(props: CarouselControlProps) {\n\tconst { classNames, icon } = props;\n\n\treturn (\n\t\t<Show.Root when={icon?.iconType}>\n\t\t\t<Show.Content>\n\t\t\t\t<CarouselButton\n\t\t\t\t\tvariant=\"prev\"\n\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t...classNames,\n\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\ticon?.iconType === \"nextIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t),\n\t\t\t\t\t}}\n\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t/>\n\n\t\t\t\t<CarouselButton\n\t\t\t\t\tvariant=\"next\"\n\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t...classNames,\n\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\ticon?.iconType === \"prevIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t),\n\t\t\t\t\t}}\n\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t/>\n\t\t\t</Show.Content>\n\n\t\t\t<Show.Fallback>\n\t\t\t\t<CarouselButton variant=\"prev\" classNames={classNames} icon={icon?.prev} />\n\n\t\t\t\t<CarouselButton variant=\"next\" classNames={classNames} icon={icon?.next} />\n\t\t\t</Show.Fallback>\n\t\t</Show.Root>\n\t);\n}\n\nexport function CarouselItemList<TArray extends unknown[]>(props: CarouselWrapperProps<TArray[number]>) {\n\tconst { children, className, each } = props;\n\n\tconst currentSlide = useCarouselStoreContext((state) => state.currentSlide);\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArray));\n\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"carousel-item-list\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item-list\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t`flex size-full transform-[translate3d(var(--translate-distance),0,0)] snap-center\n\t\t\t\ttransition-transform duration-800`,\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={\n\t\t\t\t{\n\t\t\t\t\t\"--translate-distance\": `-${currentSlide * 100}%`,\n\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</ul>\n\t);\n}\n\nexport function CarouselItem(props: CarouselItemProps) {\n\tconst { children, className, currentIndex, ...restOfProps } = props;\n\n\tconst currentSlide = useCarouselStoreContext((state) => state.currentSlide);\n\n\tconst isActive = currentSlide === currentIndex;\n\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"carousel-item\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item\"\n\t\t\tdata-active={dataAttr(isActive)}\n\t\t\tclassName={cnMerge(\"relative size-full shrink-0 snap-center overflow-hidden\", className)}\n\t\t\t{...restOfProps}\n\t\t>\n\t\t\t{children}\n\t\t</li>\n\t);\n}\n\nexport function CarouselCaption<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, OtherCarouselProps>\n) {\n\tconst { as: Element = \"div\", children, className } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-slot=\"carousel-caption\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"caption\"\n\t\t\tclassName={cnMerge(\"absolute z-10\", className)}\n\t\t>\n\t\t\t{children}\n\t\t</Element>\n\t);\n}\n\nexport function CarouselIndicatorList<TArray extends unknown[]>(\n\tprops: CarouselWrapperProps<TArray[number]>\n) {\n\tconst { children, className, each } = props;\n\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArray));\n\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"carousel-indicator-list\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator-list\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"absolute bottom-6 z-2 flex w-full items-center justify-center gap-4\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</div>\n\t);\n}\n\nexport function CarouselIndicator(props: CarouselIndicatorProps) {\n\tconst { className, classNames, currentIndex, ...restOfProps } = props;\n\n\tconst {\n\t\tactions: { goToSlide },\n\t\tcurrentSlide,\n\t} = useCarouselStoreContext((state) => state);\n\n\tconst isActive = currentSlide === currentIndex;\n\n\treturn (\n\t\t<button\n\t\t\tdata-slot=\"carousel-indicator\"\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator\"\n\t\t\tdata-active={dataAttr(isActive)}\n\t\t\ttype=\"button\"\n\t\t\tonClick={() => goToSlide(currentIndex)}\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"size-1.5 rounded-[50%]\",\n\t\t\t\tclassName,\n\t\t\t\tclassNames?.base,\n\t\t\t\tisActive && [\"w-9 rounded-[6px]\", classNames?.isActive]\n\t\t\t)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n","export {\n\tCarouselButton as Button,\n\tCarouselCaption as Caption,\n\tCarouselControls as Controls,\n\tCarouselIndicator as Indicator,\n\tCarouselIndicatorList as IndicatorList,\n\tCarouselItem as Item,\n\tCarouselItemList as ItemList,\n\tCarouselRoot as Root,\n} from \"./carousel\";\n"],"mappings":"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"}
|
|
@@ -57,7 +57,7 @@ declare const DragScrollStoreContextProvider: (props: {
|
|
|
57
57
|
//#endregion
|
|
58
58
|
//#region src/components/ui/drag-scroll/drag-scroll-store.d.ts
|
|
59
59
|
type RequiredUseDragScrollProps = { [Key in keyof Required<UseDragScrollProps>]: UseDragScrollProps[Key] | undefined };
|
|
60
|
-
type InitStoreValues = Pick<RequiredUseDragScrollProps, "orientation" | "scrollAmount"
|
|
60
|
+
type InitStoreValues = Pick<RequiredUseDragScrollProps, "orientation" | "scrollAmount">;
|
|
61
61
|
declare const createDragScrollStore: (initStoreValues: InitStoreValues) => {
|
|
62
62
|
getInitialState: () => DragScrollStore;
|
|
63
63
|
getListeners: () => Set<(state: DragScrollStore, prevState: DragScrollStore) => void>;
|
|
@@ -156,14 +156,6 @@ type UseDragScrollProps = {
|
|
|
156
156
|
* @default "item"
|
|
157
157
|
*/
|
|
158
158
|
scrollAmount?: "item" | number;
|
|
159
|
-
/**
|
|
160
|
-
* Device usage constraints for drag behavior.
|
|
161
|
-
* - `allScreens`: Drag works on all devices
|
|
162
|
-
* - `desktopOnly`: Drag works only on desktop (width >= 768px)
|
|
163
|
-
* - `mobileAndTabletOnly`: Drag works only on mobile/tablet (width < 768px)
|
|
164
|
-
* @default "allScreens"
|
|
165
|
-
*/
|
|
166
|
-
usage?: "allScreens" | "desktopOnly" | "mobileAndTabletOnly";
|
|
167
159
|
};
|
|
168
160
|
type UseDragScrollResult<TContainerElement extends HTMLElement> = Pick<UseDragScrollProps, "disableInternalStateSubscription"> & {
|
|
169
161
|
listRef: React.RefObject<TContainerElement | null>;
|
|
@@ -32,7 +32,7 @@ const handleScrollSnap = (dragContainer) => {
|
|
|
32
32
|
//#endregion
|
|
33
33
|
//#region src/components/ui/drag-scroll/drag-scroll-store.ts
|
|
34
34
|
const createDragScrollStore = (initStoreValues) => {
|
|
35
|
-
const { orientation = "horizontal", scrollAmount = "item"
|
|
35
|
+
const { orientation = "horizontal", scrollAmount = "item" } = initStoreValues;
|
|
36
36
|
const listRef = { current: null };
|
|
37
37
|
const positionRef = { current: {
|
|
38
38
|
left: 0,
|
|
@@ -84,8 +84,6 @@ const createDragScrollStore = (initStoreValues) => {
|
|
|
84
84
|
});
|
|
85
85
|
},
|
|
86
86
|
handleMouseDown: (event) => {
|
|
87
|
-
if (usage === "mobileAndTabletOnly" && window.innerWidth >= 768) return;
|
|
88
|
-
if (usage === "desktopOnly" && window.innerWidth < 768) return;
|
|
89
87
|
if (!listRef.current) return;
|
|
90
88
|
abortControllerRef.current = {
|
|
91
89
|
mouseLeave: new AbortController(),
|
|
@@ -181,19 +179,14 @@ const getDragScrollScopeAttrs = (part) => {
|
|
|
181
179
|
};
|
|
182
180
|
};
|
|
183
181
|
const useDragScroll = (props) => {
|
|
184
|
-
const { disableInternalStateSubscription = false, orientation = "horizontal", scrollAmount = "item"
|
|
182
|
+
const { disableInternalStateSubscription = false, orientation = "horizontal", scrollAmount = "item" } = props ?? {};
|
|
185
183
|
const listRef = useRef(null);
|
|
186
184
|
const storeApi = useMemo(() => {
|
|
187
185
|
return createDragScrollStore({
|
|
188
186
|
orientation,
|
|
189
|
-
scrollAmount
|
|
190
|
-
usage
|
|
187
|
+
scrollAmount
|
|
191
188
|
});
|
|
192
|
-
}, [
|
|
193
|
-
orientation,
|
|
194
|
-
scrollAmount,
|
|
195
|
-
usage
|
|
196
|
-
]);
|
|
189
|
+
}, [orientation, scrollAmount]);
|
|
197
190
|
const actions = storeApi.getState().actions;
|
|
198
191
|
const useDragScrollStore = (selector) => {
|
|
199
192
|
return useStore(storeApi, selector);
|
|
@@ -227,15 +220,14 @@ const useDragScroll = (props) => {
|
|
|
227
220
|
...innerProps,
|
|
228
221
|
...getDragScrollScopeAttrs("list"),
|
|
229
222
|
...!disableInternalStateSubscription && { "data-dragging": dataAttr(isDragging) },
|
|
230
|
-
className: cnMerge(`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-x-scroll overflow-y-hidden`, orientation === "horizontal" && "flex-row", orientation === "vertical" && "flex-col",
|
|
223
|
+
className: cnMerge(`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-x-scroll overflow-y-hidden`, orientation === "horizontal" && "flex-row", orientation === "vertical" && "flex-col", innerProps?.className),
|
|
231
224
|
ref: composeRefs(refCallback, innerProps?.ref)
|
|
232
225
|
};
|
|
233
226
|
}, [
|
|
234
227
|
disableInternalStateSubscription,
|
|
235
228
|
isDragging,
|
|
236
229
|
orientation,
|
|
237
|
-
refCallback
|
|
238
|
-
usage
|
|
230
|
+
refCallback
|
|
239
231
|
]);
|
|
240
232
|
const getItemProps = useCallbackRef((innerProps) => {
|
|
241
233
|
return {
|
|
@@ -249,8 +241,6 @@ const useDragScroll = (props) => {
|
|
|
249
241
|
return {
|
|
250
242
|
...innerProps,
|
|
251
243
|
...getDragScrollScopeAttrs("prev-button"),
|
|
252
|
-
"aria-disabled": dataAttr(isDisabled),
|
|
253
|
-
"aria-label": innerProps?.["aria-label"] ?? "Scroll back",
|
|
254
244
|
"data-disabled": dataAttr(isDisabled),
|
|
255
245
|
disabled: isDisabled,
|
|
256
246
|
onClick: composeTwoEventHandlers(actions.goToPrev, innerProps?.onClick),
|
|
@@ -262,7 +252,6 @@ const useDragScroll = (props) => {
|
|
|
262
252
|
return {
|
|
263
253
|
...innerProps,
|
|
264
254
|
...getDragScrollScopeAttrs("next-button"),
|
|
265
|
-
"aria-label": innerProps?.["aria-label"] ?? "Scroll forward",
|
|
266
255
|
"data-disabled": dataAttr(isDisabled),
|
|
267
256
|
disabled: isDisabled,
|
|
268
257
|
onClick: composeTwoEventHandlers(actions.goToNext, innerProps?.onClick),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["Slot.Root"],"sources":["../../../../src/components/ui/drag-scroll/utils.ts","../../../../src/components/ui/drag-scroll/drag-scroll-store.ts","../../../../src/components/ui/drag-scroll/use-drag-scroll.ts","../../../../src/components/ui/drag-scroll/drag-scroll-context.ts","../../../../src/components/ui/drag-scroll/drag-scroll.tsx","../../../../src/components/ui/drag-scroll/drag-scroll-parts.ts"],"sourcesContent":["import { checkIsDeviceMobile } from \"@zayne-labs/toolkit-core\";\n\n/* eslint-disable no-param-reassign -- Mutation is needed here since it's an element */\nexport const updateCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"grabbing\";\n\telement.style.userSelect = \"none\";\n};\n\nexport const onScrollSnap = <TElement extends HTMLElement>(\n\taction: \"remove\" | \"reset\",\n\telement: TElement\n) => {\n\tif (action === \"remove\") {\n\t\telement.style.scrollSnapType = \"none\";\n\t\treturn;\n\t}\n\n\telement.style.scrollSnapType = \"\";\n};\n\nexport const resetCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"\";\n\telement.style.userSelect = \"\";\n};\n/* eslint-enable no-param-reassign -- Mutation is needed here since it's an element */\n\nexport const handleScrollSnap = (dragContainer: HTMLElement) => {\n\tconst isMobile = checkIsDeviceMobile();\n\n\tif (!isMobile) {\n\t\tonScrollSnap(\"remove\", dragContainer);\n\t} else {\n\t\tonScrollSnap(\"reset\", dragContainer);\n\t}\n};\n","import { createStore, on, throttleByFrame } from \"@zayne-labs/toolkit-core\";\nimport { isNumber } from \"@zayne-labs/toolkit-type-helpers\";\nimport type { DragScrollStore, UseDragScrollProps } from \"./types\";\nimport { handleScrollSnap, resetCursor, updateCursor } from \"./utils\";\n\ntype RequiredUseDragScrollProps = {\n\t[Key in keyof Required<UseDragScrollProps>]: UseDragScrollProps[Key] | undefined;\n};\n\ntype InitStoreValues = Pick<RequiredUseDragScrollProps, \"orientation\" | \"scrollAmount\" | \"usage\">;\n\nexport const createDragScrollStore = (initStoreValues: InitStoreValues) => {\n\tconst { orientation = \"horizontal\", scrollAmount = \"item\", usage = \"allScreens\" } = initStoreValues;\n\n\tconst listRef: React.RefObject<HTMLElement | null> = {\n\t\tcurrent: null,\n\t};\n\n\tconst positionRef = {\n\t\tcurrent: {\n\t\t\tleft: 0,\n\t\t\ttop: 0,\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t},\n\t};\n\n\tconst abortControllerRef = {\n\t\tcurrent: {\n\t\t\tmouseLeave: new AbortController(),\n\t\t\tmouseMove: new AbortController(),\n\t\t\tmouseUp: new AbortController(),\n\t\t},\n\t};\n\n\t// == Calculate scroll amount based on orientation and settings\n\tconst getScrollAmount = (container: HTMLElement): number => {\n\t\tif (isNumber(scrollAmount)) {\n\t\t\treturn scrollAmount;\n\t\t}\n\n\t\tconst firstChild = container.children[0] as HTMLElement | undefined;\n\n\t\tif (!firstChild) {\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn orientation === \"vertical\" || orientation === \"both\" ?\n\t\t\t\tfirstChild.offsetHeight\n\t\t\t:\tfirstChild.offsetWidth;\n\t};\n\n\tconst store = createStore<DragScrollStore>((set, get) => ({\n\t\tcanGoToNext: true,\n\t\tcanGoToPrev: false,\n\t\tisDragging: false,\n\n\t\t// eslint-disable-next-line perfectionist/sort-objects -- actions should be last\n\t\tactions: {\n\t\t\tcleanupDragListeners: () => {\n\t\t\t\tabortControllerRef.current.mouseMove.abort();\n\t\t\t\tabortControllerRef.current.mouseUp.abort();\n\t\t\t\tabortControllerRef.current.mouseLeave.abort();\n\t\t\t},\n\n\t\t\tgoToNext: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { canGoToNext } = get();\n\t\t\t\tif (!canGoToNext) return;\n\n\t\t\t\tconst amount = getScrollAmount(listRef.current);\n\n\t\t\t\tlistRef.current.scrollBy({\n\t\t\t\t\tbehavior: \"smooth\",\n\t\t\t\t\tleft: orientation === \"vertical\" ? 0 : amount,\n\t\t\t\t\ttop: orientation === \"vertical\" || orientation === \"both\" ? amount : 0,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\tgoToPrev: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { canGoToPrev } = get();\n\t\t\t\tif (!canGoToPrev) return;\n\n\t\t\t\tconst amount = getScrollAmount(listRef.current);\n\n\t\t\t\tlistRef.current.scrollBy({\n\t\t\t\t\tbehavior: \"smooth\",\n\t\t\t\t\tleft: orientation === \"vertical\" ? 0 : -amount,\n\t\t\t\t\ttop: orientation === \"vertical\" || orientation === \"both\" ? -amount : 0,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\thandleMouseDown: (event) => {\n\t\t\t\tif (usage === \"mobileAndTabletOnly\" && window.innerWidth >= 768) return;\n\t\t\t\tif (usage === \"desktopOnly\" && window.innerWidth < 768) return;\n\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\t// == Create fresh AbortControllers for each drag session (they cannot be reused after abort)\n\t\t\t\tabortControllerRef.current = {\n\t\t\t\t\tmouseLeave: new AbortController(),\n\t\t\t\t\tmouseMove: new AbortController(),\n\t\t\t\t\tmouseUp: new AbortController(),\n\t\t\t\t};\n\n\t\t\t\t// == Update all initial position properties\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tpositionRef.current.x = event.clientX;\n\t\t\t\t\tpositionRef.current.left = listRef.current.scrollLeft;\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\t\t\tpositionRef.current.y = event.clientY;\n\t\t\t\t\tpositionRef.current.top = listRef.current.scrollTop;\n\t\t\t\t}\n\n\t\t\t\tupdateCursor(listRef.current);\n\t\t\t\tset({ isDragging: true });\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\ton(listRef.current, \"mousemove\", actions.handleMouseMove, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseMove.signal,\n\t\t\t\t});\n\t\t\t\ton(listRef.current, \"mouseup\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseUp.signal,\n\t\t\t\t});\n\t\t\t\ton(listRef.current, \"mouseleave\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseLeave.signal,\n\t\t\t\t});\n\t\t\t\t// == Document-level mouseup fallback for when user releases outside the container\n\t\t\t\ton(document, \"mouseup\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tonce: true,\n\t\t\t\t\tsignal: abortControllerRef.current.mouseUp.signal,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\thandleMouseMove: (event) => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tconst dx = event.clientX - positionRef.current.x;\n\t\t\t\t\tlistRef.current.scrollLeft = positionRef.current.left - dx;\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\t\t\tconst dy = event.clientY - positionRef.current.y;\n\t\t\t\t\tlistRef.current.scrollTop = positionRef.current.top - dy;\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleMouseUpOrLeave: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tresetCursor(listRef.current);\n\t\t\t\tset({ isDragging: false });\n\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.cleanupDragListeners();\n\t\t\t},\n\n\t\t\thandleScroll: throttleByFrame(() => {\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.updateScrollState();\n\t\t\t}),\n\n\t\t\tinitializeResizeObserver: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\t// == Use ResizeObserver to detect when container or children resize\n\t\t\t\tconst resizeObserver = new ResizeObserver(() => actions.updateScrollState());\n\n\t\t\t\tresizeObserver.observe(listRef.current);\n\n\t\t\t\t// == Also observe children for size changes\n\t\t\t\tfor (const child of listRef.current.children) {\n\t\t\t\t\tresizeObserver.observe(child);\n\t\t\t\t}\n\n\t\t\t\tconst cleanup = () => {\n\t\t\t\t\tresizeObserver.disconnect();\n\t\t\t\t};\n\n\t\t\t\treturn cleanup;\n\t\t\t},\n\n\t\t\tsetListRef: (element) => {\n\t\t\t\tlistRef.current = element as HTMLElement;\n\n\t\t\t\tif (!element) return;\n\n\t\t\t\thandleScrollSnap(element);\n\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.updateScrollState();\n\t\t\t},\n\n\t\t\tupdateScrollState: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tconst { clientWidth, scrollLeft, scrollWidth } = listRef.current;\n\n\t\t\t\t\tset({\n\t\t\t\t\t\tcanGoToNext: Math.ceil(scrollLeft + clientWidth) < scrollWidth,\n\t\t\t\t\t\tcanGoToPrev: Math.floor(scrollLeft) > 0,\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\") {\n\t\t\t\t\tconst { clientHeight, scrollHeight, scrollTop } = listRef.current;\n\n\t\t\t\t\tset({\n\t\t\t\t\t\tcanGoToNext: Math.ceil(scrollTop + clientHeight) < scrollHeight,\n\t\t\t\t\t\tcanGoToPrev: Math.floor(scrollTop) > 0,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t}));\n\n\treturn store;\n};\n","import { dataAttr, on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useStore } from \"@zayne-labs/toolkit-react\";\nimport { composeRefs, composeTwoEventHandlers } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport type { FromCamelToKebabCase } from \"@/lib/utils/type-helpers\";\nimport { createDragScrollStore } from \"./drag-scroll-store\";\nimport type { DragScrollPropGetters, PartProps, UseDragScrollProps, UseDragScrollResult } from \"./types\";\n\nexport const getDragScrollScopeAttrs = (part: FromCamelToKebabCase<keyof PartProps>) => {\n\treturn {\n\t\t/* eslint-disable perfectionist/sort-objects -- I need this order to be maintained */\n\t\t\"data-slot\": `drag-scroll-${part}`,\n\t\t\"data-scope\": \"drag-scroll\",\n\t\t\"data-part\": part,\n\t\t/* eslint-enable perfectionist/sort-objects -- I need this order to be maintained */\n\t} as const;\n};\n\nexport const useDragScroll = <TContainerElement extends HTMLElement = HTMLElement>(\n\tprops?: UseDragScrollProps\n): UseDragScrollResult<TContainerElement> => {\n\tconst {\n\t\tdisableInternalStateSubscription = false,\n\t\torientation = \"horizontal\",\n\t\tscrollAmount = \"item\",\n\t\tusage = \"allScreens\",\n\t} = props ?? {};\n\n\tconst listRef = useRef<TContainerElement>(null);\n\n\tconst storeApi = useMemo(() => {\n\t\treturn createDragScrollStore({ orientation, scrollAmount, usage });\n\t}, [orientation, scrollAmount, usage]);\n\n\tconst actions = storeApi.getState().actions;\n\n\t/* eslint-disable react-hooks/hooks -- ignore */\n\t// eslint-disable-next-line react-x/component-hook-factories -- Ignore\n\tconst useDragScrollStore: UseDragScrollResult<TContainerElement>[\"useDragScrollStore\"] = (selector) => {\n\t\treturn useStore(storeApi as never, selector);\n\t};\n\n\tconst canGoToPrev = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.canGoToPrev : null\n\t);\n\n\tconst canGoToNext = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.canGoToNext : null\n\t);\n\n\tconst isDragging = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isDragging : null\n\t);\n\t/* eslint-enable react-hooks/hooks -- ignore */\n\n\tconst refCallback: React.RefCallback<TContainerElement> = useCallbackRef((node) => {\n\t\tlistRef.current = node;\n\t\tactions.setListRef(node);\n\n\t\tif (!node) return;\n\n\t\tconst cleanupMouseDown = on(node, \"mousedown\", actions.handleMouseDown);\n\t\tconst cleanupScroll = on(node, \"scroll\", actions.handleScroll, { passive: true });\n\n\t\treturn () => {\n\t\t\tcleanupMouseDown();\n\t\t\tcleanupScroll();\n\t\t};\n\t});\n\n\t// == Update scroll state when children might change (e.g., async loaded content)\n\tuseEffect(() => {\n\t\tconst cleanup = actions.initializeResizeObserver();\n\n\t\treturn cleanup;\n\t}, [actions]);\n\n\tconst getRootProps: DragScrollPropGetters<TContainerElement>[\"getRootProps\"] = useCallbackRef(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"root\"),\n\t\t\t\tclassName: cnMerge(\"relative\", innerProps?.className),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst getListProps: DragScrollPropGetters<TContainerElement>[\"getListProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"list\"),\n\t\t\t\t...(!disableInternalStateSubscription && {\n\t\t\t\t\t\"data-dragging\": dataAttr(isDragging),\n\t\t\t\t}),\n\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-x-scroll overflow-y-hidden`,\n\t\t\t\t\torientation === \"horizontal\" && \"flex-row\",\n\t\t\t\t\torientation === \"vertical\" && \"flex-col\",\n\t\t\t\t\tusage === \"mobileAndTabletOnly\" && \"md:cursor-default md:flex-col\",\n\t\t\t\t\tusage === \"desktopOnly\" && \"max-md:cursor-default max-md:flex-col\",\n\t\t\t\t\tinnerProps?.className\n\t\t\t\t),\n\t\t\t\tref: composeRefs(\n\t\t\t\t\trefCallback,\n\t\t\t\t\t(innerProps as { ref?: React.Ref<TContainerElement> } | undefined)?.ref\n\t\t\t\t),\n\t\t\t} as never;\n\t\t},\n\t\t[disableInternalStateSubscription, isDragging, orientation, refCallback, usage]\n\t);\n\n\tconst getItemProps: DragScrollPropGetters<TContainerElement>[\"getItemProps\"] = useCallbackRef(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"item\"),\n\t\t\t\tclassName: cnMerge(\"snap-center snap-always\", innerProps?.className),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst getPrevButtonProps: DragScrollPropGetters<TContainerElement>[\"getPrevButtonProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps?.disabled ?? !canGoToPrev;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"prev-button\"),\n\t\t\t\t\"aria-disabled\": dataAttr(isDisabled),\n\t\t\t\t\"aria-label\": innerProps?.[\"aria-label\"] ?? \"Scroll back\",\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.goToPrev, innerProps?.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.goToPrev, canGoToPrev]\n\t);\n\n\tconst getNextButtonProps: DragScrollPropGetters<TContainerElement>[\"getNextButtonProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps?.disabled ?? !canGoToNext;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"next-button\"),\n\t\t\t\t\"aria-label\": innerProps?.[\"aria-label\"] ?? \"Scroll forward\",\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.goToNext, innerProps?.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.goToNext, canGoToNext]\n\t);\n\n\tconst propGetters = useMemo<DragScrollPropGetters<TContainerElement>>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tgetItemProps,\n\t\t\t\tgetListProps,\n\t\t\t\tgetNextButtonProps,\n\t\t\t\tgetPrevButtonProps,\n\t\t\t\tgetRootProps,\n\t\t\t}) satisfies DragScrollPropGetters<TContainerElement>,\n\t\t[getPrevButtonProps, getListProps, getItemProps, getNextButtonProps, getRootProps]\n\t);\n\n\tconst stableUseDragScrollStore = useCallbackRef(useDragScrollStore);\n\n\tconst result = useMemo<UseDragScrollResult<TContainerElement>>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tlistRef,\n\t\t\t\tpropGetters,\n\t\t\t\tstoreApi,\n\t\t\t\tuseDragScrollStore: stableUseDragScrollStore,\n\t\t\t}) satisfies UseDragScrollResult<TContainerElement>,\n\t\t[propGetters, disableInternalStateSubscription, storeApi, stableUseDragScrollStore]\n\t);\n\n\treturn result;\n};\n","import { createCustomContext } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { DragScrollStore, UseDragScrollResult } from \"./types\";\n\nconst [DragScrollStoreContextProvider, useDragScrollStoreContext] =\n\tcreateReactStoreContext<DragScrollStore>({\n\t\thookName: \"useDragScrollStoreContext\",\n\t\tname: \"DragScrollStoreContext\",\n\t\tproviderName: \"DragScrollRoot\",\n\t});\n\nexport type DragScrollRootContextType<TElement extends HTMLElement = HTMLElement> = Pick<\n\tUseDragScrollResult<TElement>,\n\t\"disableInternalStateSubscription\" | \"listRef\" | \"propGetters\"\n>;\n\nconst [DragScrollRootContextProvider, useDragScrollRootContext] =\n\tcreateCustomContext<DragScrollRootContextType>({\n\t\thookName: \"useDragScrollRootContext\",\n\t\tname: \"DragScrollRootContext\",\n\t\tproviderName: \"DragScrollRoot\",\n\t});\n\nexport {\n\tDragScrollRootContextProvider,\n\tDragScrollStoreContextProvider,\n\tuseDragScrollRootContext,\n\tuseDragScrollStoreContext,\n};\n","\"use client\";\n\nimport { useCompareSelector } from \"@zayne-labs/toolkit-react\";\nimport type { PolymorphicPropsStrict } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction, type SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { Slot } from \"@/components/common/slot\";\nimport {\n\tDragScrollRootContextProvider,\n\tDragScrollStoreContextProvider,\n\tuseDragScrollRootContext,\n\tuseDragScrollStoreContext,\n\ttype DragScrollRootContextType,\n} from \"./drag-scroll-context\";\nimport type { DragScrollStore, PartInputProps, UseDragScrollProps } from \"./types\";\nimport { useDragScroll } from \"./use-drag-scroll\";\n\n/* eslint-disable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n\nexport type DragScrollRootProps = UseDragScrollProps & {\n\tasChild?: boolean;\n\tchildren: React.ReactNode;\n} & PartInputProps[\"root\"];\n\nexport function DragScrollRoot(props: DragScrollRootProps) {\n\tconst { asChild, children, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, listRef, propGetters, storeApi } = useDragScroll(restOfProps);\n\n\tconst rootContextValue = useMemo<DragScrollRootContextType>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tlistRef,\n\t\t\t\tpropGetters,\n\t\t\t}) satisfies DragScrollRootContextType,\n\t\t[listRef, disableInternalStateSubscription, propGetters]\n\t);\n\n\tconst Component = asChild ? Slot.Root : \"div\";\n\n\treturn (\n\t\t<DragScrollStoreContextProvider store={storeApi}>\n\t\t\t<DragScrollRootContextProvider value={rootContextValue}>\n\t\t\t\t<Component {...propGetters.getRootProps(restOfProps)}>{children}</Component>\n\t\t\t</DragScrollRootContextProvider>\n\t\t</DragScrollStoreContextProvider>\n\t);\n}\n\nexport type DragScrollContextProps<TSlice> = {\n\tchildren: React.ReactNode | ((context: TSlice) => React.ReactNode);\n\tselector?: SelectorFn<DragScrollStore, TSlice>;\n};\n\nexport function DragScrollContext<TSlice = DragScrollStore>(props: DragScrollContextProps<TSlice>) {\n\tconst { children, selector } = props;\n\n\tconst dragScrollCtx = useDragScrollStoreContext(useCompareSelector(selector));\n\n\tconst resolvedChildren = isFunction(children) ? children(dragScrollCtx) : children;\n\n\treturn resolvedChildren;\n}\n\nexport type DragScrollListProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"list\"];\n\nexport function DragScrollList<TElement extends React.ElementType = \"ul\">(\n\tprops: PolymorphicPropsStrict<TElement, DragScrollListProps>\n) {\n\tconst { as: Element = \"ul\", asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn <Component {...propGetters.getListProps(restOfProps)} />;\n}\n\nexport type DragScrollItemProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"item\"];\n\nexport function DragScrollItem<TElement extends React.ElementType = \"li\">(\n\tprops: PolymorphicPropsStrict<TElement, DragScrollItemProps>\n) {\n\tconst { as: Element = \"li\", asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn <Component {...propGetters.getItemProps(restOfProps)} />;\n}\n\nexport type DragScrollPrevProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"prevButton\"];\n\nexport function DragScrollPrev(props: DragScrollPrevProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getPrevButtonProps(restOfProps)} />;\n}\n\nexport type DragScrollNextProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"nextButton\"];\n\nexport function DragScrollNext(props: DragScrollNextProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getNextButtonProps(restOfProps)} />;\n}\n\n/* eslint-enable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n","export {\n\tDragScrollContext as Context,\n\tDragScrollItem as Item,\n\tDragScrollNext as Next,\n\tDragScrollPrev as Prev,\n\tDragScrollRoot as Root,\n\tDragScrollList as List,\n} from \"./drag-scroll\";\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["Slot.Root"],"sources":["../../../../src/components/ui/drag-scroll/utils.ts","../../../../src/components/ui/drag-scroll/drag-scroll-store.ts","../../../../src/components/ui/drag-scroll/use-drag-scroll.ts","../../../../src/components/ui/drag-scroll/drag-scroll-context.ts","../../../../src/components/ui/drag-scroll/drag-scroll.tsx","../../../../src/components/ui/drag-scroll/drag-scroll-parts.ts"],"sourcesContent":["import { checkIsDeviceMobile } from \"@zayne-labs/toolkit-core\";\n\n/* eslint-disable no-param-reassign -- Mutation is needed here since it's an element */\nexport const updateCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"grabbing\";\n\telement.style.userSelect = \"none\";\n};\n\nexport const onScrollSnap = <TElement extends HTMLElement>(\n\taction: \"remove\" | \"reset\",\n\telement: TElement\n) => {\n\tif (action === \"remove\") {\n\t\telement.style.scrollSnapType = \"none\";\n\t\treturn;\n\t}\n\n\telement.style.scrollSnapType = \"\";\n};\n\nexport const resetCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"\";\n\telement.style.userSelect = \"\";\n};\n/* eslint-enable no-param-reassign -- Mutation is needed here since it's an element */\n\nexport const handleScrollSnap = (dragContainer: HTMLElement) => {\n\tconst isMobile = checkIsDeviceMobile();\n\n\tif (!isMobile) {\n\t\tonScrollSnap(\"remove\", dragContainer);\n\t} else {\n\t\tonScrollSnap(\"reset\", dragContainer);\n\t}\n};\n","import { createStore, on, throttleByFrame } from \"@zayne-labs/toolkit-core\";\nimport { isNumber } from \"@zayne-labs/toolkit-type-helpers\";\nimport type { DragScrollStore, UseDragScrollProps } from \"./types\";\nimport { handleScrollSnap, resetCursor, updateCursor } from \"./utils\";\n\ntype RequiredUseDragScrollProps = {\n\t[Key in keyof Required<UseDragScrollProps>]: UseDragScrollProps[Key] | undefined;\n};\n\ntype InitStoreValues = Pick<RequiredUseDragScrollProps, \"orientation\" | \"scrollAmount\">;\n\nexport const createDragScrollStore = (initStoreValues: InitStoreValues) => {\n\tconst { orientation = \"horizontal\", scrollAmount = \"item\" } = initStoreValues;\n\n\tconst listRef: React.RefObject<HTMLElement | null> = {\n\t\tcurrent: null,\n\t};\n\n\tconst positionRef = {\n\t\tcurrent: {\n\t\t\tleft: 0,\n\t\t\ttop: 0,\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t},\n\t};\n\n\tconst abortControllerRef = {\n\t\tcurrent: {\n\t\t\tmouseLeave: new AbortController(),\n\t\t\tmouseMove: new AbortController(),\n\t\t\tmouseUp: new AbortController(),\n\t\t},\n\t};\n\n\t// == Calculate scroll amount based on orientation and settings\n\tconst getScrollAmount = (container: HTMLElement): number => {\n\t\tif (isNumber(scrollAmount)) {\n\t\t\treturn scrollAmount;\n\t\t}\n\n\t\tconst firstChild = container.children[0] as HTMLElement | undefined;\n\n\t\tif (!firstChild) {\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn orientation === \"vertical\" || orientation === \"both\" ?\n\t\t\t\tfirstChild.offsetHeight\n\t\t\t:\tfirstChild.offsetWidth;\n\t};\n\n\tconst store = createStore<DragScrollStore>((set, get) => ({\n\t\tcanGoToNext: true,\n\t\tcanGoToPrev: false,\n\t\tisDragging: false,\n\n\t\t// eslint-disable-next-line perfectionist/sort-objects -- actions should be last\n\t\tactions: {\n\t\t\tcleanupDragListeners: () => {\n\t\t\t\tabortControllerRef.current.mouseMove.abort();\n\t\t\t\tabortControllerRef.current.mouseUp.abort();\n\t\t\t\tabortControllerRef.current.mouseLeave.abort();\n\t\t\t},\n\n\t\t\tgoToNext: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { canGoToNext } = get();\n\t\t\t\tif (!canGoToNext) return;\n\n\t\t\t\tconst amount = getScrollAmount(listRef.current);\n\n\t\t\t\tlistRef.current.scrollBy({\n\t\t\t\t\tbehavior: \"smooth\",\n\t\t\t\t\tleft: orientation === \"vertical\" ? 0 : amount,\n\t\t\t\t\ttop: orientation === \"vertical\" || orientation === \"both\" ? amount : 0,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\tgoToPrev: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { canGoToPrev } = get();\n\t\t\t\tif (!canGoToPrev) return;\n\n\t\t\t\tconst amount = getScrollAmount(listRef.current);\n\n\t\t\t\tlistRef.current.scrollBy({\n\t\t\t\t\tbehavior: \"smooth\",\n\t\t\t\t\tleft: orientation === \"vertical\" ? 0 : -amount,\n\t\t\t\t\ttop: orientation === \"vertical\" || orientation === \"both\" ? -amount : 0,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\thandleMouseDown: (event) => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\t// == Create fresh AbortControllers for each drag session (they cannot be reused after abort)\n\t\t\t\tabortControllerRef.current = {\n\t\t\t\t\tmouseLeave: new AbortController(),\n\t\t\t\t\tmouseMove: new AbortController(),\n\t\t\t\t\tmouseUp: new AbortController(),\n\t\t\t\t};\n\n\t\t\t\t// == Update all initial position properties\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tpositionRef.current.x = event.clientX;\n\t\t\t\t\tpositionRef.current.left = listRef.current.scrollLeft;\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\t\t\tpositionRef.current.y = event.clientY;\n\t\t\t\t\tpositionRef.current.top = listRef.current.scrollTop;\n\t\t\t\t}\n\n\t\t\t\tupdateCursor(listRef.current);\n\t\t\t\tset({ isDragging: true });\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\ton(listRef.current, \"mousemove\", actions.handleMouseMove, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseMove.signal,\n\t\t\t\t});\n\t\t\t\ton(listRef.current, \"mouseup\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseUp.signal,\n\t\t\t\t});\n\t\t\t\ton(listRef.current, \"mouseleave\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tsignal: abortControllerRef.current.mouseLeave.signal,\n\t\t\t\t});\n\t\t\t\t// == Document-level mouseup fallback for when user releases outside the container\n\t\t\t\ton(document, \"mouseup\", actions.handleMouseUpOrLeave, {\n\t\t\t\t\tonce: true,\n\t\t\t\t\tsignal: abortControllerRef.current.mouseUp.signal,\n\t\t\t\t});\n\t\t\t},\n\n\t\t\thandleMouseMove: (event) => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tconst dx = event.clientX - positionRef.current.x;\n\t\t\t\t\tlistRef.current.scrollLeft = positionRef.current.left - dx;\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\t\t\tconst dy = event.clientY - positionRef.current.y;\n\t\t\t\t\tlistRef.current.scrollTop = positionRef.current.top - dy;\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleMouseUpOrLeave: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tresetCursor(listRef.current);\n\t\t\t\tset({ isDragging: false });\n\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.cleanupDragListeners();\n\t\t\t},\n\n\t\t\thandleScroll: throttleByFrame(() => {\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.updateScrollState();\n\t\t\t}),\n\n\t\t\tinitializeResizeObserver: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\t// == Use ResizeObserver to detect when container or children resize\n\t\t\t\tconst resizeObserver = new ResizeObserver(() => actions.updateScrollState());\n\n\t\t\t\tresizeObserver.observe(listRef.current);\n\n\t\t\t\t// == Also observe children for size changes\n\t\t\t\tfor (const child of listRef.current.children) {\n\t\t\t\t\tresizeObserver.observe(child);\n\t\t\t\t}\n\n\t\t\t\tconst cleanup = () => {\n\t\t\t\t\tresizeObserver.disconnect();\n\t\t\t\t};\n\n\t\t\t\treturn cleanup;\n\t\t\t},\n\n\t\t\tsetListRef: (element) => {\n\t\t\t\tlistRef.current = element as HTMLElement;\n\n\t\t\t\tif (!element) return;\n\n\t\t\t\thandleScrollSnap(element);\n\n\t\t\t\tconst { actions } = get();\n\t\t\t\tactions.updateScrollState();\n\t\t\t},\n\n\t\t\tupdateScrollState: () => {\n\t\t\t\tif (!listRef.current) return;\n\n\t\t\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t\t\tconst { clientWidth, scrollLeft, scrollWidth } = listRef.current;\n\n\t\t\t\t\tset({\n\t\t\t\t\t\tcanGoToNext: Math.ceil(scrollLeft + clientWidth) < scrollWidth,\n\t\t\t\t\t\tcanGoToPrev: Math.floor(scrollLeft) > 0,\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\tif (orientation === \"vertical\") {\n\t\t\t\t\tconst { clientHeight, scrollHeight, scrollTop } = listRef.current;\n\n\t\t\t\t\tset({\n\t\t\t\t\t\tcanGoToNext: Math.ceil(scrollTop + clientHeight) < scrollHeight,\n\t\t\t\t\t\tcanGoToPrev: Math.floor(scrollTop) > 0,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t},\n\t\t},\n\t}));\n\n\treturn store;\n};\n","import { dataAttr, on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useStore } from \"@zayne-labs/toolkit-react\";\nimport { composeRefs, composeTwoEventHandlers } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport type { FromCamelToKebabCase } from \"@/lib/utils/type-helpers\";\nimport { createDragScrollStore } from \"./drag-scroll-store\";\nimport type { DragScrollPropGetters, PartProps, UseDragScrollProps, UseDragScrollResult } from \"./types\";\n\nexport const getDragScrollScopeAttrs = (part: FromCamelToKebabCase<keyof PartProps>) => {\n\treturn {\n\t\t/* eslint-disable perfectionist/sort-objects -- I need this order to be maintained */\n\t\t\"data-slot\": `drag-scroll-${part}`,\n\t\t\"data-scope\": \"drag-scroll\",\n\t\t\"data-part\": part,\n\t\t/* eslint-enable perfectionist/sort-objects -- I need this order to be maintained */\n\t} as const;\n};\n\nexport const useDragScroll = <TContainerElement extends HTMLElement = HTMLElement>(\n\tprops?: UseDragScrollProps\n): UseDragScrollResult<TContainerElement> => {\n\tconst {\n\t\tdisableInternalStateSubscription = false,\n\t\torientation = \"horizontal\",\n\t\tscrollAmount = \"item\",\n\t} = props ?? {};\n\n\tconst listRef = useRef<TContainerElement>(null);\n\n\tconst storeApi = useMemo(() => {\n\t\treturn createDragScrollStore({ orientation, scrollAmount });\n\t}, [orientation, scrollAmount]);\n\n\tconst actions = storeApi.getState().actions;\n\n\t/* eslint-disable react-hooks/hooks -- ignore */\n\t// eslint-disable-next-line react/component-hook-factories -- Ignore\n\tconst useDragScrollStore: UseDragScrollResult<TContainerElement>[\"useDragScrollStore\"] = (selector) => {\n\t\treturn useStore(storeApi as never, selector);\n\t};\n\n\tconst canGoToPrev = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.canGoToPrev : null\n\t);\n\n\tconst canGoToNext = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.canGoToNext : null\n\t);\n\n\tconst isDragging = useDragScrollStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isDragging : null\n\t);\n\t/* eslint-enable react-hooks/hooks -- ignore */\n\n\tconst refCallback: React.RefCallback<TContainerElement> = useCallbackRef((node) => {\n\t\tlistRef.current = node;\n\t\tactions.setListRef(node);\n\n\t\tif (!node) return;\n\n\t\tconst cleanupMouseDown = on(node, \"mousedown\", actions.handleMouseDown);\n\t\tconst cleanupScroll = on(node, \"scroll\", actions.handleScroll, { passive: true });\n\n\t\treturn () => {\n\t\t\tcleanupMouseDown();\n\t\t\tcleanupScroll();\n\t\t};\n\t});\n\n\t// == Update scroll state when children might change (e.g., async loaded content)\n\tuseEffect(() => {\n\t\tconst cleanup = actions.initializeResizeObserver();\n\n\t\treturn cleanup;\n\t}, [actions]);\n\n\tconst getRootProps: DragScrollPropGetters<TContainerElement>[\"getRootProps\"] = useCallbackRef(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"root\"),\n\t\t\t\tclassName: cnMerge(\"relative\", innerProps?.className),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst getListProps: DragScrollPropGetters<TContainerElement>[\"getListProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"list\"),\n\t\t\t\t...(!disableInternalStateSubscription && {\n\t\t\t\t\t\"data-dragging\": dataAttr(isDragging),\n\t\t\t\t}),\n\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-x-scroll overflow-y-hidden`,\n\t\t\t\t\torientation === \"horizontal\" && \"flex-row\",\n\t\t\t\t\torientation === \"vertical\" && \"flex-col\",\n\t\t\t\t\tinnerProps?.className\n\t\t\t\t),\n\t\t\t\tref: composeRefs(\n\t\t\t\t\trefCallback,\n\t\t\t\t\t(innerProps as { ref?: React.Ref<TContainerElement> } | undefined)?.ref\n\t\t\t\t),\n\t\t\t} as never;\n\t\t},\n\t\t[disableInternalStateSubscription, isDragging, orientation, refCallback]\n\t);\n\n\tconst getItemProps: DragScrollPropGetters<TContainerElement>[\"getItemProps\"] = useCallbackRef(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"item\"),\n\t\t\t\tclassName: cnMerge(\"snap-center snap-always\", innerProps?.className),\n\t\t\t};\n\t\t}\n\t);\n\n\tconst getPrevButtonProps: DragScrollPropGetters<TContainerElement>[\"getPrevButtonProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps?.disabled ?? !canGoToPrev;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"prev-button\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.goToPrev, innerProps?.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.goToPrev, canGoToPrev]\n\t);\n\n\tconst getNextButtonProps: DragScrollPropGetters<TContainerElement>[\"getNextButtonProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps?.disabled ?? !canGoToNext;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDragScrollScopeAttrs(\"next-button\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.goToNext, innerProps?.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.goToNext, canGoToNext]\n\t);\n\n\tconst propGetters = useMemo<DragScrollPropGetters<TContainerElement>>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tgetItemProps,\n\t\t\t\tgetListProps,\n\t\t\t\tgetNextButtonProps,\n\t\t\t\tgetPrevButtonProps,\n\t\t\t\tgetRootProps,\n\t\t\t}) satisfies DragScrollPropGetters<TContainerElement>,\n\t\t[getPrevButtonProps, getListProps, getItemProps, getNextButtonProps, getRootProps]\n\t);\n\n\tconst stableUseDragScrollStore = useCallbackRef(useDragScrollStore);\n\n\tconst result = useMemo<UseDragScrollResult<TContainerElement>>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tlistRef,\n\t\t\t\tpropGetters,\n\t\t\t\tstoreApi,\n\t\t\t\tuseDragScrollStore: stableUseDragScrollStore,\n\t\t\t}) satisfies UseDragScrollResult<TContainerElement>,\n\t\t[propGetters, disableInternalStateSubscription, storeApi, stableUseDragScrollStore]\n\t);\n\n\treturn result;\n};\n","import { createCustomContext } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { DragScrollStore, UseDragScrollResult } from \"./types\";\n\nconst [DragScrollStoreContextProvider, useDragScrollStoreContext] =\n\tcreateReactStoreContext<DragScrollStore>({\n\t\thookName: \"useDragScrollStoreContext\",\n\t\tname: \"DragScrollStoreContext\",\n\t\tproviderName: \"DragScrollRoot\",\n\t});\n\nexport type DragScrollRootContextType<TElement extends HTMLElement = HTMLElement> = Pick<\n\tUseDragScrollResult<TElement>,\n\t\"disableInternalStateSubscription\" | \"listRef\" | \"propGetters\"\n>;\n\nconst [DragScrollRootContextProvider, useDragScrollRootContext] =\n\tcreateCustomContext<DragScrollRootContextType>({\n\t\thookName: \"useDragScrollRootContext\",\n\t\tname: \"DragScrollRootContext\",\n\t\tproviderName: \"DragScrollRoot\",\n\t});\n\nexport {\n\tDragScrollRootContextProvider,\n\tDragScrollStoreContextProvider,\n\tuseDragScrollRootContext,\n\tuseDragScrollStoreContext,\n};\n","\"use client\";\n\nimport { useCompareSelector } from \"@zayne-labs/toolkit-react\";\nimport type { PolymorphicPropsStrict } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction, type SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { Slot } from \"@/components/common/slot\";\nimport {\n\tDragScrollRootContextProvider,\n\tDragScrollStoreContextProvider,\n\tuseDragScrollRootContext,\n\tuseDragScrollStoreContext,\n\ttype DragScrollRootContextType,\n} from \"./drag-scroll-context\";\nimport type { DragScrollStore, PartInputProps, UseDragScrollProps } from \"./types\";\nimport { useDragScroll } from \"./use-drag-scroll\";\n\n/* eslint-disable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n\nexport type DragScrollRootProps = UseDragScrollProps & {\n\tasChild?: boolean;\n\tchildren: React.ReactNode;\n} & PartInputProps[\"root\"];\n\nexport function DragScrollRoot(props: DragScrollRootProps) {\n\tconst { asChild, children, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, listRef, propGetters, storeApi } = useDragScroll(restOfProps);\n\n\tconst rootContextValue = useMemo<DragScrollRootContextType>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tlistRef,\n\t\t\t\tpropGetters,\n\t\t\t}) satisfies DragScrollRootContextType,\n\t\t[listRef, disableInternalStateSubscription, propGetters]\n\t);\n\n\tconst Component = asChild ? Slot.Root : \"div\";\n\n\treturn (\n\t\t<DragScrollStoreContextProvider store={storeApi}>\n\t\t\t<DragScrollRootContextProvider value={rootContextValue}>\n\t\t\t\t<Component {...propGetters.getRootProps(restOfProps)}>{children}</Component>\n\t\t\t</DragScrollRootContextProvider>\n\t\t</DragScrollStoreContextProvider>\n\t);\n}\n\nexport type DragScrollContextProps<TSlice> = {\n\tchildren: React.ReactNode | ((context: TSlice) => React.ReactNode);\n\tselector?: SelectorFn<DragScrollStore, TSlice>;\n};\n\nexport function DragScrollContext<TSlice = DragScrollStore>(props: DragScrollContextProps<TSlice>) {\n\tconst { children, selector } = props;\n\n\tconst dragScrollCtx = useDragScrollStoreContext(useCompareSelector(selector));\n\n\tconst resolvedChildren = isFunction(children) ? children(dragScrollCtx) : children;\n\n\treturn resolvedChildren;\n}\n\nexport type DragScrollListProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"list\"];\n\nexport function DragScrollList<TElement extends React.ElementType = \"ul\">(\n\tprops: PolymorphicPropsStrict<TElement, DragScrollListProps>\n) {\n\tconst { as: Element = \"ul\", asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn <Component {...propGetters.getListProps(restOfProps)} />;\n}\n\nexport type DragScrollItemProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"item\"];\n\nexport function DragScrollItem<TElement extends React.ElementType = \"li\">(\n\tprops: PolymorphicPropsStrict<TElement, DragScrollItemProps>\n) {\n\tconst { as: Element = \"li\", asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn <Component {...propGetters.getItemProps(restOfProps)} />;\n}\n\nexport type DragScrollPrevProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"prevButton\"];\n\nexport function DragScrollPrev(props: DragScrollPrevProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getPrevButtonProps(restOfProps)} />;\n}\n\nexport type DragScrollNextProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"nextButton\"];\n\nexport function DragScrollNext(props: DragScrollNextProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDragScrollRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getNextButtonProps(restOfProps)} />;\n}\n\n/* eslint-enable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n","export {\n\tDragScrollContext as Context,\n\tDragScrollItem as Item,\n\tDragScrollNext as Next,\n\tDragScrollPrev as Prev,\n\tDragScrollRoot as Root,\n\tDragScrollList as List,\n} from \"./drag-scroll\";\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["generateFileID","generateFileIDPrimitive","generateFileID","Slot.Root","Switch.Root","Switch.Match"],"sources":["../../../../src/components/ui/drop-zone/drop-zone-context.ts","../../../../src/components/ui/drop-zone/icons.tsx","../../../../src/components/ui/drop-zone/utils.ts","../../../../src/components/ui/drop-zone/drop-zone-store.ts","../../../../src/components/ui/drop-zone/use-drop-zone.ts","../../../../src/components/ui/drop-zone/drop-zone.tsx","../../../../src/components/ui/drop-zone/drop-zone-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { DropZoneStore, FileState, UseDropZoneResult } from \"./types\";\n\nconst [DropZoneStoreContextProvider, useDropZoneStoreContext] = createReactStoreContext<DropZoneStore>({\n\thookName: \"useDropZoneStoreContext\",\n\tname: \"DropZoneStoreContext\",\n\tproviderName: \"DropZoneRoot\",\n});\n\nexport type DropZoneRootContextType = Pick<\n\tUseDropZoneResult,\n\t\"disabled\" | \"disableInternalStateSubscription\" | \"inputRef\" | \"propGetters\"\n>;\n\nconst [DropZoneRootContextProvider, useDropZoneRootContext] = createCustomContext<DropZoneRootContextType>(\n\t{\n\t\thookName: \"useDropZoneRootContext\",\n\t\tname: \"DropZoneRootContext\",\n\t\tproviderName: \"DropZoneRoot\",\n\t}\n);\n\nexport type FileItemContextType = {\n\tfileState: FileState;\n};\n\nconst [FileItemContextProvider, useFileItemContext] = createCustomContext({\n\tdefaultValue: null as unknown as FileItemContextType,\n\thookName: \"useFileItemContext\",\n\tname: \"FileItemContext\",\n\tproviderName: \"FileItem\",\n\tstrict: false,\n});\n\nexport {\n\tDropZoneRootContextProvider,\n\tDropZoneStoreContextProvider,\n\tFileItemContextProvider,\n\tuseDropZoneRootContext,\n\tuseDropZoneStoreContext,\n\tuseFileItemContext,\n};\n","export const FileVideoIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4m-10 3l5 3l-5 3z\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileAudioIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M17.5 22h.5a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v3\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M2 19a2 2 0 1 1 4 0v1a2 2 0 1 1-4 0v-4a6 6 0 0 1 12 0v4a2 2 0 1 1-4 0v-1a2 2 0 1 1 4 0\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileTextIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M10 9H8m8 4H8m8 4H8\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileCodeIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M10 12.5L8 15l2 2.5m4-5l2 2.5l-2 2.5M14 2v4a2 2 0 0 0 2 2h4\" />\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileArchiveIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M10 12v-1m0 7v-2m0-9V6m4-4v4a2 2 0 0 0 2 2h4\" />\n\t\t\t<path d=\"M15.5 22H18a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v16a2 2 0 0 0 .274 1.01\" />\n\t\t\t<circle cx=\"10\" cy=\"20\" r=\"2\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileCogIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M3.2 12.9l-.9-.4m.9 2.6l-.9.4\" />\n\t\t\t<path d=\"M4.677 21.5a2 2 0 0 0 1.313.5H18a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v2.5m.9 4.7l-.4-.9m.4 6.5l-.4.9m3-7.4l-.4.9m.4 6.5l-.4-.9m2.6-4.3l-.9.4m.9 2.6l-.9-.4\" />\n\t\t\t<circle cx=\"6\" cy=\"14\" r=\"3\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4\" />\n\t\t</g>\n\t</svg>\n);\n","import {\n\tcreateFileURL,\n\tgenerateFileID as generateFileIDPrimitive,\n\ttype FileOrFileMeta,\n\ttype FileValidationErrorContextEach,\n} from \"@zayne-labs/toolkit-core\";\nimport { isFile, isObject, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport type { FileState, FileStateOrIDProp, PartProps } from \"./types\";\n\nexport const generateFileID = generateFileIDPrimitive;\n\nexport const createObjectURL = (\n\tfile: FileOrFileMeta,\n\tdisallowPreviewForNonImageFiles: boolean | undefined\n) => {\n\tif (disallowPreviewForNonImageFiles && !file.type?.startsWith(\"image/\")) return;\n\n\treturn createFileURL(file);\n};\n\nexport const clearObjectURL = (\n\tfileState: FileState | undefined,\n\tdisallowPreviewForNonImageFiles: boolean | undefined\n) => {\n\tif (!isFile(fileState?.file)) return;\n\n\tif (disallowPreviewForNonImageFiles && !fileState.file.type.startsWith(\"image/\")) return;\n\n\tif (!fileState.preview) return;\n\n\tURL.revokeObjectURL(fileState.preview);\n};\n\nexport const isMatchingFile = (\n\toptions: FileStateOrIDProp & {\n\t\tfileState: FileOrFileMeta | FileState;\n\t}\n) => {\n\tconst { fileState, fileStateOrID } = options;\n\n\tconst fileID = isFile(fileState) ? generateFileID(fileState) : fileState.id;\n\n\tif (isString(fileStateOrID)) {\n\t\treturn fileID === fileStateOrID;\n\t}\n\n\tif (isFile(fileStateOrID)) {\n\t\tconst generatedFileID = generateFileID(fileStateOrID);\n\t\treturn fileID === generatedFileID;\n\t}\n\n\treturn fileID === fileStateOrID.id;\n};\n\ntype FromCamelToKebabCase<TString extends string> =\n\tTString extends `${infer First}${infer Rest}` ?\n\t\tFirst extends Uppercase<First> ?\n\t\t\t`-${Lowercase<First>}${FromCamelToKebabCase<Rest>}`\n\t\t:\t`${First}${FromCamelToKebabCase<Rest>}`\n\t:\t\"\";\n\nexport const getDropZoneScopeAttrs = (part: FromCamelToKebabCase<keyof PartProps>) => {\n\treturn {\n\t\t/* eslint-disable perfectionist/sort-objects -- I need this order to be maintained */\n\t\t\"data-slot\": `dropzone-${part}`,\n\t\t\"data-scope\": \"dropzone\",\n\t\t\"data-part\": part,\n\t\t/* eslint-enable perfectionist/sort-objects -- I need this order to be maintained */\n\t} as const;\n};\n\nconst dropZoneErrorSymbol = Symbol(\"DropZoneError\");\n\nexport class DropZoneError extends Error {\n\treadonly dropZoneErrorSymbol = dropZoneErrorSymbol;\n\tfile?: FileValidationErrorContextEach[\"file\"];\n\toverride name = \"DropZoneError\" as const;\n\n\tconstructor(\n\t\tctx: Pick<FileValidationErrorContextEach, \"message\"> & {\n\t\t\tfile?: FileValidationErrorContextEach[\"file\"];\n\t\t},\n\t\terrorOptions?: ErrorOptions\n\t) {\n\t\tconst { file, message } = ctx;\n\n\t\tsuper(message, errorOptions);\n\n\t\tthis.file = file;\n\t}\n\n\tstatic override isError(error: unknown): error is DropZoneError {\n\t\tif (!isObject<DropZoneError>(error)) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif (error instanceof DropZoneError) {\n\t\t\treturn true;\n\t\t}\n\n\t\tconst actualError = error as DropZoneError;\n\n\t\treturn (\n\t\t\tactualError.dropZoneErrorSymbol === dropZoneErrorSymbol\n\t\t\t// eslint-disable-next-line ts-eslint/no-unnecessary-condition -- Allow\n\t\t\t&& actualError.name === \"DropZoneError\"\n\t\t);\n\t}\n}\n\nexport const getErrorContext = (error: unknown): NonNullable<FileState[\"error\"]> => {\n\tif (DropZoneError.isError(error)) {\n\t\treturn {\n\t\t\tcause: \"custom-error\",\n\t\t\tcode: \"upload-error\",\n\t\t\tfile: error.file ?? ({} as never),\n\t\t\tmessage: error.message,\n\t\t\toriginalError: error.cause ?? error,\n\t\t};\n\t}\n\n\tconst actualError = Error.isError(error) ? error : new Error(\"File upload failed\", { cause: error });\n\n\treturn {\n\t\tcause: \"custom-error\",\n\t\tcode: \"upload-error\",\n\t\tfile: isFile(actualError.cause) ? actualError.cause : ({} as never),\n\t\tmessage: Error.isError(error) ? actualError.message : String(actualError),\n\t\toriginalError: actualError,\n\t};\n};\n","import { createStore, handleFileValidationAsync, toArray } from \"@zayne-labs/toolkit-core\";\nimport type { DropZoneState, DropZoneStore, UseDropZoneProps } from \"./types\";\nimport { clearObjectURL, createObjectURL, generateFileID, getErrorContext, isMatchingFile } from \"./utils\";\n\ntype RequiredUseDropZoneProps = {\n\t[Key in keyof Required<UseDropZoneProps>]: UseDropZoneProps[Key] | undefined;\n};\n\ntype StoreContext = Pick<\n\tRequiredUseDropZoneProps,\n\t| \"allowedFileTypes\"\n\t| \"disablePreviewGenForNonImageFiles\"\n\t| \"initialFiles\"\n\t| \"maxFileCount\"\n\t| \"maxFileSize\"\n\t| \"multiple\"\n\t| \"onFilesChange\"\n\t| \"onUpload\"\n\t| \"onValidationError\"\n\t| \"onValidationSuccess\"\n\t| \"rejectDuplicateFiles\"\n\t| \"validator\"\n>;\n\nexport const createDropZoneStore = (storeContext: StoreContext) => {\n\tconst {\n\t\tallowedFileTypes,\n\t\tdisablePreviewGenForNonImageFiles,\n\t\tinitialFiles,\n\t\tmaxFileCount,\n\t\tmaxFileSize,\n\t\tmultiple,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\tonValidationError,\n\t\tonValidationSuccess,\n\t\trejectDuplicateFiles,\n\t\tvalidator,\n\t} = storeContext;\n\n\tconst inputRef: React.RefObject<HTMLInputElement | null> = { current: null };\n\n\tconst initialFileArray = toArray(initialFiles).filter(Boolean);\n\n\tconst clearInputValue = () => {\n\t\tif (!inputRef.current) return;\n\n\t\tinputRef.current.value = \"\";\n\t};\n\n\tconst initFileStateArray: DropZoneState[\"fileStateArray\"] = initialFileArray.map((fileMeta) => ({\n\t\tfile: fileMeta,\n\t\tid: fileMeta.id,\n\t\tpreview: fileMeta.url,\n\t\tprogress: 0,\n\t\tstatus: \"idle\",\n\t}));\n\n\tconst store = createStore<DropZoneStore>((set, get) => ({\n\t\tdisabled: false,\n\t\terrors: [],\n\t\tfileStateArray: initFileStateArray,\n\t\tisDraggingOver: false,\n\t\tisInvalid: false,\n\n\t\t// eslint-disable-next-line perfectionist/sort-objects -- ignore\n\t\tactions: {\n\t\t\taddFiles: async (files) => {\n\t\t\t\tif (!files || files.length === 0) {\n\t\t\t\t\tconsole.warn(\"No file selected!\");\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst { actions, fileStateArray: existingFileStateArray } = get();\n\n\t\t\t\t// == In single file mode, only use the first file\n\t\t\t\tconst resolvedNewFiles = !multiple ? [files[0]] : files;\n\n\t\t\t\tconst { errors, validFiles } = await handleFileValidationAsync({\n\t\t\t\t\texistingFiles: existingFileStateArray.map((fileWithPreview) => fileWithPreview.file),\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tonErrorEach: onValidationError,\n\t\t\t\t\t\tonSuccessBatch: onValidationSuccess,\n\t\t\t\t\t},\n\t\t\t\t\tnewFiles: resolvedNewFiles,\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tallowedFileTypes,\n\t\t\t\t\t\tmaxFileCount,\n\t\t\t\t\t\tmaxFileSize,\n\t\t\t\t\t\trejectDuplicateFiles,\n\t\t\t\t\t\tvalidator,\n\t\t\t\t\t},\n\t\t\t\t});\n\n\t\t\t\tif (validFiles.length === 0) {\n\t\t\t\t\tset({ errors, isDraggingOver: false });\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst newFileStateArray: DropZoneState[\"fileStateArray\"] = validFiles.map((file) => ({\n\t\t\t\t\tfile,\n\t\t\t\t\tid: generateFileID(file),\n\t\t\t\t\tpreview: createObjectURL(file, disablePreviewGenForNonImageFiles),\n\t\t\t\t\tprogress: 0,\n\t\t\t\t\tstatus: \"idle\",\n\t\t\t\t}));\n\n\t\t\t\tconst resolvedFileStateArray =\n\t\t\t\t\t!multiple ? newFileStateArray : [...existingFileStateArray, ...newFileStateArray];\n\n\t\t\t\tset(\n\t\t\t\t\t{\n\t\t\t\t\t\terrors,\n\t\t\t\t\t\tfileStateArray: resolvedFileStateArray,\n\t\t\t\t\t\tisDraggingOver: false,\n\t\t\t\t\t},\n\t\t\t\t\t{ shouldNotifySync: true }\n\t\t\t\t);\n\n\t\t\t\tawait actions.handleFileUpload({ newFileStateArray });\n\t\t\t},\n\t\t\tclearErrors: () => {\n\t\t\t\tset({ errors: [], isInvalid: false });\n\t\t\t},\n\n\t\t\tclearFiles: () => {\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tactions.clearObjectURLs();\n\n\t\t\t\tset({ errors: [], fileStateArray: [], isInvalid: false });\n\t\t\t},\n\n\t\t\tclearObjectURLs: () => {\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tfor (const fileState of fileStateArray) {\n\t\t\t\t\tclearObjectURL(fileState, disablePreviewGenForNonImageFiles);\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleChange: async (event) => {\n\t\t\t\tconst fileList = event.target.files;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tawait actions.addFiles(fileList);\n\n\t\t\t\tclearInputValue();\n\t\t\t},\n\n\t\t\thandleDragEnter: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tset({ isDraggingOver: true });\n\t\t\t},\n\n\t\t\thandleDragLeave: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tset({ isDraggingOver: false });\n\t\t\t},\n\n\t\t\thandleDragOver: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t},\n\n\t\t\thandleDrop: async (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tconst fileList = event.dataTransfer.files;\n\n\t\t\t\tawait actions.addFiles(fileList);\n\t\t\t},\n\n\t\t\thandleFileUpload: async (context) => {\n\t\t\t\tconst { newFileStateArray } = context;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tif (!onUpload) {\n\t\t\t\t\tfor (const fileState of newFileStateArray) {\n\t\t\t\t\t\tactions.updateFileState({ fileStateOrID: fileState, progress: 100, status: \"success\" });\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\ttry {\n\t\t\t\t\tawait onUpload({\n\t\t\t\t\t\tfileStateArray: newFileStateArray,\n\t\t\t\t\t\tonError: (ctx) => {\n\t\t\t\t\t\t\tconst { error, fileStateOrID } = ctx;\n\n\t\t\t\t\t\t\tconst errorContext = getErrorContext(error);\n\n\t\t\t\t\t\t\tactions.updateFileState({ error: errorContext, fileStateOrID, status: \"error\" });\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonProgress: (ctx) => {\n\t\t\t\t\t\t\tconst { fileStateOrID, progress } = ctx;\n\n\t\t\t\t\t\t\tactions.updateFileState({ fileStateOrID, progress });\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonSuccess: (ctx) => {\n\t\t\t\t\t\t\tconst { fileStateOrID } = ctx;\n\n\t\t\t\t\t\t\tactions.updateFileState({ fileStateOrID, progress: 100, status: \"success\" });\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\n\t\t\t\t\t// == Handle Errors ==\n\t\t\t\t} catch (error) {\n\t\t\t\t\tconst errorContext = getErrorContext(error);\n\n\t\t\t\t\tfor (const fileState of newFileStateArray) {\n\t\t\t\t\t\tactions.updateFileState({\n\t\t\t\t\t\t\terror: errorContext,\n\t\t\t\t\t\t\tfileStateOrID: fileState,\n\t\t\t\t\t\t\tstatus: \"error\",\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleKeyDown: (event) => {\n\t\t\t\tconst isEnterKey = event.key === \"Enter\";\n\t\t\t\tconst isSpaceKey = event.key === \" \";\n\n\t\t\t\tconst isAllowedKey = isEnterKey || isSpaceKey;\n\n\t\t\t\tif (!isAllowedKey) return;\n\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tactions.openFilePicker();\n\t\t\t},\n\n\t\t\thandlePaste: async (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tconst fileList = event.clipboardData.files;\n\n\t\t\t\tawait actions.addFiles(fileList);\n\t\t\t},\n\n\t\t\topenFilePicker: () => {\n\t\t\t\tinputRef.current?.click();\n\t\t\t},\n\n\t\t\tremoveFile: (ctx) => {\n\t\t\t\tconst { fileStateOrID } = ctx;\n\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tconst updatedFileStateArray = fileStateArray.filter((fileState) => {\n\t\t\t\t\tif (!isMatchingFile({ fileState, fileStateOrID })) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\n\t\t\t\t\tclearObjectURL(fileState, disablePreviewGenForNonImageFiles);\n\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\n\t\t\t\tset({ errors: [], fileStateArray: updatedFileStateArray });\n\t\t\t},\n\n\t\t\tsetInputRef: (element) => {\n\t\t\t\tinputRef.current = element;\n\t\t\t},\n\n\t\t\tupdateFileState: (ctx) => {\n\t\t\t\tconst { fileStateOrID, ...updatedFileState } = ctx;\n\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tconst updatedFileStateArray: DropZoneState[\"fileStateArray\"] = fileStateArray.map(\n\t\t\t\t\t(fileState) => {\n\t\t\t\t\t\tif (!isMatchingFile({ fileState, fileStateOrID })) {\n\t\t\t\t\t\t\treturn fileState;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...fileState,\n\t\t\t\t\t\t\t...updatedFileState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tset({ fileStateArray: updatedFileStateArray }, { shouldNotifySync: true });\n\t\t\t},\n\t\t},\n\t}));\n\n\t// == File change subscription\n\tstore.subscribe.withSelector(\n\t\t(state) => state.fileStateArray,\n\t\t(fileStateArray) => {\n\t\t\tonFilesChange?.({ fileStateArray });\n\t\t}\n\t);\n\n\t// == Set `isInvalid` to true if there are errors\n\tstore.subscribe.withSelector(\n\t\t(state) => state.errors,\n\t\t(errors) => {\n\t\t\tif (errors.length === 0) return;\n\n\t\t\tstore.setState({ isInvalid: true });\n\n\t\t\t// == Reset to false after 1.5 seconds\n\t\t\tsetTimeout(() => store.setState({ isInvalid: false }), 1500);\n\t\t}\n\t);\n\n\treturn store;\n};\n","import { dataAttr } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useCompareValue, useStore, useUnmountEffect } from \"@zayne-labs/toolkit-react\";\nimport { composeRefs, composeTwoEventHandlers } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport { createDropZoneStore } from \"./drop-zone-store\";\nimport type { DropZonePropGetters, UseDropZoneProps, UseDropZoneResult } from \"./types\";\nimport { getDropZoneScopeAttrs } from \"./utils\";\n\nexport const useDropZone = (props?: UseDropZoneProps): UseDropZoneResult => {\n\tconst {\n\t\tallowedFileTypes,\n\t\tdisabled = false,\n\t\tdisableFilePickerOpenOnAreaClick = false,\n\t\tdisableInternalStateSubscription = false,\n\t\tdisablePreviewGenForNonImageFiles = true,\n\t\tinitialFiles,\n\t\tmaxFileCount,\n\t\tmaxFileSize,\n\t\tmultiple,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\tonValidationError,\n\t\tonValidationSuccess,\n\t\trejectDuplicateFiles = true,\n\t\tunstyled: globalUnstyled = false,\n\t\tvalidator,\n\t} = props ?? {};\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\tconst stableOnFilesChange = useCallbackRef(onFilesChange);\n\tconst stableOnUpload = useCallbackRef(onUpload);\n\tconst stableOnUploadError = useCallbackRef(onValidationError);\n\tconst stableOnUploadSuccess = useCallbackRef(onValidationSuccess);\n\tconst stableValidator = useCallbackRef(validator);\n\n\tconst shallowComparedInitialFiles = useCompareValue(initialFiles);\n\tconst shallowComparedMaxFileSize = useCompareValue(maxFileSize);\n\tconst shallowComparedAllowedFileTypes = useCompareValue(allowedFileTypes);\n\n\tconst storeApi = useMemo(() => {\n\t\treturn createDropZoneStore({\n\t\t\tallowedFileTypes: shallowComparedAllowedFileTypes,\n\t\t\tdisablePreviewGenForNonImageFiles,\n\t\t\tinitialFiles: shallowComparedInitialFiles,\n\t\t\tmaxFileCount,\n\t\t\tmaxFileSize: shallowComparedMaxFileSize,\n\t\t\tmultiple,\n\t\t\tonFilesChange: stableOnFilesChange,\n\t\t\tonUpload: stableOnUpload,\n\t\t\tonValidationError: stableOnUploadError,\n\t\t\tonValidationSuccess: stableOnUploadSuccess,\n\t\t\trejectDuplicateFiles,\n\t\t\tvalidator: stableValidator,\n\t\t});\n\t}, [\n\t\tshallowComparedAllowedFileTypes,\n\t\tdisablePreviewGenForNonImageFiles,\n\t\tshallowComparedInitialFiles,\n\t\tmaxFileCount,\n\t\tshallowComparedMaxFileSize,\n\t\tmultiple,\n\t\tstableOnFilesChange,\n\t\tstableOnUpload,\n\t\tstableOnUploadError,\n\t\tstableOnUploadSuccess,\n\t\trejectDuplicateFiles,\n\t\tstableValidator,\n\t]);\n\n\tconst actions = storeApi.getState().actions;\n\n\tuseUnmountEffect(() => {\n\t\tactions.clearObjectURLs();\n\t});\n\n\t/* eslint-disable react-hooks/hooks -- ignore */\n\t// eslint-disable-next-line react-x/component-hook-factories -- ignore\n\tconst useDropZoneStore: UseDropZoneResult[\"useDropZoneStore\"] = (selector) => {\n\t\treturn useStore(storeApi as never, selector);\n\t};\n\n\tconst isDraggingOver = useDropZoneStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isDraggingOver : null\n\t);\n\n\tconst isInvalid = useDropZoneStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isInvalid : null\n\t);\n\t/* eslint-enable react-hooks/hooks -- ignore */\n\n\tconst getRootProps: DropZonePropGetters[\"getRootProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"root\"),\n\t\t\t\t\"data-disabled\": dataAttr(disabled),\n\t\t\t};\n\t\t},\n\t\t[disabled]\n\t);\n\n\tconst getContainerProps: DropZonePropGetters[\"getContainerProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\tconst isDisabled = disabled;\n\t\t\tconst onFileDrop = !isDisabled ? actions.handleDrop : undefined;\n\t\t\tconst onFilePaste = !isDisabled ? actions.handlePaste : undefined;\n\t\t\tconst tabIndex = !isDisabled ? 0 : undefined;\n\t\t\tconst onAreaClick =\n\t\t\t\t!isDisabled && !disableFilePickerOpenOnAreaClick ? actions.openFilePicker : undefined;\n\t\t\tconst onKeyDown =\n\t\t\t\t!isDisabled && !disableFilePickerOpenOnAreaClick ? actions.handleKeyDown : undefined;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"container\"),\n\t\t\t\t...(!disableInternalStateSubscription && {\n\t\t\t\t\t\"data-drag-over\": dataAttr(isDraggingOver),\n\t\t\t\t\t\"data-invalid\": dataAttr(isInvalid),\n\t\t\t\t}),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\trole: \"region\",\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t`relative flex flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed p-6 transition-colors duration-250 ease-out outline-none select-none focus-visible:border-zu-ring/50`,\n\t\t\t\t\t\t`data-disabled:pointer-events-none data-drag-over:opacity-60 data-invalid:border-zu-destructive data-invalid:ring-zu-destructive/20`,\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t\tonClick: composeTwoEventHandlers(onAreaClick, innerProps.onClick),\n\t\t\t\tonDragEnter: composeTwoEventHandlers(actions.handleDragEnter, innerProps.onDragEnter),\n\t\t\t\tonDragLeave: composeTwoEventHandlers(actions.handleDragLeave, innerProps.onDragLeave),\n\t\t\t\tonDragOver: composeTwoEventHandlers(actions.handleDragOver, innerProps.onDragOver),\n\t\t\t\tonDrop: composeTwoEventHandlers(onFileDrop, innerProps.onDrop),\n\t\t\t\tonKeyDown: composeTwoEventHandlers(onKeyDown, innerProps.onKeyDown),\n\t\t\t\tonPaste: composeTwoEventHandlers(onFilePaste, innerProps.onPaste),\n\t\t\t\ttabIndex,\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tglobalUnstyled,\n\t\t\tdisabled,\n\t\t\tactions.handleDrop,\n\t\t\tactions.handlePaste,\n\t\t\tactions.openFilePicker,\n\t\t\tactions.handleKeyDown,\n\t\t\tactions.handleDragEnter,\n\t\t\tactions.handleDragLeave,\n\t\t\tactions.handleDragOver,\n\t\t\tdisableFilePickerOpenOnAreaClick,\n\t\t\tdisableInternalStateSubscription,\n\t\t\tisDraggingOver,\n\t\t\tisInvalid,\n\t\t]\n\t);\n\n\tconst refCallback: React.RefCallback<HTMLInputElement> = useCallbackRef((node) => {\n\t\tinputRef.current = node;\n\t\tactions.setInputRef(node);\n\t});\n\n\tconst getInputProps: DropZonePropGetters[\"getInputProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\tconst onFileChange = !isDisabled ? actions.handleChange : undefined;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"input\"),\n\t\t\t\t...(!disableInternalStateSubscription && { \"data-drag-over\": dataAttr(isDraggingOver) }),\n\t\t\t\taccept: allowedFileTypes ? allowedFileTypes.join(\", \") : innerProps.accept,\n\t\t\t\tclassName: cnMerge(\"hidden\", innerProps.className),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tmultiple: multiple ?? innerProps.multiple,\n\t\t\t\tonChange: composeTwoEventHandlers(onFileChange, innerProps.onChange),\n\t\t\t\tref: composeRefs(refCallback, innerProps.ref),\n\t\t\t\ttype: \"file\",\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tactions.handleChange,\n\t\t\tallowedFileTypes,\n\t\t\tdisableInternalStateSubscription,\n\t\t\tdisabled,\n\t\t\tisDraggingOver,\n\t\t\tmultiple,\n\t\t\trefCallback,\n\t\t]\n\t);\n\n\tconst getTriggerProps: DropZonePropGetters[\"getTriggerProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"trigger\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.openFilePicker, innerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.openFilePicker, disabled]\n\t);\n\n\tconst getFileListProps: DropZonePropGetters[\"getFileListProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { orientation = \"vertical\", unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-list\"),\n\t\t\t\t\"data-orientation\": orientation,\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"flex flex-col gap-2\",\n\t\t\t\t\t\torientation === \"horizontal\" && \"flex-row overflow-x-auto p-1.5\",\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemProps: DropZonePropGetters[\"getFileItemProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"relative flex animate-files-in items-center gap-2.5 rounded-md border p-2\",\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemProgressProps: DropZonePropGetters[\"getFileItemProgressProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, variant = \"linear\", ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-progress\"),\n\t\t\t\trole: \"progressbar\",\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"inline-flex\",\n\t\t\t\t\t\tvariant === \"circular\" && \"absolute top-1/2 left-1/2 -translate-1/2\",\n\t\t\t\t\t\tvariant === \"fill\" && `absolute inset-0`,\n\t\t\t\t\t\tvariant === \"linear\"\n\t\t\t\t\t\t\t&& \"relative h-1.5 w-full overflow-hidden rounded-full bg-zu-primary/20\",\n\t\t\t\t\t\trestOfInnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemDeleteProps: DropZonePropGetters[\"getFileItemDeleteProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { fileStateOrID, ...restOfInnerProps } = innerProps;\n\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\tconst onRemoveFile = () => fileStateOrID && actions.removeFile({ fileStateOrID });\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-delete\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(onRemoveFile, restOfInnerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions, disabled]\n\t);\n\n\tconst getFileItemPreviewProps: DropZonePropGetters[\"getFileItemPreviewProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-preview\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t`relative flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-md bg-zu-accent/50 [&>svg]:size-10`,\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemMetadataProps: DropZonePropGetters[\"getFileItemMetadataProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-metadata\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\"flex min-w-0 grow flex-col\", innerProps.className),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemClearProps: DropZonePropGetters[\"getFileItemClearProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-clear\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.clearFiles, innerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.clearFiles, disabled]\n\t);\n\n\tconst propGetters = useMemo<DropZonePropGetters>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tgetContainerProps,\n\t\t\t\tgetFileItemClearProps,\n\t\t\t\tgetFileItemDeleteProps,\n\t\t\t\tgetFileItemMetadataProps,\n\t\t\t\tgetFileItemPreviewProps,\n\t\t\t\tgetFileItemProgressProps,\n\t\t\t\tgetFileItemProps,\n\t\t\t\tgetFileListProps,\n\t\t\t\tgetInputProps,\n\t\t\t\tgetRootProps,\n\t\t\t\tgetTriggerProps,\n\t\t\t}) satisfies DropZonePropGetters,\n\t\t[\n\t\t\tgetContainerProps,\n\t\t\tgetFileItemClearProps,\n\t\t\tgetFileItemDeleteProps,\n\t\t\tgetFileItemMetadataProps,\n\t\t\tgetFileItemPreviewProps,\n\t\t\tgetFileItemProgressProps,\n\t\t\tgetFileItemProps,\n\t\t\tgetFileListProps,\n\t\t\tgetInputProps,\n\t\t\tgetRootProps,\n\t\t\tgetTriggerProps,\n\t\t]\n\t);\n\n\tconst stableUseDropZoneStore = useCallbackRef(useDropZoneStore);\n\n\tconst result = useMemo<UseDropZoneResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisabled,\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tinputRef,\n\t\t\t\tpropGetters,\n\t\t\t\tstoreApi,\n\t\t\t\tuseDropZoneStore: stableUseDropZoneStore,\n\t\t\t}) satisfies UseDropZoneResult,\n\t\t[disabled, disableInternalStateSubscription, propGetters, storeApi, stableUseDropZoneStore]\n\t);\n\n\treturn result;\n};\n","\"use client\";\n\nimport { dataAttr, formatBytes, omitKeys } from \"@zayne-labs/toolkit-core\";\nimport { useCompareSelector } from \"@zayne-labs/toolkit-react\";\nimport type {\n\tCssWithCustomProperties,\n\tInferProps,\n\tPolymorphicPropsStrict,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport {\n\tisBoolean,\n\tisFunction,\n\tisNumber,\n\ttype AnyFunction,\n\ttype SelectorFn,\n\ttype UnionDiscriminator,\n\ttype UnionToIntersection,\n\ttype UnionToTuple,\n} from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { For } from \"@/components/common/for\";\nimport { Presence } from \"@/components/common/presence\";\nimport { Slot } from \"@/components/common/slot\";\nimport { Switch } from \"@/components/common/switch\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport {\n\tDropZoneRootContextProvider,\n\tDropZoneStoreContextProvider,\n\tFileItemContextProvider,\n\tuseDropZoneRootContext,\n\tuseDropZoneStoreContext,\n\tuseFileItemContext,\n\ttype DropZoneRootContextType,\n\ttype FileItemContextType,\n} from \"./drop-zone-context\";\nimport {\n\tFileArchiveIcon,\n\tFileAudioIcon,\n\tFileCodeIcon,\n\tFileCogIcon,\n\tFileIcon,\n\tFileTextIcon,\n\tFileVideoIcon,\n} from \"./icons\";\nimport type { DropZoneStore, PartInputProps, UseDropZoneProps } from \"./types\";\nimport { useDropZone } from \"./use-drop-zone\";\n\n/* eslint-disable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n\nexport type DropZoneRootProps = UseDropZoneProps & {\n\tasChild?: boolean;\n} & PartInputProps[\"root\"];\n\nconst dropzonePropKeys = [\n\t\"allowedFileTypes\",\n\t\"disableFilePickerOpenOnAreaClick\",\n\t\"disableInternalStateSubscription\",\n\t\"disablePreviewGenForNonImageFiles\",\n\t\"disabled\",\n\t\"initialFiles\",\n\t\"maxFileCount\",\n\t\"maxFileSize\",\n\t\"multiple\",\n\t\"onFilesChange\",\n\t\"onUpload\",\n\t\"onValidationError\",\n\t\"onValidationSuccess\",\n\t\"rejectDuplicateFiles\",\n\t\"unstyled\",\n\t\"validator\",\n] satisfies UnionToTuple<keyof UseDropZoneProps>;\n\nexport function DropZoneRoot<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneRootProps>\n) {\n\tconst { as: Element = \"div\", asChild, children, ...restOfProps } = props;\n\n\tconst rootProps = useMemo(() => omitKeys(restOfProps, dropzonePropKeys), [restOfProps]);\n\n\tconst { disabled, disableInternalStateSubscription, inputRef, propGetters, storeApi } =\n\t\tuseDropZone(restOfProps);\n\n\tconst rootContextValue = useMemo<DropZoneRootContextType>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisabled,\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tinputRef,\n\t\t\t\tpropGetters,\n\t\t\t}) satisfies DropZoneRootContextType,\n\t\t[disableInternalStateSubscription, disabled, inputRef, propGetters]\n\t);\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<DropZoneStoreContextProvider store={storeApi}>\n\t\t\t<DropZoneRootContextProvider value={rootContextValue}>\n\t\t\t\t<Component {...propGetters.getRootProps(rootProps)}>{children}</Component>\n\t\t\t</DropZoneRootContextProvider>\n\t\t</DropZoneStoreContextProvider>\n\t);\n}\n\nexport type DropZoneContextProps<TSlice> = {\n\tchildren: React.ReactNode | ((context: TSlice) => React.ReactNode);\n\tselector?: SelectorFn<DropZoneStore, TSlice>;\n};\n\nexport function DropZoneContext<TSlice = DropZoneStore>(props: DropZoneContextProps<TSlice>) {\n\tconst { children, selector } = props;\n\n\tconst dropZoneCtx = useDropZoneStoreContext(useCompareSelector(selector));\n\n\tconst resolvedChildren = isFunction(children) ? children(dropZoneCtx) : children;\n\n\treturn resolvedChildren;\n}\n\nexport type DropZoneContainerProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"container\"];\n\nexport function DropZoneContainer<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneContainerProps>\n) {\n\tconst { as: Element = \"div\", asChild, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst isDraggingOver = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isDraggingOver : null\n\t);\n\n\tconst isInvalid = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isInvalid : null\n\t);\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getContainerProps({\n\t\t\t\t...(disableInternalStateSubscription && {\n\t\t\t\t\t\"data-drag-over\": dataAttr(isDraggingOver),\n\t\t\t\t\t\"data-invalid\": dataAttr(isInvalid),\n\t\t\t\t}),\n\t\t\t\t...restOfProps,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport type DropZoneInputProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"input\"];\n\nexport function DropZoneInput(props: DropZoneInputProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst isDraggingOver = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isDraggingOver : null\n\t);\n\n\tconst Component = asChild ? Slot.Root : \"input\";\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getInputProps({\n\t\t\t\t...(disableInternalStateSubscription && { \"data-drag-over\": dataAttr(isDraggingOver) }),\n\t\t\t\t...restOfProps,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport type DropZoneAreaProps<TSlice = DropZoneStore> = DropZoneContextProps<TSlice> & {\n\tclassNames?: Partial<Record<Extract<keyof PartInputProps, \"container\" | \"input\">, string>>;\n\textraProps?: Partial<Pick<PartInputProps, \"container\" | \"input\">>;\n} & PartInputProps[\"container\"];\n\nexport function DropZoneArea<TSlice = DropZoneStore>(props: DropZoneAreaProps<TSlice>) {\n\tconst { children, className, classNames, extraProps, selector, ...restOfProps } = props;\n\n\treturn (\n\t\t<DropZoneContainer\n\t\t\t{...extraProps?.container}\n\t\t\t{...restOfProps}\n\t\t\tclassName={cnMerge(extraProps?.container?.className, className, classNames?.container)}\n\t\t>\n\t\t\t<DropZoneInput\n\t\t\t\t{...extraProps?.input}\n\t\t\t\tclassName={cnMerge(extraProps?.input?.className, classNames?.input)}\n\t\t\t/>\n\n\t\t\t<DropZoneContext selector={selector}>{children}</DropZoneContext>\n\t\t</DropZoneContainer>\n\t);\n}\n\nexport type DropZoneTriggerProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"trigger\"];\n\nexport function DropZoneTrigger(props: DropZoneTriggerProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getTriggerProps(restOfProps)} />;\n}\n\ntype ListPerItemContext = Pick<DropZoneStore, \"actions\"> & {\n\tarray: DropZoneStore[\"fileStateArray\"];\n\tfileState: DropZoneStore[\"fileStateArray\"][number];\n\tindex: number;\n};\n\ntype FileListPerItemVariant = {\n\tchildren: React.ReactNode | ((context: ListPerItemContext) => React.ReactNode);\n\trenderMode?: \"per-item\";\n};\n\ntype ListManualListContext = Pick<DropZoneStore, \"actions\" | \"fileStateArray\">;\n\ntype FileListManualListVariant = {\n\tchildren: React.ReactNode | ((context: ListManualListContext) => React.ReactNode);\n\trenderMode: \"manual-list\";\n};\n\nexport type DropZoneFileListProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n} & (FileListManualListVariant | FileListPerItemVariant)\n\t& Omit<PartInputProps[\"fileList\"], \"children\">;\n\nexport function DropZoneFileList<TElement extends React.ElementType = \"ul\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileListProps>\n) {\n\tconst {\n\t\tas: Element = \"ul\",\n\t\tasChild,\n\t\tchildren,\n\t\tforceMount = false,\n\t\trenderMode = \"per-item\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileStateArray = useDropZoneStoreContext((store) => store.fileStateArray);\n\tconst actions = useDropZoneStoreContext((store) => store.actions);\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst childrenMap = {\n\t\t\"manual-list\": () => {\n\t\t\tconst childrenFn = children as Extract<FileListManualListVariant[\"children\"], AnyFunction>;\n\t\t\treturn childrenFn({ actions, fileStateArray });\n\t\t},\n\t\t\"per-item\": () => {\n\t\t\tconst childrenFn = children as Extract<FileListPerItemVariant[\"children\"], AnyFunction>;\n\n\t\t\treturn (\n\t\t\t\t<For\n\t\t\t\t\teach={fileStateArray}\n\t\t\t\t\trenderItem={(fileState, index, array) => childrenFn({ actions, array, fileState, index })}\n\t\t\t\t/>\n\t\t\t);\n\t\t},\n\t} satisfies Record<typeof renderMode, () => React.ReactNode>;\n\n\tconst hasFiles = fileStateArray.length > 0;\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<Presence present={hasFiles} forceMount={forceMount}>\n\t\t\t<Component\n\t\t\t\t{...propGetters.getFileListProps({\n\t\t\t\t\t...(disableInternalStateSubscription && { \"data-state\": hasFiles ? \"active\" : \"inactive\" }),\n\t\t\t\t\t...restOfProps,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{isFunction(children) ? childrenMap[renderMode]() : children}\n\t\t\t</Component>\n\t\t</Presence>\n\t);\n}\n\nexport type DropZoneFileItemProps = FileItemContextType & {\n\tasChild?: boolean;\n} & PartInputProps[\"fileItem\"];\n\nexport function DropZoneFileItem<TElement extends React.ElementType = \"li\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemProps>\n) {\n\tconst { as: Element = \"li\", asChild, fileState, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst contextValue = useMemo<FileItemContextType>(\n\t\t() => ({ fileState }) satisfies FileItemContextType,\n\t\t[fileState]\n\t);\n\n\treturn (\n\t\t<FileItemContextProvider value={contextValue}>\n\t\t\t<Component {...propGetters.getFileItemProps(restOfProps)} />\n\t\t</FileItemContextProvider>\n\t);\n}\n\nexport type DropZoneFileItemDeleteProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"fileItemDelete\"];\n\nexport function DropZoneFileItemDelete(props: DropZoneFileItemDeleteProps) {\n\tconst { asChild, fileStateOrID, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\tconst resolvedFileStateOrID = fileStateOrID ?? fileItemContextValue?.fileState;\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getFileItemDeleteProps({ fileStateOrID: resolvedFileStateOrID, ...restOfProps })}\n\t\t/>\n\t);\n}\n\ntype StrictExtract<TUnion, TPick extends TUnion> = Extract<TUnion, TPick>;\n\nexport type DropZoneFileItemProgressProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n\tsize?: number;\n} & PartInputProps[\"fileItemProgress\"]\n\t& (\n\t\t| {\n\t\t\t\tclassNames?: { svgCircleOne?: string; svgCircleTwo?: string; svgRoot?: string };\n\t\t\t\tvariant: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"circular\">;\n\t\t }\n\t\t| {\n\t\t\t\tclassNames?: { track?: string };\n\t\t\t\tvariant: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"fill\">;\n\t\t }\n\t\t| {\n\t\t\t\tclassNames?: { track?: string };\n\t\t\t\tvariant?: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"linear\">;\n\t\t }\n\t);\n\nexport function DropZoneFileItemProgress<TElement extends React.ElementType = \"span\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemProgressProps>\n) {\n\tconst {\n\t\tas: Element = \"span\",\n\t\tasChild,\n\t\tclassName,\n\t\tclassNames: classNamesProp,\n\t\tforceMount = false,\n\t\tsize = 40,\n\t\tvariant = \"linear\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst classNames = classNamesProp as\n\t\t| UnionToIntersection<NonNullable<typeof classNamesProp>>\n\t\t| undefined;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst fileState = fileItemContextValue?.fileState;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst componentProps = propGetters.getFileItemProgressProps({ variant, ...restOfProps });\n\n\treturn (\n\t\t<Presence\n\t\t\tpresent={fileState.progress !== 100}\n\t\t\tforceMount={forceMount}\n\t\t\tclassName=\"data-[animation-phase=exit]:animate-progress-out\"\n\t\t>\n\t\t\t<Component className={cnMerge(\"inline-block\", className)} {...componentProps}>\n\t\t\t\t<Switch.Root>\n\t\t\t\t\t<Switch.Match when={variant === \"circular\"}>\n\t\t\t\t\t\t{() => {\n\t\t\t\t\t\t\tconst circumference = 2 * Math.PI * ((size - 4) / 2);\n\t\t\t\t\t\t\tconst strokeDashoffset = circumference - (fileState.progress / 100) * circumference;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\tclassName={cnMerge(\"-rotate-90\", classNames?.svgRoot)}\n\t\t\t\t\t\t\t\t\twidth={size}\n\t\t\t\t\t\t\t\t\theight={size}\n\t\t\t\t\t\t\t\t\tviewBox={`0 0 ${size} ${size}`}\n\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<circle\n\t\t\t\t\t\t\t\t\t\tclassName={cnMerge(\"text-zu-primary/20\", classNames?.svgCircleOne)}\n\t\t\t\t\t\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\t\t\t\t\t\tcx={size / 2}\n\t\t\t\t\t\t\t\t\t\tcy={size / 2}\n\t\t\t\t\t\t\t\t\t\tr={(size - 4) / 2}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<circle\n\t\t\t\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t\t\t\t\"text-zu-primary transition-[stroke-dashoffset] duration-300 ease-linear\",\n\t\t\t\t\t\t\t\t\t\t\tclassNames?.svgCircleTwo\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\t\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\t\t\t\t\t\tstrokeDasharray={2 * Math.PI * ((size - 4) / 2)}\n\t\t\t\t\t\t\t\t\t\tstrokeDashoffset={strokeDashoffset}\n\t\t\t\t\t\t\t\t\t\tcx={size / 2}\n\t\t\t\t\t\t\t\t\t\tcy={size / 2}\n\t\t\t\t\t\t\t\t\t\tr={(size - 4) / 2}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}}\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t\t<Switch.Match when={variant === \"fill\"}>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t`size-full bg-zu-primary/50 transition-[clip-path] duration-300 ease-linear\n\t\t\t\t\t\t\t\t[clip-path:var(--clip-path)]`,\n\t\t\t\t\t\t\t\tclassNames?.track\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\"--clip-path\": `inset(${100 - fileState.progress}% 0% 0% 0%)`,\n\t\t\t\t\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t\t<Switch.Match when={variant === \"linear\"}>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t`inline-block size-full grow translate-x-(--translate-distance) bg-zu-primary\n\t\t\t\t\t\t\t\ttransition-transform duration-300 ease-linear`,\n\t\t\t\t\t\t\t\tclassNames?.track\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\"--translate-distance\": `-${100 - fileState.progress}%`,\n\t\t\t\t\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t</Switch.Root>\n\t\t\t</Component>\n\t\t</Presence>\n\t);\n}\n\ntype NodeCtx<TElement extends React.ElementType> = {\n\tgetProps: (innerProps: Partial<InferProps<TElement>>) => InferProps<TElement>;\n};\n\ntype RenderPreviewDetails<TElement extends React.ElementType = \"svg\"> = UnionDiscriminator<\n\t[\n\t\t{ props: InferProps<TElement> },\n\t\t{ node: React.ReactNode | ((ctx: NodeCtx<TElement>) => React.ReactNode) },\n\t]\n>;\n\ntype RenderPropContext = Pick<FileItemContextType, \"fileState\"> & {\n\tfileExtension: string;\n\tfileType: string;\n};\n\ntype RenderPreviewObject = {\n\tarchive?: RenderPreviewDetails;\n\taudio?: RenderPreviewDetails;\n\tcode?: RenderPreviewDetails;\n\tdefault?: RenderPreviewDetails;\n\texecutable?: RenderPreviewDetails;\n\timage?: RenderPreviewDetails<\"img\">;\n\ttext?: RenderPreviewDetails;\n\tvideo?: RenderPreviewDetails;\n};\ntype RenderPreviewFn = (context: RenderPropContext) => RenderPreviewObject;\n\ntype RenderPreview = RenderPreviewFn | RenderPreviewObject;\n\nexport type DropZoneFileItemPreviewProps = Partial<Pick<FileItemContextType, \"fileState\">> & {\n\tasChild?: boolean;\n\tchildren?:\n\t\t| React.ReactNode\n\t\t| ((context: RenderPropContext & { fallbackPreview: () => React.ReactNode }) => React.ReactNode);\n\trenderPreview?: boolean | RenderPreview;\n} & Omit<PartInputProps[\"fileItemPreview\"], \"children\">;\n\nexport function DropZoneFileItemPreview<TElement extends React.ElementType>(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemPreviewProps>\n) {\n\tconst {\n\t\tas: Element = \"span\",\n\t\tasChild,\n\t\tchildren,\n\t\tfileState: fileStateProp,\n\t\trenderPreview = true,\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileState = fileStateProp ?? fileItemContextValue?.fileState;\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst fileType = fileState.file.type ?? \"\";\n\n\tconst fileExtension = fileState.file.name?.split(\".\").pop()?.toLowerCase() ?? \"\";\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst fallbackPreview = () =>\n\t\tgetFilePreviewOrIcon({ fileExtension, fileState, fileType, renderPreview });\n\n\tconst resolvedChildren =\n\t\tisFunction(children) ? children({ fallbackPreview, fileExtension, fileState, fileType }) : children;\n\n\treturn (\n\t\t<Component {...propGetters.getFileItemPreviewProps(restOfProps)}>\n\t\t\t{renderPreview && fallbackPreview()}\n\t\t\t{resolvedChildren}\n\t\t</Component>\n\t);\n}\n\nconst resolvePreviewNode = <\n\tTPreviewDetail extends NonNullable<RenderPreviewObject[keyof RenderPreviewObject]>,\n\tTNodeFn extends Extract<TPreviewDetail[\"node\"], AnyFunction>,\n>(\n\tdetails: TPreviewDetail | undefined,\n\tgetProps: Parameters<TNodeFn>[0][\"getProps\"] = ((props: unknown) => props) as never\n) => {\n\tconst resolvedNode =\n\t\tisFunction(details?.node) ? details.node({ getProps: getProps as never }) : details?.node;\n\n\treturn resolvedNode;\n};\n\nconst getFilePreviewOrIcon = (\n\tcontext: Pick<Required<DropZoneFileItemPreviewProps>, \"renderPreview\"> & Required<RenderPropContext>\n): React.ReactNode => {\n\tconst { fileExtension, fileState, fileType, renderPreview } = context;\n\n\tconst renderPreviewValue = isBoolean(renderPreview) ? {} : renderPreview;\n\n\tconst resolvedRenderPreviewObject =\n\t\tisFunction(renderPreviewValue) ?\n\t\t\trenderPreviewValue({ fileExtension, fileState, fileType })\n\t\t:\trenderPreviewValue;\n\n\tswitch (true) {\n\t\tcase fileType.startsWith(\"image/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.image, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\talt: innerProps.alt ?? fileState.file.name ?? \"\",\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t\tsrc: innerProps.src ?? fileState.preview,\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<img\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.image?.props}\n\t\t\t\t\t\tsrc={fileState.preview}\n\t\t\t\t\t\talt={fileState.file.name ?? \"\"}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.image?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"video/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.video, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<FileVideoIcon\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.video?.props}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.video?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"audio/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.audio, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<FileAudioIcon\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.audio?.props}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.audio?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"text/\") || [\"md\", \"pdf\", \"rtf\", \"txt\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.text);\n\n\t\t\treturn resolvedNode ?? <FileTextIcon {...resolvedRenderPreviewObject.text?.props} />;\n\t\t}\n\n\t\tcase [\n\t\t\t\"c\",\n\t\t\t\"cpp\",\n\t\t\t\"cs\",\n\t\t\t\"css\",\n\t\t\t\"html\",\n\t\t\t\"java\",\n\t\t\t\"js\",\n\t\t\t\"json\",\n\t\t\t\"jsx\",\n\t\t\t\"php\",\n\t\t\t\"py\",\n\t\t\t\"rb\",\n\t\t\t\"ts\",\n\t\t\t\"tsx\",\n\t\t\t\"xml\",\n\t\t].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.code);\n\n\t\t\treturn resolvedNode ?? <FileCodeIcon {...resolvedRenderPreviewObject.code?.props} />;\n\t\t}\n\n\t\tcase [\"7z\", \"bz2\", \"gz\", \"rar\", \"tar\", \"zip\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.archive);\n\n\t\t\treturn resolvedNode ?? <FileArchiveIcon {...resolvedRenderPreviewObject.archive?.props} />;\n\t\t}\n\n\t\tcase [\"apk\", \"app\", \"deb\", \"exe\", \"msi\", \"rpm\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.executable);\n\n\t\t\treturn resolvedNode ?? <FileCogIcon {...resolvedRenderPreviewObject.executable?.props} />;\n\t\t}\n\n\t\tdefault: {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.default);\n\n\t\t\treturn resolvedNode ?? <FileIcon {...resolvedRenderPreviewObject.default?.props} />;\n\t\t}\n\t}\n};\n\nexport type DropZoneFileItemMetadataProps = Partial<Pick<FileItemContextType, \"fileState\">> & {\n\tasChild?: boolean;\n\tchildren?: React.ReactNode | ((context: Pick<FileItemContextType, \"fileState\">) => React.ReactNode);\n\tclassNames?: {\n\t\tname?: string;\n\t\tsize?: string;\n\t};\n\tsize?: \"default\" | \"sm\";\n} & Omit<PartInputProps[\"fileItemMetadata\"], \"children\">;\n\nexport function DropZoneFileItemMetadata(props: DropZoneFileItemMetadataProps) {\n\tconst {\n\t\tasChild,\n\t\tchildren,\n\t\tclassNames,\n\t\tfileState: fileStateProp,\n\t\tsize = \"default\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileState = fileStateProp ?? fileItemContextValue?.fileState;\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : \"div\";\n\n\tconst resolvedChildren = isFunction(children) ? children({ fileState }) : children;\n\n\tconst getDefaultMetadataChildren = () => {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<p\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"truncate\",\n\t\t\t\t\t\tsize === \"default\" && \"text-[14px] font-medium\",\n\t\t\t\t\t\tsize === \"sm\" && \"text-[13px] leading-snug\",\n\t\t\t\t\t\tclassNames?.name\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{fileState.file.name}\n\t\t\t\t</p>\n\t\t\t\t<p\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"truncate text-zu-muted-foreground\",\n\t\t\t\t\t\tsize === \"default\" && \"text-[12px]\",\n\t\t\t\t\t\tsize === \"sm\" && \"text-[11px] leading-snug\",\n\t\t\t\t\t\tclassNames?.size\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{isNumber(fileState.file.size) && formatBytes(fileState.file.size)}\n\t\t\t\t</p>\n\t\t\t\t{fileState.error && (\n\t\t\t\t\t<p className=\"text-[12px] text-zu-destructive\">{fileState.error.message}</p>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t};\n\n\treturn (\n\t\t<Component {...propGetters.getFileItemMetadataProps(restOfProps)}>\n\t\t\t{resolvedChildren ?? getDefaultMetadataChildren()}\n\t\t</Component>\n\t);\n}\n\nexport type DropZoneFileClearProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n} & PartInputProps[\"fileItemClear\"];\n\nexport function DropZoneFileClear(props: DropZoneFileClearProps) {\n\tconst { asChild, forceMount = false, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileCount = useDropZoneStoreContext((state) => state.fileStateArray.length);\n\n\tconst shouldRender = forceMount || fileCount > 0;\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getFileItemClearProps(restOfProps)} />;\n}\n\n/* eslint-enable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n","export {\n\tDropZoneArea as Area,\n\tDropZoneContainer as Container,\n\tDropZoneContext as Context,\n\tDropZoneFileClear as FileClear,\n\tDropZoneFileItem as FileItem,\n\tDropZoneFileItemDelete as FileItemDelete,\n\tDropZoneFileItemMetadata as FileItemMetadata,\n\tDropZoneFileItemPreview as FileItemPreview,\n\tDropZoneFileItemProgress as FileItemProgress,\n\tDropZoneFileList as FileList,\n\tDropZoneInput as Input,\n\tDropZoneRoot as Root,\n\tDropZoneTrigger as Trigger,\n} from \"./drop-zone\";\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["generateFileID","generateFileIDPrimitive","generateFileID","Slot.Root","Switch.Root","Switch.Match"],"sources":["../../../../src/components/ui/drop-zone/drop-zone-context.ts","../../../../src/components/ui/drop-zone/icons.tsx","../../../../src/components/ui/drop-zone/utils.ts","../../../../src/components/ui/drop-zone/drop-zone-store.ts","../../../../src/components/ui/drop-zone/use-drop-zone.ts","../../../../src/components/ui/drop-zone/drop-zone.tsx","../../../../src/components/ui/drop-zone/drop-zone-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\nimport { createReactStoreContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { DropZoneStore, FileState, UseDropZoneResult } from \"./types\";\n\nconst [DropZoneStoreContextProvider, useDropZoneStoreContext] = createReactStoreContext<DropZoneStore>({\n\thookName: \"useDropZoneStoreContext\",\n\tname: \"DropZoneStoreContext\",\n\tproviderName: \"DropZoneRoot\",\n});\n\nexport type DropZoneRootContextType = Pick<\n\tUseDropZoneResult,\n\t\"disabled\" | \"disableInternalStateSubscription\" | \"inputRef\" | \"propGetters\"\n>;\n\nconst [DropZoneRootContextProvider, useDropZoneRootContext] = createCustomContext<DropZoneRootContextType>(\n\t{\n\t\thookName: \"useDropZoneRootContext\",\n\t\tname: \"DropZoneRootContext\",\n\t\tproviderName: \"DropZoneRoot\",\n\t}\n);\n\nexport type FileItemContextType = {\n\tfileState: FileState;\n};\n\nconst [FileItemContextProvider, useFileItemContext] = createCustomContext({\n\tdefaultValue: null as unknown as FileItemContextType,\n\thookName: \"useFileItemContext\",\n\tname: \"FileItemContext\",\n\tproviderName: \"FileItem\",\n\tstrict: false,\n});\n\nexport {\n\tDropZoneRootContextProvider,\n\tDropZoneStoreContextProvider,\n\tFileItemContextProvider,\n\tuseDropZoneRootContext,\n\tuseDropZoneStoreContext,\n\tuseFileItemContext,\n};\n","export const FileVideoIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4m-10 3l5 3l-5 3z\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileAudioIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M17.5 22h.5a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v3\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M2 19a2 2 0 1 1 4 0v1a2 2 0 1 1-4 0v-4a6 6 0 0 1 12 0v4a2 2 0 1 1-4 0v-1a2 2 0 1 1 4 0\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileTextIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M10 9H8m8 4H8m8 4H8\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileCodeIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M10 12.5L8 15l2 2.5m4-5l2 2.5l-2 2.5M14 2v4a2 2 0 0 0 2 2h4\" />\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileArchiveIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M10 12v-1m0 7v-2m0-9V6m4-4v4a2 2 0 0 0 2 2h4\" />\n\t\t\t<path d=\"M15.5 22H18a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v16a2 2 0 0 0 .274 1.01\" />\n\t\t\t<circle cx=\"10\" cy=\"20\" r=\"2\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileCogIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4M3.2 12.9l-.9-.4m.9 2.6l-.9.4\" />\n\t\t\t<path d=\"M4.677 21.5a2 2 0 0 0 1.313.5H18a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v2.5m.9 4.7l-.4-.9m.4 6.5l-.4.9m3-7.4l-.4.9m.4 6.5l-.4-.9m2.6-4.3l-.9.4m.9 2.6l-.9-.4\" />\n\t\t\t<circle cx=\"6\" cy=\"14\" r=\"3\" />\n\t\t</g>\n\t</svg>\n);\n\nexport const FileIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t{/* Icon from Lucide by Lucide Contributors - https://github.com/lucide-icons/lucide/blob/main/LICENSE */}\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\" />\n\t\t\t<path d=\"M14 2v4a2 2 0 0 0 2 2h4\" />\n\t\t</g>\n\t</svg>\n);\n","import {\n\tcreateFileURL,\n\tgenerateFileID as generateFileIDPrimitive,\n\ttype FileOrFileMeta,\n\ttype FileValidationErrorContextEach,\n} from \"@zayne-labs/toolkit-core\";\nimport { isFile, isObject, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport type { FileState, FileStateOrIDProp, PartProps } from \"./types\";\n\nexport const generateFileID = generateFileIDPrimitive;\n\nexport const createObjectURL = (\n\tfile: FileOrFileMeta,\n\tdisallowPreviewForNonImageFiles: boolean | undefined\n) => {\n\tif (disallowPreviewForNonImageFiles && !file.type?.startsWith(\"image/\")) return;\n\n\treturn createFileURL(file);\n};\n\nexport const clearObjectURL = (\n\tfileState: FileState | undefined,\n\tdisallowPreviewForNonImageFiles: boolean | undefined\n) => {\n\tif (!isFile(fileState?.file)) return;\n\n\tif (disallowPreviewForNonImageFiles && !fileState.file.type.startsWith(\"image/\")) return;\n\n\tif (!fileState.preview) return;\n\n\tURL.revokeObjectURL(fileState.preview);\n};\n\nexport const isMatchingFile = (\n\toptions: FileStateOrIDProp & {\n\t\tfileState: FileOrFileMeta | FileState;\n\t}\n) => {\n\tconst { fileState, fileStateOrID } = options;\n\n\tconst fileID = isFile(fileState) ? generateFileID(fileState) : fileState.id;\n\n\tif (isString(fileStateOrID)) {\n\t\treturn fileID === fileStateOrID;\n\t}\n\n\tif (isFile(fileStateOrID)) {\n\t\tconst generatedFileID = generateFileID(fileStateOrID);\n\t\treturn fileID === generatedFileID;\n\t}\n\n\treturn fileID === fileStateOrID.id;\n};\n\ntype FromCamelToKebabCase<TString extends string> =\n\tTString extends `${infer First}${infer Rest}` ?\n\t\tFirst extends Uppercase<First> ?\n\t\t\t`-${Lowercase<First>}${FromCamelToKebabCase<Rest>}`\n\t\t:\t`${First}${FromCamelToKebabCase<Rest>}`\n\t:\t\"\";\n\nexport const getDropZoneScopeAttrs = (part: FromCamelToKebabCase<keyof PartProps>) => {\n\treturn {\n\t\t/* eslint-disable perfectionist/sort-objects -- I need this order to be maintained */\n\t\t\"data-slot\": `dropzone-${part}`,\n\t\t\"data-scope\": \"dropzone\",\n\t\t\"data-part\": part,\n\t\t/* eslint-enable perfectionist/sort-objects -- I need this order to be maintained */\n\t} as const;\n};\n\nconst dropZoneErrorSymbol = Symbol(\"DropZoneError\");\n\nexport class DropZoneError extends Error {\n\treadonly dropZoneErrorSymbol = dropZoneErrorSymbol;\n\tfile?: FileValidationErrorContextEach[\"file\"];\n\toverride name = \"DropZoneError\" as const;\n\n\tconstructor(\n\t\tctx: Pick<FileValidationErrorContextEach, \"message\"> & {\n\t\t\tfile?: FileValidationErrorContextEach[\"file\"];\n\t\t},\n\t\terrorOptions?: ErrorOptions\n\t) {\n\t\tconst { file, message } = ctx;\n\n\t\tsuper(message, errorOptions);\n\n\t\tthis.file = file;\n\t}\n\n\tstatic override isError(error: unknown): error is DropZoneError {\n\t\tif (!isObject<DropZoneError>(error)) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif (error instanceof DropZoneError) {\n\t\t\treturn true;\n\t\t}\n\n\t\tconst actualError = error as DropZoneError;\n\n\t\treturn (\n\t\t\tactualError.dropZoneErrorSymbol === dropZoneErrorSymbol\n\t\t\t// eslint-disable-next-line ts-eslint/no-unnecessary-condition -- Allow\n\t\t\t&& actualError.name === \"DropZoneError\"\n\t\t);\n\t}\n}\n\nexport const getErrorContext = (error: unknown): NonNullable<FileState[\"error\"]> => {\n\tif (DropZoneError.isError(error)) {\n\t\treturn {\n\t\t\tcause: \"custom-error\",\n\t\t\tcode: \"upload-error\",\n\t\t\tfile: error.file ?? ({} as never),\n\t\t\tmessage: error.message,\n\t\t\toriginalError: error.cause ?? error,\n\t\t};\n\t}\n\n\tconst actualError = Error.isError(error) ? error : new Error(\"File upload failed\", { cause: error });\n\n\treturn {\n\t\tcause: \"custom-error\",\n\t\tcode: \"upload-error\",\n\t\tfile: isFile(actualError.cause) ? actualError.cause : ({} as never),\n\t\tmessage: Error.isError(error) ? actualError.message : String(actualError),\n\t\toriginalError: actualError,\n\t};\n};\n","import { createStore, handleFileValidationAsync, toArray } from \"@zayne-labs/toolkit-core\";\nimport type { DropZoneState, DropZoneStore, UseDropZoneProps } from \"./types\";\nimport { clearObjectURL, createObjectURL, generateFileID, getErrorContext, isMatchingFile } from \"./utils\";\n\ntype RequiredUseDropZoneProps = {\n\t[Key in keyof Required<UseDropZoneProps>]: UseDropZoneProps[Key] | undefined;\n};\n\ntype StoreContext = Pick<\n\tRequiredUseDropZoneProps,\n\t| \"allowedFileTypes\"\n\t| \"disablePreviewGenForNonImageFiles\"\n\t| \"initialFiles\"\n\t| \"maxFileCount\"\n\t| \"maxFileSize\"\n\t| \"multiple\"\n\t| \"onFilesChange\"\n\t| \"onUpload\"\n\t| \"onValidationError\"\n\t| \"onValidationSuccess\"\n\t| \"rejectDuplicateFiles\"\n\t| \"validator\"\n>;\n\nexport const createDropZoneStore = (storeContext: StoreContext) => {\n\tconst {\n\t\tallowedFileTypes,\n\t\tdisablePreviewGenForNonImageFiles,\n\t\tinitialFiles,\n\t\tmaxFileCount,\n\t\tmaxFileSize,\n\t\tmultiple,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\tonValidationError,\n\t\tonValidationSuccess,\n\t\trejectDuplicateFiles,\n\t\tvalidator,\n\t} = storeContext;\n\n\tconst inputRef: React.RefObject<HTMLInputElement | null> = { current: null };\n\n\tconst initialFileArray = toArray(initialFiles).filter(Boolean);\n\n\tconst clearInputValue = () => {\n\t\tif (!inputRef.current) return;\n\n\t\tinputRef.current.value = \"\";\n\t};\n\n\tconst initFileStateArray: DropZoneState[\"fileStateArray\"] = initialFileArray.map((fileMeta) => ({\n\t\tfile: fileMeta,\n\t\tid: fileMeta.id,\n\t\tpreview: fileMeta.url,\n\t\tprogress: 0,\n\t\tstatus: \"idle\",\n\t}));\n\n\tconst store = createStore<DropZoneStore>((set, get) => ({\n\t\tdisabled: false,\n\t\terrors: [],\n\t\tfileStateArray: initFileStateArray,\n\t\tisDraggingOver: false,\n\t\tisInvalid: false,\n\n\t\t// eslint-disable-next-line perfectionist/sort-objects -- ignore\n\t\tactions: {\n\t\t\taddFiles: async (files) => {\n\t\t\t\tif (!files || files.length === 0) {\n\t\t\t\t\tconsole.warn(\"No file selected!\");\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst { actions, fileStateArray: existingFileStateArray } = get();\n\n\t\t\t\t// == In single file mode, only use the first file\n\t\t\t\tconst resolvedNewFiles = !multiple ? [files[0]] : files;\n\n\t\t\t\tconst { errors, validFiles } = await handleFileValidationAsync({\n\t\t\t\t\texistingFiles: existingFileStateArray.map((fileWithPreview) => fileWithPreview.file),\n\t\t\t\t\thooks: {\n\t\t\t\t\t\tonErrorEach: onValidationError,\n\t\t\t\t\t\tonSuccessBatch: onValidationSuccess,\n\t\t\t\t\t},\n\t\t\t\t\tnewFiles: resolvedNewFiles,\n\t\t\t\t\tsettings: {\n\t\t\t\t\t\tallowedFileTypes,\n\t\t\t\t\t\tmaxFileCount,\n\t\t\t\t\t\tmaxFileSize,\n\t\t\t\t\t\trejectDuplicateFiles,\n\t\t\t\t\t\tvalidator,\n\t\t\t\t\t},\n\t\t\t\t});\n\n\t\t\t\tif (validFiles.length === 0) {\n\t\t\t\t\tset({ errors, isDraggingOver: false });\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst newFileStateArray: DropZoneState[\"fileStateArray\"] = validFiles.map((file) => ({\n\t\t\t\t\tfile,\n\t\t\t\t\tid: generateFileID(file),\n\t\t\t\t\tpreview: createObjectURL(file, disablePreviewGenForNonImageFiles),\n\t\t\t\t\tprogress: 0,\n\t\t\t\t\tstatus: \"idle\",\n\t\t\t\t}));\n\n\t\t\t\tconst resolvedFileStateArray =\n\t\t\t\t\t!multiple ? newFileStateArray : [...existingFileStateArray, ...newFileStateArray];\n\n\t\t\t\tset(\n\t\t\t\t\t{\n\t\t\t\t\t\terrors,\n\t\t\t\t\t\tfileStateArray: resolvedFileStateArray,\n\t\t\t\t\t\tisDraggingOver: false,\n\t\t\t\t\t},\n\t\t\t\t\t{ shouldNotifySync: true }\n\t\t\t\t);\n\n\t\t\t\tawait actions.handleFileUpload({ newFileStateArray });\n\t\t\t},\n\t\t\tclearErrors: () => {\n\t\t\t\tset({ errors: [], isInvalid: false });\n\t\t\t},\n\n\t\t\tclearFiles: () => {\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tactions.clearObjectURLs();\n\n\t\t\t\tset({ errors: [], fileStateArray: [], isInvalid: false });\n\t\t\t},\n\n\t\t\tclearObjectURLs: () => {\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tfor (const fileState of fileStateArray) {\n\t\t\t\t\tclearObjectURL(fileState, disablePreviewGenForNonImageFiles);\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleChange: async (event) => {\n\t\t\t\tconst fileList = event.target.files;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tawait actions.addFiles(fileList);\n\n\t\t\t\tclearInputValue();\n\t\t\t},\n\n\t\t\thandleDragEnter: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tset({ isDraggingOver: true });\n\t\t\t},\n\n\t\t\thandleDragLeave: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tset({ isDraggingOver: false });\n\t\t\t},\n\n\t\t\thandleDragOver: (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\t\t\t},\n\n\t\t\thandleDrop: async (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tconst fileList = event.dataTransfer.files;\n\n\t\t\t\tawait actions.addFiles(fileList);\n\t\t\t},\n\n\t\t\thandleFileUpload: async (context) => {\n\t\t\t\tconst { newFileStateArray } = context;\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tif (!onUpload) {\n\t\t\t\t\tfor (const fileState of newFileStateArray) {\n\t\t\t\t\t\tactions.updateFileState({ fileStateOrID: fileState, progress: 100, status: \"success\" });\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\ttry {\n\t\t\t\t\tawait onUpload({\n\t\t\t\t\t\tfileStateArray: newFileStateArray,\n\t\t\t\t\t\tonError: (ctx) => {\n\t\t\t\t\t\t\tconst { error, fileStateOrID } = ctx;\n\n\t\t\t\t\t\t\tconst errorContext = getErrorContext(error);\n\n\t\t\t\t\t\t\tactions.updateFileState({ error: errorContext, fileStateOrID, status: \"error\" });\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonProgress: (ctx) => {\n\t\t\t\t\t\t\tconst { fileStateOrID, progress } = ctx;\n\n\t\t\t\t\t\t\tactions.updateFileState({ fileStateOrID, progress });\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonSuccess: (ctx) => {\n\t\t\t\t\t\t\tconst { fileStateOrID } = ctx;\n\n\t\t\t\t\t\t\tactions.updateFileState({ fileStateOrID, progress: 100, status: \"success\" });\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\n\t\t\t\t\t// == Handle Errors ==\n\t\t\t\t} catch (error) {\n\t\t\t\t\tconst errorContext = getErrorContext(error);\n\n\t\t\t\t\tfor (const fileState of newFileStateArray) {\n\t\t\t\t\t\tactions.updateFileState({\n\t\t\t\t\t\t\terror: errorContext,\n\t\t\t\t\t\t\tfileStateOrID: fileState,\n\t\t\t\t\t\t\tstatus: \"error\",\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\n\t\t\thandleKeyDown: (event) => {\n\t\t\t\tconst isEnterKey = event.key === \"Enter\";\n\t\t\t\tconst isSpaceKey = event.key === \" \";\n\n\t\t\t\tconst isAllowedKey = isEnterKey || isSpaceKey;\n\n\t\t\t\tif (!isAllowedKey) return;\n\n\t\t\t\tevent.preventDefault();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tactions.openFilePicker();\n\t\t\t},\n\n\t\t\thandlePaste: async (event) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tevent.stopPropagation();\n\n\t\t\t\tconst { actions } = get();\n\n\t\t\t\tconst fileList = event.clipboardData.files;\n\n\t\t\t\tawait actions.addFiles(fileList);\n\t\t\t},\n\n\t\t\topenFilePicker: () => {\n\t\t\t\tinputRef.current?.click();\n\t\t\t},\n\n\t\t\tremoveFile: (ctx) => {\n\t\t\t\tconst { fileStateOrID } = ctx;\n\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tconst updatedFileStateArray = fileStateArray.filter((fileState) => {\n\t\t\t\t\tif (!isMatchingFile({ fileState, fileStateOrID })) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\n\t\t\t\t\tclearObjectURL(fileState, disablePreviewGenForNonImageFiles);\n\n\t\t\t\t\treturn false;\n\t\t\t\t});\n\n\t\t\t\tset({ errors: [], fileStateArray: updatedFileStateArray });\n\t\t\t},\n\n\t\t\tsetInputRef: (element) => {\n\t\t\t\tinputRef.current = element;\n\t\t\t},\n\n\t\t\tupdateFileState: (ctx) => {\n\t\t\t\tconst { fileStateOrID, ...updatedFileState } = ctx;\n\n\t\t\t\tconst { fileStateArray } = get();\n\n\t\t\t\tconst updatedFileStateArray: DropZoneState[\"fileStateArray\"] = fileStateArray.map(\n\t\t\t\t\t(fileState) => {\n\t\t\t\t\t\tif (!isMatchingFile({ fileState, fileStateOrID })) {\n\t\t\t\t\t\t\treturn fileState;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...fileState,\n\t\t\t\t\t\t\t...updatedFileState,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tset({ fileStateArray: updatedFileStateArray }, { shouldNotifySync: true });\n\t\t\t},\n\t\t},\n\t}));\n\n\t// == File change subscription\n\tstore.subscribe.withSelector(\n\t\t(state) => state.fileStateArray,\n\t\t(fileStateArray) => {\n\t\t\tonFilesChange?.({ fileStateArray });\n\t\t}\n\t);\n\n\t// == Set `isInvalid` to true if there are errors\n\tstore.subscribe.withSelector(\n\t\t(state) => state.errors,\n\t\t(errors) => {\n\t\t\tif (errors.length === 0) return;\n\n\t\t\tstore.setState({ isInvalid: true });\n\n\t\t\t// == Reset to false after 1.5 seconds\n\t\t\tsetTimeout(() => store.setState({ isInvalid: false }), 1500);\n\t\t}\n\t);\n\n\treturn store;\n};\n","import { dataAttr } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useCompareValue, useStore, useUnmountEffect } from \"@zayne-labs/toolkit-react\";\nimport { composeRefs, composeTwoEventHandlers } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport { createDropZoneStore } from \"./drop-zone-store\";\nimport type { DropZonePropGetters, UseDropZoneProps, UseDropZoneResult } from \"./types\";\nimport { getDropZoneScopeAttrs } from \"./utils\";\n\nexport const useDropZone = (props?: UseDropZoneProps): UseDropZoneResult => {\n\tconst {\n\t\tallowedFileTypes,\n\t\tdisabled = false,\n\t\tdisableFilePickerOpenOnAreaClick = false,\n\t\tdisableInternalStateSubscription = false,\n\t\tdisablePreviewGenForNonImageFiles = true,\n\t\tinitialFiles,\n\t\tmaxFileCount,\n\t\tmaxFileSize,\n\t\tmultiple,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\tonValidationError,\n\t\tonValidationSuccess,\n\t\trejectDuplicateFiles = true,\n\t\tunstyled: globalUnstyled = false,\n\t\tvalidator,\n\t} = props ?? {};\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\tconst stableOnFilesChange = useCallbackRef(onFilesChange);\n\tconst stableOnUpload = useCallbackRef(onUpload);\n\tconst stableOnUploadError = useCallbackRef(onValidationError);\n\tconst stableOnUploadSuccess = useCallbackRef(onValidationSuccess);\n\tconst stableValidator = useCallbackRef(validator);\n\n\tconst shallowComparedInitialFiles = useCompareValue(initialFiles);\n\tconst shallowComparedMaxFileSize = useCompareValue(maxFileSize);\n\tconst shallowComparedAllowedFileTypes = useCompareValue(allowedFileTypes);\n\n\tconst storeApi = useMemo(() => {\n\t\treturn createDropZoneStore({\n\t\t\tallowedFileTypes: shallowComparedAllowedFileTypes,\n\t\t\tdisablePreviewGenForNonImageFiles,\n\t\t\tinitialFiles: shallowComparedInitialFiles,\n\t\t\tmaxFileCount,\n\t\t\tmaxFileSize: shallowComparedMaxFileSize,\n\t\t\tmultiple,\n\t\t\tonFilesChange: stableOnFilesChange,\n\t\t\tonUpload: stableOnUpload,\n\t\t\tonValidationError: stableOnUploadError,\n\t\t\tonValidationSuccess: stableOnUploadSuccess,\n\t\t\trejectDuplicateFiles,\n\t\t\tvalidator: stableValidator,\n\t\t});\n\t}, [\n\t\tshallowComparedAllowedFileTypes,\n\t\tdisablePreviewGenForNonImageFiles,\n\t\tshallowComparedInitialFiles,\n\t\tmaxFileCount,\n\t\tshallowComparedMaxFileSize,\n\t\tmultiple,\n\t\tstableOnFilesChange,\n\t\tstableOnUpload,\n\t\tstableOnUploadError,\n\t\tstableOnUploadSuccess,\n\t\trejectDuplicateFiles,\n\t\tstableValidator,\n\t]);\n\n\tconst actions = storeApi.getState().actions;\n\n\tuseUnmountEffect(() => {\n\t\tactions.clearObjectURLs();\n\t});\n\n\t/* eslint-disable react-hooks/hooks -- ignore */\n\t// eslint-disable-next-line react/component-hook-factories -- ignore\n\tconst useDropZoneStore: UseDropZoneResult[\"useDropZoneStore\"] = (selector) => {\n\t\treturn useStore(storeApi as never, selector);\n\t};\n\n\tconst isDraggingOver = useDropZoneStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isDraggingOver : null\n\t);\n\n\tconst isInvalid = useDropZoneStore((state) =>\n\t\t!disableInternalStateSubscription ? state.isInvalid : null\n\t);\n\t/* eslint-enable react-hooks/hooks -- ignore */\n\n\tconst getRootProps: DropZonePropGetters[\"getRootProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"root\"),\n\t\t\t\t\"data-disabled\": dataAttr(disabled),\n\t\t\t};\n\t\t},\n\t\t[disabled]\n\t);\n\n\tconst getContainerProps: DropZonePropGetters[\"getContainerProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\tconst isDisabled = disabled;\n\t\t\tconst onFileDrop = !isDisabled ? actions.handleDrop : undefined;\n\t\t\tconst onFilePaste = !isDisabled ? actions.handlePaste : undefined;\n\t\t\tconst tabIndex = !isDisabled ? 0 : undefined;\n\t\t\tconst onAreaClick =\n\t\t\t\t!isDisabled && !disableFilePickerOpenOnAreaClick ? actions.openFilePicker : undefined;\n\t\t\tconst onKeyDown =\n\t\t\t\t!isDisabled && !disableFilePickerOpenOnAreaClick ? actions.handleKeyDown : undefined;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"container\"),\n\t\t\t\t...(!disableInternalStateSubscription && {\n\t\t\t\t\t\"data-drag-over\": dataAttr(isDraggingOver),\n\t\t\t\t\t\"data-invalid\": dataAttr(isInvalid),\n\t\t\t\t}),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\trole: \"region\",\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t`relative flex flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed p-6 transition-colors duration-250 ease-out outline-none select-none focus-visible:border-zu-ring/50`,\n\t\t\t\t\t\t`data-disabled:pointer-events-none data-drag-over:opacity-60 data-invalid:border-zu-destructive data-invalid:ring-zu-destructive/20`,\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t\tonClick: composeTwoEventHandlers(onAreaClick, innerProps.onClick),\n\t\t\t\tonDragEnter: composeTwoEventHandlers(actions.handleDragEnter, innerProps.onDragEnter),\n\t\t\t\tonDragLeave: composeTwoEventHandlers(actions.handleDragLeave, innerProps.onDragLeave),\n\t\t\t\tonDragOver: composeTwoEventHandlers(actions.handleDragOver, innerProps.onDragOver),\n\t\t\t\tonDrop: composeTwoEventHandlers(onFileDrop, innerProps.onDrop),\n\t\t\t\tonKeyDown: composeTwoEventHandlers(onKeyDown, innerProps.onKeyDown),\n\t\t\t\tonPaste: composeTwoEventHandlers(onFilePaste, innerProps.onPaste),\n\t\t\t\ttabIndex,\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tglobalUnstyled,\n\t\t\tdisabled,\n\t\t\tactions.handleDrop,\n\t\t\tactions.handlePaste,\n\t\t\tactions.openFilePicker,\n\t\t\tactions.handleKeyDown,\n\t\t\tactions.handleDragEnter,\n\t\t\tactions.handleDragLeave,\n\t\t\tactions.handleDragOver,\n\t\t\tdisableFilePickerOpenOnAreaClick,\n\t\t\tdisableInternalStateSubscription,\n\t\t\tisDraggingOver,\n\t\t\tisInvalid,\n\t\t]\n\t);\n\n\tconst refCallback: React.RefCallback<HTMLInputElement> = useCallbackRef((node) => {\n\t\tinputRef.current = node;\n\t\tactions.setInputRef(node);\n\t});\n\n\tconst getInputProps: DropZonePropGetters[\"getInputProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\tconst onFileChange = !isDisabled ? actions.handleChange : undefined;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"input\"),\n\t\t\t\t...(!disableInternalStateSubscription && { \"data-drag-over\": dataAttr(isDraggingOver) }),\n\t\t\t\taccept: allowedFileTypes ? allowedFileTypes.join(\", \") : innerProps.accept,\n\t\t\t\tclassName: cnMerge(\"hidden\", innerProps.className),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tmultiple: multiple ?? innerProps.multiple,\n\t\t\t\tonChange: composeTwoEventHandlers(onFileChange, innerProps.onChange),\n\t\t\t\tref: composeRefs(refCallback, innerProps.ref),\n\t\t\t\ttype: \"file\",\n\t\t\t};\n\t\t},\n\t\t[\n\t\t\tactions.handleChange,\n\t\t\tallowedFileTypes,\n\t\t\tdisableInternalStateSubscription,\n\t\t\tdisabled,\n\t\t\tisDraggingOver,\n\t\t\tmultiple,\n\t\t\trefCallback,\n\t\t]\n\t);\n\n\tconst getTriggerProps: DropZonePropGetters[\"getTriggerProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"trigger\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.openFilePicker, innerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.openFilePicker, disabled]\n\t);\n\n\tconst getFileListProps: DropZonePropGetters[\"getFileListProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { orientation = \"vertical\", unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-list\"),\n\t\t\t\t\"data-orientation\": orientation,\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"flex flex-col gap-2\",\n\t\t\t\t\t\torientation === \"horizontal\" && \"flex-row overflow-x-auto p-1.5\",\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemProps: DropZonePropGetters[\"getFileItemProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"relative flex animate-files-in items-center gap-2.5 rounded-md border p-2\",\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemProgressProps: DropZonePropGetters[\"getFileItemProgressProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, variant = \"linear\", ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-progress\"),\n\t\t\t\trole: \"progressbar\",\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t\"inline-flex\",\n\t\t\t\t\t\tvariant === \"circular\" && \"absolute top-1/2 left-1/2 -translate-1/2\",\n\t\t\t\t\t\tvariant === \"fill\" && `absolute inset-0`,\n\t\t\t\t\t\tvariant === \"linear\"\n\t\t\t\t\t\t\t&& \"relative h-1.5 w-full overflow-hidden rounded-full bg-zu-primary/20\",\n\t\t\t\t\t\trestOfInnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemDeleteProps: DropZonePropGetters[\"getFileItemDeleteProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { fileStateOrID, ...restOfInnerProps } = innerProps;\n\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\tconst onRemoveFile = () => fileStateOrID && actions.removeFile({ fileStateOrID });\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-delete\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(onRemoveFile, restOfInnerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions, disabled]\n\t);\n\n\tconst getFileItemPreviewProps: DropZonePropGetters[\"getFileItemPreviewProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-preview\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\n\t\t\t\t\t\t`relative flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-md bg-zu-accent/50 [&>svg]:size-10`,\n\t\t\t\t\t\tinnerProps.className\n\t\t\t\t\t),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemMetadataProps: DropZonePropGetters[\"getFileItemMetadataProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst { unstyled = globalUnstyled, ...restOfInnerProps } = innerProps;\n\n\t\t\treturn {\n\t\t\t\t...restOfInnerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-metadata\"),\n\t\t\t\t...(!unstyled && {\n\t\t\t\t\tclassName: cnMerge(\"flex min-w-0 grow flex-col\", innerProps.className),\n\t\t\t\t}),\n\t\t\t};\n\t\t},\n\t\t[globalUnstyled]\n\t);\n\n\tconst getFileItemClearProps: DropZonePropGetters[\"getFileItemClearProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst isDisabled = innerProps.disabled ?? disabled;\n\n\t\t\treturn {\n\t\t\t\t...innerProps,\n\t\t\t\t...getDropZoneScopeAttrs(\"file-item-clear\"),\n\t\t\t\t\"data-disabled\": dataAttr(isDisabled),\n\t\t\t\tdisabled: isDisabled,\n\t\t\t\tonClick: composeTwoEventHandlers(actions.clearFiles, innerProps.onClick),\n\t\t\t\ttype: \"button\",\n\t\t\t};\n\t\t},\n\t\t[actions.clearFiles, disabled]\n\t);\n\n\tconst propGetters = useMemo<DropZonePropGetters>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tgetContainerProps,\n\t\t\t\tgetFileItemClearProps,\n\t\t\t\tgetFileItemDeleteProps,\n\t\t\t\tgetFileItemMetadataProps,\n\t\t\t\tgetFileItemPreviewProps,\n\t\t\t\tgetFileItemProgressProps,\n\t\t\t\tgetFileItemProps,\n\t\t\t\tgetFileListProps,\n\t\t\t\tgetInputProps,\n\t\t\t\tgetRootProps,\n\t\t\t\tgetTriggerProps,\n\t\t\t}) satisfies DropZonePropGetters,\n\t\t[\n\t\t\tgetContainerProps,\n\t\t\tgetFileItemClearProps,\n\t\t\tgetFileItemDeleteProps,\n\t\t\tgetFileItemMetadataProps,\n\t\t\tgetFileItemPreviewProps,\n\t\t\tgetFileItemProgressProps,\n\t\t\tgetFileItemProps,\n\t\t\tgetFileListProps,\n\t\t\tgetInputProps,\n\t\t\tgetRootProps,\n\t\t\tgetTriggerProps,\n\t\t]\n\t);\n\n\tconst stableUseDropZoneStore = useCallbackRef(useDropZoneStore);\n\n\tconst result = useMemo<UseDropZoneResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisabled,\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tinputRef,\n\t\t\t\tpropGetters,\n\t\t\t\tstoreApi,\n\t\t\t\tuseDropZoneStore: stableUseDropZoneStore,\n\t\t\t}) satisfies UseDropZoneResult,\n\t\t[disabled, disableInternalStateSubscription, propGetters, storeApi, stableUseDropZoneStore]\n\t);\n\n\treturn result;\n};\n","\"use client\";\n\nimport { dataAttr, formatBytes, omitKeys } from \"@zayne-labs/toolkit-core\";\nimport { useCompareSelector } from \"@zayne-labs/toolkit-react\";\nimport type {\n\tCssWithCustomProperties,\n\tInferProps,\n\tPolymorphicPropsStrict,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport {\n\tisBoolean,\n\tisFunction,\n\tisNumber,\n\ttype AnyFunction,\n\ttype SelectorFn,\n\ttype UnionDiscriminator,\n\ttype UnionToIntersection,\n\ttype UnionToTuple,\n} from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { For } from \"@/components/common/for\";\nimport { Presence } from \"@/components/common/presence\";\nimport { Slot } from \"@/components/common/slot\";\nimport { Switch } from \"@/components/common/switch\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport {\n\tDropZoneRootContextProvider,\n\tDropZoneStoreContextProvider,\n\tFileItemContextProvider,\n\tuseDropZoneRootContext,\n\tuseDropZoneStoreContext,\n\tuseFileItemContext,\n\ttype DropZoneRootContextType,\n\ttype FileItemContextType,\n} from \"./drop-zone-context\";\nimport {\n\tFileArchiveIcon,\n\tFileAudioIcon,\n\tFileCodeIcon,\n\tFileCogIcon,\n\tFileIcon,\n\tFileTextIcon,\n\tFileVideoIcon,\n} from \"./icons\";\nimport type { DropZoneStore, PartInputProps, UseDropZoneProps } from \"./types\";\nimport { useDropZone } from \"./use-drop-zone\";\n\n/* eslint-disable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n\nexport type DropZoneRootProps = UseDropZoneProps & {\n\tasChild?: boolean;\n} & PartInputProps[\"root\"];\n\nconst dropzonePropKeys = [\n\t\"allowedFileTypes\",\n\t\"disableFilePickerOpenOnAreaClick\",\n\t\"disableInternalStateSubscription\",\n\t\"disablePreviewGenForNonImageFiles\",\n\t\"disabled\",\n\t\"initialFiles\",\n\t\"maxFileCount\",\n\t\"maxFileSize\",\n\t\"multiple\",\n\t\"onFilesChange\",\n\t\"onUpload\",\n\t\"onValidationError\",\n\t\"onValidationSuccess\",\n\t\"rejectDuplicateFiles\",\n\t\"unstyled\",\n\t\"validator\",\n] satisfies UnionToTuple<keyof UseDropZoneProps>;\n\nexport function DropZoneRoot<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneRootProps>\n) {\n\tconst { as: Element = \"div\", asChild, children, ...restOfProps } = props;\n\n\tconst rootProps = useMemo(() => omitKeys(restOfProps, dropzonePropKeys), [restOfProps]);\n\n\tconst { disabled, disableInternalStateSubscription, inputRef, propGetters, storeApi } =\n\t\tuseDropZone(restOfProps);\n\n\tconst rootContextValue = useMemo<DropZoneRootContextType>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tdisabled,\n\t\t\t\tdisableInternalStateSubscription,\n\t\t\t\tinputRef,\n\t\t\t\tpropGetters,\n\t\t\t}) satisfies DropZoneRootContextType,\n\t\t[disableInternalStateSubscription, disabled, inputRef, propGetters]\n\t);\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<DropZoneStoreContextProvider store={storeApi}>\n\t\t\t<DropZoneRootContextProvider value={rootContextValue}>\n\t\t\t\t<Component {...propGetters.getRootProps(rootProps)}>{children}</Component>\n\t\t\t</DropZoneRootContextProvider>\n\t\t</DropZoneStoreContextProvider>\n\t);\n}\n\nexport type DropZoneContextProps<TSlice> = {\n\tchildren: React.ReactNode | ((context: TSlice) => React.ReactNode);\n\tselector?: SelectorFn<DropZoneStore, TSlice>;\n};\n\nexport function DropZoneContext<TSlice = DropZoneStore>(props: DropZoneContextProps<TSlice>) {\n\tconst { children, selector } = props;\n\n\tconst dropZoneCtx = useDropZoneStoreContext(useCompareSelector(selector));\n\n\tconst resolvedChildren = isFunction(children) ? children(dropZoneCtx) : children;\n\n\treturn resolvedChildren;\n}\n\nexport type DropZoneContainerProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"container\"];\n\nexport function DropZoneContainer<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneContainerProps>\n) {\n\tconst { as: Element = \"div\", asChild, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst isDraggingOver = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isDraggingOver : null\n\t);\n\n\tconst isInvalid = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isInvalid : null\n\t);\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getContainerProps({\n\t\t\t\t...(disableInternalStateSubscription && {\n\t\t\t\t\t\"data-drag-over\": dataAttr(isDraggingOver),\n\t\t\t\t\t\"data-invalid\": dataAttr(isInvalid),\n\t\t\t\t}),\n\t\t\t\t...restOfProps,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport type DropZoneInputProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"input\"];\n\nexport function DropZoneInput(props: DropZoneInputProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst isDraggingOver = useDropZoneStoreContext((store) =>\n\t\tdisableInternalStateSubscription ? store.isDraggingOver : null\n\t);\n\n\tconst Component = asChild ? Slot.Root : \"input\";\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getInputProps({\n\t\t\t\t...(disableInternalStateSubscription && { \"data-drag-over\": dataAttr(isDraggingOver) }),\n\t\t\t\t...restOfProps,\n\t\t\t})}\n\t\t/>\n\t);\n}\n\nexport type DropZoneAreaProps<TSlice = DropZoneStore> = DropZoneContextProps<TSlice> & {\n\tclassNames?: Partial<Record<Extract<keyof PartInputProps, \"container\" | \"input\">, string>>;\n\textraProps?: Partial<Pick<PartInputProps, \"container\" | \"input\">>;\n} & PartInputProps[\"container\"];\n\nexport function DropZoneArea<TSlice = DropZoneStore>(props: DropZoneAreaProps<TSlice>) {\n\tconst { children, className, classNames, extraProps, selector, ...restOfProps } = props;\n\n\treturn (\n\t\t<DropZoneContainer\n\t\t\t{...extraProps?.container}\n\t\t\t{...restOfProps}\n\t\t\tclassName={cnMerge(extraProps?.container?.className, className, classNames?.container)}\n\t\t>\n\t\t\t<DropZoneInput\n\t\t\t\t{...extraProps?.input}\n\t\t\t\tclassName={cnMerge(extraProps?.input?.className, classNames?.input)}\n\t\t\t/>\n\n\t\t\t<DropZoneContext selector={selector}>{children}</DropZoneContext>\n\t\t</DropZoneContainer>\n\t);\n}\n\nexport type DropZoneTriggerProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"trigger\"];\n\nexport function DropZoneTrigger(props: DropZoneTriggerProps) {\n\tconst { asChild, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getTriggerProps(restOfProps)} />;\n}\n\ntype ListPerItemContext = Pick<DropZoneStore, \"actions\"> & {\n\tarray: DropZoneStore[\"fileStateArray\"];\n\tfileState: DropZoneStore[\"fileStateArray\"][number];\n\tindex: number;\n};\n\ntype FileListPerItemVariant = {\n\tchildren: React.ReactNode | ((context: ListPerItemContext) => React.ReactNode);\n\trenderMode?: \"per-item\";\n};\n\ntype ListManualListContext = Pick<DropZoneStore, \"actions\" | \"fileStateArray\">;\n\ntype FileListManualListVariant = {\n\tchildren: React.ReactNode | ((context: ListManualListContext) => React.ReactNode);\n\trenderMode: \"manual-list\";\n};\n\nexport type DropZoneFileListProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n} & (FileListManualListVariant | FileListPerItemVariant)\n\t& Omit<PartInputProps[\"fileList\"], \"children\">;\n\nexport function DropZoneFileList<TElement extends React.ElementType = \"ul\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileListProps>\n) {\n\tconst {\n\t\tas: Element = \"ul\",\n\t\tasChild,\n\t\tchildren,\n\t\tforceMount = false,\n\t\trenderMode = \"per-item\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileStateArray = useDropZoneStoreContext((store) => store.fileStateArray);\n\tconst actions = useDropZoneStoreContext((store) => store.actions);\n\n\tconst { disableInternalStateSubscription, propGetters } = useDropZoneRootContext();\n\n\tconst childrenMap = {\n\t\t\"manual-list\": () => {\n\t\t\tconst childrenFn = children as Extract<FileListManualListVariant[\"children\"], AnyFunction>;\n\t\t\treturn childrenFn({ actions, fileStateArray });\n\t\t},\n\t\t\"per-item\": () => {\n\t\t\tconst childrenFn = children as Extract<FileListPerItemVariant[\"children\"], AnyFunction>;\n\n\t\t\treturn (\n\t\t\t\t<For\n\t\t\t\t\teach={fileStateArray}\n\t\t\t\t\trenderItem={(fileState, index, array) => childrenFn({ actions, array, fileState, index })}\n\t\t\t\t/>\n\t\t\t);\n\t\t},\n\t} satisfies Record<typeof renderMode, () => React.ReactNode>;\n\n\tconst hasFiles = fileStateArray.length > 0;\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<Presence present={hasFiles} forceMount={forceMount}>\n\t\t\t<Component\n\t\t\t\t{...propGetters.getFileListProps({\n\t\t\t\t\t...(disableInternalStateSubscription && { \"data-state\": hasFiles ? \"active\" : \"inactive\" }),\n\t\t\t\t\t...restOfProps,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{isFunction(children) ? childrenMap[renderMode]() : children}\n\t\t\t</Component>\n\t\t</Presence>\n\t);\n}\n\nexport type DropZoneFileItemProps = FileItemContextType & {\n\tasChild?: boolean;\n} & PartInputProps[\"fileItem\"];\n\nexport function DropZoneFileItem<TElement extends React.ElementType = \"li\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemProps>\n) {\n\tconst { as: Element = \"li\", asChild, fileState, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst contextValue = useMemo<FileItemContextType>(\n\t\t() => ({ fileState }) satisfies FileItemContextType,\n\t\t[fileState]\n\t);\n\n\treturn (\n\t\t<FileItemContextProvider value={contextValue}>\n\t\t\t<Component {...propGetters.getFileItemProps(restOfProps)} />\n\t\t</FileItemContextProvider>\n\t);\n}\n\nexport type DropZoneFileItemDeleteProps = {\n\tasChild?: boolean;\n} & PartInputProps[\"fileItemDelete\"];\n\nexport function DropZoneFileItemDelete(props: DropZoneFileItemDeleteProps) {\n\tconst { asChild, fileStateOrID, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\tconst resolvedFileStateOrID = fileStateOrID ?? fileItemContextValue?.fileState;\n\n\treturn (\n\t\t<Component\n\t\t\t{...propGetters.getFileItemDeleteProps({ fileStateOrID: resolvedFileStateOrID, ...restOfProps })}\n\t\t/>\n\t);\n}\n\ntype StrictExtract<TUnion, TPick extends TUnion> = Extract<TUnion, TPick>;\n\nexport type DropZoneFileItemProgressProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n\tsize?: number;\n} & PartInputProps[\"fileItemProgress\"]\n\t& (\n\t\t| {\n\t\t\t\tclassNames?: { svgCircleOne?: string; svgCircleTwo?: string; svgRoot?: string };\n\t\t\t\tvariant: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"circular\">;\n\t\t }\n\t\t| {\n\t\t\t\tclassNames?: { track?: string };\n\t\t\t\tvariant: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"fill\">;\n\t\t }\n\t\t| {\n\t\t\t\tclassNames?: { track?: string };\n\t\t\t\tvariant?: StrictExtract<PartInputProps[\"fileItemProgress\"][\"variant\"], \"linear\">;\n\t\t }\n\t);\n\nexport function DropZoneFileItemProgress<TElement extends React.ElementType = \"span\">(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemProgressProps>\n) {\n\tconst {\n\t\tas: Element = \"span\",\n\t\tasChild,\n\t\tclassName,\n\t\tclassNames: classNamesProp,\n\t\tforceMount = false,\n\t\tsize = 40,\n\t\tvariant = \"linear\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst classNames = classNamesProp as\n\t\t| UnionToIntersection<NonNullable<typeof classNamesProp>>\n\t\t| undefined;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst fileState = fileItemContextValue?.fileState;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst componentProps = propGetters.getFileItemProgressProps({ variant, ...restOfProps });\n\n\treturn (\n\t\t<Presence\n\t\t\tpresent={fileState.progress !== 100}\n\t\t\tforceMount={forceMount}\n\t\t\tclassName=\"data-[animation-phase=exit]:animate-progress-out\"\n\t\t>\n\t\t\t<Component className={cnMerge(\"inline-block\", className)} {...componentProps}>\n\t\t\t\t<Switch.Root>\n\t\t\t\t\t<Switch.Match when={variant === \"circular\"}>\n\t\t\t\t\t\t{() => {\n\t\t\t\t\t\t\tconst circumference = 2 * Math.PI * ((size - 4) / 2);\n\t\t\t\t\t\t\tconst strokeDashoffset = circumference - (fileState.progress / 100) * circumference;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\t\t\tclassName={cnMerge(\"-rotate-90\", classNames?.svgRoot)}\n\t\t\t\t\t\t\t\t\twidth={size}\n\t\t\t\t\t\t\t\t\theight={size}\n\t\t\t\t\t\t\t\t\tviewBox={`0 0 ${size} ${size}`}\n\t\t\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<circle\n\t\t\t\t\t\t\t\t\t\tclassName={cnMerge(\"text-zu-primary/20\", classNames?.svgCircleOne)}\n\t\t\t\t\t\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\t\t\t\t\t\tcx={size / 2}\n\t\t\t\t\t\t\t\t\t\tcy={size / 2}\n\t\t\t\t\t\t\t\t\t\tr={(size - 4) / 2}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<circle\n\t\t\t\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t\t\t\t\"text-zu-primary transition-[stroke-dashoffset] duration-300 ease-linear\",\n\t\t\t\t\t\t\t\t\t\t\tclassNames?.svgCircleTwo\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\t\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\t\t\t\t\t\tstrokeDasharray={2 * Math.PI * ((size - 4) / 2)}\n\t\t\t\t\t\t\t\t\t\tstrokeDashoffset={strokeDashoffset}\n\t\t\t\t\t\t\t\t\t\tcx={size / 2}\n\t\t\t\t\t\t\t\t\t\tcy={size / 2}\n\t\t\t\t\t\t\t\t\t\tr={(size - 4) / 2}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}}\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t\t<Switch.Match when={variant === \"fill\"}>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t`size-full bg-zu-primary/50 transition-[clip-path] duration-300 ease-linear\n\t\t\t\t\t\t\t\t[clip-path:var(--clip-path)]`,\n\t\t\t\t\t\t\t\tclassNames?.track\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\"--clip-path\": `inset(${100 - fileState.progress}% 0% 0% 0%)`,\n\t\t\t\t\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t\t<Switch.Match when={variant === \"linear\"}>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\t`inline-block size-full grow translate-x-(--translate-distance) bg-zu-primary\n\t\t\t\t\t\t\t\ttransition-transform duration-300 ease-linear`,\n\t\t\t\t\t\t\t\tclassNames?.track\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\"--translate-distance\": `-${100 - fileState.progress}%`,\n\t\t\t\t\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Switch.Match>\n\t\t\t\t</Switch.Root>\n\t\t\t</Component>\n\t\t</Presence>\n\t);\n}\n\ntype NodeCtx<TElement extends React.ElementType> = {\n\tgetProps: (innerProps: Partial<InferProps<TElement>>) => InferProps<TElement>;\n};\n\ntype RenderPreviewDetails<TElement extends React.ElementType = \"svg\"> = UnionDiscriminator<\n\t[\n\t\t{ props: InferProps<TElement> },\n\t\t{ node: React.ReactNode | ((ctx: NodeCtx<TElement>) => React.ReactNode) },\n\t]\n>;\n\ntype RenderPropContext = Pick<FileItemContextType, \"fileState\"> & {\n\tfileExtension: string;\n\tfileType: string;\n};\n\ntype RenderPreviewObject = {\n\tarchive?: RenderPreviewDetails;\n\taudio?: RenderPreviewDetails;\n\tcode?: RenderPreviewDetails;\n\tdefault?: RenderPreviewDetails;\n\texecutable?: RenderPreviewDetails;\n\timage?: RenderPreviewDetails<\"img\">;\n\ttext?: RenderPreviewDetails;\n\tvideo?: RenderPreviewDetails;\n};\ntype RenderPreviewFn = (context: RenderPropContext) => RenderPreviewObject;\n\ntype RenderPreview = RenderPreviewFn | RenderPreviewObject;\n\nexport type DropZoneFileItemPreviewProps = Partial<Pick<FileItemContextType, \"fileState\">> & {\n\tasChild?: boolean;\n\tchildren?:\n\t\t| React.ReactNode\n\t\t| ((context: RenderPropContext & { fallbackPreview: () => React.ReactNode }) => React.ReactNode);\n\trenderPreview?: boolean | RenderPreview;\n} & Omit<PartInputProps[\"fileItemPreview\"], \"children\">;\n\nexport function DropZoneFileItemPreview<TElement extends React.ElementType>(\n\tprops: PolymorphicPropsStrict<TElement, DropZoneFileItemPreviewProps>\n) {\n\tconst {\n\t\tas: Element = \"span\",\n\t\tasChild,\n\t\tchildren,\n\t\tfileState: fileStateProp,\n\t\trenderPreview = true,\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileState = fileStateProp ?? fileItemContextValue?.fileState;\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst fileType = fileState.file.type ?? \"\";\n\n\tconst fileExtension = fileState.file.name?.split(\".\").pop()?.toLowerCase() ?? \"\";\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\tconst fallbackPreview = () =>\n\t\tgetFilePreviewOrIcon({ fileExtension, fileState, fileType, renderPreview });\n\n\tconst resolvedChildren =\n\t\tisFunction(children) ? children({ fallbackPreview, fileExtension, fileState, fileType }) : children;\n\n\treturn (\n\t\t<Component {...propGetters.getFileItemPreviewProps(restOfProps)}>\n\t\t\t{renderPreview && fallbackPreview()}\n\t\t\t{resolvedChildren}\n\t\t</Component>\n\t);\n}\n\nconst resolvePreviewNode = <\n\tTPreviewDetail extends NonNullable<RenderPreviewObject[keyof RenderPreviewObject]>,\n\tTNodeFn extends Extract<TPreviewDetail[\"node\"], AnyFunction>,\n>(\n\tdetails: TPreviewDetail | undefined,\n\tgetProps: Parameters<TNodeFn>[0][\"getProps\"] = ((props: unknown) => props) as never\n) => {\n\tconst resolvedNode =\n\t\tisFunction(details?.node) ? details.node({ getProps: getProps as never }) : details?.node;\n\n\treturn resolvedNode;\n};\n\nconst getFilePreviewOrIcon = (\n\tcontext: Pick<Required<DropZoneFileItemPreviewProps>, \"renderPreview\"> & Required<RenderPropContext>\n): React.ReactNode => {\n\tconst { fileExtension, fileState, fileType, renderPreview } = context;\n\n\tconst renderPreviewValue = isBoolean(renderPreview) ? {} : renderPreview;\n\n\tconst resolvedRenderPreviewObject =\n\t\tisFunction(renderPreviewValue) ?\n\t\t\trenderPreviewValue({ fileExtension, fileState, fileType })\n\t\t:\trenderPreviewValue;\n\n\tswitch (true) {\n\t\tcase fileType.startsWith(\"image/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.image, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\talt: innerProps.alt ?? fileState.file.name ?? \"\",\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t\tsrc: innerProps.src ?? fileState.preview,\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<img\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.image?.props}\n\t\t\t\t\t\tsrc={fileState.preview}\n\t\t\t\t\t\talt={fileState.file.name ?? \"\"}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.image?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"video/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.video, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<FileVideoIcon\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.video?.props}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.video?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"audio/\"): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.audio, (innerProps) => ({\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: cnMerge(\"size-full object-cover\", innerProps.className),\n\t\t\t}));\n\n\t\t\treturn (\n\t\t\t\tresolvedNode ?? (\n\t\t\t\t\t<FileAudioIcon\n\t\t\t\t\t\t{...resolvedRenderPreviewObject.audio?.props}\n\t\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\t\"size-full object-cover\",\n\t\t\t\t\t\t\tresolvedRenderPreviewObject.audio?.props?.className\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tcase fileType.startsWith(\"text/\") || [\"md\", \"pdf\", \"rtf\", \"txt\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.text);\n\n\t\t\treturn resolvedNode ?? <FileTextIcon {...resolvedRenderPreviewObject.text?.props} />;\n\t\t}\n\n\t\tcase [\n\t\t\t\"c\",\n\t\t\t\"cpp\",\n\t\t\t\"cs\",\n\t\t\t\"css\",\n\t\t\t\"html\",\n\t\t\t\"java\",\n\t\t\t\"js\",\n\t\t\t\"json\",\n\t\t\t\"jsx\",\n\t\t\t\"php\",\n\t\t\t\"py\",\n\t\t\t\"rb\",\n\t\t\t\"ts\",\n\t\t\t\"tsx\",\n\t\t\t\"xml\",\n\t\t].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.code);\n\n\t\t\treturn resolvedNode ?? <FileCodeIcon {...resolvedRenderPreviewObject.code?.props} />;\n\t\t}\n\n\t\tcase [\"7z\", \"bz2\", \"gz\", \"rar\", \"tar\", \"zip\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.archive);\n\n\t\t\treturn resolvedNode ?? <FileArchiveIcon {...resolvedRenderPreviewObject.archive?.props} />;\n\t\t}\n\n\t\tcase [\"apk\", \"app\", \"deb\", \"exe\", \"msi\", \"rpm\"].includes(fileExtension): {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.executable);\n\n\t\t\treturn resolvedNode ?? <FileCogIcon {...resolvedRenderPreviewObject.executable?.props} />;\n\t\t}\n\n\t\tdefault: {\n\t\t\tconst resolvedNode = resolvePreviewNode(resolvedRenderPreviewObject.default);\n\n\t\t\treturn resolvedNode ?? <FileIcon {...resolvedRenderPreviewObject.default?.props} />;\n\t\t}\n\t}\n};\n\nexport type DropZoneFileItemMetadataProps = Partial<Pick<FileItemContextType, \"fileState\">> & {\n\tasChild?: boolean;\n\tchildren?: React.ReactNode | ((context: Pick<FileItemContextType, \"fileState\">) => React.ReactNode);\n\tclassNames?: {\n\t\tname?: string;\n\t\tsize?: string;\n\t};\n\tsize?: \"default\" | \"sm\";\n} & Omit<PartInputProps[\"fileItemMetadata\"], \"children\">;\n\nexport function DropZoneFileItemMetadata(props: DropZoneFileItemMetadataProps) {\n\tconst {\n\t\tasChild,\n\t\tchildren,\n\t\tclassNames,\n\t\tfileState: fileStateProp,\n\t\tsize = \"default\",\n\t\t...restOfProps\n\t} = props;\n\n\tconst fileItemContextValue = useFileItemContext();\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileState = fileStateProp ?? fileItemContextValue?.fileState;\n\n\tif (!fileState) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : \"div\";\n\n\tconst resolvedChildren = isFunction(children) ? children({ fileState }) : children;\n\n\tconst getDefaultMetadataChildren = () => {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<p\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"truncate\",\n\t\t\t\t\t\tsize === \"default\" && \"text-[14px] font-medium\",\n\t\t\t\t\t\tsize === \"sm\" && \"text-[13px] leading-snug\",\n\t\t\t\t\t\tclassNames?.name\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{fileState.file.name}\n\t\t\t\t</p>\n\t\t\t\t<p\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"truncate text-zu-muted-foreground\",\n\t\t\t\t\t\tsize === \"default\" && \"text-[12px]\",\n\t\t\t\t\t\tsize === \"sm\" && \"text-[11px] leading-snug\",\n\t\t\t\t\t\tclassNames?.size\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{isNumber(fileState.file.size) && formatBytes(fileState.file.size)}\n\t\t\t\t</p>\n\t\t\t\t{fileState.error && (\n\t\t\t\t\t<p className=\"text-[12px] text-zu-destructive\">{fileState.error.message}</p>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t};\n\n\treturn (\n\t\t<Component {...propGetters.getFileItemMetadataProps(restOfProps)}>\n\t\t\t{resolvedChildren ?? getDefaultMetadataChildren()}\n\t\t</Component>\n\t);\n}\n\nexport type DropZoneFileClearProps = {\n\tasChild?: boolean;\n\tforceMount?: boolean;\n} & PartInputProps[\"fileItemClear\"];\n\nexport function DropZoneFileClear(props: DropZoneFileClearProps) {\n\tconst { asChild, forceMount = false, ...restOfProps } = props;\n\n\tconst { propGetters } = useDropZoneRootContext();\n\n\tconst fileCount = useDropZoneStoreContext((state) => state.fileStateArray.length);\n\n\tconst shouldRender = forceMount || fileCount > 0;\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\tconst Component = asChild ? Slot.Root : \"button\";\n\n\treturn <Component {...propGetters.getFileItemClearProps(restOfProps)} />;\n}\n\n/* eslint-enable perfectionist/sort-intersection-types -- I need non-standard props to come first */\n","export {\n\tDropZoneArea as Area,\n\tDropZoneContainer as Container,\n\tDropZoneContext as Context,\n\tDropZoneFileClear as FileClear,\n\tDropZoneFileItem as FileItem,\n\tDropZoneFileItemDelete as FileItemDelete,\n\tDropZoneFileItemMetadata as FileItemMetadata,\n\tDropZoneFileItemPreview as FileItemPreview,\n\tDropZoneFileItemProgress as FileItemProgress,\n\tDropZoneFileList as FileList,\n\tDropZoneInput as Input,\n\tDropZoneRoot as Root,\n\tDropZoneTrigger as Trigger,\n} from \"./drop-zone\";\n"],"mappings":"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"}
|
package/dist/style.css
CHANGED
|
@@ -211,8 +211,8 @@
|
|
|
211
211
|
.right-0 {
|
|
212
212
|
right: calc(var(--spacing) * 0);
|
|
213
213
|
}
|
|
214
|
-
.bottom
|
|
215
|
-
bottom:
|
|
214
|
+
.bottom-6 {
|
|
215
|
+
bottom: calc(var(--spacing) * 6);
|
|
216
216
|
}
|
|
217
217
|
.left-0 {
|
|
218
218
|
left: calc(var(--spacing) * 0);
|
|
@@ -290,8 +290,8 @@
|
|
|
290
290
|
.h-1\.5 {
|
|
291
291
|
height: calc(var(--spacing) * 1.5);
|
|
292
292
|
}
|
|
293
|
-
.w
|
|
294
|
-
width:
|
|
293
|
+
.w-9 {
|
|
294
|
+
width: calc(var(--spacing) * 9);
|
|
295
295
|
}
|
|
296
296
|
.w-full {
|
|
297
297
|
width: 100%;
|
|
@@ -368,8 +368,8 @@
|
|
|
368
368
|
.gap-2\.5 {
|
|
369
369
|
gap: calc(var(--spacing) * 2.5);
|
|
370
370
|
}
|
|
371
|
-
.gap
|
|
372
|
-
gap:
|
|
371
|
+
.gap-4 {
|
|
372
|
+
gap: calc(var(--spacing) * 4);
|
|
373
373
|
}
|
|
374
374
|
.truncate {
|
|
375
375
|
overflow: hidden;
|
|
@@ -388,8 +388,8 @@
|
|
|
388
388
|
.overflow-y-hidden {
|
|
389
389
|
overflow-y: hidden;
|
|
390
390
|
}
|
|
391
|
-
.rounded-\[
|
|
392
|
-
border-radius:
|
|
391
|
+
.rounded-\[6px\] {
|
|
392
|
+
border-radius: 6px;
|
|
393
393
|
}
|
|
394
394
|
.rounded-\[50\%\] {
|
|
395
395
|
border-radius: 50%;
|
|
@@ -691,26 +691,6 @@
|
|
|
691
691
|
margin-top: calc(var(--spacing) * 1);
|
|
692
692
|
}
|
|
693
693
|
}
|
|
694
|
-
.max-md\:cursor-default {
|
|
695
|
-
@media (width < 48rem) {
|
|
696
|
-
cursor: default;
|
|
697
|
-
}
|
|
698
|
-
}
|
|
699
|
-
.max-md\:flex-col {
|
|
700
|
-
@media (width < 48rem) {
|
|
701
|
-
flex-direction: column;
|
|
702
|
-
}
|
|
703
|
-
}
|
|
704
|
-
.md\:cursor-default {
|
|
705
|
-
@media (width >= 48rem) {
|
|
706
|
-
cursor: default;
|
|
707
|
-
}
|
|
708
|
-
}
|
|
709
|
-
.md\:flex-col {
|
|
710
|
-
@media (width >= 48rem) {
|
|
711
|
-
flex-direction: column;
|
|
712
|
-
}
|
|
713
|
-
}
|
|
714
694
|
.lg\:size-6 {
|
|
715
695
|
@media (width >= 64rem) {
|
|
716
696
|
width: calc(var(--spacing) * 6);
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zayne-labs/ui-react",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.11.
|
|
4
|
+
"version": "0.11.6",
|
|
5
5
|
"description": "A composable UI/UI-utilities components library. ",
|
|
6
6
|
"author": "Ryan Zayne",
|
|
7
7
|
"license": "MIT",
|
|
@@ -30,11 +30,11 @@
|
|
|
30
30
|
"node": ">=18.x"
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
|
-
"react": "19.
|
|
34
|
-
"react-dom": "19.
|
|
35
|
-
"react-hook-form": "7.
|
|
36
|
-
"tailwind-merge": "^
|
|
37
|
-
"tailwindcss": "4.
|
|
33
|
+
"react": "^19.2.5",
|
|
34
|
+
"react-dom": "^19.2.5",
|
|
35
|
+
"react-hook-form": "^7.72.1",
|
|
36
|
+
"tailwind-merge": "^3.5.0",
|
|
37
|
+
"tailwindcss": "^4.2.2"
|
|
38
38
|
},
|
|
39
39
|
"peerDependenciesMeta": {
|
|
40
40
|
"react-hook-form": {
|
|
@@ -57,21 +57,21 @@
|
|
|
57
57
|
"@total-typescript/ts-reset": "0.6.1",
|
|
58
58
|
"@types/react": "19.2.14",
|
|
59
59
|
"@types/react-dom": "19.2.3",
|
|
60
|
-
"@zayne-labs/prettier-config": "0.
|
|
61
|
-
"@zayne-labs/tsconfig": "0.
|
|
60
|
+
"@zayne-labs/prettier-config": "0.13.1",
|
|
61
|
+
"@zayne-labs/tsconfig": "0.13.1",
|
|
62
62
|
"concurrently": "9.2.1",
|
|
63
63
|
"cross-env": "10.1.0",
|
|
64
|
-
"prettier": "3.8.
|
|
64
|
+
"prettier": "3.8.2",
|
|
65
65
|
"prettier-plugin-classnames": "0.10.1",
|
|
66
66
|
"prettier-plugin-merge": "0.10.1",
|
|
67
67
|
"prettier-plugin-tailwindcss": "0.7.2",
|
|
68
68
|
"publint": "0.3.18",
|
|
69
|
-
"react": "19.2.
|
|
70
|
-
"react-dom": "19.2.
|
|
71
|
-
"react-hook-form": "7.72.
|
|
69
|
+
"react": "^19.2.5",
|
|
70
|
+
"react-dom": "^19.2.5",
|
|
71
|
+
"react-hook-form": "^7.72.1",
|
|
72
72
|
"size-limit": "12.0.1",
|
|
73
|
-
"tailwind-merge": "3.5.0",
|
|
74
|
-
"tailwindcss": "4.2.2",
|
|
73
|
+
"tailwind-merge": "^3.5.0",
|
|
74
|
+
"tailwindcss": "^4.2.2",
|
|
75
75
|
"tsdown": "0.21.7",
|
|
76
76
|
"typescript": "6.0.2"
|
|
77
77
|
},
|