@jenesei-software/jenesei-kit-react 1.3.39 → 2.0.0

package/README.md

@@ -2,39 +2,6 @@
 
 This is a frontend library for React from Jenesei Software.
 
-## Customize the theme
-
-To use themes in your application, create a declaration themes file and extend `styled-comments` as follows:
-
-```typescript
-// styled-components.d.ts
-import { ITheme } from '@jenesei-software/jenesei-kit-react/style-theme'
-import 'styled-components'
-
-declare module 'styled-components' {
-  // eslint-disable-next-line @typescript-eslint/no-empty-object-type
-  export interface DefaultTheme extends ITheme {}
-}
-```
-
-Import `JeneseiTheme` and `JeneseiGlobalStyles` from our library and apply them in the root component of your application:
-
-```typescript
-// app.tsx
-import { JeneseiGlobalStyles, JeneseiTheme } from '@jenesei-software/jenesei-kit-react/style-theme'
-
-function App() {
-  return (
-    ...
-      <ThemeProvider theme={JeneseiTheme}>
-        <JeneseiGlobalStyles />
-        {/* Your components */}
-      </ThemeProvider>
-    ...
-  )
-}
-```
-
 ## Customize the cookie and local storage
 
 ```typescript
@@ -62,10 +29,6 @@ declare module '@jenesei-software/jenesei-kit-react/context-local-storage' {
 To work correctly you need to install the following dependencies:
 
 ```bash
-npm install @tanstack/react-router --save
-npm install @tanstack/react-virtual --save
-npm install framer-motion --save
 npm install react --save
 npm install react-dom --save
-npm install styled-components --save
 ```

package/build/AnimatePresence-BByJ67dn.js

@@ -0,0 +1,134 @@
+import { a as K, c as N, i as O, o as S, r as U, s as I } from "./proxy-DTLy-pV-.js";
+import { Fragment as V, jsx as g } from "react/jsx-runtime";
+import * as M from "react";
+import { Children as _, isValidElement as B, useCallback as F, useContext as L, useId as D, useInsertionEffect as G, useMemo as P, useRef as y, useState as k } from "react";
+var H = class extends M.Component {
+  getSnapshotBeforeUpdate(o) {
+    const t = this.props.childRef.current;
+    if (t && o.isPresent && !this.props.isPresent) {
+      const e = this.props.sizeRef.current;
+      e.height = t.offsetHeight || 0, e.width = t.offsetWidth || 0, e.top = t.offsetTop, e.left = t.offsetLeft;
+    }
+    return null;
+  }
+  componentDidUpdate() {
+  }
+  render() {
+    return this.props.children;
+  }
+};
+function W({ children: o, isPresent: t }) {
+  const e = D(), i = y(null), m = y({
+    width: 0,
+    height: 0,
+    top: 0,
+    left: 0
+  }), { nonce: f } = L(K);
+  return G(() => {
+    const { width: a, height: s, top: h, left: n } = m.current;
+    if (t || !i.current || !a || !s) return;
+    i.current.dataset.motionPopId = e;
+    const l = document.createElement("style");
+    return f && (l.nonce = f), document.head.appendChild(l), l.sheet && l.sheet.insertRule(`
+          [data-motion-pop-id="${e}"] {
+            position: absolute !important;
+            width: ${a}px !important;
+            height: ${s}px !important;
+            top: ${h}px !important;
+            left: ${n}px !important;
+          }
+        `), () => {
+      document.head.removeChild(l);
+    };
+  }, [t]), g(H, {
+    isPresent: t,
+    childRef: i,
+    sizeRef: m,
+    children: M.cloneElement(o, { ref: i })
+  });
+}
+var Y = ({ children: o, initial: t, isPresent: e, onExitComplete: i, custom: m, presenceAffectsLayout: f, mode: a }) => {
+  const s = I(q), h = D(), n = F((u) => {
+    s.set(u, !0);
+    for (const C of s.values()) if (!C) return;
+    i && i();
+  }, [s, i]), l = P(() => ({
+    id: h,
+    initial: t,
+    isPresent: e,
+    custom: m,
+    onExitComplete: n,
+    register: (u) => (s.set(u, !1), () => s.delete(u))
+  }), f ? [Math.random(), n] : [e, n]);
+  return P(() => {
+    s.forEach((u, C) => s.set(C, !1));
+  }, [e]), M.useEffect(() => {
+    !e && !s.size && i && i();
+  }, [e]), a === "popLayout" && (o = g(W, {
+    isPresent: e,
+    children: o
+  })), g(S.Provider, {
+    value: l,
+    children: o
+  });
+};
+function q() {
+  return /* @__PURE__ */ new Map();
+}
+var x = (o) => o.key || "";
+function b(o) {
+  const t = [];
+  return _.forEach(o, (e) => {
+    B(e) && t.push(e);
+  }), t;
+}
+var Z = ({ children: o, custom: t, initial: e = !0, onExitComplete: i, presenceAffectsLayout: m = !0, mode: f = "sync", propagate: a = !1 }) => {
+  const [s, h] = O(a), n = P(() => b(o), [o]), l = a && !s ? [] : n.map(x), u = y(!0), C = y(n), v = I(() => /* @__PURE__ */ new Map()), [T, j] = k(n), [d, z] = k(n);
+  U(() => {
+    u.current = !1, C.current = n;
+    for (let c = 0; c < d.length; c++) {
+      const r = x(d[c]);
+      l.includes(r) ? v.delete(r) : v.get(r) !== !0 && v.set(r, !1);
+    }
+  }, [
+    d,
+    l.length,
+    l.join("-")
+  ]);
+  const w = [];
+  if (n !== T) {
+    let c = [...n];
+    for (let r = 0; r < d.length; r++) {
+      const p = d[r], R = x(p);
+      l.includes(R) || (c.splice(r, 0, p), w.push(p));
+    }
+    f === "wait" && w.length && (c = w), z(b(c)), j(n);
+    return;
+  }
+  process.env.NODE_ENV !== "production" && f === "wait" && d.length > 1 && console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);
+  const { forceRender: E } = L(N);
+  return g(V, { children: d.map((c) => {
+    const r = x(c), p = a && !s ? !1 : n === d || l.includes(r), R = () => {
+      if (v.has(r)) v.set(r, !0);
+      else return;
+      let $ = !0;
+      v.forEach((A) => {
+        A || ($ = !1);
+      }), $ && (E?.(), z(C.current), a && h?.(), i && i());
+    };
+    return g(Y, {
+      isPresent: p,
+      initial: !u.current || e ? void 0 : !1,
+      custom: p ? void 0 : t,
+      presenceAffectsLayout: m,
+      mode: f,
+      onExitComplete: p ? void 0 : R,
+      children: c
+    }, r);
+  }) });
+};
+export {
+  Z as t
+};
+
+//# sourceMappingURL=AnimatePresence-BByJ67dn.js.map

package/build/AnimatePresence-BByJ67dn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimatePresence-BByJ67dn.js","names":["React"],"sources":["../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/utils.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs"],"sourcesContent":["\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useRef, useContext, useInsertionEffect } from 'react';\nimport { MotionConfigContext } from '../../context/MotionConfigContext.mjs';\n\n/**\n * Measurement functionality has to be within a separate component\n * to leverage snapshot lifecycle.\n */\nclass PopChildMeasure extends React.Component {\n    getSnapshotBeforeUpdate(prevProps) {\n        const element = this.props.childRef.current;\n        if (element && prevProps.isPresent && !this.props.isPresent) {\n            const size = this.props.sizeRef.current;\n            size.height = element.offsetHeight || 0;\n            size.width = element.offsetWidth || 0;\n            size.top = element.offsetTop;\n            size.left = element.offsetLeft;\n        }\n        return null;\n    }\n    /**\n     * Required with getSnapshotBeforeUpdate to stop React complaining.\n     */\n    componentDidUpdate() { }\n    render() {\n        return this.props.children;\n    }\n}\nfunction PopChild({ children, isPresent }) {\n    const id = useId();\n    const ref = useRef(null);\n    const size = useRef({\n        width: 0,\n        height: 0,\n        top: 0,\n        left: 0,\n    });\n    const { nonce } = useContext(MotionConfigContext);\n    /**\n     * We create and inject a style block so we can apply this explicit\n     * sizing in a non-destructive manner by just deleting the style block.\n     *\n     * We can't apply size via render as the measurement happens\n     * in getSnapshotBeforeUpdate (post-render), likewise if we apply the\n     * styles directly on the DOM node, we might be overwriting\n     * styles set via the style prop.\n     */\n    useInsertionEffect(() => {\n        const { width, height, top, left } = size.current;\n        if (isPresent || !ref.current || !width || !height)\n            return;\n        ref.current.dataset.motionPopId = id;\n        const style = document.createElement(\"style\");\n        if (nonce)\n            style.nonce = nonce;\n        document.head.appendChild(style);\n        if (style.sheet) {\n            style.sheet.insertRule(`\n          [data-motion-pop-id=\"${id}\"] {\n            position: absolute !important;\n            width: ${width}px !important;\n            height: ${height}px !important;\n            top: ${top}px !important;\n            left: ${left}px !important;\n          }\n        `);\n        }\n        return () => {\n            document.head.removeChild(style);\n        };\n    }, [isPresent]);\n    return (jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React.cloneElement(children, { ref }) }));\n}\n\nexport { PopChild };\n","\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useCallback, useMemo } from 'react';\nimport { PresenceContext } from '../../context/PresenceContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PopChild } from './PopChild.mjs';\n\nconst PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, }) => {\n    const presenceChildren = useConstant(newChildrenMap);\n    const id = useId();\n    const memoizedOnExitComplete = useCallback((childId) => {\n        presenceChildren.set(childId, true);\n        for (const isComplete of presenceChildren.values()) {\n            if (!isComplete)\n                return; // can stop searching when any is incomplete\n        }\n        onExitComplete && onExitComplete();\n    }, [presenceChildren, onExitComplete]);\n    const context = useMemo(() => ({\n        id,\n        initial,\n        isPresent,\n        custom,\n        onExitComplete: memoizedOnExitComplete,\n        register: (childId) => {\n            presenceChildren.set(childId, false);\n            return () => presenceChildren.delete(childId);\n        },\n    }), \n    /**\n     * If the presence of a child affects the layout of the components around it,\n     * we want to make a new context value to ensure they get re-rendered\n     * so they can detect that layout change.\n     */\n    presenceAffectsLayout\n        ? [Math.random(), memoizedOnExitComplete]\n        : [isPresent, memoizedOnExitComplete]);\n    useMemo(() => {\n        presenceChildren.forEach((_, key) => presenceChildren.set(key, false));\n    }, [isPresent]);\n    /**\n     * If there's no `motion` components to fire exit animations, we want to remove this\n     * component immediately.\n     */\n    React.useEffect(() => {\n        !isPresent &&\n            !presenceChildren.size &&\n            onExitComplete &&\n            onExitComplete();\n    }, [isPresent]);\n    if (mode === \"popLayout\") {\n        children = jsx(PopChild, { isPresent: isPresent, children: children });\n    }\n    return (jsx(PresenceContext.Provider, { value: context, children: children }));\n};\nfunction newChildrenMap() {\n    return new Map();\n}\n\nexport { PresenceChild };\n","import { Children, isValidElement } from 'react';\n\nconst getChildKey = (child) => child.key || \"\";\nfunction onlyElements(children) {\n    const filtered = [];\n    // We use forEach here instead of map as map mutates the component key by preprending `.$`\n    Children.forEach(children, (child) => {\n        if (isValidElement(child))\n            filtered.push(child);\n    });\n    return filtered;\n}\n\nexport { getChildKey, onlyElements };\n","\"use client\";\nimport { jsx, Fragment } from 'react/jsx-runtime';\nimport { useMemo, useRef, useState, useContext } from 'react';\nimport { LayoutGroupContext } from '../../context/LayoutGroupContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PresenceChild } from './PresenceChild.mjs';\nimport { usePresence } from './use-presence.mjs';\nimport { onlyElements, getChildKey } from './utils.mjs';\nimport { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs';\n\n/**\n * `AnimatePresence` enables the animation of components that have been removed from the tree.\n *\n * When adding/removing more than a single child, every child **must** be given a unique `key` prop.\n *\n * Any `motion` components that have an `exit` property defined will animate out when removed from\n * the tree.\n *\n * ```jsx\n * import { motion, AnimatePresence } from 'framer-motion'\n *\n * export const Items = ({ items }) => (\n *   <AnimatePresence>\n *     {items.map(item => (\n *       <motion.div\n *         key={item.id}\n *         initial={{ opacity: 0 }}\n *         animate={{ opacity: 1 }}\n *         exit={{ opacity: 0 }}\n *       />\n *     ))}\n *   </AnimatePresence>\n * )\n * ```\n *\n * You can sequence exit animations throughout a tree using variants.\n *\n * If a child contains multiple `motion` components with `exit` props, it will only unmount the child\n * once all `motion` components have finished animating out. Likewise, any components using\n * `usePresence` all need to call `safeToRemove`.\n *\n * @public\n */\nconst AnimatePresence = ({ children, custom, initial = true, onExitComplete, presenceAffectsLayout = true, mode = \"sync\", propagate = false, }) => {\n    const [isParentPresent, safeToRemove] = usePresence(propagate);\n    /**\n     * Filter any children that aren't ReactElements. We can only track components\n     * between renders with a props.key.\n     */\n    const presentChildren = useMemo(() => onlyElements(children), [children]);\n    /**\n     * Track the keys of the currently rendered children. This is used to\n     * determine which children are exiting.\n     */\n    const presentKeys = propagate && !isParentPresent ? [] : presentChildren.map(getChildKey);\n    /**\n     * If `initial={false}` we only want to pass this to components in the first render.\n     */\n    const isInitialRender = useRef(true);\n    /**\n     * A ref containing the currently present children. When all exit animations\n     * are complete, we use this to re-render the component with the latest children\n     * *committed* rather than the latest children *rendered*.\n     */\n    const pendingPresentChildren = useRef(presentChildren);\n    /**\n     * Track which exiting children have finished animating out.\n     */\n    const exitComplete = useConstant(() => new Map());\n    /**\n     * Save children to render as React state. To ensure this component is concurrent-safe,\n     * we check for exiting children via an effect.\n     */\n    const [diffedChildren, setDiffedChildren] = useState(presentChildren);\n    const [renderedChildren, setRenderedChildren] = useState(presentChildren);\n    useIsomorphicLayoutEffect(() => {\n        isInitialRender.current = false;\n        pendingPresentChildren.current = presentChildren;\n        /**\n         * Update complete status of exiting children.\n         */\n        for (let i = 0; i < renderedChildren.length; i++) {\n            const key = getChildKey(renderedChildren[i]);\n            if (!presentKeys.includes(key)) {\n                if (exitComplete.get(key) !== true) {\n                    exitComplete.set(key, false);\n                }\n            }\n            else {\n                exitComplete.delete(key);\n            }\n        }\n    }, [renderedChildren, presentKeys.length, presentKeys.join(\"-\")]);\n    const exitingChildren = [];\n    if (presentChildren !== diffedChildren) {\n        let nextChildren = [...presentChildren];\n        /**\n         * Loop through all the currently rendered components and decide which\n         * are exiting.\n         */\n        for (let i = 0; i < renderedChildren.length; i++) {\n            const child = renderedChildren[i];\n            const key = getChildKey(child);\n            if (!presentKeys.includes(key)) {\n                nextChildren.splice(i, 0, child);\n                exitingChildren.push(child);\n            }\n        }\n        /**\n         * If we're in \"wait\" mode, and we have exiting children, we want to\n         * only render these until they've all exited.\n         */\n        if (mode === \"wait\" && exitingChildren.length) {\n            nextChildren = exitingChildren;\n        }\n        setRenderedChildren(onlyElements(nextChildren));\n        setDiffedChildren(presentChildren);\n        /**\n         * Early return to ensure once we've set state with the latest diffed\n         * children, we can immediately re-render.\n         */\n        return;\n    }\n    if (process.env.NODE_ENV !== \"production\" &&\n        mode === \"wait\" &&\n        renderedChildren.length > 1) {\n        console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to \"wait\". This will lead to odd visual behaviour.`);\n    }\n    /**\n     * If we've been provided a forceRender function by the LayoutGroupContext,\n     * we can use it to force a re-render amongst all surrounding components once\n     * all components have finished animating out.\n     */\n    const { forceRender } = useContext(LayoutGroupContext);\n    return (jsx(Fragment, { children: renderedChildren.map((child) => {\n            const key = getChildKey(child);\n            const isPresent = propagate && !isParentPresent\n                ? false\n                : presentChildren === renderedChildren ||\n                    presentKeys.includes(key);\n            const onExit = () => {\n                if (exitComplete.has(key)) {\n                    exitComplete.set(key, true);\n                }\n                else {\n                    return;\n                }\n                let isEveryExitComplete = true;\n                exitComplete.forEach((isExitComplete) => {\n                    if (!isExitComplete)\n                        isEveryExitComplete = false;\n                });\n                if (isEveryExitComplete) {\n                    forceRender === null || forceRender === void 0 ? void 0 : forceRender();\n                    setRenderedChildren(pendingPresentChildren.current);\n                    propagate && (safeToRemove === null || safeToRemove === void 0 ? void 0 : safeToRemove());\n                    onExitComplete && onExitComplete();\n                }\n            };\n            return (jsx(PresenceChild, { isPresent: isPresent, initial: !isInitialRender.current || initial\n                    ? undefined\n                    : false, custom: isPresent ? undefined : custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode, onExitComplete: isPresent ? undefined : onExit, children: child }, key));\n        }) }));\n};\n\nexport { AnimatePresence };\n"],"x_google_ignoreList":[0,1,2,3],"mappings":"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"}

package/build/AnimatePresence-BtUPiqYm.cjs

@@ -0,0 +1,11 @@
+const z=require("./chunk-CW3en5xf.cjs"),C=require("./proxy-D2Z8K6jr.cjs");let y=require("react/jsx-runtime"),e=require("react");e=z.__toESM(e,1);var I=class extends e.Component{getSnapshotBeforeUpdate(s){const n=this.props.childRef.current;if(n&&s.isPresent&&!this.props.isPresent){const t=this.props.sizeRef.current;t.height=n.offsetHeight||0,t.width=n.offsetWidth||0,t.top=n.offsetTop,t.left=n.offsetLeft}return null}componentDidUpdate(){}render(){return this.props.children}};function $({children:s,isPresent:n}){const t=(0,e.useId)(),u=(0,e.useRef)(null),x=(0,e.useRef)({width:0,height:0,top:0,left:0}),{nonce:d}=(0,e.useContext)(C.MotionConfigContext);return(0,e.useInsertionEffect)(()=>{const{width:f,height:i,top:p,left:r}=x.current;if(n||!u.current||!f||!i)return;u.current.dataset.motionPopId=t;const l=document.createElement("style");return d&&(l.nonce=d),document.head.appendChild(l),l.sheet&&l.sheet.insertRule(`
+          [data-motion-pop-id="${t}"] {
+            position: absolute !important;
+            width: ${f}px !important;
+            height: ${i}px !important;
+            top: ${p}px !important;
+            left: ${r}px !important;
+          }
+        `),()=>{document.head.removeChild(l)}},[n]),(0,y.jsx)(I,{isPresent:n,childRef:u,sizeRef:x,children:e.cloneElement(s,{ref:u})})}var L=({children:s,initial:n,isPresent:t,onExitComplete:u,custom:x,presenceAffectsLayout:d,mode:f})=>{const i=C.useConstant(S),p=(0,e.useId)(),r=(0,e.useCallback)(a=>{i.set(a,!0);for(const v of i.values())if(!v)return;u&&u()},[i,u]),l=(0,e.useMemo)(()=>({id:p,initial:n,isPresent:t,custom:x,onExitComplete:r,register:a=>(i.set(a,!1),()=>i.delete(a))}),d?[Math.random(),r]:[t,r]);return(0,e.useMemo)(()=>{i.forEach((a,v)=>i.set(v,!1))},[t]),e.useEffect(()=>{!t&&!i.size&&u&&u()},[t]),f==="popLayout"&&(s=(0,y.jsx)($,{isPresent:t,children:s})),(0,y.jsx)(C.PresenceContext.Provider,{value:l,children:s})};function S(){return new Map}var E=s=>s.key||"";function _(s){const n=[];return e.Children.forEach(s,t=>{(0,e.isValidElement)(t)&&n.push(t)}),n}var A=({children:s,custom:n,initial:t=!0,onExitComplete:u,presenceAffectsLayout:x=!0,mode:d="sync",propagate:f=!1})=>{const[i,p]=C.usePresence(f),r=(0,e.useMemo)(()=>_(s),[s]),l=f&&!i?[]:r.map(E),a=(0,e.useRef)(!0),v=(0,e.useRef)(r),g=C.useConstant(()=>new Map),[b,k]=(0,e.useState)(r),[h,P]=(0,e.useState)(r);C.useIsomorphicLayoutEffect(()=>{a.current=!1,v.current=r;for(let c=0;c<h.length;c++){const o=E(h[c]);l.includes(o)?g.delete(o):g.get(o)!==!0&&g.set(o,!1)}},[h,l.length,l.join("-")]);const w=[];if(r!==b){let c=[...r];for(let o=0;o<h.length;o++){const m=h[o],M=E(m);l.includes(M)||(c.splice(o,0,m),w.push(m))}d==="wait"&&w.length&&(c=w),P(_(c)),k(r);return}process.env.NODE_ENV!=="production"&&d==="wait"&&h.length>1&&console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to "wait". This will lead to odd visual behaviour.`);const{forceRender:R}=(0,e.useContext)(C.LayoutGroupContext);return(0,y.jsx)(y.Fragment,{children:h.map(c=>{const o=E(c),m=f&&!i?!1:r===h||l.includes(o),M=()=>{if(g.has(o))g.set(o,!0);else return;let j=!0;g.forEach(q=>{q||(j=!1)}),j&&(R?.(),P(v.current),f&&p?.(),u&&u())};return(0,y.jsx)(L,{isPresent:m,initial:!a.current||t?void 0:!1,custom:m?void 0:n,presenceAffectsLayout:x,mode:d,onExitComplete:m?void 0:M,children:c},o)})})};Object.defineProperty(exports,"AnimatePresence",{enumerable:!0,get:function(){return A}});
+
+//# sourceMappingURL=AnimatePresence-BtUPiqYm.cjs.map

package/build/AnimatePresence-BtUPiqYm.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimatePresence-BtUPiqYm.cjs","names":["React","MotionConfigContext","useConstant","PresenceContext","usePresence","useConstant","LayoutGroupContext","Fragment"],"sources":["../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/utils.mjs","../node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs"],"sourcesContent":["\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useRef, useContext, useInsertionEffect } from 'react';\nimport { MotionConfigContext } from '../../context/MotionConfigContext.mjs';\n\n/**\n * Measurement functionality has to be within a separate component\n * to leverage snapshot lifecycle.\n */\nclass PopChildMeasure extends React.Component {\n    getSnapshotBeforeUpdate(prevProps) {\n        const element = this.props.childRef.current;\n        if (element && prevProps.isPresent && !this.props.isPresent) {\n            const size = this.props.sizeRef.current;\n            size.height = element.offsetHeight || 0;\n            size.width = element.offsetWidth || 0;\n            size.top = element.offsetTop;\n            size.left = element.offsetLeft;\n        }\n        return null;\n    }\n    /**\n     * Required with getSnapshotBeforeUpdate to stop React complaining.\n     */\n    componentDidUpdate() { }\n    render() {\n        return this.props.children;\n    }\n}\nfunction PopChild({ children, isPresent }) {\n    const id = useId();\n    const ref = useRef(null);\n    const size = useRef({\n        width: 0,\n        height: 0,\n        top: 0,\n        left: 0,\n    });\n    const { nonce } = useContext(MotionConfigContext);\n    /**\n     * We create and inject a style block so we can apply this explicit\n     * sizing in a non-destructive manner by just deleting the style block.\n     *\n     * We can't apply size via render as the measurement happens\n     * in getSnapshotBeforeUpdate (post-render), likewise if we apply the\n     * styles directly on the DOM node, we might be overwriting\n     * styles set via the style prop.\n     */\n    useInsertionEffect(() => {\n        const { width, height, top, left } = size.current;\n        if (isPresent || !ref.current || !width || !height)\n            return;\n        ref.current.dataset.motionPopId = id;\n        const style = document.createElement(\"style\");\n        if (nonce)\n            style.nonce = nonce;\n        document.head.appendChild(style);\n        if (style.sheet) {\n            style.sheet.insertRule(`\n          [data-motion-pop-id=\"${id}\"] {\n            position: absolute !important;\n            width: ${width}px !important;\n            height: ${height}px !important;\n            top: ${top}px !important;\n            left: ${left}px !important;\n          }\n        `);\n        }\n        return () => {\n            document.head.removeChild(style);\n        };\n    }, [isPresent]);\n    return (jsx(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: React.cloneElement(children, { ref }) }));\n}\n\nexport { PopChild };\n","\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport * as React from 'react';\nimport { useId, useCallback, useMemo } from 'react';\nimport { PresenceContext } from '../../context/PresenceContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PopChild } from './PopChild.mjs';\n\nconst PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, }) => {\n    const presenceChildren = useConstant(newChildrenMap);\n    const id = useId();\n    const memoizedOnExitComplete = useCallback((childId) => {\n        presenceChildren.set(childId, true);\n        for (const isComplete of presenceChildren.values()) {\n            if (!isComplete)\n                return; // can stop searching when any is incomplete\n        }\n        onExitComplete && onExitComplete();\n    }, [presenceChildren, onExitComplete]);\n    const context = useMemo(() => ({\n        id,\n        initial,\n        isPresent,\n        custom,\n        onExitComplete: memoizedOnExitComplete,\n        register: (childId) => {\n            presenceChildren.set(childId, false);\n            return () => presenceChildren.delete(childId);\n        },\n    }), \n    /**\n     * If the presence of a child affects the layout of the components around it,\n     * we want to make a new context value to ensure they get re-rendered\n     * so they can detect that layout change.\n     */\n    presenceAffectsLayout\n        ? [Math.random(), memoizedOnExitComplete]\n        : [isPresent, memoizedOnExitComplete]);\n    useMemo(() => {\n        presenceChildren.forEach((_, key) => presenceChildren.set(key, false));\n    }, [isPresent]);\n    /**\n     * If there's no `motion` components to fire exit animations, we want to remove this\n     * component immediately.\n     */\n    React.useEffect(() => {\n        !isPresent &&\n            !presenceChildren.size &&\n            onExitComplete &&\n            onExitComplete();\n    }, [isPresent]);\n    if (mode === \"popLayout\") {\n        children = jsx(PopChild, { isPresent: isPresent, children: children });\n    }\n    return (jsx(PresenceContext.Provider, { value: context, children: children }));\n};\nfunction newChildrenMap() {\n    return new Map();\n}\n\nexport { PresenceChild };\n","import { Children, isValidElement } from 'react';\n\nconst getChildKey = (child) => child.key || \"\";\nfunction onlyElements(children) {\n    const filtered = [];\n    // We use forEach here instead of map as map mutates the component key by preprending `.$`\n    Children.forEach(children, (child) => {\n        if (isValidElement(child))\n            filtered.push(child);\n    });\n    return filtered;\n}\n\nexport { getChildKey, onlyElements };\n","\"use client\";\nimport { jsx, Fragment } from 'react/jsx-runtime';\nimport { useMemo, useRef, useState, useContext } from 'react';\nimport { LayoutGroupContext } from '../../context/LayoutGroupContext.mjs';\nimport { useConstant } from '../../utils/use-constant.mjs';\nimport { PresenceChild } from './PresenceChild.mjs';\nimport { usePresence } from './use-presence.mjs';\nimport { onlyElements, getChildKey } from './utils.mjs';\nimport { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-effect.mjs';\n\n/**\n * `AnimatePresence` enables the animation of components that have been removed from the tree.\n *\n * When adding/removing more than a single child, every child **must** be given a unique `key` prop.\n *\n * Any `motion` components that have an `exit` property defined will animate out when removed from\n * the tree.\n *\n * ```jsx\n * import { motion, AnimatePresence } from 'framer-motion'\n *\n * export const Items = ({ items }) => (\n *   <AnimatePresence>\n *     {items.map(item => (\n *       <motion.div\n *         key={item.id}\n *         initial={{ opacity: 0 }}\n *         animate={{ opacity: 1 }}\n *         exit={{ opacity: 0 }}\n *       />\n *     ))}\n *   </AnimatePresence>\n * )\n * ```\n *\n * You can sequence exit animations throughout a tree using variants.\n *\n * If a child contains multiple `motion` components with `exit` props, it will only unmount the child\n * once all `motion` components have finished animating out. Likewise, any components using\n * `usePresence` all need to call `safeToRemove`.\n *\n * @public\n */\nconst AnimatePresence = ({ children, custom, initial = true, onExitComplete, presenceAffectsLayout = true, mode = \"sync\", propagate = false, }) => {\n    const [isParentPresent, safeToRemove] = usePresence(propagate);\n    /**\n     * Filter any children that aren't ReactElements. We can only track components\n     * between renders with a props.key.\n     */\n    const presentChildren = useMemo(() => onlyElements(children), [children]);\n    /**\n     * Track the keys of the currently rendered children. This is used to\n     * determine which children are exiting.\n     */\n    const presentKeys = propagate && !isParentPresent ? [] : presentChildren.map(getChildKey);\n    /**\n     * If `initial={false}` we only want to pass this to components in the first render.\n     */\n    const isInitialRender = useRef(true);\n    /**\n     * A ref containing the currently present children. When all exit animations\n     * are complete, we use this to re-render the component with the latest children\n     * *committed* rather than the latest children *rendered*.\n     */\n    const pendingPresentChildren = useRef(presentChildren);\n    /**\n     * Track which exiting children have finished animating out.\n     */\n    const exitComplete = useConstant(() => new Map());\n    /**\n     * Save children to render as React state. To ensure this component is concurrent-safe,\n     * we check for exiting children via an effect.\n     */\n    const [diffedChildren, setDiffedChildren] = useState(presentChildren);\n    const [renderedChildren, setRenderedChildren] = useState(presentChildren);\n    useIsomorphicLayoutEffect(() => {\n        isInitialRender.current = false;\n        pendingPresentChildren.current = presentChildren;\n        /**\n         * Update complete status of exiting children.\n         */\n        for (let i = 0; i < renderedChildren.length; i++) {\n            const key = getChildKey(renderedChildren[i]);\n            if (!presentKeys.includes(key)) {\n                if (exitComplete.get(key) !== true) {\n                    exitComplete.set(key, false);\n                }\n            }\n            else {\n                exitComplete.delete(key);\n            }\n        }\n    }, [renderedChildren, presentKeys.length, presentKeys.join(\"-\")]);\n    const exitingChildren = [];\n    if (presentChildren !== diffedChildren) {\n        let nextChildren = [...presentChildren];\n        /**\n         * Loop through all the currently rendered components and decide which\n         * are exiting.\n         */\n        for (let i = 0; i < renderedChildren.length; i++) {\n            const child = renderedChildren[i];\n            const key = getChildKey(child);\n            if (!presentKeys.includes(key)) {\n                nextChildren.splice(i, 0, child);\n                exitingChildren.push(child);\n            }\n        }\n        /**\n         * If we're in \"wait\" mode, and we have exiting children, we want to\n         * only render these until they've all exited.\n         */\n        if (mode === \"wait\" && exitingChildren.length) {\n            nextChildren = exitingChildren;\n        }\n        setRenderedChildren(onlyElements(nextChildren));\n        setDiffedChildren(presentChildren);\n        /**\n         * Early return to ensure once we've set state with the latest diffed\n         * children, we can immediately re-render.\n         */\n        return;\n    }\n    if (process.env.NODE_ENV !== \"production\" &&\n        mode === \"wait\" &&\n        renderedChildren.length > 1) {\n        console.warn(`You're attempting to animate multiple children within AnimatePresence, but its mode is set to \"wait\". This will lead to odd visual behaviour.`);\n    }\n    /**\n     * If we've been provided a forceRender function by the LayoutGroupContext,\n     * we can use it to force a re-render amongst all surrounding components once\n     * all components have finished animating out.\n     */\n    const { forceRender } = useContext(LayoutGroupContext);\n    return (jsx(Fragment, { children: renderedChildren.map((child) => {\n            const key = getChildKey(child);\n            const isPresent = propagate && !isParentPresent\n                ? false\n                : presentChildren === renderedChildren ||\n                    presentKeys.includes(key);\n            const onExit = () => {\n                if (exitComplete.has(key)) {\n                    exitComplete.set(key, true);\n                }\n                else {\n                    return;\n                }\n                let isEveryExitComplete = true;\n                exitComplete.forEach((isExitComplete) => {\n                    if (!isExitComplete)\n                        isEveryExitComplete = false;\n                });\n                if (isEveryExitComplete) {\n                    forceRender === null || forceRender === void 0 ? void 0 : forceRender();\n                    setRenderedChildren(pendingPresentChildren.current);\n                    propagate && (safeToRemove === null || safeToRemove === void 0 ? void 0 : safeToRemove());\n                    onExitComplete && onExitComplete();\n                }\n            };\n            return (jsx(PresenceChild, { isPresent: isPresent, initial: !isInitialRender.current || initial\n                    ? undefined\n                    : false, custom: isPresent ? undefined : custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode, onExitComplete: isPresent ? undefined : onExit, children: child }, key));\n        }) }));\n};\n\nexport { AnimatePresence };\n"],"x_google_ignoreList":[0,1,2,3],"mappings":"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"}

package/build/area-outside.cjs.js

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./area-DxKLtDFZ.cjs");exports.Outside=e.Outside;
-//# sourceMappingURL=area-outside.cjs.js.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./chunk-CW3en5xf.cjs"),e=require("./outside-DJ1B9sBT.cjs");exports.Outside=e.Outside;

package/build/area-outside.d.ts

@@ -1,28 +1,2 @@
-import { CSSObject } from 'styled-components';
-import { DefaultTheme } from 'styled-components';
-import { FC } from 'react';
-import { PropsWithChildren } from 'react';
-
-declare interface addSXProps {
-    sx?: SXProps;
-}
-
-declare type IThemeDevice = 'default' | 'tablet' | 'mobile';
-
-export declare const Outside: FC<OutsideProps>;
-
-declare type OutsideProps = PropsWithChildren & addSXProps & {
-    onOutsideClick: (event: MouseEvent) => void;
-};
-
-declare type SXProps = ({
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-}) | ((theme: DefaultTheme) => {
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-});
-
-export { }
+export * from './areas/outside/index'
+export {}

package/build/area-outside.es.js

@@ -1,5 +1,4 @@
-import { O } from "./area-B6xxVQ87.js";
+import { t as o } from "./outside-BtjOuCPD.js";
 export {
-  O as Outside
+  o as Outside
 };
-//# sourceMappingURL=area-outside.es.js.map

package/build/area-preview.cjs.js

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./area.hooks-C_UKZzcb.cjs"),r=require("./context.constants-gXk1ewxx.cjs");exports.useRemovePreviewLoader=e.useRemovePreviewLoader,exports.Preview=r.Preview;
-//# sourceMappingURL=area-preview.cjs.js.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./chunk-CW3en5xf.cjs"),e=require("./preview-CG76AiC9.cjs");exports.Preview=e.Preview;exports.useRemovePreviewLoader=e.useRemovePreviewLoader;

package/build/area-preview.d.ts

@@ -1,48 +1,2 @@
-import { CSSObject } from 'styled-components';
-import { DefaultTheme } from 'styled-components';
-import { FC } from 'react';
-import { PropsWithChildren } from 'react';
-import { ReactNode } from 'react';
-
-declare interface addSXProps {
-    sx?: SXProps;
-}
-
-declare type IThemeDevice = 'default' | 'tablet' | 'mobile';
-
-export declare const Preview: FC<PreviewProps>;
-
-export declare type PreviewAdditionalProps = PreviewIsShowProps | PreviewTimeProps;
-
-declare type PreviewDefaultProps = {
-    defaultVisible?: boolean;
-    content?: ReactNode;
-} & {
-    sxLoader?: addSXProps['sx'];
-    sxChildren?: addSXProps['sx'];
-};
-
-declare interface PreviewIsShowProps extends PreviewDefaultProps {
-    visible: boolean;
-    minTime?: number;
-}
-
-export declare type PreviewProps = PropsWithChildren & PreviewAdditionalProps;
-
-declare interface PreviewTimeProps extends PreviewDefaultProps {
-    time: number;
-}
-
-declare type SXProps = ({
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-}) | ((theme: DefaultTheme) => {
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-});
-
-export declare const useRemovePreviewLoader: () => void;
-
-export { }
+export * from './areas/preview/index'
+export {}

package/build/area-preview.es.js

@@ -1,7 +1,5 @@
-import { u } from "./area.hooks-Bk04M7mk.js";
-import { P } from "./context.constants-D0UjboYX.js";
+import { n as r, t as o } from "./preview-BvJN6QoV.js";
 export {
-  P as Preview,
-  u as useRemovePreviewLoader
+  r as Preview,
+  o as useRemovePreviewLoader
 };
-//# sourceMappingURL=area-preview.es.js.map

package/build/area-skeleton.cjs.js

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./context.constants-gXk1ewxx.cjs");exports.Skeleton=e.Skeleton,exports.StyledSkeleton=e.StyledSkeleton;
-//# sourceMappingURL=area-skeleton.cjs.js.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./chunk-CW3en5xf.cjs"),e=require("./skeleton-BOfnrUaI.cjs");exports.Skeleton=e.Skeleton;

package/build/area-skeleton.d.ts

@@ -1,68 +1,2 @@
-import { Component } from 'react';
-import { CSSObject } from 'styled-components';
-import { DefaultTheme } from 'styled-components';
-import { DragEvent as DragEvent_2 } from 'react';
-import { DragEventHandler } from 'react';
-import { FC } from 'react';
-import { IStyledComponentBase } from 'styled-components/dist/types';
-import { PropsWithChildren } from 'react';
-import { Ref } from 'react';
-import { Substitute } from 'styled-components/dist/types';
-
-declare type AddDollarSign<T> = {
-    [K in keyof T as `$${string & K}`]: T[K];
-};
-
-declare interface addSXProps {
-    sx?: SXProps;
-}
-
-declare type IThemeDevice = 'default' | 'tablet' | 'mobile';
-
-declare type IThemePaletteKeys = 'transparent' | 'black100' | 'black80' | 'black60' | 'black50' | 'black40' | 'black10' | 'black05' | 'black04' | 'blackHelena' | 'blackJanice' | 'grayJanice' | 'grayKaren' | 'grayMonica' | 'graySandra' | 'grayPatricia' | 'graySarah' | 'grayStassie' | 'grayAdriana' | 'greenGoogle' | 'grayBarbara' | 'grayStephanie' | 'grayFrances' | 'grayTina' | 'green100' | 'green50' | 'green25' | 'green10' | 'green10Background' | 'whiteStandard' | 'whiteJanice' | 'yellowGoogle' | 'yellow100' | 'yellow50' | 'yellow25' | 'yellow10' | 'yellow10Background' | 'redGoogle' | 'red100' | 'red50' | 'red25' | 'red10' | 'red10Background' | 'blueGoogle' | 'blueRest' | 'blueActive' | 'blueHover' | 'blueFocus' | 'blueBr' | 'blueKaren' | 'blueMonica' | 'violetStephanie' | 'violetJanice' | 'amnezia' | 'inherit' | 'currentColor';
-
-export declare const Skeleton: FC<SkeletonProps>;
-
-declare type SkeletonDefaultProps = {
-    className?: string;
-    defaultVisible?: boolean;
-    type?: 'primary' | 'secondary';
-    color?: IThemePaletteKeys;
-    isInheritColor?: boolean;
-};
-
-declare interface SkeletonIsShowProps extends SkeletonDefaultProps {
-    visible: boolean;
-}
-
-export declare type SkeletonProps = StackProps & (SkeletonIsShowProps | SkeletonTimeProps);
-
-declare interface SkeletonTimeProps extends SkeletonDefaultProps {
-    time: number;
-}
-
-declare interface StackProps extends addSXProps, PropsWithChildren {
-    className?: string;
-    isHover?: boolean;
-    isRipple?: boolean;
-    onClick?: () => void;
-    onDragOver?: DragEventHandler<HTMLDivElement>;
-    onDrop?: (e: DragEvent_2<HTMLDivElement>) => void;
-    ref?: Ref<HTMLDivElement | null>;
-}
-
-export declare const StyledSkeleton: IStyledComponentBase<"web", Substitute<StackProps, StyledSkeletonProps>> & string & Omit<FC<StackProps>, keyof Component<any, {}, any>>;
-
-export declare type StyledSkeletonProps = StackProps & AddDollarSign<Pick<SkeletonIsShowProps & SkeletonTimeProps, 'visible' | 'type' | 'color' | 'isInheritColor'>>;
-
-declare type SXProps = ({
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-}) | ((theme: DefaultTheme) => {
-    default: CSSObject;
-} & {
-    [K in IThemeDevice]?: CSSObject;
-});
-
-export { }
+export * from './areas/skeleton/index'
+export {}

package/build/area-skeleton.es.js

@@ -1,6 +1,4 @@
-import { a, S } from "./context.constants-D0UjboYX.js";
+import { t } from "./skeleton-Bzr92XmL.js";
 export {
-  a as Skeleton,
-  S as StyledSkeleton
+  t as Skeleton
 };
-//# sourceMappingURL=area-skeleton.es.js.map

package/build/areas/outside/area.d.ts

@@ -0,0 +1,7 @@
+import { ISx } from '../../styles/utils';
+import { FC, PropsWithChildren } from 'react';
+type IOutside = PropsWithChildren & ISx & {
+    onOutsideClick: (event: MouseEvent) => void;
+};
+export declare const Outside: FC<IOutside>;
+export {};

package/build/areas/outside/index.d.ts

@@ -0,0 +1 @@
+export { Outside } from './area';

package/build/areas/preview/area.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { IPreview } from './area.types';
+export declare const Preview: FC<IPreview>;

package/build/areas/preview/area.hooks.d.ts

@@ -0,0 +1 @@
+export declare const useRemovePreviewLoader: () => void;

package/build/areas/preview/area.types.d.ts

@@ -0,0 +1,19 @@
+import { ISx, IThemePalette } from '../../styles/utils';
+import { PropsWithChildren, ReactNode } from 'react';
+type IPreviewDefault = {
+    defaultVisible?: boolean;
+    content?: ReactNode;
+    sxLoader?: ISx['sx'];
+    sxChildren?: ISx['sx'];
+    colorIcon?: IThemePalette;
+};
+interface IPreviewIsShow extends IPreviewDefault {
+    visible: boolean;
+    minTime?: number;
+}
+interface IPreviewTime extends IPreviewDefault {
+    time: number;
+}
+export type IPreviewAdditional = IPreviewIsShow | IPreviewTime;
+export type IPreview = PropsWithChildren & IPreviewAdditional;
+export {};

package/build/areas/preview/index.d.ts

@@ -0,0 +1,3 @@
+export { Preview } from './area';
+export { useRemovePreviewLoader } from './area.hooks';
+export type { IPreview, IPreviewAdditional } from './area.types';

package/build/areas/skeleton/area.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ISkeleton } from './area.types';
+export declare const Skeleton: FC<ISkeleton>;

package/build/areas/skeleton/area.types.d.ts

@@ -0,0 +1,21 @@
+import { IStack } from '../../components/stack';
+import { IThemePalette } from '../../styles/utils';
+import { CSSProperties } from 'react';
+type ISkeletonDefault = {
+    className?: string;
+    style?: CSSProperties;
+    defaultVisible?: boolean;
+    type?: 'primary' | 'secondary';
+    color?: IThemePalette;
+    colorLine?: IThemePalette;
+    isInheritColor?: boolean;
+    isLiquid?: boolean;
+};
+interface ISkeletonIsShow extends ISkeletonDefault {
+    visible: boolean;
+}
+interface ISkeletonTime extends ISkeletonDefault {
+    time: number;
+}
+export type ISkeleton = IStack & (ISkeletonIsShow | ISkeletonTime);
+export {};

package/build/areas/skeleton/index.d.ts

@@ -0,0 +1,2 @@
+export { Skeleton } from './area';
+export type { ISkeleton } from './area.types';

package/build/build-info.txt

@@ -1,3 +1,3 @@
-version: 1.3.39
-commit: cf85e00
-date: 2025-10-18T20:17:41Z
+version: 2.0.0
+commit: 522d72e
+date: 2026-04-17T19:57:31Z

package/build/button-C5PgNYns.cjs

@@ -0,0 +1,3 @@
+const R=require("./chunk-CW3en5xf.cjs"),n=require("./utils-DtinAjAU.cjs"),S=require("./functions-Dwo54amB.cjs"),A=require("./icon-CreblPsB.cjs"),m=require("./hooks-use-merge-refs.cjs.js"),g=require("./hooks-use-typography-styles.cjs.js");let s=require("react/jsx-runtime"),o=require("react");var y=e=>{const c=(0,o.useMemo)(()=>A.getIconComponents({icons:(e.icons??[]).map(i=>({...i,style:{color:n.CSS_VARS.genre.button[e.genre].color.index}})),size:e.size}),[e.icons,e.size,e.genre]),u=(0,o.useCallback)(i=>{!e.isDisabled&&e.onClick&&e.onClick(i)},[e.isDisabled,e.onClick]),l=m.useMergeRefs([(0,o.useRef)(null),e.ref]),{className:a,style:d}=g.useTypographyStyles({sx:{variant:n.EXTRA_VALUE.sizeToController[e.size],isNoUserSelect:!0,...e?.sxTypography},style:{order:0,display:"inline-flex"}}),{className:r,style:C}=(0,o.useMemo)(()=>{const i=S.setClasses([n.CSS_CLASS.component.button.root,n.CSS_CLASS.control[e.isDisabled?"none":e.control??"boxShadow"],n.CSS_CLASS.transition.color,e.isZeroRadius&&n.CSS_CLASS.component.button.isZeroRadius,e.isHidden&&n.CSS_CLASS.component.button.isHidden,e.isHiddenBorder&&n.CSS_CLASS.component.button.isHiddenBorder,e.isFullRadius&&n.CSS_CLASS.component.button.isFullRadius,e.isFullSize&&n.CSS_CLASS.component.button.isFullSize,e.isWidthAsHeight&&n.CSS_CLASS.component.button.isWidthAsHeight,e.isMinWidthAsContent&&n.CSS_CLASS.component.button.isMinWidthAsContent,e.isZeroPadding&&n.CSS_CLASS.component.button.isZeroPadding,e.isSizeFitContent&&n.CSS_CLASS.component.button.isSizeFitContent,e.className]),t={};return t[n.CSS_VARS_RAW.component.button.background]=n.CSS_VARS.genre.button[e.genre].background.index,t[n.CSS_VARS_RAW.component.button.color]=n.CSS_VARS.genre.button[e.genre].color.index,t[n.CSS_VARS_RAW.component.button.border]=n.CSS_VARS.genre.button[e.genre].border.index,t[n.CSS_VARS_RAW.component.button.height]=n.CSS_VARS.size[e.size].height,t[n.CSS_VARS_RAW.component.button.padding]=n.CSS_VARS.size[e.size].padding,t[n.CSS_VARS_RAW.component.button.radius]=n.CSS_VARS.size[e.size].radius,t[n.CSS_VARS_RAW.component.button.gap]=`calc(${n.CSS_VARS.size[e.size].padding} - 2px)`,{className:i,style:S.setStyles([Object.keys(t).length?t:void 0,e.style])}},[e.className,e.style,e.genre,e.isDisabled,e.isFullSize,e.isHidden,e.isHiddenBorder,e.isMinWidthAsContent,e.isFullRadius,e.isWidthAsHeight,e.size,e.isZeroRadius,e.control,e.isZeroPadding,e.isSizeFitContent]),{className:_,style:b}=(0,o.useMemo)(()=>{const i=S.setClasses([n.CSS_CLASS.component.button.iconGroup,e.isIconGroup&&n.CSS_CLASS.component.button.iconGroupIsIconGroup]),t={};return"iconGroupOrder"in e&&(t[n.CSS_VARS_RAW.component.button.iconGroupOrder]=String(e.iconGroupOrder??"initial")),{className:i,style:S.setStyles([Object.keys(t).length?t:void 0])}},[e]);return(0,s.jsxs)("button",{tabIndex:e.tabIndex,disabled:e.isDisabled,className:r,style:C,onClick:u,onFocus:e.onFocus,onMouseDown:e.onMouseDown,type:e.type??"button",ref:l,name:e.name,"aria-label":e.ariaLabel,id:e.id,children:[!e.isOnlyIcon&&e.children&&(0,s.jsx)("div",{className:a,style:d,children:e.children}),(0,s.jsx)("div",{className:_,style:b,children:c})]})};Object.defineProperty(exports,"Button",{enumerable:!0,get:function(){return y}});
+
+//# sourceMappingURL=button-C5PgNYns.cjs.map

package/build/button-C5PgNYns.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-C5PgNYns.cjs","names":[],"sources":["../src/components/button/component.tsx"],"sourcesContent":["import { getIconComponents } from '@local/components/icon';\nimport { useMergeRefs } from '@local/hooks/use-merge-refs';\nimport { useTypographyStyles } from '@local/hooks/use-typography-styles';\nimport { CSS_CLASS, CSS_VARS, CSS_VARS_RAW, EXTRA_VALUE } from '@local/styles/utils';\nimport { setClasses, setStyles } from '@local/styles/utils/functions';\n\nimport { FC, Ref, useCallback, useMemo, useRef } from 'react';\n\nimport { IButton } from './component.types';\n\nexport const Button: FC<IButton> = (props) => {\n  const iconComponents = useMemo(\n    () =>\n      getIconComponents({\n        icons: (props.icons ?? []).map((e) => ({\n          ...e,\n          style: { color: CSS_VARS.genre.button[props.genre].color.index },\n        })),\n        size: props.size,\n      }),\n    [props.icons, props.size, props.genre],\n  );\n\n  const handleClick = useCallback<Exclude<IButton['onClick'], undefined>>(\n    (event) => {\n      if (!props.isDisabled && props.onClick) {\n        props.onClick(event);\n      }\n    },\n    [props.isDisabled, props.onClick],\n  );\n\n  const refDefault = useRef<HTMLButtonElement>(null);\n\n  const ref = useMergeRefs([refDefault, props.ref]);\n\n  const { className: classNameTypography, style: styleTypography } = useTypographyStyles({\n    sx: { variant: EXTRA_VALUE.sizeToController[props.size], isNoUserSelect: true, ...props?.sxTypography },\n    style: { order: 0, display: 'inline-flex' },\n  });\n\n  const { className, style } = useMemo(() => {\n    const className = setClasses([\n      CSS_CLASS.component.button.root,\n      CSS_CLASS.control[props.isDisabled ? 'none' : (props.control ?? 'boxShadow')],\n      CSS_CLASS.transition.color,\n      props.isZeroRadius && CSS_CLASS.component.button.isZeroRadius,\n      props.isHidden && CSS_CLASS.component.button.isHidden,\n      props.isHiddenBorder && CSS_CLASS.component.button.isHiddenBorder,\n      props.isFullRadius && CSS_CLASS.component.button.isFullRadius,\n      props.isFullSize && CSS_CLASS.component.button.isFullSize,\n      props.isWidthAsHeight && CSS_CLASS.component.button.isWidthAsHeight,\n      props.isMinWidthAsContent && CSS_CLASS.component.button.isMinWidthAsContent,\n      props.isZeroPadding && CSS_CLASS.component.button.isZeroPadding,\n      props.isSizeFitContent && CSS_CLASS.component.button.isSizeFitContent,\n      props.className,\n    ]);\n\n    const vars: Record<string, string> = {};\n\n    vars[CSS_VARS_RAW.component.button.background] = CSS_VARS.genre.button[props.genre].background.index;\n    vars[CSS_VARS_RAW.component.button.color] = CSS_VARS.genre.button[props.genre].color.index;\n    vars[CSS_VARS_RAW.component.button.border] = CSS_VARS.genre.button[props.genre].border.index;\n\n    vars[CSS_VARS_RAW.component.button.height] = CSS_VARS.size[props.size].height;\n    vars[CSS_VARS_RAW.component.button.padding] = CSS_VARS.size[props.size].padding;\n    vars[CSS_VARS_RAW.component.button.radius] = CSS_VARS.size[props.size].radius;\n    vars[CSS_VARS_RAW.component.button.gap] = `calc(${CSS_VARS.size[props.size].padding} - 2px)`;\n\n    const style = setStyles([Object.keys(vars).length ? vars : undefined, props.style]);\n\n    return { className, style };\n  }, [\n    props.className,\n    props.style,\n    props.genre,\n    props.isDisabled,\n    props.isFullSize,\n    props.isHidden,\n    props.isHiddenBorder,\n    props.isMinWidthAsContent,\n    props.isFullRadius,\n    props.isWidthAsHeight,\n    props.size,\n    props.isZeroRadius,\n    props.control,\n    props.isZeroPadding,\n    props.isSizeFitContent,\n  ]);\n\n  const { className: classNameIconGroup, style: styleIconGroup } = useMemo(() => {\n    const className = setClasses([\n      CSS_CLASS.component.button.iconGroup,\n\n      props.isIconGroup && CSS_CLASS.component.button.iconGroupIsIconGroup,\n    ]);\n\n    const vars: Record<string, string> = {};\n\n    if ('iconGroupOrder' in props)\n      vars[CSS_VARS_RAW.component.button.iconGroupOrder] = String(props.iconGroupOrder ?? 'initial');\n\n    const style = setStyles([Object.keys(vars).length ? vars : undefined]);\n\n    return { className, style };\n  }, [props]);\n\n  return (\n    <button\n      tabIndex={props.tabIndex}\n      disabled={props.isDisabled}\n      className={className}\n      style={style}\n      onClick={handleClick}\n      onFocus={props.onFocus}\n      onMouseDown={props.onMouseDown}\n      type={props.type ?? 'button'}\n      ref={ref as Ref<HTMLButtonElement>}\n      name={props.name}\n      aria-label={props.ariaLabel}\n      id={props.id}\n    >\n      {!props.isOnlyIcon && props.children && (\n        <div className={classNameTypography} style={styleTypography}>\n          {props.children}\n        </div>\n      )}\n      <div className={classNameIconGroup} style={styleIconGroup}>\n        {iconComponents}\n      </div>\n    </button>\n  );\n};\n"],"mappings":"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"}