@solibo/solibo-ui 0.5.16 → 1.0.1

package/dist/use-touched-DXIJVVzz.js

@@ -0,0 +1,14 @@
+import { useState as s, useCallback as c, useEffect as r } from "react";
+function f(t) {
+  const [u, e] = s(!1), o = c(() => e(!0), []);
+  return r(() => {
+    e(!1);
+  }, [t]), {
+    touched: u,
+    onBlur: o
+  };
+}
+export {
+  f as u
+};
+//# sourceMappingURL=use-touched-DXIJVVzz.js.map

package/dist/use-touched-DXIJVVzz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-touched-DXIJVVzz.js","sources":["../src/lib/use-touched.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\n\nexport function useTouched(resetKey?: unknown) {\n  const [touched, setTouched] = useState(false);\n  const onBlur = useCallback(() => setTouched(true), []);\n\n  useEffect(() => {\n    setTouched(false);\n  }, [resetKey]);\n\n  return { touched, onBlur };\n}\n"],"names":["useTouched","resetKey","touched","setTouched","useState","onBlur","useCallback","useEffect"],"mappings":";AAEO,SAASA,EAAWC,GAAoB;AAC7C,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtCC,IAASC,EAAY,MAAMH,EAAW,EAAI,GAAG,CAAA,CAAE;AAErDI,SAAAA,EAAU,MAAM;AACdJ,IAAAA,EAAW,EAAK;AAAA,EAClB,GAAG,CAACF,CAAQ,CAAC,GAEN;AAAA,IAAEC,SAAAA;AAAAA,IAASG,QAAAA;AAAAA,EAAAA;AACpB;"}

package/dist/use-touched-D_TJ8wDc.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("react");function o(t){const[s,u]=e.useState(!1),c=e.useCallback(()=>u(!0),[]);return e.useEffect(()=>{u(!1)},[t]),{touched:s,onBlur:c}}exports.useTouched=o;
+//# sourceMappingURL=use-touched-D_TJ8wDc.cjs.map

package/dist/use-touched-D_TJ8wDc.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-touched-D_TJ8wDc.cjs","sources":["../src/lib/use-touched.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\n\nexport function useTouched(resetKey?: unknown) {\n  const [touched, setTouched] = useState(false);\n  const onBlur = useCallback(() => setTouched(true), []);\n\n  useEffect(() => {\n    setTouched(false);\n  }, [resetKey]);\n\n  return { touched, onBlur };\n}\n"],"names":["useTouched","resetKey","touched","setTouched","useState","onBlur","useCallback","useEffect"],"mappings":"sCAEO,SAASA,EAAWC,EAAoB,CAC7C,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtCC,EAASC,EAAAA,YAAY,IAAMH,EAAW,EAAI,EAAG,CAAA,CAAE,EAErDI,OAAAA,EAAAA,UAAU,IAAM,CACdJ,EAAW,EAAK,CAClB,EAAG,CAACF,CAAQ,CAAC,EAEN,CAAEC,QAAAA,EAASG,OAAAA,CAAAA,CACpB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solibo/solibo-ui",
-  "version": "0.5.16",
+  "version": "1.0.1",
   "type": "module",
   "scripts": {
     "dev": "pnpm run tokens:build && vite build --watch",
@@ -10,6 +10,7 @@
     "format:fix": "prettier --write .",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
+    "open": "node scripts/open-storybook.mjs",
     "prepare": "git config core.hooksPath .githooks || true",
     "prepublishOnly": "vitest run && pnpm run build",
     "storybook": "storybook dev -p 6006",
@@ -52,6 +53,7 @@
   "devDependencies": {
     "@eslint/js": "^9.39.3",
     "@storybook/addon-a11y": "9.1.20",
+    "@storybook/addon-docs": "9.1.20",
     "@storybook/react-vite": "9.1.20",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
@@ -73,6 +75,8 @@
     "globals": "^15.15.0",
     "jsdom": "^25.0.1",
     "npm-snapshot": "^1.1.2",
+    "postcss-apply": "^0.12.0",
+    "postcss-simple-vars": "^7.0.1",
     "prettier": "^3.8.1",
     "storybook": "9.1.20",
     "stylelint": "^16.26.1",
@@ -83,8 +87,7 @@
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
     "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^2.1.9",
-    "@storybook/addon-docs": "9.1.20"
+    "vitest": "^2.1.9"
   },
   "peerDependencies": {
     "react": ">=19 <20",

package/dist/assets/styles.css

@@ -1 +0,0 @@
-._input_1s8ts_1{background-image:var(--icon-svg);background-repeat:no-repeat;background-size:var(--utils-tokens-unit);background-position:var(--scale-8) center;border:var(--scale-1) solid var(--colors-semantic-border-default);border-radius:var(--shape-border-radius-radius-md);box-shadow:var(--shape-box-shadow-xs-position-x) var(--shape-box-shadow-xs-position-y) var(--shape-box-shadow-xs-blur) var(--shape-box-shadow-xs-spread) var(--shape-box-shadow-xs-color);color:var(--colors-semantic-content-primary);font-size:var(--typography-font-sizes-body-md);padding:var(--utils-tokens-unit);padding-top:calc(var(--utils-tokens-unit) - var(--scale-1));transition:border var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);width:100%}._input_1s8ts_1:disabled{background-color:var(--colors-semantic-interactive-disabled);color:var(--colors-semantic-content-primary);pointer-events:none}._input_1s8ts_1[data-icon=true]{padding-left:var(--scale-32)}._input_1s8ts_1::-moz-placeholder{color:var(--colors-neutral-300)}._input_1s8ts_1::placeholder{color:var(--colors-neutral-300)}._input_1s8ts_1[type=date],._input_1s8ts_1[type=datetime-local]{max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}._input_1s8ts_1[type=datetime-local]{border:var(--scale-1) solid var(--colors-semantic-border-default);border-radius:var(--shape-border-radius-radius-md);padding:var(--utils-tokens-unit)}._input_1s8ts_1[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--colors-semantic-bg-surface);border:var(--scale-1) solid var(--colors-semantic-border-default);box-shadow:none;padding:0;height:calc(var(--utils-tokens-unit) * 1.25);width:calc(var(--utils-tokens-unit) * 1.25)}._input_1s8ts_1[type=radio]:checked{border-color:var(--colors-purple-500);border-width:var(--scale-4)}._input_1s8ts_1._touched_1s8ts_59:invalid{border-color:var(--colors-semantic-status-error-border);outline:solid var(--scale-1) var(--colors-semantic-status-error-border)}._label_1s8ts_65{position:relative}._label_1s8ts_65 span{display:block;margin-bottom:var(--shape-spacing-2xs)}._label_1s8ts_65:has(input[type=radio]){align-items:center;display:flex;flex-direction:row-reverse;gap:var(--utils-tokens-unit);justify-content:start}._label_1s8ts_65:has(input[type=radio]) span{margin-bottom:0}._code_1s8ts_86{margin-right:var(--scale-8);width:calc(5 * var(--utils-tokens-unit))}._code_1s8ts_86+input[type=tel]{width:calc(100% - (5 * var(--utils-tokens-unit) + var(--scale-8)))}

package/dist/components/_avatar/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index15.css');const a=require("react/jsx-runtime"),c=require("../figure/index.cjs"),o=require("../icon/index.cjs"),i=require("../link/index.cjs"),u="_avatar_3vtid_5",v={avatar:u},d=({accessibleLabel:s,imageUrl:t,link:e})=>{const r=s||"User Avatar",n=a.jsx("span",{className:v.avatar,children:a.jsx(c.Figure,{accessibleLabel:r,children:t?a.jsx("img",{src:t,alt:r}):a.jsx(o.Icon,{name:"user",variant:e?"white":"default"})})});return e?a.jsx(i.Link,{to:e,"data-component":"avatar",children:n}):n};exports.Avatar=d;
-//# sourceMappingURL=index.cjs.map

package/dist/components/_avatar/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/_avatar/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon } from '@/components/icon';\nimport { Link } from '@/components/link';\n\nimport styles from './styles.module.css';\n\nexport type AvatarProps = {\n  accessibleLabel?: string;\n  imageUrl?: string;\n  link?: string;\n};\n\nexport const Avatar = ({ accessibleLabel, imageUrl, link }: AvatarProps) => {\n  const avatarLabel = accessibleLabel || 'User Avatar';\n\n  const avatarFigure = (\n    <span className={styles.avatar}>\n      <Figure accessibleLabel={avatarLabel}>\n        {imageUrl ? (\n          <img\n            src={imageUrl}\n            alt={avatarLabel}\n          />\n        ) : (\n          <Icon\n            name='user'\n            variant={link ? 'white' : 'default'}\n          />\n        )}\n      </Figure>\n    </span>\n  );\n\n  return link ? <Link to={link}>{avatarFigure}</Link> : avatarFigure;\n};\n"],"names":["Avatar","accessibleLabel","imageUrl","link","avatarLabel","avatarFigure","jsx","styles","avatar","Figure","Icon","Link"],"mappings":"qPAYaA,EAASA,CAAC,CAAEC,gBAAAA,EAAiBC,SAAAA,EAAUC,KAAAA,CAAkB,IAAM,CAC1E,MAAMC,EAAcH,GAAmB,cAEjCI,EACJC,EAAAA,IAAC,OAAA,CAAK,UAAWC,EAAOC,OACtB,SAAAF,EAAAA,IAACG,EAAAA,OAAA,CAAO,gBAAiBL,EACtBF,SAAAA,EACCI,MAAC,MAAA,CACC,IAAKJ,EACL,IAAKE,CAAAA,CAAY,EAGnBE,EAAAA,IAACI,OAAA,CACC,KAAK,OACL,QAASP,EAAO,QAAU,SAAA,CAAU,CAAA,CAG1C,EACF,EAGF,OAAOA,QAAQQ,EAAAA,KAAA,CAAK,GAAIR,EAAK,iBAAA,SAAEE,WAAa,EAAUA,CACxD"}

package/dist/components/_avatar/index.js

@@ -1,18 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Figure as c } from "../figure/index.js";
-import { Icon as n } from "../icon/index.js";
-import { Link as i } from "../link/index.js";
-import '../../assets/index15.css';const m = "_avatar_3vtid_5", v = {
-  avatar: m
-}, u = ({
-  accessibleLabel: s,
-  imageUrl: r,
-  link: t
-}) => {
-  const e = s || "User Avatar", o = /* @__PURE__ */ a("span", { className: v.avatar, children: /* @__PURE__ */ a(c, { accessibleLabel: e, children: r ? /* @__PURE__ */ a("img", { src: r, alt: e }) : /* @__PURE__ */ a(n, { name: "user", variant: t ? "white" : "default" }) }) });
-  return t ? /* @__PURE__ */ a(i, { to: t, "data-component": "avatar", children: o }) : o;
-};
-export {
-  u as Avatar
-};
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/_avatar/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon } from '@/components/icon';\nimport { Link } from '@/components/link';\n\nimport styles from './styles.module.css';\n\nexport type AvatarProps = {\n  accessibleLabel?: string;\n  imageUrl?: string;\n  link?: string;\n};\n\nexport const Avatar = ({ accessibleLabel, imageUrl, link }: AvatarProps) => {\n  const avatarLabel = accessibleLabel || 'User Avatar';\n\n  const avatarFigure = (\n    <span className={styles.avatar}>\n      <Figure accessibleLabel={avatarLabel}>\n        {imageUrl ? (\n          <img\n            src={imageUrl}\n            alt={avatarLabel}\n          />\n        ) : (\n          <Icon\n            name='user'\n            variant={link ? 'white' : 'default'}\n          />\n        )}\n      </Figure>\n    </span>\n  );\n\n  return link ? <Link to={link}>{avatarFigure}</Link> : avatarFigure;\n};\n"],"names":["Avatar","accessibleLabel","imageUrl","link","avatarLabel","avatarFigure","jsx","styles","avatar","Figure","Icon","Link"],"mappings":";;;;;;GAYaA,IAASA,CAAC;AAAA,EAAEC,iBAAAA;AAAAA,EAAiBC,UAAAA;AAAAA,EAAUC,MAAAA;AAAkB,MAAM;AAC1E,QAAMC,IAAcH,KAAmB,eAEjCI,IACJ,gBAAAC,EAAC,QAAA,EAAK,WAAWC,EAAOC,QACtB,UAAA,gBAAAF,EAACG,GAAA,EAAO,iBAAiBL,GACtBF,UAAAA,IACC,gBAAAI,EAAC,OAAA,EACC,KAAKJ,GACL,KAAKE,EAAAA,CAAY,IAGnB,gBAAAE,EAACI,GAAA,EACC,MAAK,QACL,SAASP,IAAO,UAAU,UAAA,CAAU,EAAA,CAG1C,GACF;AAGF,SAAOA,sBAAQQ,GAAA,EAAK,IAAIR,GAAK,kBAAA,UAAEE,aAAa,IAAUA;AACxD;"}

package/dist/components/_card/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),l=require("../../classix-5H4IWnMA.cjs"),p=require("../badge/index.cjs"),g=require("../checkbox/index.cjs"),u=require("../figure/index.cjs"),x=require("../icon/index.cjs"),j="_card_1sfar_1",q="_head_1sfar_27",y="_center_1sfar_40",h="_content_1sfar_52",N="_margin_1sfar_58",b="_clickable_1sfar_94",T="_selected_1sfar_131",t={card:j,head:q,center:y,content:h,margin:N,clickable:b,"image-top":"_image-top_1sfar_109","image-left":"_image-left_1sfar_120",selected:T},k=({actions:f,badge:d,checkbox:s,children:_,header:m,icon:o,image:c,imagePosition:a="top",onClick:i,variant:r="default"})=>e.jsxs("article",{className:l.t(t.card,i&&t.clickable,(s==null?void 0:s.checked)&&t.selected),"data-minimal":r==="minimal",onClick:i,onKeyDown:n=>{i&&n.currentTarget===document.activeElement&&(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),n.currentTarget.click())},tabIndex:i?0:-1,"data-component":"card",children:[c&&r!=="minimal"&&a==="top"&&e.jsx(u.Figure,{className:t[`image-${a}`],children:c}),e.jsxs("section",{children:[e.jsxs("div",{className:l.t(t.head,r==="minimal"&&t.center),children:[s&&e.jsx("span",{onClick:n=>n.stopPropagation(),children:e.jsx(g.Checkbox,{...s})}),c&&r!=="minimal"&&a==="left"&&e.jsx(u.Figure,{className:t[`image-${a}`],children:c}),m,d&&e.jsx(p.Badge,{...d}),o&&e.jsx(x.Icon,{name:o,size:"medium"}),f]}),_&&r!=="minimal"&&e.jsx("div",{className:l.t(t.content,!!m&&t.margin),children:_})]})]});exports.Card=k;
-//# sourceMappingURL=index.cjs.map

package/dist/components/_card/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/_card/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport { Badge, BadgeProps } from '@/components/badge';\nimport { Checkbox, CheckboxProps } from '@/components/checkbox';\nimport { Figure } from '@/components/figure';\nimport { Icon } from '@/components/icon';\nimport { IconName } from '@/components/icon/icons.ts';\n\nimport styles from './styles.module.css';\n\nexport type CardProps = {\n  actions?: React.ReactNode;\n  badge?: BadgeProps;\n  checkbox?: CheckboxProps;\n  children?: React.ReactNode;\n  header?: React.ReactNode;\n  icon?: IconName;\n  image?: React.ReactNode;\n  imagePosition?: 'top' | 'left';\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Card = ({\n  actions,\n  badge,\n  checkbox,\n  children,\n  header,\n  icon,\n  image,\n  imagePosition = 'top',\n  onClick,\n  variant = 'default',\n}: CardProps) => {\n  return (\n    <article\n      className={cx(styles.card, onClick && styles.clickable, checkbox?.checked && styles.selected)}\n      data-minimal={variant === 'minimal'}\n      onClick={onClick}\n      onKeyDown={(e) => {\n        if (!onClick) return;\n\n        if (e.currentTarget !== document.activeElement) {\n          return;\n        }\n\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          e.currentTarget.click();\n        }\n      }}\n      tabIndex={onClick ? 0 : -1}\n    >\n      {image && variant !== 'minimal' && imagePosition === 'top' && (\n        <Figure className={styles[`image-${imagePosition}`]}>{image}</Figure>\n      )}\n      <section>\n        <div className={cx(styles.head, variant === 'minimal' && styles.center)}>\n          {checkbox && (\n            <span onClick={(e) => e.stopPropagation()}>\n              <Checkbox {...checkbox} />\n            </span>\n          )}\n          {image && variant !== 'minimal' && imagePosition === 'left' && (\n            <Figure className={styles[`image-${imagePosition}`]}>{image}</Figure>\n          )}\n          {header}\n          {badge && <Badge {...badge} />}\n          {icon && (\n            <Icon\n              name={icon}\n              size='medium'\n            />\n          )}\n          {actions}\n        </div>\n        {children && variant !== 'minimal' && (\n          <div className={cx(styles.content, !!header && styles.margin)}>{children}</div>\n        )}\n      </section>\n    </article>\n  );\n};\n"],"names":["Card","actions","badge","checkbox","children","header","icon","image","imagePosition","onClick","variant","cx","styles","card","clickable","checked","selected","e","currentTarget","document","activeElement","key","preventDefault","click","jsx","Figure","jsxs","head","center","stopPropagation","Checkbox","Badge","Icon","content","margin"],"mappings":"kkBAuBaA,EAAOA,CAAC,CACnBC,QAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,OAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,cAAAA,EAAgB,MAChBC,QAAAA,EACAC,QAAAA,EAAU,SACD,WAEN,UAAA,CACC,UAAWC,EAAAA,EAAGC,EAAOC,KAAMJ,GAAWG,EAAOE,WAAWX,GAAAA,YAAAA,EAAUY,UAAWH,EAAOI,QAAQ,EAC5F,eAAcN,IAAY,UAC1B,QAAAD,EACA,UAAYQ,GAAM,CACXR,GAEDQ,EAAEC,gBAAkBC,SAASC,gBAI7BH,EAAEI,MAAQ,SAAWJ,EAAEI,MAAQ,OACjCJ,EAAEK,eAAAA,EACFL,EAAEC,cAAcK,MAAAA,EAEpB,EACA,SAAUd,EAAU,EAAI,GAAG,iBAAA,OAE1BF,SAAAA,CAAAA,GAASG,IAAY,WAAaF,IAAkB,OACnDgB,EAAAA,IAACC,SAAA,CAAO,UAAWb,EAAO,SAASJ,CAAa,EAAE,EAAID,SAAAA,EAAM,SAE7D,UAAA,CACC,SAAA,CAAAmB,EAAAA,KAAC,MAAA,CAAI,UAAWf,EAAAA,EAAGC,EAAOe,KAAMjB,IAAY,WAAaE,EAAOgB,MAAM,EACnEzB,SAAAA,CAAAA,GACCqB,EAAAA,IAAC,OAAA,CAAK,QAAUP,GAAMA,EAAEY,gBAAAA,EACtB,SAAAL,EAAAA,IAACM,EAAAA,SAAA,CAAS,GAAI3B,CAAAA,CAAS,EACzB,EAEDI,GAASG,IAAY,WAAaF,IAAkB,QACnDgB,EAAAA,IAACC,SAAA,CAAO,UAAWb,EAAO,SAASJ,CAAa,EAAE,EAAID,SAAAA,EAAM,EAE7DF,EACAH,GAASsB,EAAAA,IAACO,EAAAA,MAAA,CAAM,GAAI7B,CAAAA,CAAM,EAC1BI,GACCkB,EAAAA,IAACQ,OAAA,CACC,KAAM1B,EACN,KAAK,SAAQ,EAGhBL,CAAAA,EACH,EACCG,GAAYM,IAAY,WACvBc,EAAAA,IAAC,OAAI,UAAWb,EAAAA,EAAGC,EAAOqB,QAAS,CAAC,CAAC5B,GAAUO,EAAOsB,MAAM,EAAI9B,SAAAA,CAAAA,CAAS,CAAA,CAAA,CAE7E,CAAA,EACF"}

package/dist/components/_card/index.js

@@ -1,47 +0,0 @@
-import { jsxs as l, jsx as r } from "react/jsx-runtime";
-import { t as i } from "../../classix-DG18itHa.js";
-import { Badge as g } from "../badge/index.js";
-import { Checkbox as N } from "../checkbox/index.js";
-import { Figure as p } from "../figure/index.js";
-import { Icon as h } from "../icon/index.js";
-import '../../assets/index16.css';const y = "_card_1sfar_1", j = "_head_1sfar_27", D = "_center_1sfar_40", E = "_content_1sfar_52", I = "_margin_1sfar_58", T = "_clickable_1sfar_94", $ = "_selected_1sfar_131", e = {
-  card: y,
-  head: j,
-  center: D,
-  content: E,
-  margin: I,
-  clickable: T,
-  "image-top": "_image-top_1sfar_109",
-  "image-left": "_image-left_1sfar_120",
-  selected: $
-}, q = ({
-  actions: u,
-  badge: d,
-  checkbox: a,
-  children: _,
-  header: o,
-  icon: f,
-  image: c,
-  imagePosition: m = "top",
-  onClick: s,
-  variant: n = "default"
-}) => /* @__PURE__ */ l("article", { className: i(e.card, s && e.clickable, (a == null ? void 0 : a.checked) && e.selected), "data-minimal": n === "minimal", onClick: s, onKeyDown: (t) => {
-  s && t.currentTarget === document.activeElement && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.currentTarget.click());
-}, tabIndex: s ? 0 : -1, "data-component": "card", children: [
-  c && n !== "minimal" && m === "top" && /* @__PURE__ */ r(p, { className: e[`image-${m}`], children: c }),
-  /* @__PURE__ */ l("section", { children: [
-    /* @__PURE__ */ l("div", { className: i(e.head, n === "minimal" && e.center), children: [
-      a && /* @__PURE__ */ r("span", { onClick: (t) => t.stopPropagation(), children: /* @__PURE__ */ r(N, { ...a }) }),
-      c && n !== "minimal" && m === "left" && /* @__PURE__ */ r(p, { className: e[`image-${m}`], children: c }),
-      o,
-      d && /* @__PURE__ */ r(g, { ...d }),
-      f && /* @__PURE__ */ r(h, { name: f, size: "medium" }),
-      u
-    ] }),
-    _ && n !== "minimal" && /* @__PURE__ */ r("div", { className: i(e.content, !!o && e.margin), children: _ })
-  ] })
-] });
-export {
-  q as Card
-};
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/_card/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport { Badge, BadgeProps } from '@/components/badge';\nimport { Checkbox, CheckboxProps } from '@/components/checkbox';\nimport { Figure } from '@/components/figure';\nimport { Icon } from '@/components/icon';\nimport { IconName } from '@/components/icon/icons.ts';\n\nimport styles from './styles.module.css';\n\nexport type CardProps = {\n  actions?: React.ReactNode;\n  badge?: BadgeProps;\n  checkbox?: CheckboxProps;\n  children?: React.ReactNode;\n  header?: React.ReactNode;\n  icon?: IconName;\n  image?: React.ReactNode;\n  imagePosition?: 'top' | 'left';\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Card = ({\n  actions,\n  badge,\n  checkbox,\n  children,\n  header,\n  icon,\n  image,\n  imagePosition = 'top',\n  onClick,\n  variant = 'default',\n}: CardProps) => {\n  return (\n    <article\n      className={cx(styles.card, onClick && styles.clickable, checkbox?.checked && styles.selected)}\n      data-minimal={variant === 'minimal'}\n      onClick={onClick}\n      onKeyDown={(e) => {\n        if (!onClick) return;\n\n        if (e.currentTarget !== document.activeElement) {\n          return;\n        }\n\n        if (e.key === 'Enter' || e.key === ' ') {\n          e.preventDefault();\n          e.currentTarget.click();\n        }\n      }}\n      tabIndex={onClick ? 0 : -1}\n    >\n      {image && variant !== 'minimal' && imagePosition === 'top' && (\n        <Figure className={styles[`image-${imagePosition}`]}>{image}</Figure>\n      )}\n      <section>\n        <div className={cx(styles.head, variant === 'minimal' && styles.center)}>\n          {checkbox && (\n            <span onClick={(e) => e.stopPropagation()}>\n              <Checkbox {...checkbox} />\n            </span>\n          )}\n          {image && variant !== 'minimal' && imagePosition === 'left' && (\n            <Figure className={styles[`image-${imagePosition}`]}>{image}</Figure>\n          )}\n          {header}\n          {badge && <Badge {...badge} />}\n          {icon && (\n            <Icon\n              name={icon}\n              size='medium'\n            />\n          )}\n          {actions}\n        </div>\n        {children && variant !== 'minimal' && (\n          <div className={cx(styles.content, !!header && styles.margin)}>{children}</div>\n        )}\n      </section>\n    </article>\n  );\n};\n"],"names":["Card","actions","badge","checkbox","children","header","icon","image","imagePosition","onClick","variant","cx","styles","card","clickable","checked","selected","e","currentTarget","document","activeElement","key","preventDefault","click","jsx","Figure","jsxs","head","center","stopPropagation","Checkbox","Badge","Icon","content","margin"],"mappings":";;;;;;;;;;;;;;;;GAuBaA,IAAOA,CAAC;AAAA,EACnBC,SAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,MAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,eAAAA,IAAgB;AAAA,EAChBC,SAAAA;AAAAA,EACAC,SAAAA,IAAU;AACD,wBAEN,WAAA,EACC,WAAWC,EAAGC,EAAOC,MAAMJ,KAAWG,EAAOE,YAAWX,KAAAA,gBAAAA,EAAUY,YAAWH,EAAOI,QAAQ,GAC5F,gBAAcN,MAAY,WAC1B,SAAAD,GACA,WAAYQ,CAAAA,MAAM;AAChB,EAAKR,KAEDQ,EAAEC,kBAAkBC,SAASC,kBAI7BH,EAAEI,QAAQ,WAAWJ,EAAEI,QAAQ,SACjCJ,EAAEK,eAAAA,GACFL,EAAEC,cAAcK,MAAAA;AAEpB,GACA,UAAUd,IAAU,IAAI,IAAG,kBAAA,QAE1BF,UAAAA;AAAAA,EAAAA,KAASG,MAAY,aAAaF,MAAkB,SACnD,gBAAAgB,EAACC,GAAA,EAAO,WAAWb,EAAO,SAASJ,CAAa,EAAE,GAAID,UAAAA,GAAM;AAAA,oBAE7D,WAAA,EACC,UAAA;AAAA,IAAA,gBAAAmB,EAAC,OAAA,EAAI,WAAWf,EAAGC,EAAOe,MAAMjB,MAAY,aAAaE,EAAOgB,MAAM,GACnEzB,UAAAA;AAAAA,MAAAA,KACC,gBAAAqB,EAAC,QAAA,EAAK,SAAUP,CAAAA,MAAMA,EAAEY,gBAAAA,GACtB,UAAA,gBAAAL,EAACM,GAAA,EAAS,GAAI3B,EAAAA,CAAS,GACzB;AAAA,MAEDI,KAASG,MAAY,aAAaF,MAAkB,UACnD,gBAAAgB,EAACC,GAAA,EAAO,WAAWb,EAAO,SAASJ,CAAa,EAAE,GAAID,UAAAA,GAAM;AAAA,MAE7DF;AAAAA,MACAH,KAAS,gBAAAsB,EAACO,GAAA,EAAM,GAAI7B,EAAAA,CAAM;AAAA,MAC1BI,KACC,gBAAAkB,EAACQ,GAAA,EACC,MAAM1B,GACN,MAAK,UAAQ;AAAA,MAGhBL;AAAAA,IAAAA,GACH;AAAA,IACCG,KAAYM,MAAY,aACvB,gBAAAc,EAAC,SAAI,WAAWb,EAAGC,EAAOqB,SAAS,CAAC,CAAC5B,KAAUO,EAAOsB,MAAM,GAAI9B,UAAAA,EAAAA,CAAS;AAAA,EAAA,EAAA,CAE7E;AAAA,GACF;"}

package/dist/components/_collapsible/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index17.css');const r=require("react/jsx-runtime"),s=require("../../icons-s-lGsxio.cjs"),n=require("../../utils-DBzf7CFq.cjs"),i="_collapsible_7flaz_1",a={collapsible:i},p=({children:c,disabled:o,label:e})=>{const l=n.resolveColor("--color-primary"),t=o?void 0:{"--icon-svg":s.iconSVG("chevron").replace("currentColor",l),"--icon-svg-open":s.iconSVG("chevron").replace("%3Cpath","%3Cpath transform='rotate(180 12 12)'").replace("currentColor",l)};return r.jsxs("details",{className:a.collapsible,open:o||void 0,"data-component":"collapsible",children:[r.jsx("summary",{style:t,children:e&&e}),c]})};exports.Collapsible=p;
-//# sourceMappingURL=index.cjs.map

package/dist/components/_collapsible/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/_collapsible/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { iconSVG } from '@/components/icon/icons';\nimport { resolveColor } from '@/utils';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: React.ReactNode;\n  disabled?: boolean;\n  label?: React.ReactNode;\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n  '--icon-svg-open'?: string;\n};\n\nexport const Collapsible = ({ children, disabled, label }: CollapsibleProps) => {\n  const iconColor = resolveColor('--color-primary');\n  const withVars: withVars | undefined = disabled\n    ? undefined\n    : {\n        '--icon-svg': iconSVG('chevron').replace('currentColor', iconColor),\n        '--icon-svg-open': iconSVG('chevron')\n          .replace('%3Cpath', \"%3Cpath transform='rotate(180 12 12)'\")\n          .replace('currentColor', iconColor),\n      };\n\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || undefined}\n    >\n      <summary style={withVars}>{label && label}</summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["Collapsible","children","disabled","label","iconColor","resolveColor","withVars","undefined","iconSVG","replace","jsxs","styles","collapsible","jsx"],"mappings":"4OAkBaA,EAAcA,CAAC,CAAEC,SAAAA,EAAUC,SAAAA,EAAUC,MAAAA,CAAwB,IAAM,CAC9E,MAAMC,EAAYC,EAAAA,aAAa,iBAAiB,EAC1CC,EAAiCJ,EACnCK,OACA,CACE,aAAcC,EAAAA,QAAQ,SAAS,EAAEC,QAAQ,eAAgBL,CAAS,EAClE,kBAAmBI,EAAAA,QAAQ,SAAS,EACjCC,QAAQ,UAAW,uCAAuC,EAC1DA,QAAQ,eAAgBL,CAAS,CAAA,EAG1C,OACEM,OAAC,WACC,UAAWC,EAAOC,YAClB,KAAMV,GAAYK,OAAU,iBAAA,cAE5B,SAAA,CAAAM,EAAAA,IAAC,UAAA,CAAQ,MAAOP,EAAWH,SAAAA,GAASA,EAAM,EAEzCF,CAAAA,EACH,CAEJ"}

package/dist/components/_collapsible/index.js

@@ -1,23 +0,0 @@
-import { jsxs as t, jsx as a } from "react/jsx-runtime";
-import { i as e } from "../../icons-D6XjzxSX.js";
-import { r as n } from "../../utils--n2yqjCy.js";
-import '../../assets/index17.css';const i = "_collapsible_7flaz_1", p = {
-  collapsible: i
-}, C = ({
-  children: s,
-  disabled: o,
-  label: r
-}) => {
-  const l = n("--color-primary"), c = o ? void 0 : {
-    "--icon-svg": e("chevron").replace("currentColor", l),
-    "--icon-svg-open": e("chevron").replace("%3Cpath", "%3Cpath transform='rotate(180 12 12)'").replace("currentColor", l)
-  };
-  return /* @__PURE__ */ t("details", { className: p.collapsible, open: o || void 0, "data-component": "collapsible", children: [
-    /* @__PURE__ */ a("summary", { style: c, children: r && r }),
-    s
-  ] });
-};
-export {
-  C as Collapsible
-};
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/_collapsible/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { iconSVG } from '@/components/icon/icons';\nimport { resolveColor } from '@/utils';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: React.ReactNode;\n  disabled?: boolean;\n  label?: React.ReactNode;\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n  '--icon-svg-open'?: string;\n};\n\nexport const Collapsible = ({ children, disabled, label }: CollapsibleProps) => {\n  const iconColor = resolveColor('--color-primary');\n  const withVars: withVars | undefined = disabled\n    ? undefined\n    : {\n        '--icon-svg': iconSVG('chevron').replace('currentColor', iconColor),\n        '--icon-svg-open': iconSVG('chevron')\n          .replace('%3Cpath', \"%3Cpath transform='rotate(180 12 12)'\")\n          .replace('currentColor', iconColor),\n      };\n\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || undefined}\n    >\n      <summary style={withVars}>{label && label}</summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["Collapsible","children","disabled","label","iconColor","resolveColor","withVars","undefined","iconSVG","replace","jsxs","styles","collapsible","jsx"],"mappings":";;;;;GAkBaA,IAAcA,CAAC;AAAA,EAAEC,UAAAA;AAAAA,EAAUC,UAAAA;AAAAA,EAAUC,OAAAA;AAAwB,MAAM;AAC9E,QAAMC,IAAYC,EAAa,iBAAiB,GAC1CC,IAAiCJ,IACnCK,SACA;AAAA,IACE,cAAcC,EAAQ,SAAS,EAAEC,QAAQ,gBAAgBL,CAAS;AAAA,IAClE,mBAAmBI,EAAQ,SAAS,EACjCC,QAAQ,WAAW,uCAAuC,EAC1DA,QAAQ,gBAAgBL,CAAS;AAAA,EAAA;AAG1C,SACE,gBAAAM,EAAC,aACC,WAAWC,EAAOC,aAClB,MAAMV,KAAYK,QAAU,kBAAA,eAE5B,UAAA;AAAA,IAAA,gBAAAM,EAAC,WAAA,EAAQ,OAAOP,GAAWH,UAAAA,KAASA,GAAM;AAAA,IAEzCF;AAAAA,EAAAA,GACH;AAEJ;"}

package/dist/components/_croppable/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index18.css');const d=require("react/jsx-runtime"),tt=require("../../classix-5H4IWnMA.cjs"),c=require("react"),mt=require("../button/index.cjs"),pt=require("../figure/index.cjs"),gt=require("../icon/index.cjs"),Ot="_croppable_2wdo8_1",St="_empty_2wdo8_14",Ut="_media_2wdo8_22",It="_overlay_2wdo8_33",Pt="_viewport_2wdo8_41",Yt="_draggable_2wdo8_53",Xt="_dragging_2wdo8_57",At="_inner_2wdo8_61",Dt="_standalone_2wdo8_77",z={croppable:Ot,empty:St,media:Ut,overlay:It,viewport:Pt,draggable:Yt,dragging:Xt,inner:At,standalone:Dt},Wt=192,B={offset:{x:0,y:0},zoom:1},wt="Select image",S=10,W=.1,Ht=.92,m=(h,w,R)=>Math.min(R,Math.max(w,h)),Zt=h=>new Promise((w,R)=>{const f=URL.createObjectURL(h),a=new globalThis.Image;a.onload=()=>{URL.revokeObjectURL(f),w(a)},a.onerror=()=>{URL.revokeObjectURL(f),R(new Error("croppable-image-load-failed"))},a.src=f}),kt=async({file:h,fill:w,transform:R,viewport:f})=>{const a=await Zt(h),U=f.width/a.naturalWidth,M=f.height/a.naturalHeight,y=Math.max(U,M),H=a.naturalWidth*y,E=a.naturalHeight*y,Q=w==="width"?Math.max(W,U/y):w==="height"?Math.max(W,M/y):W,j=m(R.zoom,Q,S),x=y*j,b=H*j,N=E*j,p=(f.width-b)/2+R.offset.x,L=(f.height-N)/2+R.offset.y,I=m((0-p)/x,0,a.naturalWidth),T=m((0-L)/x,0,a.naturalHeight),v=m(f.width/x,1,Math.max(1,a.naturalWidth-I)),s=m(f.height/x,1,Math.max(1,a.naturalHeight-T)),_=document.createElement("canvas"),u=_.getContext("2d");if(!u)throw new Error("croppable-image-context-missing");_.width=Math.max(1,Math.round(v)),_.height=Math.max(1,Math.round(s)),u.drawImage(a,I,T,v,s,0,0,_.width,_.height);const P=h.type.startsWith("image/")?h.type:"image/jpeg",Y=await new Promise(q=>{_.toBlob(q,P,Ht)});if(!Y)throw new Error("croppable-image-export-failed");return new globalThis.File([Y],h.name,{lastModified:Date.now(),type:Y.type||P})},Bt=({children:h,fill:w="none",height:R,image:f,label:a,onCroppableChange:U,onFileChange:M,onImageChange:y,onTransformChange:H,transform:E,standalone:Q})=>{const j=c.useRef(null),x=c.useRef(null),b=c.useRef(null),N=c.useRef(null),p=c.useRef(y),L=c.useRef(null),I=c.useRef(null),T=c.useRef(null),v=c.useRef(new Map),s=c.useRef(B),_=c.useRef(null),[u,P]=c.useState(null),[Y,q]=c.useState(null),[et,V]=c.useState(!1),[xt,nt]=c.useState(B),[F,ot]=c.useState(null),[g,yt]=c.useState({width:0,height:0}),Z=(()=>{const t=g.width,n=g.height;if(!t||!n)return{width:0,height:0,minZoom:W};if(!u)return{width:t,height:n,minZoom:W};const o=t/u.width,e=n/u.height,r=Math.max(o,e),i=w==="width"?o/r:w==="height"?e/r:0;return{width:u.width*r,height:u.height*r,minZoom:Math.max(W,i)}})(),X=Z.minZoom,k=E??xt,A=m(k.zoom,X,S),$=Y??f??null,rt=!h&&!!f&&!Y&&!F,G=!rt,ct=h??($?d.jsx("img",{alt:"",draggable:!1,onLoad:t=>{const n=t.currentTarget;n.naturalWidth&&n.naturalHeight&&P({width:n.naturalWidth,height:n.naturalHeight})},src:$}):null),D=ct==null,J=(t,n)=>{const{maxX:o,maxY:e}=it(n);return{x:m(t.x,-o,o),y:m(t.y,-e,e)}},st=(t,n)=>{const o=_.current;if(!o)return null;const e=o.getBoundingClientRect(),r=t-e.left-e.width/2,i=n-e.top-e.height/2;return{x:r,y:i}},bt=(t,n,o,e)=>{const r=m(n,X,S),i=m(o,X,S);if(r===0)return t;const l=i/r;return{x:(1-l)*e.x+l*t.x,y:(1-l)*e.y+l*t.y}},_t=(t,n,o)=>{const e=s.current.zoom,r=m(t,X,S),i=s.current.offset,l=o?bt(i,e,r,o):n,O=J(l,r);s.current={zoom:r,offset:O},E||nt({zoom:r,offset:O}),H==null||H({zoom:r,offset:O})},K=(t,n,o)=>{I.current={zoom:t,offset:n,anchor:o??null},x.current==null&&(x.current=window.requestAnimationFrame(()=>{x.current=null;const e=I.current;I.current=null;const r=(e==null?void 0:e.zoom)??s.current.zoom,i=(e==null?void 0:e.offset)??s.current.offset,l=(e==null?void 0:e.anchor)??null;_t(r,i,l)}))},zt=t=>{if(D||!G)return;const n=t.ctrlKey?.001:25e-5,o=s.current.zoom*Math.exp(-t.deltaY*n),e=st(t.clientX,t.clientY);K(o,s.current.offset,e)},it=t=>{const n=g.width,o=g.height;if(!n||!o)return{maxX:0,maxY:0};const e=m(t,X,S),r=Z.width*e,i=Z.height*e,l=Math.max(0,(r-n)/2),O=Math.max(0,(i-o)/2);return{maxX:l,maxY:O}},Rt=t=>{var r;const n=t.target,o=((r=n.files)==null?void 0:r[0])??null;if(L.current&&(URL.revokeObjectURL(L.current),L.current=null),!o){q(null),ot(null),M==null||M(null),n.value="";return}const e=URL.createObjectURL(o);L.current=e,q(e),P(null),ot(o),K(B.zoom,B.offset),s.current=B,M==null||M(o),n.value=""},Mt=t=>{if(!(D||!G||t.pointerType==="mouse"&&t.button!==0)){if(t.currentTarget.setPointerCapture(t.pointerId),t.pointerType==="touch"){const n=v.current;if(n.set(t.pointerId,{x:t.clientX,y:t.clientY}),n.size===2){b.current=null,j.current=null,V(!1);const[o,e]=Array.from(n.values());T.current=Math.hypot(o.x-e.x,o.y-e.y);return}}j.current=t.pointerId,b.current={x:t.clientX,y:t.clientY,originX:s.current.offset.x,originY:s.current.offset.y}}},Et=t=>{if(D||!G)return;if(t.pointerType==="touch"){const r=v.current;if(!r.has(t.pointerId))return;if(r.set(t.pointerId,{x:t.clientX,y:t.clientY}),r.size===2){const[i,l]=Array.from(r.values()),O=i.x-l.x,jt=i.y-l.y,ht=Math.hypot(O,jt),ft={x:(i.x+l.x)/2,y:(i.y+l.y)/2};if(T.current){const Lt=ht/T.current,Tt=s.current.zoom*Lt,vt=st(ft.x,ft.y);K(Tt,s.current.offset,vt)}T.current=ht;return}}if(j.current!==t.pointerId||!b.current||!C)return;const n=t.clientX-b.current.x,o=t.clientY-b.current.y,e=Math.abs(n)+Math.abs(o);!et&&e>2&&V(!0),!(e<=1)&&K(s.current.zoom,{x:b.current.originX+n,y:b.current.originY+o})},at=t=>{t.pointerType==="touch"&&(v.current.delete(t.pointerId),v.current.size<2&&(T.current=null)),j.current===t.pointerId&&(j.current=null,b.current=null,V(!1))};c.useEffect(()=>{if(!E)return;const t=m(E.zoom,X,S);s.current={zoom:t,offset:J(E.offset,t)}},[E,g.width,g.height,u==null?void 0:u.width,u==null?void 0:u.height]),c.useEffect(()=>()=>{L.current&&URL.revokeObjectURL(L.current)},[]),c.useEffect(()=>{const t=_.current;if(!t)return;const n=()=>{const r=t.getBoundingClientRect();yt(i=>i.width===r.width&&i.height===r.height?i:{width:r.width,height:r.height}),U&&U(r)};n();const o=()=>n();if(window.addEventListener("scroll",o,!0),typeof ResizeObserver>"u"){const r=()=>n();return window.addEventListener("resize",r),()=>{window.removeEventListener("resize",r),window.removeEventListener("scroll",o,!0)}}const e=new ResizeObserver(()=>n());return e.observe(t),()=>{e.disconnect(),window.removeEventListener("scroll",o,!0)}},[U]),c.useEffect(()=>{if(E)return;const t=s.current.offset,n=J(t,A);t.x===n.x&&t.y===n.y||(s.current={zoom:s.current.zoom,offset:n},nt(o=>({...o,offset:n})))},[A,u,g.width,g.height]),c.useEffect(()=>{$||P(null)},[$]),c.useEffect(()=>{p.current=y},[y]),c.useEffect(()=>{var o;if(!y)return;if(!F||!g.width||!g.height||h){(o=p.current)==null||o.call(p,null);return}let t=!0;const n=window.setTimeout(()=>{kt({file:F,fill:w,transform:{zoom:A,offset:k.offset},viewport:g}).then(e=>{var r;t&&((r=p.current)==null||r.call(p,e))}).catch(()=>{var e;t&&((e=p.current)==null||e.call(p,null))})},75);return()=>{t=!1,window.clearTimeout(n)}},[h,A,k.offset,w,F,g]),c.useEffect(()=>()=>{x.current!=null&&(window.cancelAnimationFrame(x.current),x.current=null)},[]);const ut=it(A),C=!D&&G&&(ut.maxX>0||ut.maxY>0),lt=()=>{var t;return(t=N.current)==null?void 0:t.click()},dt=t=>{t.preventDefault(),t.stopPropagation(),lt()};return d.jsxs("div",{className:tt.t(z.croppable,Q&&z.standalone),onClick:()=>{D&&lt()},"data-component":"croppable",children:[d.jsx("input",{accept:"image/*",onChange:Rt,ref:N,type:"file"}),d.jsx("div",{className:z.viewport,ref:_,onDragStart:t=>t.preventDefault(),onPointerDown:Mt,onPointerMove:Et,onPointerUp:at,onPointerCancel:at,onWheel:zt,style:{"--croppable-height":`${R??Wt}px`,"--croppable-zoom":A,"--croppable-x":`${k.offset.x}px`,"--croppable-y":`${k.offset.y}px`,...u?{"--croppable-image-width":`${Z.width}px`,"--croppable-image-height":`${Z.height}px`}:null},children:D?d.jsxs("div",{className:z.empty,children:[d.jsx(pt.Figure,{children:d.jsx(gt.Icon,{name:"image",size:"large"})}),d.jsx(mt.Button,{onClick:dt,children:a??wt})]}):d.jsxs("div",{className:tt.t(z.media,C&&z.draggable,C&&et&&z.dragging),children:[d.jsx("div",{className:tt.t(z.inner),children:ct}),rt&&d.jsx("div",{className:z.overlay,children:d.jsxs("div",{className:z.empty,children:[d.jsx(pt.Figure,{children:d.jsx(gt.Icon,{name:"image",size:"large"})}),d.jsx(mt.Button,{onClick:dt,children:a??wt})]})})]})})]})};exports.Croppable=Bt;
-//# sourceMappingURL=index.cjs.map

package/dist/components/_croppable/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/_croppable/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Figure } from '../figure';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type CroppableTransform = {\n  offset: { x: number; y: number };\n  zoom: number;\n};\n\nexport type CroppableProps = {\n  children?: React.ReactNode;\n  fill?: 'width' | 'height' | 'none';\n  height?: number;\n  image?: string | null;\n  label?: string;\n  onCroppableChange?: (rect: DOMRect) => void;\n  onFileChange?: (file: File | null) => void;\n  onImageChange?: (file: File | null) => void;\n  onTransformChange?: (transform: CroppableTransform) => void;\n  standalone?: boolean;\n  transform?: CroppableTransform;\n};\n\nconst DEFAULT_HEIGHT = 192;\nconst DEFAULT_TRANSFORM: CroppableTransform = { offset: { x: 0, y: 0 }, zoom: 1 };\nconst EMPTY_STATE_LABEL = 'Select image';\nconst MAX_ZOOM = 10;\nconst MIN_ZOOM = 0.1;\nconst IMAGE_EXPORT_QUALITY = 0.92;\n\nconst clamp = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));\n\nconst loadImage = (file: File) =>\n  new Promise<HTMLImageElement>((resolve, reject) => {\n    const url = URL.createObjectURL(file);\n    const image = new globalThis.Image();\n\n    image.onload = () => {\n      URL.revokeObjectURL(url);\n      resolve(image);\n    };\n    image.onerror = () => {\n      URL.revokeObjectURL(url);\n      reject(new Error('croppable-image-load-failed'));\n    };\n\n    image.src = url;\n  });\n\nconst createCroppedFile = async ({\n  file,\n  fill,\n  transform,\n  viewport,\n}: {\n  file: File;\n  fill: 'width' | 'height' | 'none';\n  transform: CroppableTransform;\n  viewport: { width: number; height: number };\n}) => {\n  const image = await loadImage(file);\n  const widthRatio = viewport.width / image.naturalWidth;\n  const heightRatio = viewport.height / image.naturalHeight;\n  const coverRatio = Math.max(widthRatio, heightRatio);\n  const baseWidth = image.naturalWidth * coverRatio;\n  const baseHeight = image.naturalHeight * coverRatio;\n  const minZoom =\n    fill === 'width'\n      ? Math.max(MIN_ZOOM, widthRatio / coverRatio)\n      : fill === 'height'\n        ? Math.max(MIN_ZOOM, heightRatio / coverRatio)\n        : MIN_ZOOM;\n  const zoom = clamp(transform.zoom, minZoom, MAX_ZOOM);\n  const scale = coverRatio * zoom;\n  const renderedWidth = baseWidth * zoom;\n  const renderedHeight = baseHeight * zoom;\n  const left = (viewport.width - renderedWidth) / 2 + transform.offset.x;\n  const top = (viewport.height - renderedHeight) / 2 + transform.offset.y;\n  const sourceX = clamp((0 - left) / scale, 0, image.naturalWidth);\n  const sourceY = clamp((0 - top) / scale, 0, image.naturalHeight);\n  const sourceWidth = clamp(viewport.width / scale, 1, Math.max(1, image.naturalWidth - sourceX));\n  const sourceHeight = clamp(\n    viewport.height / scale,\n    1,\n    Math.max(1, image.naturalHeight - sourceY)\n  );\n  const canvas = document.createElement('canvas');\n  const context = canvas.getContext('2d');\n\n  if (!context) {\n    throw new Error('croppable-image-context-missing');\n  }\n\n  canvas.width = Math.max(1, Math.round(sourceWidth));\n  canvas.height = Math.max(1, Math.round(sourceHeight));\n  context.drawImage(\n    image,\n    sourceX,\n    sourceY,\n    sourceWidth,\n    sourceHeight,\n    0,\n    0,\n    canvas.width,\n    canvas.height\n  );\n\n  const outputType = file.type.startsWith('image/') ? file.type : 'image/jpeg';\n  const blob = await new Promise<Blob | null>((resolve) => {\n    canvas.toBlob(resolve, outputType, IMAGE_EXPORT_QUALITY);\n  });\n\n  if (!blob) {\n    throw new Error('croppable-image-export-failed');\n  }\n\n  return new globalThis.File([blob], file.name, {\n    lastModified: Date.now(),\n    type: blob.type || outputType,\n  });\n};\n\nexport const Croppable = ({\n  children,\n  fill = 'none',\n  height,\n  image,\n  label,\n  onCroppableChange,\n  onFileChange,\n  onImageChange,\n  onTransformChange,\n  transform,\n  standalone,\n}: CroppableProps) => {\n  const activePointerId = useRef<number | null>(null);\n  const animationFrameRef = useRef<number | null>(null);\n  const dragStartRef = useRef<{ x: number; y: number; originX: number; originY: number } | null>(\n    null\n  );\n  const inputRef = useRef<HTMLInputElement>(null);\n  const onImageChangeRef = useRef(onImageChange);\n  const objectUrlRef = useRef<string | null>(null);\n  const pendingRef = useRef<{\n    zoom: number;\n    offset: { x: number; y: number };\n    anchor: { x: number; y: number } | null;\n  } | null>(null);\n  const pinchDistance = useRef<number | null>(null);\n  const pointers = useRef<Map<number, { x: number; y: number }>>(new Map());\n  const transformRef = useRef<CroppableTransform>(DEFAULT_TRANSFORM);\n  const viewportRef = useRef<HTMLDivElement>(null);\n\n  const [imageSize, setImageSize] = useState<{ width: number; height: number } | null>(null);\n  const [imageSrc, setImageSrc] = useState<string | null>(null);\n  const [isDragging, setIsDragging] = useState(false);\n  const [draftTransform, setDraftTransform] = useState<CroppableTransform>(DEFAULT_TRANSFORM);\n  const [sourceFile, setSourceFile] = useState<File | null>(null);\n  const [viewportSize, setViewportSize] = useState({ width: 0, height: 0 });\n\n  const getBaseMetrics = () => {\n    const width = viewportSize.width;\n    const height = viewportSize.height;\n\n    if (!width || !height) return { width: 0, height: 0, minZoom: MIN_ZOOM };\n    if (!imageSize) return { width, height, minZoom: MIN_ZOOM };\n\n    const scaleX = width / imageSize.width;\n    const scaleY = height / imageSize.height;\n    const cover = Math.max(scaleX, scaleY);\n\n    const rawMinZoom = fill === 'width' ? scaleX / cover : fill === 'height' ? scaleY / cover : 0;\n\n    return {\n      width: imageSize.width * cover,\n      height: imageSize.height * cover,\n      minZoom: Math.max(MIN_ZOOM, rawMinZoom),\n    };\n  };\n\n  const baseMetrics = getBaseMetrics();\n  const minZoom = baseMetrics.minZoom;\n\n  const currentTransform = transform ?? draftTransform;\n  const clampedZoom = clamp(currentTransform.zoom, minZoom, MAX_ZOOM);\n  const displayImage = imageSrc ?? image ?? null;\n  const hasPresetImage = !children && !!image && !imageSrc && !sourceFile;\n  const canTransform = !hasPresetImage;\n  const content =\n    children ??\n    (displayImage ? (\n      <img\n        alt=''\n        draggable={false}\n        onLoad={(event) => {\n          const img = event.currentTarget;\n          if (img.naturalWidth && img.naturalHeight) {\n            setImageSize({ width: img.naturalWidth, height: img.naturalHeight });\n          }\n        }}\n        src={displayImage}\n      />\n    ) : null);\n  const isEmpty = content == null;\n\n  const clampOffset = (next: { x: number; y: number }, zoomToUse: number) => {\n    const { maxX, maxY } = getClampBounds(zoomToUse);\n    return {\n      x: clamp(next.x, -maxX, maxX),\n      y: clamp(next.y, -maxY, maxY),\n    };\n  };\n\n  const getViewportVectorFromClient = (clientX: number, clientY: number) => {\n    const node = viewportRef.current;\n    if (!node) return null;\n    const rect = node.getBoundingClientRect();\n    const x = clientX - rect.left - rect.width / 2;\n    const y = clientY - rect.top - rect.height / 2;\n    return { x, y };\n  };\n\n  const computeAnchoredOffset = (\n    currentOffset: { x: number; y: number },\n    currentZoom: number,\n    nextZoom: number,\n    anchorVec: { x: number; y: number }\n  ) => {\n    const z0 = clamp(currentZoom, minZoom, MAX_ZOOM);\n    const z1 = clamp(nextZoom, minZoom, MAX_ZOOM);\n    if (z0 === 0) return currentOffset;\n    const r = z1 / z0;\n    return {\n      x: (1 - r) * anchorVec.x + r * currentOffset.x,\n      y: (1 - r) * anchorVec.y + r * currentOffset.y,\n    };\n  };\n\n  const commitTransform = (\n    nextZoom: number,\n    nextOffset: { x: number; y: number },\n    anchorVec?: { x: number; y: number } | null\n  ) => {\n    const z0 = transformRef.current.zoom;\n    const z1 = clamp(nextZoom, minZoom, MAX_ZOOM);\n    const currentOffset = transformRef.current.offset;\n    const anchoredOffset = anchorVec\n      ? computeAnchoredOffset(currentOffset, z0, z1, anchorVec)\n      : nextOffset;\n    const clampedOffset = clampOffset(anchoredOffset, z1);\n    transformRef.current = { zoom: z1, offset: clampedOffset };\n\n    if (!transform) {\n      setDraftTransform({ zoom: z1, offset: clampedOffset });\n    }\n    onTransformChange?.({ zoom: z1, offset: clampedOffset });\n  };\n\n  const scheduleTransform = (\n    nextZoom: number,\n    nextOffset: { x: number; y: number },\n    anchorVec?: { x: number; y: number } | null\n  ) => {\n    pendingRef.current = {\n      zoom: nextZoom,\n      offset: nextOffset,\n      anchor: anchorVec ?? null,\n    };\n\n    if (animationFrameRef.current != null) return;\n\n    animationFrameRef.current = window.requestAnimationFrame(() => {\n      animationFrameRef.current = null;\n\n      const pending = pendingRef.current;\n      pendingRef.current = null;\n\n      const z = pending?.zoom ?? transformRef.current.zoom;\n      const o = pending?.offset ?? transformRef.current.offset;\n      const a = pending?.anchor ?? null;\n\n      commitTransform(z, o, a);\n    });\n  };\n\n  const handleWheel: React.WheelEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform) return;\n\n    const sensitivity = event.ctrlKey ? 0.001 : 0.00025;\n    const next = transformRef.current.zoom * Math.exp(-event.deltaY * sensitivity);\n\n    const anchor = getViewportVectorFromClient(event.clientX, event.clientY);\n    scheduleTransform(next, transformRef.current.offset, anchor);\n  };\n\n  const getClampBounds = (zoomToUse: number) => {\n    const width = viewportSize.width;\n    const height = viewportSize.height;\n    if (!width || !height) return { maxX: 0, maxY: 0 };\n    const z = clamp(zoomToUse, minZoom, MAX_ZOOM);\n    const scaledWidth = baseMetrics.width * z;\n    const scaledHeight = baseMetrics.height * z;\n    const maxX = Math.max(0, (scaledWidth - width) / 2);\n    const maxY = Math.max(0, (scaledHeight - height) / 2);\n    return { maxX, maxY };\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    const input = event.target;\n    const file = input.files?.[0] ?? null;\n\n    if (objectUrlRef.current) {\n      URL.revokeObjectURL(objectUrlRef.current);\n      objectUrlRef.current = null;\n    }\n\n    if (!file) {\n      setImageSrc(null);\n      setSourceFile(null);\n      onFileChange?.(null);\n      input.value = '';\n      return;\n    }\n\n    const url = URL.createObjectURL(file);\n    objectUrlRef.current = url;\n    setImageSrc(url);\n    setImageSize(null);\n    setSourceFile(file);\n    scheduleTransform(DEFAULT_TRANSFORM.zoom, DEFAULT_TRANSFORM.offset);\n    transformRef.current = DEFAULT_TRANSFORM;\n    onFileChange?.(file);\n    input.value = '';\n  };\n\n  const handlePointerDown: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform || (event.pointerType === 'mouse' && event.button !== 0)) return;\n\n    event.currentTarget.setPointerCapture(event.pointerId);\n\n    if (event.pointerType === 'touch') {\n      const points = pointers.current;\n      points.set(event.pointerId, { x: event.clientX, y: event.clientY });\n      if (points.size === 2) {\n        dragStartRef.current = null;\n        activePointerId.current = null;\n        setIsDragging(false);\n        const [first, second] = Array.from(points.values());\n        pinchDistance.current = Math.hypot(first.x - second.x, first.y - second.y);\n        return;\n      }\n    }\n\n    activePointerId.current = event.pointerId;\n    dragStartRef.current = {\n      x: event.clientX,\n      y: event.clientY,\n      originX: transformRef.current.offset.x,\n      originY: transformRef.current.offset.y,\n    };\n  };\n\n  const handlePointerMove: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform) return;\n\n    if (event.pointerType === 'touch') {\n      const points = pointers.current;\n      if (!points.has(event.pointerId)) return;\n      points.set(event.pointerId, { x: event.clientX, y: event.clientY });\n      if (points.size === 2) {\n        const [first, second] = Array.from(points.values());\n        const dx = first.x - second.x;\n        const dy = first.y - second.y;\n        const distance = Math.hypot(dx, dy);\n        const center = { x: (first.x + second.x) / 2, y: (first.y + second.y) / 2 };\n        if (pinchDistance.current) {\n          const ratio = distance / pinchDistance.current;\n          const nextZoom = transformRef.current.zoom * ratio;\n          const anchor = getViewportVectorFromClient(center.x, center.y);\n          scheduleTransform(nextZoom, transformRef.current.offset, anchor);\n        }\n        pinchDistance.current = distance;\n        return;\n      }\n    }\n\n    if (activePointerId.current !== event.pointerId || !dragStartRef.current || !canDrag) return;\n    const dx = event.clientX - dragStartRef.current.x;\n    const dy = event.clientY - dragStartRef.current.y;\n    const distance = Math.abs(dx) + Math.abs(dy);\n    if (!isDragging && distance > 2) setIsDragging(true);\n    if (distance <= 1) return;\n    scheduleTransform(transformRef.current.zoom, {\n      x: dragStartRef.current.originX + dx,\n      y: dragStartRef.current.originY + dy,\n    });\n  };\n\n  const handlePointerUp: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (event.pointerType === 'touch') {\n      pointers.current.delete(event.pointerId);\n      if (pointers.current.size < 2) pinchDistance.current = null;\n    }\n\n    if (activePointerId.current === event.pointerId) {\n      activePointerId.current = null;\n      dragStartRef.current = null;\n      setIsDragging(false);\n    }\n  };\n\n  useEffect(() => {\n    if (!transform) return;\n\n    const z = clamp(transform.zoom, minZoom, MAX_ZOOM);\n    transformRef.current = { zoom: z, offset: clampOffset(transform.offset, z) };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [transform, viewportSize.width, viewportSize.height, imageSize?.width, imageSize?.height]);\n\n  useEffect(() => {\n    return () => {\n      if (objectUrlRef.current) URL.revokeObjectURL(objectUrlRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    const node = viewportRef.current;\n    if (!node) return;\n\n    const update = () => {\n      const rect = node.getBoundingClientRect();\n      setViewportSize((prev) =>\n        prev.width === rect.width && prev.height === rect.height\n          ? prev\n          : { width: rect.width, height: rect.height }\n      );\n      if (onCroppableChange) onCroppableChange(rect);\n    };\n\n    update();\n\n    const handleScroll = () => update();\n    window.addEventListener('scroll', handleScroll, true);\n\n    if (typeof ResizeObserver === 'undefined') {\n      const handleResize = () => update();\n      window.addEventListener('resize', handleResize);\n      return () => {\n        window.removeEventListener('resize', handleResize);\n        window.removeEventListener('scroll', handleScroll, true);\n      };\n    }\n\n    const observer = new ResizeObserver(() => update());\n    observer.observe(node);\n    return () => {\n      observer.disconnect();\n      window.removeEventListener('scroll', handleScroll, true);\n    };\n  }, [onCroppableChange]);\n\n  useEffect(() => {\n    if (transform) return;\n\n    const current = transformRef.current.offset;\n    const clamped = clampOffset(current, clampedZoom);\n\n    if (current.x === clamped.x && current.y === clamped.y) return;\n\n    transformRef.current = { zoom: transformRef.current.zoom, offset: clamped };\n    setDraftTransform((prev) => ({ ...prev, offset: clamped }));\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [clampedZoom, imageSize, viewportSize.width, viewportSize.height]);\n\n  useEffect(() => {\n    if (!displayImage) {\n      setImageSize(null);\n    }\n  }, [displayImage]);\n\n  useEffect(() => {\n    onImageChangeRef.current = onImageChange;\n  }, [onImageChange]);\n\n  useEffect(() => {\n    if (!onImageChange) return;\n\n    if (!sourceFile || !viewportSize.width || !viewportSize.height || children) {\n      onImageChangeRef.current?.(null);\n      return;\n    }\n\n    let isActive = true;\n    const timeout = window.setTimeout(() => {\n      createCroppedFile({\n        file: sourceFile,\n        fill,\n        transform: {\n          zoom: clampedZoom,\n          offset: currentTransform.offset,\n        },\n        viewport: viewportSize,\n      })\n        .then((nextFile) => {\n          if (isActive) {\n            onImageChangeRef.current?.(nextFile);\n          }\n        })\n        .catch(() => {\n          if (isActive) {\n            onImageChangeRef.current?.(null);\n          }\n        });\n    }, 75);\n\n    return () => {\n      isActive = false;\n      window.clearTimeout(timeout);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    children,\n    clampedZoom,\n    currentTransform.offset,\n    fill,\n    sourceFile,\n    viewportSize,\n  ]);\n\n  useEffect(() => {\n    return () => {\n      if (animationFrameRef.current != null) {\n        window.cancelAnimationFrame(animationFrameRef.current);\n        animationFrameRef.current = null;\n      }\n    };\n  }, []);\n\n  const clampBounds = getClampBounds(clampedZoom);\n  const canDrag = !isEmpty && canTransform && (clampBounds.maxX > 0 || clampBounds.maxY > 0);\n  const openFilePicker = () => inputRef.current?.click();\n  const handleSelectImageClick: React.MouseEventHandler<HTMLButtonElement> = (event) => {\n    event.preventDefault();\n    event.stopPropagation();\n    openFilePicker();\n  };\n\n  return (\n    <div\n      className={cx(styles.croppable, standalone && styles.standalone)}\n      onClick={() => {\n        if (isEmpty) openFilePicker();\n      }}\n    >\n      <input\n        accept='image/*'\n        onChange={handleInputChange}\n        ref={inputRef}\n        type='file'\n      />\n      <div\n        className={styles.viewport}\n        ref={viewportRef}\n        onDragStart={(event) => event.preventDefault()}\n        onPointerDown={handlePointerDown}\n        onPointerMove={handlePointerMove}\n        onPointerUp={handlePointerUp}\n        onPointerCancel={handlePointerUp}\n        onWheel={handleWheel}\n        style={\n          {\n            '--croppable-height': `${height ?? DEFAULT_HEIGHT}px`,\n            '--croppable-zoom': clampedZoom,\n            '--croppable-x': `${currentTransform.offset.x}px`,\n            '--croppable-y': `${currentTransform.offset.y}px`,\n            ...(imageSize\n              ? {\n                  '--croppable-image-width': `${baseMetrics.width}px`,\n                  '--croppable-image-height': `${baseMetrics.height}px`,\n                }\n              : null),\n          } as React.CSSProperties\n        }\n      >\n        {isEmpty ? (\n          <div className={styles.empty}>\n            <Figure>\n              <Icon\n                name='image'\n                size='large'\n              />\n            </Figure>\n            <Button\n              onClick={handleSelectImageClick}\n            >\n              {label ?? EMPTY_STATE_LABEL}\n            </Button>\n          </div>\n        ) : (\n          <div\n            className={cx(\n              styles.media,\n              canDrag && styles.draggable,\n              canDrag && isDragging && styles.dragging\n            )}\n          >\n            <div className={cx(styles.inner)}>{content}</div>\n            {hasPresetImage && (\n              <div className={styles.overlay}>\n                <div className={styles.empty}>\n                  <Figure>\n                    <Icon\n                      name='image'\n                      size='large'\n                    />\n                  </Figure>\n                  <Button\n                    onClick={handleSelectImageClick}\n                  >\n                    {label ?? EMPTY_STATE_LABEL}\n                  </Button>\n                </div>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["DEFAULT_HEIGHT","DEFAULT_TRANSFORM","offset","x","y","zoom","EMPTY_STATE_LABEL","MAX_ZOOM","MIN_ZOOM","IMAGE_EXPORT_QUALITY","clamp","value","min","max","Math","loadImage","file","Promise","resolve","reject","url","URL","createObjectURL","image","globalThis","Image","onload","revokeObjectURL","onerror","Error","src","createCroppedFile","fill","transform","viewport","widthRatio","width","naturalWidth","heightRatio","height","naturalHeight","coverRatio","baseWidth","baseHeight","minZoom","scale","renderedWidth","renderedHeight","left","top","sourceX","sourceY","sourceWidth","sourceHeight","canvas","document","createElement","context","getContext","round","drawImage","outputType","type","startsWith","blob","toBlob","File","name","lastModified","Date","now","Croppable","children","label","onCroppableChange","onFileChange","onImageChange","onTransformChange","standalone","activePointerId","useRef","animationFrameRef","dragStartRef","inputRef","onImageChangeRef","objectUrlRef","pendingRef","pinchDistance","pointers","Map","transformRef","viewportRef","imageSize","setImageSize","useState","imageSrc","setImageSrc","isDragging","setIsDragging","draftTransform","setDraftTransform","sourceFile","setSourceFile","viewportSize","setViewportSize","baseMetrics","getBaseMetrics","scaleX","scaleY","cover","rawMinZoom","currentTransform","clampedZoom","displayImage","hasPresetImage","canTransform","content","jsx","event","img","currentTarget","isEmpty","clampOffset","next","zoomToUse","maxX","maxY","getClampBounds","getViewportVectorFromClient","clientX","clientY","node","current","rect","getBoundingClientRect","computeAnchoredOffset","currentOffset","currentZoom","nextZoom","anchorVec","z0","z1","r","commitTransform","nextOffset","anchoredOffset","clampedOffset","scheduleTransform","anchor","window","requestAnimationFrame","pending","z","o","a","handleWheel","sensitivity","ctrlKey","exp","deltaY","scaledWidth","scaledHeight","handleInputChange","input","target","files","handlePointerDown","pointerType","button","setPointerCapture","pointerId","points","set","size","first","second","Array","from","values","hypot","originX","originY","handlePointerMove","has","dx","dy","distance","center","ratio","canDrag","abs","handlePointerUp","delete","useEffect","update","prev","handleScroll","addEventListener","ResizeObserver","handleResize","removeEventListener","observer","observe","disconnect","clamped","isActive","timeout","setTimeout","then","nextFile","catch","clearTimeout","cancelAnimationFrame","clampBounds","openFilePicker","click","handleSelectImageClick","preventDefault","stopPropagation","jsxs","cx","styles","croppable","empty","Figure","Icon","Button","media","draggable","dragging","inner","overlay"],"mappings":"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"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/_croppable/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Figure } from '../figure';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type CroppableTransform = {\n  offset: { x: number; y: number };\n  zoom: number;\n};\n\nexport type CroppableProps = {\n  children?: React.ReactNode;\n  fill?: 'width' | 'height' | 'none';\n  height?: number;\n  image?: string | null;\n  label?: string;\n  onCroppableChange?: (rect: DOMRect) => void;\n  onFileChange?: (file: File | null) => void;\n  onImageChange?: (file: File | null) => void;\n  onTransformChange?: (transform: CroppableTransform) => void;\n  standalone?: boolean;\n  transform?: CroppableTransform;\n};\n\nconst DEFAULT_HEIGHT = 192;\nconst DEFAULT_TRANSFORM: CroppableTransform = { offset: { x: 0, y: 0 }, zoom: 1 };\nconst EMPTY_STATE_LABEL = 'Select image';\nconst MAX_ZOOM = 10;\nconst MIN_ZOOM = 0.1;\nconst IMAGE_EXPORT_QUALITY = 0.92;\n\nconst clamp = (value: number, min: number, max: number) => Math.min(max, Math.max(min, value));\n\nconst loadImage = (file: File) =>\n  new Promise<HTMLImageElement>((resolve, reject) => {\n    const url = URL.createObjectURL(file);\n    const image = new globalThis.Image();\n\n    image.onload = () => {\n      URL.revokeObjectURL(url);\n      resolve(image);\n    };\n    image.onerror = () => {\n      URL.revokeObjectURL(url);\n      reject(new Error('croppable-image-load-failed'));\n    };\n\n    image.src = url;\n  });\n\nconst createCroppedFile = async ({\n  file,\n  fill,\n  transform,\n  viewport,\n}: {\n  file: File;\n  fill: 'width' | 'height' | 'none';\n  transform: CroppableTransform;\n  viewport: { width: number; height: number };\n}) => {\n  const image = await loadImage(file);\n  const widthRatio = viewport.width / image.naturalWidth;\n  const heightRatio = viewport.height / image.naturalHeight;\n  const coverRatio = Math.max(widthRatio, heightRatio);\n  const baseWidth = image.naturalWidth * coverRatio;\n  const baseHeight = image.naturalHeight * coverRatio;\n  const minZoom =\n    fill === 'width'\n      ? Math.max(MIN_ZOOM, widthRatio / coverRatio)\n      : fill === 'height'\n        ? Math.max(MIN_ZOOM, heightRatio / coverRatio)\n        : MIN_ZOOM;\n  const zoom = clamp(transform.zoom, minZoom, MAX_ZOOM);\n  const scale = coverRatio * zoom;\n  const renderedWidth = baseWidth * zoom;\n  const renderedHeight = baseHeight * zoom;\n  const left = (viewport.width - renderedWidth) / 2 + transform.offset.x;\n  const top = (viewport.height - renderedHeight) / 2 + transform.offset.y;\n  const sourceX = clamp((0 - left) / scale, 0, image.naturalWidth);\n  const sourceY = clamp((0 - top) / scale, 0, image.naturalHeight);\n  const sourceWidth = clamp(viewport.width / scale, 1, Math.max(1, image.naturalWidth - sourceX));\n  const sourceHeight = clamp(\n    viewport.height / scale,\n    1,\n    Math.max(1, image.naturalHeight - sourceY)\n  );\n  const canvas = document.createElement('canvas');\n  const context = canvas.getContext('2d');\n\n  if (!context) {\n    throw new Error('croppable-image-context-missing');\n  }\n\n  canvas.width = Math.max(1, Math.round(sourceWidth));\n  canvas.height = Math.max(1, Math.round(sourceHeight));\n  context.drawImage(\n    image,\n    sourceX,\n    sourceY,\n    sourceWidth,\n    sourceHeight,\n    0,\n    0,\n    canvas.width,\n    canvas.height\n  );\n\n  const outputType = file.type.startsWith('image/') ? file.type : 'image/jpeg';\n  const blob = await new Promise<Blob | null>((resolve) => {\n    canvas.toBlob(resolve, outputType, IMAGE_EXPORT_QUALITY);\n  });\n\n  if (!blob) {\n    throw new Error('croppable-image-export-failed');\n  }\n\n  return new globalThis.File([blob], file.name, {\n    lastModified: Date.now(),\n    type: blob.type || outputType,\n  });\n};\n\nexport const Croppable = ({\n  children,\n  fill = 'none',\n  height,\n  image,\n  label,\n  onCroppableChange,\n  onFileChange,\n  onImageChange,\n  onTransformChange,\n  transform,\n  standalone,\n}: CroppableProps) => {\n  const activePointerId = useRef<number | null>(null);\n  const animationFrameRef = useRef<number | null>(null);\n  const dragStartRef = useRef<{ x: number; y: number; originX: number; originY: number } | null>(\n    null\n  );\n  const inputRef = useRef<HTMLInputElement>(null);\n  const onImageChangeRef = useRef(onImageChange);\n  const objectUrlRef = useRef<string | null>(null);\n  const pendingRef = useRef<{\n    zoom: number;\n    offset: { x: number; y: number };\n    anchor: { x: number; y: number } | null;\n  } | null>(null);\n  const pinchDistance = useRef<number | null>(null);\n  const pointers = useRef<Map<number, { x: number; y: number }>>(new Map());\n  const transformRef = useRef<CroppableTransform>(DEFAULT_TRANSFORM);\n  const viewportRef = useRef<HTMLDivElement>(null);\n\n  const [imageSize, setImageSize] = useState<{ width: number; height: number } | null>(null);\n  const [imageSrc, setImageSrc] = useState<string | null>(null);\n  const [isDragging, setIsDragging] = useState(false);\n  const [draftTransform, setDraftTransform] = useState<CroppableTransform>(DEFAULT_TRANSFORM);\n  const [sourceFile, setSourceFile] = useState<File | null>(null);\n  const [viewportSize, setViewportSize] = useState({ width: 0, height: 0 });\n\n  const getBaseMetrics = () => {\n    const width = viewportSize.width;\n    const height = viewportSize.height;\n\n    if (!width || !height) return { width: 0, height: 0, minZoom: MIN_ZOOM };\n    if (!imageSize) return { width, height, minZoom: MIN_ZOOM };\n\n    const scaleX = width / imageSize.width;\n    const scaleY = height / imageSize.height;\n    const cover = Math.max(scaleX, scaleY);\n\n    const rawMinZoom = fill === 'width' ? scaleX / cover : fill === 'height' ? scaleY / cover : 0;\n\n    return {\n      width: imageSize.width * cover,\n      height: imageSize.height * cover,\n      minZoom: Math.max(MIN_ZOOM, rawMinZoom),\n    };\n  };\n\n  const baseMetrics = getBaseMetrics();\n  const minZoom = baseMetrics.minZoom;\n\n  const currentTransform = transform ?? draftTransform;\n  const clampedZoom = clamp(currentTransform.zoom, minZoom, MAX_ZOOM);\n  const displayImage = imageSrc ?? image ?? null;\n  const hasPresetImage = !children && !!image && !imageSrc && !sourceFile;\n  const canTransform = !hasPresetImage;\n  const content =\n    children ??\n    (displayImage ? (\n      <img\n        alt=''\n        draggable={false}\n        onLoad={(event) => {\n          const img = event.currentTarget;\n          if (img.naturalWidth && img.naturalHeight) {\n            setImageSize({ width: img.naturalWidth, height: img.naturalHeight });\n          }\n        }}\n        src={displayImage}\n      />\n    ) : null);\n  const isEmpty = content == null;\n\n  const clampOffset = (next: { x: number; y: number }, zoomToUse: number) => {\n    const { maxX, maxY } = getClampBounds(zoomToUse);\n    return {\n      x: clamp(next.x, -maxX, maxX),\n      y: clamp(next.y, -maxY, maxY),\n    };\n  };\n\n  const getViewportVectorFromClient = (clientX: number, clientY: number) => {\n    const node = viewportRef.current;\n    if (!node) return null;\n    const rect = node.getBoundingClientRect();\n    const x = clientX - rect.left - rect.width / 2;\n    const y = clientY - rect.top - rect.height / 2;\n    return { x, y };\n  };\n\n  const computeAnchoredOffset = (\n    currentOffset: { x: number; y: number },\n    currentZoom: number,\n    nextZoom: number,\n    anchorVec: { x: number; y: number }\n  ) => {\n    const z0 = clamp(currentZoom, minZoom, MAX_ZOOM);\n    const z1 = clamp(nextZoom, minZoom, MAX_ZOOM);\n    if (z0 === 0) return currentOffset;\n    const r = z1 / z0;\n    return {\n      x: (1 - r) * anchorVec.x + r * currentOffset.x,\n      y: (1 - r) * anchorVec.y + r * currentOffset.y,\n    };\n  };\n\n  const commitTransform = (\n    nextZoom: number,\n    nextOffset: { x: number; y: number },\n    anchorVec?: { x: number; y: number } | null\n  ) => {\n    const z0 = transformRef.current.zoom;\n    const z1 = clamp(nextZoom, minZoom, MAX_ZOOM);\n    const currentOffset = transformRef.current.offset;\n    const anchoredOffset = anchorVec\n      ? computeAnchoredOffset(currentOffset, z0, z1, anchorVec)\n      : nextOffset;\n    const clampedOffset = clampOffset(anchoredOffset, z1);\n    transformRef.current = { zoom: z1, offset: clampedOffset };\n\n    if (!transform) {\n      setDraftTransform({ zoom: z1, offset: clampedOffset });\n    }\n    onTransformChange?.({ zoom: z1, offset: clampedOffset });\n  };\n\n  const scheduleTransform = (\n    nextZoom: number,\n    nextOffset: { x: number; y: number },\n    anchorVec?: { x: number; y: number } | null\n  ) => {\n    pendingRef.current = {\n      zoom: nextZoom,\n      offset: nextOffset,\n      anchor: anchorVec ?? null,\n    };\n\n    if (animationFrameRef.current != null) return;\n\n    animationFrameRef.current = window.requestAnimationFrame(() => {\n      animationFrameRef.current = null;\n\n      const pending = pendingRef.current;\n      pendingRef.current = null;\n\n      const z = pending?.zoom ?? transformRef.current.zoom;\n      const o = pending?.offset ?? transformRef.current.offset;\n      const a = pending?.anchor ?? null;\n\n      commitTransform(z, o, a);\n    });\n  };\n\n  const handleWheel: React.WheelEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform) return;\n\n    const sensitivity = event.ctrlKey ? 0.001 : 0.00025;\n    const next = transformRef.current.zoom * Math.exp(-event.deltaY * sensitivity);\n\n    const anchor = getViewportVectorFromClient(event.clientX, event.clientY);\n    scheduleTransform(next, transformRef.current.offset, anchor);\n  };\n\n  const getClampBounds = (zoomToUse: number) => {\n    const width = viewportSize.width;\n    const height = viewportSize.height;\n    if (!width || !height) return { maxX: 0, maxY: 0 };\n    const z = clamp(zoomToUse, minZoom, MAX_ZOOM);\n    const scaledWidth = baseMetrics.width * z;\n    const scaledHeight = baseMetrics.height * z;\n    const maxX = Math.max(0, (scaledWidth - width) / 2);\n    const maxY = Math.max(0, (scaledHeight - height) / 2);\n    return { maxX, maxY };\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n    const input = event.target;\n    const file = input.files?.[0] ?? null;\n\n    if (objectUrlRef.current) {\n      URL.revokeObjectURL(objectUrlRef.current);\n      objectUrlRef.current = null;\n    }\n\n    if (!file) {\n      setImageSrc(null);\n      setSourceFile(null);\n      onFileChange?.(null);\n      input.value = '';\n      return;\n    }\n\n    const url = URL.createObjectURL(file);\n    objectUrlRef.current = url;\n    setImageSrc(url);\n    setImageSize(null);\n    setSourceFile(file);\n    scheduleTransform(DEFAULT_TRANSFORM.zoom, DEFAULT_TRANSFORM.offset);\n    transformRef.current = DEFAULT_TRANSFORM;\n    onFileChange?.(file);\n    input.value = '';\n  };\n\n  const handlePointerDown: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform || (event.pointerType === 'mouse' && event.button !== 0)) return;\n\n    event.currentTarget.setPointerCapture(event.pointerId);\n\n    if (event.pointerType === 'touch') {\n      const points = pointers.current;\n      points.set(event.pointerId, { x: event.clientX, y: event.clientY });\n      if (points.size === 2) {\n        dragStartRef.current = null;\n        activePointerId.current = null;\n        setIsDragging(false);\n        const [first, second] = Array.from(points.values());\n        pinchDistance.current = Math.hypot(first.x - second.x, first.y - second.y);\n        return;\n      }\n    }\n\n    activePointerId.current = event.pointerId;\n    dragStartRef.current = {\n      x: event.clientX,\n      y: event.clientY,\n      originX: transformRef.current.offset.x,\n      originY: transformRef.current.offset.y,\n    };\n  };\n\n  const handlePointerMove: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (isEmpty || !canTransform) return;\n\n    if (event.pointerType === 'touch') {\n      const points = pointers.current;\n      if (!points.has(event.pointerId)) return;\n      points.set(event.pointerId, { x: event.clientX, y: event.clientY });\n      if (points.size === 2) {\n        const [first, second] = Array.from(points.values());\n        const dx = first.x - second.x;\n        const dy = first.y - second.y;\n        const distance = Math.hypot(dx, dy);\n        const center = { x: (first.x + second.x) / 2, y: (first.y + second.y) / 2 };\n        if (pinchDistance.current) {\n          const ratio = distance / pinchDistance.current;\n          const nextZoom = transformRef.current.zoom * ratio;\n          const anchor = getViewportVectorFromClient(center.x, center.y);\n          scheduleTransform(nextZoom, transformRef.current.offset, anchor);\n        }\n        pinchDistance.current = distance;\n        return;\n      }\n    }\n\n    if (activePointerId.current !== event.pointerId || !dragStartRef.current || !canDrag) return;\n    const dx = event.clientX - dragStartRef.current.x;\n    const dy = event.clientY - dragStartRef.current.y;\n    const distance = Math.abs(dx) + Math.abs(dy);\n    if (!isDragging && distance > 2) setIsDragging(true);\n    if (distance <= 1) return;\n    scheduleTransform(transformRef.current.zoom, {\n      x: dragStartRef.current.originX + dx,\n      y: dragStartRef.current.originY + dy,\n    });\n  };\n\n  const handlePointerUp: React.PointerEventHandler<HTMLDivElement> = (event) => {\n    if (event.pointerType === 'touch') {\n      pointers.current.delete(event.pointerId);\n      if (pointers.current.size < 2) pinchDistance.current = null;\n    }\n\n    if (activePointerId.current === event.pointerId) {\n      activePointerId.current = null;\n      dragStartRef.current = null;\n      setIsDragging(false);\n    }\n  };\n\n  useEffect(() => {\n    if (!transform) return;\n\n    const z = clamp(transform.zoom, minZoom, MAX_ZOOM);\n    transformRef.current = { zoom: z, offset: clampOffset(transform.offset, z) };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [transform, viewportSize.width, viewportSize.height, imageSize?.width, imageSize?.height]);\n\n  useEffect(() => {\n    return () => {\n      if (objectUrlRef.current) URL.revokeObjectURL(objectUrlRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    const node = viewportRef.current;\n    if (!node) return;\n\n    const update = () => {\n      const rect = node.getBoundingClientRect();\n      setViewportSize((prev) =>\n        prev.width === rect.width && prev.height === rect.height\n          ? prev\n          : { width: rect.width, height: rect.height }\n      );\n      if (onCroppableChange) onCroppableChange(rect);\n    };\n\n    update();\n\n    const handleScroll = () => update();\n    window.addEventListener('scroll', handleScroll, true);\n\n    if (typeof ResizeObserver === 'undefined') {\n      const handleResize = () => update();\n      window.addEventListener('resize', handleResize);\n      return () => {\n        window.removeEventListener('resize', handleResize);\n        window.removeEventListener('scroll', handleScroll, true);\n      };\n    }\n\n    const observer = new ResizeObserver(() => update());\n    observer.observe(node);\n    return () => {\n      observer.disconnect();\n      window.removeEventListener('scroll', handleScroll, true);\n    };\n  }, [onCroppableChange]);\n\n  useEffect(() => {\n    if (transform) return;\n\n    const current = transformRef.current.offset;\n    const clamped = clampOffset(current, clampedZoom);\n\n    if (current.x === clamped.x && current.y === clamped.y) return;\n\n    transformRef.current = { zoom: transformRef.current.zoom, offset: clamped };\n    setDraftTransform((prev) => ({ ...prev, offset: clamped }));\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [clampedZoom, imageSize, viewportSize.width, viewportSize.height]);\n\n  useEffect(() => {\n    if (!displayImage) {\n      setImageSize(null);\n    }\n  }, [displayImage]);\n\n  useEffect(() => {\n    onImageChangeRef.current = onImageChange;\n  }, [onImageChange]);\n\n  useEffect(() => {\n    if (!onImageChange) return;\n\n    if (!sourceFile || !viewportSize.width || !viewportSize.height || children) {\n      onImageChangeRef.current?.(null);\n      return;\n    }\n\n    let isActive = true;\n    const timeout = window.setTimeout(() => {\n      createCroppedFile({\n        file: sourceFile,\n        fill,\n        transform: {\n          zoom: clampedZoom,\n          offset: currentTransform.offset,\n        },\n        viewport: viewportSize,\n      })\n        .then((nextFile) => {\n          if (isActive) {\n            onImageChangeRef.current?.(nextFile);\n          }\n        })\n        .catch(() => {\n          if (isActive) {\n            onImageChangeRef.current?.(null);\n          }\n        });\n    }, 75);\n\n    return () => {\n      isActive = false;\n      window.clearTimeout(timeout);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    children,\n    clampedZoom,\n    currentTransform.offset,\n    fill,\n    sourceFile,\n    viewportSize,\n  ]);\n\n  useEffect(() => {\n    return () => {\n      if (animationFrameRef.current != null) {\n        window.cancelAnimationFrame(animationFrameRef.current);\n        animationFrameRef.current = null;\n      }\n    };\n  }, []);\n\n  const clampBounds = getClampBounds(clampedZoom);\n  const canDrag = !isEmpty && canTransform && (clampBounds.maxX > 0 || clampBounds.maxY > 0);\n  const openFilePicker = () => inputRef.current?.click();\n  const handleSelectImageClick: React.MouseEventHandler<HTMLButtonElement> = (event) => {\n    event.preventDefault();\n    event.stopPropagation();\n    openFilePicker();\n  };\n\n  return (\n    <div\n      className={cx(styles.croppable, standalone && styles.standalone)}\n      onClick={() => {\n        if (isEmpty) openFilePicker();\n      }}\n    >\n      <input\n        accept='image/*'\n        onChange={handleInputChange}\n        ref={inputRef}\n        type='file'\n      />\n      <div\n        className={styles.viewport}\n        ref={viewportRef}\n        onDragStart={(event) => event.preventDefault()}\n        onPointerDown={handlePointerDown}\n        onPointerMove={handlePointerMove}\n        onPointerUp={handlePointerUp}\n        onPointerCancel={handlePointerUp}\n        onWheel={handleWheel}\n        style={\n          {\n            '--croppable-height': `${height ?? DEFAULT_HEIGHT}px`,\n            '--croppable-zoom': clampedZoom,\n            '--croppable-x': `${currentTransform.offset.x}px`,\n            '--croppable-y': `${currentTransform.offset.y}px`,\n            ...(imageSize\n              ? {\n                  '--croppable-image-width': `${baseMetrics.width}px`,\n                  '--croppable-image-height': `${baseMetrics.height}px`,\n                }\n              : null),\n          } as React.CSSProperties\n        }\n      >\n        {isEmpty ? (\n          <div className={styles.empty}>\n            <Figure>\n              <Icon\n                name='image'\n                size='large'\n              />\n            </Figure>\n            <Button\n              onClick={handleSelectImageClick}\n            >\n              {label ?? EMPTY_STATE_LABEL}\n            </Button>\n          </div>\n        ) : (\n          <div\n            className={cx(\n              styles.media,\n              canDrag && styles.draggable,\n              canDrag && isDragging && styles.dragging\n            )}\n          >\n            <div className={cx(styles.inner)}>{content}</div>\n            {hasPresetImage && (\n              <div className={styles.overlay}>\n                <div className={styles.empty}>\n                  <Figure>\n                    <Icon\n                      name='image'\n                      size='large'\n                    />\n                  </Figure>\n                  <Button\n                    onClick={handleSelectImageClick}\n                  >\n                    {label ?? EMPTY_STATE_LABEL}\n                  </Button>\n                </div>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["DEFAULT_HEIGHT","DEFAULT_TRANSFORM","offset","x","y","zoom","EMPTY_STATE_LABEL","MAX_ZOOM","MIN_ZOOM","IMAGE_EXPORT_QUALITY","clamp","value","min","max","Math","loadImage","file","Promise","resolve","reject","url","URL","createObjectURL","image","globalThis","Image","onload","revokeObjectURL","onerror","Error","src","createCroppedFile","fill","transform","viewport","widthRatio","width","naturalWidth","heightRatio","height","naturalHeight","coverRatio","baseWidth","baseHeight","minZoom","scale","renderedWidth","renderedHeight","left","top","sourceX","sourceY","sourceWidth","sourceHeight","canvas","document","createElement","context","getContext","round","drawImage","outputType","type","startsWith","blob","toBlob","File","name","lastModified","Date","now","Croppable","children","label","onCroppableChange","onFileChange","onImageChange","onTransformChange","standalone","activePointerId","useRef","animationFrameRef","dragStartRef","inputRef","onImageChangeRef","objectUrlRef","pendingRef","pinchDistance","pointers","Map","transformRef","viewportRef","imageSize","setImageSize","useState","imageSrc","setImageSrc","isDragging","setIsDragging","draftTransform","setDraftTransform","sourceFile","setSourceFile","viewportSize","setViewportSize","baseMetrics","getBaseMetrics","scaleX","scaleY","cover","rawMinZoom","currentTransform","clampedZoom","displayImage","hasPresetImage","canTransform","content","jsx","event","img","currentTarget","isEmpty","clampOffset","next","zoomToUse","maxX","maxY","getClampBounds","getViewportVectorFromClient","clientX","clientY","node","current","rect","getBoundingClientRect","computeAnchoredOffset","currentOffset","currentZoom","nextZoom","anchorVec","z0","z1","r","commitTransform","nextOffset","anchoredOffset","clampedOffset","scheduleTransform","anchor","window","requestAnimationFrame","pending","z","o","a","handleWheel","sensitivity","ctrlKey","exp","deltaY","scaledWidth","scaledHeight","handleInputChange","input","target","files","handlePointerDown","pointerType","button","setPointerCapture","pointerId","points","set","size","first","second","Array","from","values","hypot","originX","originY","handlePointerMove","has","dx","dy","distance","center","ratio","canDrag","abs","handlePointerUp","delete","useEffect","update","prev","handleScroll","addEventListener","ResizeObserver","handleResize","removeEventListener","observer","observe","disconnect","clamped","isActive","timeout","setTimeout","then","nextFile","catch","clearTimeout","cancelAnimationFrame","clampBounds","openFilePicker","click","handleSelectImageClick","preventDefault","stopPropagation","jsxs","cx","styles","croppable","empty","Figure","Icon","Button","media","draggable","dragging","inner","overlay"],"mappings":"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"}

package/dist/components/_dropdown/index.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index19.css');const i=require("react/jsx-runtime"),E=require("../../classix-5H4IWnMA.cjs"),o=require("react"),W=require("../button/index.cjs"),U=require("../../icons-s-lGsxio.cjs"),X=require("../input/index.cjs"),Y=require("../../styles.module-BON5Bi9g.cjs"),Z=require("../list/index.cjs"),k=require("../../index-FM_lJcIM.cjs"),M=require("../../utils-DBzf7CFq.cjs"),ee="_dropdown_1dsxx_1",te="_empty_1dsxx_4",ne="_group_1dsxx_5",re="_placeholder_1dsxx_6",se="_filter_1dsxx_14",oe="_native_1dsxx_25",le="_option_1dsxx_35",ie="_options_1dsxx_57",ce="_panel_1dsxx_81",ae="_selected_1dsxx_104",ue="_text_1dsxx_108",de="_trigger_1dsxx_117",pe="_minimal_1dsxx_133",c={dropdown:ee,empty:te,group:ne,placeholder:re,filter:se,native:oe,option:le,options:ie,panel:ce,selected:ae,text:ue,trigger:de,minimal:pe};function Q(e,r){return{"--icon-svg":U.iconSVG(e).replace("currentColor",r)}}function N(e){return typeof e=="string"||typeof e=="number"?String(e):Array.isArray(e)?e.map(N).join(" "):o.isValidElement(e)?N(e.props.children):""}function fe(e){return o.isValidElement(e)&&e.type==="option"}function me(e){return o.isValidElement(e)&&e.type==="optgroup"}function xe(e){return o.isValidElement(e)&&e.type===o.Fragment}function he(e){return o.isValidElement(e)&&e.type===k.Select}function V(e,r,s=!1){const l=[];return o.Children.forEach(e,t=>{if(xe(t)){l.push(...V(t.props.children,r,s));return}if(fe(t)){const d=N(t.props.children).trim(),p=t.props.value!=null?String(t.props.value):d;l.push({disabled:s||!!t.props.disabled,groupLabel:r,hidden:!!t.props.hidden,isPlaceholder:!!(t.props.hidden&&p===""),label:t.props.children,selected:!!t.props.selected,text:d,value:p});return}me(t)&&l.push(...V(t.props.children,t.props.label,s||!!t.props.disabled))}),l}function _e(e){const r=e.trim();if(!r)return null;const l=[.../[*?]/.test(r)?r:`*${r}*`].map(t=>t==="*"?".*":t==="?"?".":t.replace(/[|\\{}()[\]^$+.,]/g,"\\$&")).join("");return new RegExp(`^${l}$`,"i")}function ge(e,r){const s=_e(r),l=e.filter(t=>!t.hidden&&!t.isPlaceholder);return s?l.filter(t=>s.test([t.groupLabel,t.text,t.value].filter(Boolean).join(" "))):l}function ve(e,r){return e.find(s=>s.value===r)??e.find(s=>s.isPlaceholder)??e[0]}function ye(e,r,s){var t;if(r!=null)return String(r);if(s!=null)return String(s);const l=e.find(d=>d.selected);return l?l.value:((t=e[0])==null?void 0:t.value)??""}function be(e){if(he(e)){const{children:r,placeholder:s,...l}=e.props;return{children:i.jsxs(i.Fragment,{children:[s&&i.jsx("option",{hidden:!0,value:"",children:s}),r]}),props:l}}return{children:e.props.children,props:e.props}}const we=({children:e,className:r,emptyLabel:s="No matches found",searchPlaceholder:l="Filter",variant:t="default",...d})=>{const p=be(e),{defaultValue:z,onChange:_,value:g,...T}=p.props,q=k.sanitizeSelectProps(T),C=o.useRef(null),R=o.useRef(null),O=o.useRef(null),P=o.useRef(null),x=V(p.children),h=g!=null,v=ye(x,g,z),[y,b]=o.useState(()=>v),[u,w]=o.useState(!1),[B,$]=o.useState(""),S=h?String(g):y,I={default:M.resolveColor("--colors-semantic-content-secondary"),white:M.resolveColor("--color-white","white")},L=t==="minimal"?I.white:I.default,f=ve(x,S),A=Q("chevron",L),G=Q("search",L),D=ge(x,B);o.useEffect(()=>{!h&&!x.some(n=>n.value===y)&&b(v)},[v,y,h,x]),o.useEffect(()=>{var n;if(!u){$("");return}(n=P.current)==null||n.focus()},[u]),o.useEffect(()=>{if(!u)return;const n=a=>{var m;(m=R.current)!=null&&m.contains(a.target)||w(!1)};return document.addEventListener("mousedown",n),()=>{document.removeEventListener("mousedown",n)}},[u]);const K=n=>{h||b(n.target.value),_==null||_(n)},j=()=>{var n;w(!1),(n=C.current)==null||n.focus()},H=n=>{var F;h||b(n);const a=O.current;if(!a){j();return}const m=(F=Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype,"value"))==null?void 0:F.set;m==null||m.call(a,n),a.dispatchEvent(new Event("change",{bubbles:!0})),j()},J=n=>{n.key==="Escape"&&j()};return i.jsxs("div",{className:E.t(c.dropdown,t==="minimal"&&c.minimal,r),onKeyDown:J,ref:R,...d,"data-component":"dropdown",children:[i.jsx("select",{...q,"aria-hidden":"true",className:c.native,onChange:K,ref:O,tabIndex:-1,value:S,children:p.children}),i.jsx(W.Button,{"aria-expanded":u,"aria-haspopup":"dialog",className:E.t(t==="default"&&Y.inputStyles.input,c.trigger,(f==null?void 0:f.isPlaceholder)&&c.placeholder),"data-open":u?"true":void 0,disabled:q.disabled,onClick:()=>w(n=>!n),ref:C,style:A,variant:"minimal",children:i.jsx("span",{className:c.text,children:(f==null?void 0:f.label)??"Select an option"})}),u&&i.jsxs("div",{className:c.panel,children:[i.jsx(X.Input,{"aria-label":"Filter",className:c.filter,icon:"search",onChange:n=>$(n.target.value),placeholder:l,ref:P,style:G,type:"search",value:B}),i.jsx(Z.List,{"aria-label":"Dropdown",className:c.options,children:D.length>0?D.map(n=>{const a=n.value===S;return i.jsx("li",{"data-component":"dropdown",children:i.jsxs(W.Button,{"aria-label":a?`${n.text}, selected`:n.text,className:E.t(c.option,a&&c.selected),disabled:n.disabled,onClick:()=>H(n.value),variant:"minimal",children:[i.jsx("span",{className:c.text,children:n.label}),n.groupLabel&&i.jsx("small",{className:c.group,children:n.groupLabel})]})},`${n.groupLabel??"root"}-${n.value}`)}):i.jsx("li",{className:c.empty,children:s})})]})]})};exports.Dropdown=we;
-//# sourceMappingURL=index.cjs.map

package/dist/components/_dropdown/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/_dropdown/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport React, { Children, isValidElement, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { type IconName, iconSVG } from '@/components/icon/icons';\nimport { Input } from '@/components/input';\nimport inputStyles from '@/components/input/styles.module.css';\nimport { List } from '@/components/list';\nimport { Select, type SelectProps } from '@/components/select';\nimport { sanitizeSelectProps } from '@/components/select/sanitizeSelectProps';\nimport { resolveColor } from '@/utils';\n\nimport styles from './styles.module.css';\n\ntype NativeSelectProps = Omit<React.ComponentPropsWithoutRef<'select'>, 'children' | 'multiple'> & {\n  children: React.ReactNode;\n  multiple?: false;\n};\n\ntype NativeSelectElement = React.ReactElement<NativeSelectProps, 'select'>;\ntype WrappedSelectElement = React.ReactElement<SelectProps, typeof Select>;\ntype DropdownSelectElement = NativeSelectElement | WrappedSelectElement;\n\ntype DropdownOption = {\n  disabled: boolean;\n  groupLabel?: string;\n  hidden: boolean;\n  isPlaceholder: boolean;\n  label: React.ReactNode;\n  selected: boolean;\n  text: string;\n  value: string;\n};\n\nexport type DropdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {\n  children: DropdownSelectElement;\n  emptyLabel?: string;\n  searchPlaceholder?: string;\n  variant?: 'default' | 'minimal';\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n};\n\nfunction getIconWithVars(icon: IconName, color: string): withVars {\n  return {\n    '--icon-svg': iconSVG(icon).replace('currentColor', color),\n  };\n}\n\nfunction getNodeText(node: React.ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') {\n    return String(node);\n  }\n\n  if (Array.isArray(node)) {\n    return node.map(getNodeText).join(' ');\n  }\n\n  if (isValidElement<{ children?: React.ReactNode }>(node)) {\n    return getNodeText(node.props.children);\n  }\n\n  return '';\n}\n\nfunction isOptionElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'option'>, 'option'> {\n  return isValidElement(node) && node.type === 'option';\n}\n\nfunction isOptGroupElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'optgroup'>, 'optgroup'> {\n  return isValidElement(node) && node.type === 'optgroup';\n}\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }, typeof React.Fragment> {\n  return isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction isWrappedSelectElement(node: React.ReactNode): node is WrappedSelectElement {\n  return isValidElement(node) && node.type === Select;\n}\n\nfunction extractOptions(\n  children: React.ReactNode,\n  groupLabel?: string,\n  groupDisabled = false\n): DropdownOption[] {\n  const options: DropdownOption[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      options.push(...extractOptions(child.props.children, groupLabel, groupDisabled));\n      return;\n    }\n\n    if (isOptionElement(child)) {\n      const text = getNodeText(child.props.children).trim();\n      const value = child.props.value != null ? String(child.props.value) : text;\n\n      options.push({\n        disabled: groupDisabled || Boolean(child.props.disabled),\n        groupLabel,\n        hidden: Boolean(child.props.hidden),\n        isPlaceholder: Boolean(child.props.hidden && value === ''),\n        label: child.props.children,\n        selected: Boolean(child.props.selected),\n        text,\n        value,\n      });\n\n      return;\n    }\n\n    if (isOptGroupElement(child)) {\n      options.push(\n        ...extractOptions(\n          child.props.children,\n          child.props.label,\n          groupDisabled || Boolean(child.props.disabled)\n        )\n      );\n    }\n  });\n\n  return options;\n}\n\nfunction buildWildcardMatcher(query: string) {\n  const trimmedQuery = query.trim();\n\n  if (!trimmedQuery) {\n    return null;\n  }\n\n  const wildcardQuery = /[*?]/.test(trimmedQuery) ? trimmedQuery : `*${trimmedQuery}*`;\n  const expression = [...wildcardQuery]\n    .map((character) => {\n      if (character === '*') {\n        return '.*';\n      }\n\n      if (character === '?') {\n        return '.';\n      }\n\n      return character.replace(/[|\\\\{}()[\\]^$+.,]/g, '\\\\$&');\n    })\n    .join('');\n\n  return new RegExp(`^${expression}$`, 'i');\n}\n\nfunction filterOptions(options: DropdownOption[], query: string) {\n  const matcher = buildWildcardMatcher(query);\n  const selectableOptions = options.filter((option) => !option.hidden && !option.isPlaceholder);\n\n  if (!matcher) {\n    return selectableOptions;\n  }\n\n  return selectableOptions.filter((option) =>\n    matcher.test([option.groupLabel, option.text, option.value].filter(Boolean).join(' '))\n  );\n}\n\nfunction getDisplayOption(options: DropdownOption[], selectedValue: string) {\n  return (\n    options.find((option) => option.value === selectedValue) ??\n    options.find((option) => option.isPlaceholder) ??\n    options[0]\n  );\n}\n\nfunction getInitialValue(\n  options: DropdownOption[],\n  value?: NativeSelectProps['value'],\n  defaultValue?: NativeSelectProps['defaultValue']\n) {\n  if (value != null) {\n    return String(value);\n  }\n\n  if (defaultValue != null) {\n    return String(defaultValue);\n  }\n\n  const selectedOption = options.find((option) => option.selected);\n\n  if (selectedOption) {\n    return selectedOption.value;\n  }\n\n  return options[0]?.value ?? '';\n}\n\nfunction normalizeSelectElement(selectElement: DropdownSelectElement) {\n  if (isWrappedSelectElement(selectElement)) {\n    const { children, placeholder, ...props } = selectElement.props;\n\n    return {\n      children: (\n        <>\n          {placeholder && (\n            <option\n              hidden\n              value=''\n            >\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </>\n      ),\n      props,\n    };\n  }\n\n  return {\n    children: selectElement.props.children,\n    props: selectElement.props,\n  };\n}\n\nexport const Dropdown = ({\n  children: selectElement,\n  className,\n  emptyLabel = 'No matches found',\n  searchPlaceholder = 'Filter',\n  variant = 'default',\n  ...props\n}: DropdownProps) => {\n  const normalizedSelect = normalizeSelectElement(selectElement);\n  const { defaultValue, onChange, value, ...restSelectProps } = normalizedSelect.props;\n  const selectProps = sanitizeSelectProps(restSelectProps);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const nativeSelectRef = useRef<HTMLSelectElement>(null);\n  const searchRef = useRef<HTMLInputElement>(null);\n  const options = extractOptions(normalizedSelect.children);\n  const isControlled = value != null;\n  const initialValue = getInitialValue(options, value, defaultValue);\n  const [internalValue, setInternalValue] = useState(() => initialValue);\n  const [isOpen, setIsOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const selectedValue = isControlled ? String(value) : internalValue;\n  const iconColors = {\n    default: resolveColor('--colors-semantic-content-secondary'),\n    white: resolveColor('--color-white', 'white'),\n  };\n  const dropdownIconColor = variant === 'minimal' ? iconColors.white : iconColors.default;\n  const displayOption = getDisplayOption(options, selectedValue);\n  const triggerWithVars = getIconWithVars('chevron', dropdownIconColor);\n  const filterWithVars = getIconWithVars('search', dropdownIconColor);\n  const filteredOptions = filterOptions(options, query);\n\n  useEffect(() => {\n    if (!isControlled && !options.some((option) => option.value === internalValue)) {\n      setInternalValue(initialValue);\n    }\n  }, [initialValue, internalValue, isControlled, options]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      setQuery('');\n      return;\n    }\n\n    searchRef.current?.focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      if (!containerRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [isOpen]);\n\n  const handleNativeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!isControlled) {\n      setInternalValue(event.target.value);\n    }\n\n    onChange?.(event);\n  };\n\n  const closeMenu = () => {\n    setIsOpen(false);\n    buttonRef.current?.focus();\n  };\n\n  const commitValue = (nextValue: string) => {\n    if (!isControlled) {\n      setInternalValue(nextValue);\n    }\n\n    const nativeSelect = nativeSelectRef.current;\n\n    if (!nativeSelect) {\n      closeMenu();\n      return;\n    }\n\n    const valueSetter = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')?.set;\n\n    valueSetter?.call(nativeSelect, nextValue);\n    nativeSelect.dispatchEvent(new Event('change', { bubbles: true }));\n    closeMenu();\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape') {\n      closeMenu();\n    }\n  };\n\n  return (\n    <div\n      className={cx(styles.dropdown, variant === 'minimal' && styles.minimal, className)}\n      onKeyDown={handleKeyDown}\n      ref={containerRef}\n      {...props}\n    >\n      <select\n        {...selectProps}\n        aria-hidden='true'\n        className={styles.native}\n        onChange={handleNativeChange}\n        ref={nativeSelectRef}\n        tabIndex={-1}\n        value={selectedValue}\n      >\n        {normalizedSelect.children}\n      </select>\n      <Button\n        aria-expanded={isOpen}\n        aria-haspopup='dialog'\n        className={cx(\n          variant === 'default' && inputStyles.input,\n          styles.trigger,\n          displayOption?.isPlaceholder && styles.placeholder\n        )}\n        data-open={isOpen ? 'true' : undefined}\n        disabled={selectProps.disabled}\n        onClick={() => setIsOpen((currentValue) => !currentValue)}\n        ref={buttonRef}\n        style={triggerWithVars}\n        variant='minimal'\n      >\n        <span className={styles.text}>{displayOption?.label ?? 'Select an option'}</span>\n      </Button>\n      {isOpen && (\n        <div className={styles.panel}>\n          <Input\n            aria-label='Filter'\n            className={styles.filter}\n            icon='search'\n            onChange={(event) => setQuery(event.target.value)}\n            placeholder={searchPlaceholder}\n            ref={searchRef}\n            style={filterWithVars}\n            type='search'\n            value={query}\n          />\n          <List\n            aria-label='Dropdown'\n            className={styles.options}\n          >\n            {filteredOptions.length > 0 ? (\n              filteredOptions.map((option) => {\n                const isSelected = option.value === selectedValue;\n\n                return (\n                  <li key={`${option.groupLabel ?? 'root'}-${option.value}`}>\n                    <Button\n                      aria-label={isSelected ? `${option.text}, selected` : option.text}\n                      className={cx(styles.option, isSelected && styles.selected)}\n                      disabled={option.disabled}\n                      onClick={() => commitValue(option.value)}\n                      variant='minimal'\n                    >\n                      <span className={styles.text}>{option.label}</span>\n                      {option.groupLabel && (\n                        <small className={styles.group}>{option.groupLabel}</small>\n                      )}\n                    </Button>\n                  </li>\n                );\n              })\n            ) : (\n              <li className={styles.empty}>{emptyLabel}</li>\n            )}\n          </List>\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["getIconWithVars","icon","color","iconSVG","replace","getNodeText","node","String","Array","isArray","map","join","isValidElement","props","children","isOptionElement","type","isOptGroupElement","isFragmentElement","React","Fragment","isWrappedSelectElement","Select","extractOptions","groupLabel","groupDisabled","options","Children","forEach","child","push","text","trim","value","disabled","Boolean","hidden","isPlaceholder","label","selected","buildWildcardMatcher","query","trimmedQuery","expression","test","character","RegExp","filterOptions","matcher","selectableOptions","filter","option","getDisplayOption","selectedValue","find","getInitialValue","defaultValue","selectedOption","normalizeSelectElement","selectElement","placeholder","jsxs","Dropdown","className","emptyLabel","searchPlaceholder","variant","normalizedSelect","onChange","restSelectProps","selectProps","sanitizeSelectProps","buttonRef","useRef","containerRef","nativeSelectRef","searchRef","isControlled","initialValue","internalValue","setInternalValue","useState","isOpen","setIsOpen","setQuery","iconColors","default","resolveColor","white","dropdownIconColor","displayOption","triggerWithVars","filterWithVars","filteredOptions","useEffect","some","current","focus","handlePointerDown","event","contains","target","document","addEventListener","removeEventListener","handleNativeChange","closeMenu","commitValue","nextValue","nativeSelect","valueSetter","Object","getOwnPropertyDescriptor","HTMLSelectElement","prototype","set","call","dispatchEvent","Event","bubbles","handleKeyDown","key","cx","styles","dropdown","minimal","jsx","native","Button","inputStyles","input","trigger","undefined","currentValue","panel","Input","List","length","isSelected","group","empty"],"mappings":"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"}