@omnifyjp/ui 2.0.0 → 2.0.1

package/dist/{chunk-6S5AZCU6.js → chunk-4AGNE75K.js}

@@ -1,4 +1,4 @@
-import { Input } from './chunk-HXMY2NQ3.js';
+import { Input } from './chunk-4NBDYSSQ.js';
 import { Label } from './chunk-EYJ7TJIX.js';
 import { useEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -40,5 +40,5 @@ function SlugInput({
 }
 
 export { SlugInput, generateSlug };
-//# sourceMappingURL=chunk-6S5AZCU6.js.map
-//# sourceMappingURL=chunk-6S5AZCU6.js.map
+//# sourceMappingURL=chunk-4AGNE75K.js.map
+//# sourceMappingURL=chunk-4AGNE75K.js.map

package/dist/{chunk-6S5AZCU6.js.map → chunk-4AGNE75K.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/slug-input.tsx"],"names":[],"mappings":";;;;;AA2BA,IAAM,aAAA,GAAiC;AAAA,EACrC,IAAA,EAAM,MAAA;AAAA,EACN,aAAA,EAAe,2BAAA;AAAA,EACf,WAAA,EAAa;AACf,CAAA;AAMO,SAAS,aAAa,IAAA,EAAsB;AACjD,EAAA,OAAO,IAAA,CACJ,aAAY,CACZ,OAAA,CAAQ,wBAAwB,GAAG,CAAA,CACnC,QAAQ,gBAAA,EAAkB,GAAG,EAC7B,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,OAAA,CAAQ,wBAAwB,GAAG,CAAA,CACnC,QAAQ,gBAAA,EAAkB,GAAG,EAC7B,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,OAAA,CAAQ,MAAM,GAAG,CAAA,CACjB,QAAQ,eAAA,EAAiB,EAAE,EAC3B,OAAA,CAAQ,MAAA,EAAQ,GAAG,CAAA,CACnB,OAAA,CAAQ,OAAO,GAAG,CAAA,CAClB,OAAA,CAAQ,QAAA,EAAU,EAAE,CAAA;AACzB;AAqBO,SAAS,SAAA,CAAU;AAAA,EACxB,KAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAA,EAAmB;AACjB,EAAA,MAAM,MAAA,GAAS,EAAE,GAAG,aAAA,EAAe,GAAG,cAAA,EAAe;AAErD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,YAAY,KAAA,EAAO;AACtB,MAAA,YAAA,CAAa,YAAA,CAAa,KAAK,CAAC,CAAA;AAAA,IAClC;AAAA,EACF,CAAA,EAAG,CAAC,KAAA,EAAO,QAAA,EAAU,YAAY,CAAC,CAAA;AAElC,EAAA,4BACG,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAO,iBAAO,IAAA,EAAK,CAAA;AAAA,oBACpB,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,IAAA;AAAA,QACP,UAAU,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,QAC5C,aAAa,MAAA,CAAO,WAAA;AAAA,QACpB,SAAA,EAAU;AAAA;AAAA,KACZ;AAAA,oBACA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,oCAAA,EAAsC,iBAAO,aAAA,EAAc;AAAA,GAAA,EAC1E,CAAA;AAEJ","file":"chunk-6S5AZCU6.js","sourcesContent":["import { useEffect } from 'react';\nimport { Input } from './input';\nimport { Label } from './label';\n\n/** Customizable labels for the SlugInput component. */\nexport interface SlugInputLabels {\n  /** Label text above the slug input field. */\n  slug: string;\n  /** Helper text below the slug input. */\n  autoGenerated: string;\n  /** Placeholder shown inside the slug input. */\n  placeholder: string;\n}\n\nexport interface SlugInputProps {\n  /** Source title string from which the slug is auto-generated. */\n  title: string;\n  /** Current slug value. */\n  slug: string;\n  /** Callback fired when the slug changes (auto-generated or manually edited). */\n  onSlugChange: (slug: string) => void;\n  /** Whether auto-generation from title is disabled and slug is manually editable only. */\n  disabled?: boolean;\n  /** Override default label strings for localization. */\n  labels?: Partial<SlugInputLabels>;\n}\n\nconst defaultLabels: SlugInputLabels = {\n  slug: 'Slug',\n  autoGenerated: 'Auto-generated from title',\n  placeholder: 'enter-slug-here',\n};\n\n/**\n * Generates a URL-friendly slug from a text string.\n * Handles Vietnamese diacritics and other special characters.\n */\nexport function generateSlug(text: string): string {\n  return text\n    .toLowerCase()\n    .replace(/[àáạảãâầấậẩẫăằắặẳẵ]/g, 'a')\n    .replace(/[èéẹẻẽêềếệểễ]/g, 'e')\n    .replace(/[ìíịỉĩ]/g, 'i')\n    .replace(/[òóọỏõôồốộổỗơờớợởỡ]/g, 'o')\n    .replace(/[ùúụủũưừứựửữ]/g, 'u')\n    .replace(/[ỳýỵỷỹ]/g, 'y')\n    .replace(/đ/g, 'd')\n    .replace(/[^a-z0-9\\s-]/g, '')\n    .replace(/\\s+/g, '-')\n    .replace(/-+/g, '-')\n    .replace(/^-|-$/g, '');\n}\n\n/**\n * URL slug input that auto-generates a slug from a title string.\n * Handles Vietnamese diacritics and special characters via `generateSlug`.\n * The slug updates automatically when the title changes (unless `disabled` is true).\n *\n * @example\n * ```tsx\n * const [title, setTitle] = useState(\"My Blog Post\");\n * const [slug, setSlug] = useState(\"\");\n *\n * <Input value={title} onChange={(e) => setTitle(e.target.value)} />\n * <SlugInput\n *   title={title}\n *   slug={slug}\n *   onSlugChange={setSlug}\n * />\n * // slug will auto-populate as \"my-blog-post\"\n * ```\n */\nexport function SlugInput({\n  title,\n  slug,\n  onSlugChange,\n  disabled = false,\n  labels: labelOverrides,\n}: SlugInputProps) {\n  const labels = { ...defaultLabels, ...labelOverrides };\n\n  useEffect(() => {\n    if (!disabled && title) {\n      onSlugChange(generateSlug(title));\n    }\n  }, [title, disabled, onSlugChange]);\n\n  return (\n    <div>\n      <Label>{labels.slug}</Label>\n      <Input\n        value={slug}\n        onChange={(e) => onSlugChange(e.target.value)}\n        placeholder={labels.placeholder}\n        className=\"h-element-sm mt-1 font-mono text-sm\"\n      />\n      <p className=\"text-xs text-muted-foreground mt-1\">{labels.autoGenerated}</p>\n    </div>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/inputs/slug-input.tsx"],"names":[],"mappings":";;;;;AA2BA,IAAM,aAAA,GAAiC;AAAA,EACrC,IAAA,EAAM,MAAA;AAAA,EACN,aAAA,EAAe,2BAAA;AAAA,EACf,WAAA,EAAa;AACf,CAAA;AAMO,SAAS,aAAa,IAAA,EAAsB;AACjD,EAAA,OAAO,IAAA,CACJ,aAAY,CACZ,OAAA,CAAQ,wBAAwB,GAAG,CAAA,CACnC,QAAQ,gBAAA,EAAkB,GAAG,EAC7B,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,OAAA,CAAQ,wBAAwB,GAAG,CAAA,CACnC,QAAQ,gBAAA,EAAkB,GAAG,EAC7B,OAAA,CAAQ,UAAA,EAAY,GAAG,CAAA,CACvB,OAAA,CAAQ,MAAM,GAAG,CAAA,CACjB,QAAQ,eAAA,EAAiB,EAAE,EAC3B,OAAA,CAAQ,MAAA,EAAQ,GAAG,CAAA,CACnB,OAAA,CAAQ,OAAO,GAAG,CAAA,CAClB,OAAA,CAAQ,QAAA,EAAU,EAAE,CAAA;AACzB;AAqBO,SAAS,SAAA,CAAU;AAAA,EACxB,KAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAA,EAAmB;AACjB,EAAA,MAAM,MAAA,GAAS,EAAE,GAAG,aAAA,EAAe,GAAG,cAAA,EAAe;AAErD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,YAAY,KAAA,EAAO;AACtB,MAAA,YAAA,CAAa,YAAA,CAAa,KAAK,CAAC,CAAA;AAAA,IAClC;AAAA,EACF,CAAA,EAAG,CAAC,KAAA,EAAO,QAAA,EAAU,YAAY,CAAC,CAAA;AAElC,EAAA,4BACG,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAO,iBAAO,IAAA,EAAK,CAAA;AAAA,oBACpB,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,IAAA;AAAA,QACP,UAAU,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,QAC5C,aAAa,MAAA,CAAO,WAAA;AAAA,QACpB,SAAA,EAAU;AAAA;AAAA,KACZ;AAAA,oBACA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,oCAAA,EAAsC,iBAAO,aAAA,EAAc;AAAA,GAAA,EAC1E,CAAA;AAEJ","file":"chunk-4AGNE75K.js","sourcesContent":["import { useEffect } from 'react';\nimport { Input } from './input';\nimport { Label } from './label';\n\n/** Customizable labels for the SlugInput component. */\nexport interface SlugInputLabels {\n  /** Label text above the slug input field. */\n  slug: string;\n  /** Helper text below the slug input. */\n  autoGenerated: string;\n  /** Placeholder shown inside the slug input. */\n  placeholder: string;\n}\n\nexport interface SlugInputProps {\n  /** Source title string from which the slug is auto-generated. */\n  title: string;\n  /** Current slug value. */\n  slug: string;\n  /** Callback fired when the slug changes (auto-generated or manually edited). */\n  onSlugChange: (slug: string) => void;\n  /** Whether auto-generation from title is disabled and slug is manually editable only. */\n  disabled?: boolean;\n  /** Override default label strings for localization. */\n  labels?: Partial<SlugInputLabels>;\n}\n\nconst defaultLabels: SlugInputLabels = {\n  slug: 'Slug',\n  autoGenerated: 'Auto-generated from title',\n  placeholder: 'enter-slug-here',\n};\n\n/**\n * Generates a URL-friendly slug from a text string.\n * Handles Vietnamese diacritics and other special characters.\n */\nexport function generateSlug(text: string): string {\n  return text\n    .toLowerCase()\n    .replace(/[àáạảãâầấậẩẫăằắặẳẵ]/g, 'a')\n    .replace(/[èéẹẻẽêềếệểễ]/g, 'e')\n    .replace(/[ìíịỉĩ]/g, 'i')\n    .replace(/[òóọỏõôồốộổỗơờớợởỡ]/g, 'o')\n    .replace(/[ùúụủũưừứựửữ]/g, 'u')\n    .replace(/[ỳýỵỷỹ]/g, 'y')\n    .replace(/đ/g, 'd')\n    .replace(/[^a-z0-9\\s-]/g, '')\n    .replace(/\\s+/g, '-')\n    .replace(/-+/g, '-')\n    .replace(/^-|-$/g, '');\n}\n\n/**\n * URL slug input that auto-generates a slug from a title string.\n * Handles Vietnamese diacritics and special characters via `generateSlug`.\n * The slug updates automatically when the title changes (unless `disabled` is true).\n *\n * @example\n * ```tsx\n * const [title, setTitle] = useState(\"My Blog Post\");\n * const [slug, setSlug] = useState(\"\");\n *\n * <Input value={title} onChange={(e) => setTitle(e.target.value)} />\n * <SlugInput\n *   title={title}\n *   slug={slug}\n *   onSlugChange={setSlug}\n * />\n * // slug will auto-populate as \"my-blog-post\"\n * ```\n */\nexport function SlugInput({\n  title,\n  slug,\n  onSlugChange,\n  disabled = false,\n  labels: labelOverrides,\n}: SlugInputProps) {\n  const labels = { ...defaultLabels, ...labelOverrides };\n\n  useEffect(() => {\n    if (!disabled && title) {\n      onSlugChange(generateSlug(title));\n    }\n  }, [title, disabled, onSlugChange]);\n\n  return (\n    <div>\n      <Label>{labels.slug}</Label>\n      <Input\n        value={slug}\n        onChange={(e) => onSlugChange(e.target.value)}\n        placeholder={labels.placeholder}\n        className=\"h-element-sm mt-1 font-mono text-sm\"\n      />\n      <p className=\"text-xs text-muted-foreground mt-1\">{labels.autoGenerated}</p>\n    </div>\n  );\n}\n"]}

package/dist/{chunk-HXMY2NQ3.js → chunk-4NBDYSSQ.js}

@@ -1,5 +1,5 @@
-import { useUILocales, resolveTranslatableConfig } from './chunk-5K6RO5R3.js';
 import { TranslatableField } from './chunk-YU55YBID.js';
+import { useUILocales, resolveTranslatableConfig } from './chunk-VPTIRPZW.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { cva } from 'class-variance-authority';
@@ -86,5 +86,5 @@ var Input = React.forwardRef(
 Input.displayName = "Input";
 
 export { Input, inputVariants };
-//# sourceMappingURL=chunk-HXMY2NQ3.js.map
-//# sourceMappingURL=chunk-HXMY2NQ3.js.map
+//# sourceMappingURL=chunk-4NBDYSSQ.js.map
+//# sourceMappingURL=chunk-4NBDYSSQ.js.map

package/dist/{chunk-HXMY2NQ3.js.map → chunk-4NBDYSSQ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/input.tsx"],"names":["inputRest","value","onChange"],"mappings":"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","file":"chunk-HXMY2NQ3.js","sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { TranslatableField } from './translatable-field';\nimport { useUILocales, resolveTranslatableConfig } from '../../providers/ui-provider';\nimport type { TranslatableConfig, TranslatableValue } from '../../providers/ui-provider';\n\n// ─── Variants ─────────────────────────────────────────────────────────────────\n\nconst inputVariants = cva(\n  \"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex w-full min-w-0 rounded-md border bg-input-background transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n  {\n    variants: {\n      size: {\n        xs: \"h-element-xs px-2 text-xs\",\n        sm: \"h-element-sm px-2.5 text-sm\",\n        default: \"h-element px-3 py-1 text-base md:text-sm\",\n        lg: \"h-element-lg px-4 text-sm\",\n        xl: \"h-element-xl px-4 text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"default\",\n    },\n  },\n);\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\ntype InputSize = VariantProps<typeof inputVariants>['size'];\ntype NativeInputProps = Omit<React.ComponentProps<'input'>, 'value' | 'onChange' | 'size'>;\n\ninterface StandardInputProps extends NativeInputProps {\n  size?: InputSize;\n  /** Translatable mode disabled (default). */\n  translatable?: never;\n  value?: string;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n}\n\ninterface TranslatableInputProps extends NativeInputProps {\n  size?: InputSize;\n  /**\n   * Enable locale-switching tabs on this input.\n   * - `true` — inherit UIProvider's locale config\n   * - `object` — override locales/defaultLocale/fallbackLocale per field\n   *\n   * @example\n   * ```tsx\n   * // Uses UIProvider config\n   * <Input translatable value={val} onChange={setVal} />\n   *\n   * // Custom per-field config\n   * <Input\n   *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n   *   value={val}\n   *   onChange={setVal}\n   * />\n   * ```\n   */\n  translatable: TranslatableConfig;\n  value?: TranslatableValue;\n  onChange?: (value: TranslatableValue) => void;\n  /**\n   * Per-locale validation errors. Truthy string = that locale is invalid.\n   * The active locale's error is forwarded as `aria-invalid` on the input;\n   * all locale tabs with errors show a red dot indicator.\n   *\n   * @example `{ en: 'Required', vi: 'Too long (120/100)' }`\n   */\n  errors?: Partial<Record<string, string>>;\n}\n\nexport type InputProps = StandardInputProps | TranslatableInputProps;\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Text input component with multiple size variants.\n * Supports translatable mode via the `translatable` prop.\n *\n * @example\n * ```tsx\n * // Standard\n * <Input placeholder=\"Enter text...\" />\n * <Input size=\"sm\" value={val} onChange={(e) => setVal(e.target.value)} />\n *\n * // Translatable — uses UIProvider's locale config\n * <Input translatable value={val} onChange={setVal} />\n *\n * // Translatable — custom config\n * <Input\n *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n *   value={val}\n *   onChange={setVal}\n * />\n * ```\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (props, ref) => {\n    const { className, type, size, translatable, ...rest } = props as TranslatableInputProps & { type?: string; className?: string };\n\n    const providerLocales = useUILocales();\n\n    // ── Translatable mode ──────────────────────────────────────────────────\n    if (translatable !== undefined) {\n      const config = resolveTranslatableConfig(translatable, providerLocales);\n\n      // Fallback: if no locale config available, render standard input\n      if (!config) {\n        const { value: _v, onChange: _oc, ...inputRest } = rest as TranslatableInputProps;\n        return (\n          <input\n            type={type}\n            ref={ref}\n            data-slot=\"input\"\n            className={cn(inputVariants({ size, className }))}\n            {...(inputRest as NativeInputProps)}\n          />\n        );\n      }\n\n      const { value = {}, onChange, errors, ...inputRest } = rest as TranslatableInputProps;\n\n      return (\n        <TranslatableField\n          config={config}\n          value={value as TranslatableValue}\n          onChange={onChange ?? (() => {})}\n          errors={errors}\n        >\n          {({ value: localeValue, onChange: localeChange, fallbackPlaceholder, hasError }) => (\n            <input\n              type={type}\n              ref={ref}\n              data-slot=\"input\"\n              data-translatable\n              className={cn(inputVariants({ size, className }))}\n              value={localeValue}\n              placeholder={fallbackPlaceholder ?? (inputRest as React.InputHTMLAttributes<HTMLInputElement>).placeholder}\n              onChange={(e) => localeChange(e.target.value)}\n              {...(inputRest as React.InputHTMLAttributes<HTMLInputElement>)}\n              aria-invalid={hasError || (inputRest as React.InputHTMLAttributes<HTMLInputElement>)['aria-invalid'] || undefined}\n            />\n          )}\n        </TranslatableField>\n      );\n    }\n\n    // ── Standard mode ──────────────────────────────────────────────────────\n    const { value, onChange, ...inputRest } = rest as StandardInputProps;\n    return (\n      <input\n        type={type}\n        ref={ref}\n        data-slot=\"input\"\n        className={cn(inputVariants({ size, className }))}\n        value={value}\n        onChange={onChange}\n        {...(inputRest as NativeInputProps)}\n      />\n    );\n  },\n);\nInput.displayName = \"Input\";\n\nexport { Input, inputVariants };\n"]}
+{"version":3,"sources":["../src/components/inputs/input.tsx"],"names":["inputRest","value","onChange"],"mappings":";;;;;;;AAUA,IAAM,aAAA,GAAgB,GAAA;AAAA,EACpB,8kBAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,2BAAA;AAAA,QACJ,EAAA,EAAI,6BAAA;AAAA,QACJ,OAAA,EAAS,0CAAA;AAAA,QACT,EAAA,EAAI,2BAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ;AAyEA,IAAM,KAAA,GAAc,KAAA,CAAA,UAAA;AAAA,EAClB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,IAAA,EAAM,MAAM,YAAA,EAAc,GAAG,MAAK,GAAI,KAAA;AAEzD,IAAA,MAAM,kBAAkB,YAAA,EAAa;AAGrC,IAAA,IAAI,iBAAiB,MAAA,EAAW;AAC9B,MAAA,MAAM,MAAA,GAAS,yBAAA,CAA0B,YAAA,EAAc,eAAe,CAAA;AAGtE,MAAA,IAAI,CAAC,MAAA,EAAQ;AACX,QAAA,MAAM,EAAE,KAAA,EAAO,EAAA,EAAI,UAAU,GAAA,EAAK,GAAGA,YAAU,GAAI,IAAA;AACnD,QAAA,uBACE,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,IAAA;AAAA,YACA,GAAA;AAAA,YACA,WAAA,EAAU,OAAA;AAAA,YACV,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,YAC/C,GAAIA;AAAA;AAAA,SACP;AAAA,MAEJ;AAEA,MAAA,MAAM,EAAE,KAAA,EAAAC,MAAAA,GAAQ,EAAC,EAAG,UAAAC,SAAAA,EAAU,MAAA,EAAQ,GAAGF,UAAAA,EAAU,GAAI,IAAA;AAEvD,MAAA,uBACE,GAAA;AAAA,QAAC,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,KAAA,EAAOC,MAAAA;AAAA,UACP,QAAA,EAAUC,cAAa,MAAM;AAAA,UAAC,CAAA,CAAA;AAAA,UAC9B,MAAA;AAAA,UAEC,QAAA,EAAA,CAAC,EAAE,KAAA,EAAO,WAAA,EAAa,UAAU,YAAA,EAAc,mBAAA,EAAqB,UAAS,qBAC5E,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,IAAA;AAAA,cACA,GAAA;AAAA,cACA,WAAA,EAAU,OAAA;AAAA,cACV,mBAAA,EAAiB,IAAA;AAAA,cACjB,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,cAChD,KAAA,EAAO,WAAA;AAAA,cACP,WAAA,EAAa,uBAAwBF,UAAAA,CAA0D,WAAA;AAAA,cAC/F,UAAU,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cAC3C,GAAIA,UAAAA;AAAA,cACL,cAAA,EAAc,QAAA,IAAaA,UAAAA,CAA0D,cAAc,CAAA,IAAK;AAAA;AAAA;AAC1G;AAAA,OAEJ;AAAA,IAEJ;AAGA,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,GAAG,WAAU,GAAI,IAAA;AAC1C,IAAA,uBACE,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,GAAA;AAAA,QACA,WAAA,EAAU,OAAA;AAAA,QACV,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,QAChD,KAAA;AAAA,QACA,QAAA;AAAA,QACC,GAAI;AAAA;AAAA,KACP;AAAA,EAEJ;AACF;AACA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"chunk-4NBDYSSQ.js","sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\nimport { TranslatableField } from './translatable-field';\nimport { useUILocales, resolveTranslatableConfig } from '../../providers/ui-provider';\nimport type { TranslatableConfig, TranslatableValue } from '../../providers/ui-provider';\n\n// ─── Variants ─────────────────────────────────────────────────────────────────\n\nconst inputVariants = cva(\n  \"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex w-full min-w-0 rounded-md border bg-input-background transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n  {\n    variants: {\n      size: {\n        xs: \"h-element-xs px-2 text-xs\",\n        sm: \"h-element-sm px-2.5 text-sm\",\n        default: \"h-element px-3 py-1 text-base md:text-sm\",\n        lg: \"h-element-lg px-4 text-sm\",\n        xl: \"h-element-xl px-4 text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"default\",\n    },\n  },\n);\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\ntype InputSize = VariantProps<typeof inputVariants>['size'];\ntype NativeInputProps = Omit<React.ComponentProps<'input'>, 'value' | 'onChange' | 'size'>;\n\ninterface StandardInputProps extends NativeInputProps {\n  size?: InputSize;\n  /** Translatable mode disabled (default). */\n  translatable?: never;\n  value?: string;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n}\n\ninterface TranslatableInputProps extends NativeInputProps {\n  size?: InputSize;\n  /**\n   * Enable locale-switching tabs on this input.\n   * - `true` — inherit UIProvider's locale config\n   * - `object` — override locales/defaultLocale/fallbackLocale per field\n   *\n   * @example\n   * ```tsx\n   * // Uses UIProvider config\n   * <Input translatable value={val} onChange={setVal} />\n   *\n   * // Custom per-field config\n   * <Input\n   *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n   *   value={val}\n   *   onChange={setVal}\n   * />\n   * ```\n   */\n  translatable: TranslatableConfig;\n  value?: TranslatableValue;\n  onChange?: (value: TranslatableValue) => void;\n  /**\n   * Per-locale validation errors. Truthy string = that locale is invalid.\n   * The active locale's error is forwarded as `aria-invalid` on the input;\n   * all locale tabs with errors show a red dot indicator.\n   *\n   * @example `{ en: 'Required', vi: 'Too long (120/100)' }`\n   */\n  errors?: Partial<Record<string, string>>;\n}\n\nexport type InputProps = StandardInputProps | TranslatableInputProps;\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Text input component with multiple size variants.\n * Supports translatable mode via the `translatable` prop.\n *\n * @example\n * ```tsx\n * // Standard\n * <Input placeholder=\"Enter text...\" />\n * <Input size=\"sm\" value={val} onChange={(e) => setVal(e.target.value)} />\n *\n * // Translatable — uses UIProvider's locale config\n * <Input translatable value={val} onChange={setVal} />\n *\n * // Translatable — custom config\n * <Input\n *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n *   value={val}\n *   onChange={setVal}\n * />\n * ```\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (props, ref) => {\n    const { className, type, size, translatable, ...rest } = props as TranslatableInputProps & { type?: string; className?: string };\n\n    const providerLocales = useUILocales();\n\n    // ── Translatable mode ──────────────────────────────────────────────────\n    if (translatable !== undefined) {\n      const config = resolveTranslatableConfig(translatable, providerLocales);\n\n      // Fallback: if no locale config available, render standard input\n      if (!config) {\n        const { value: _v, onChange: _oc, ...inputRest } = rest as TranslatableInputProps;\n        return (\n          <input\n            type={type}\n            ref={ref}\n            data-slot=\"input\"\n            className={cn(inputVariants({ size, className }))}\n            {...(inputRest as NativeInputProps)}\n          />\n        );\n      }\n\n      const { value = {}, onChange, errors, ...inputRest } = rest as TranslatableInputProps;\n\n      return (\n        <TranslatableField\n          config={config}\n          value={value as TranslatableValue}\n          onChange={onChange ?? (() => {})}\n          errors={errors}\n        >\n          {({ value: localeValue, onChange: localeChange, fallbackPlaceholder, hasError }) => (\n            <input\n              type={type}\n              ref={ref}\n              data-slot=\"input\"\n              data-translatable\n              className={cn(inputVariants({ size, className }))}\n              value={localeValue}\n              placeholder={fallbackPlaceholder ?? (inputRest as React.InputHTMLAttributes<HTMLInputElement>).placeholder}\n              onChange={(e) => localeChange(e.target.value)}\n              {...(inputRest as React.InputHTMLAttributes<HTMLInputElement>)}\n              aria-invalid={hasError || (inputRest as React.InputHTMLAttributes<HTMLInputElement>)['aria-invalid'] || undefined}\n            />\n          )}\n        </TranslatableField>\n      );\n    }\n\n    // ── Standard mode ──────────────────────────────────────────────────────\n    const { value, onChange, ...inputRest } = rest as StandardInputProps;\n    return (\n      <input\n        type={type}\n        ref={ref}\n        data-slot=\"input\"\n        className={cn(inputVariants({ size, className }))}\n        value={value}\n        onChange={onChange}\n        {...(inputRest as NativeInputProps)}\n      />\n    );\n  },\n);\nInput.displayName = \"Input\";\n\nexport { Input, inputVariants };\n"]}

package/dist/{chunk-O2KRH6BS.js → chunk-EBV2XEHD.js}

@@ -71,7 +71,7 @@ function DrawerHeader({ className, ...props }) {
     "div",
     {
       "data-slot": "drawer-header",
-      className: cn("flex flex-col gap-1.5 p-6", className),
+      className: cn("flex flex-col gap-1.5 p-dialog", className),
       ...props
     }
   );
@@ -81,7 +81,7 @@ function DrawerBody({ className, ...props }) {
     "div",
     {
       "data-slot": "drawer-body",
-      className: cn("flex-1 overflow-y-auto px-6 py-4", className),
+      className: cn("flex-1 overflow-y-auto p-dialog", className),
       ...props
     }
   );
@@ -91,7 +91,7 @@ function DrawerFooter({ className, ...props }) {
     "div",
     {
       "data-slot": "drawer-footer",
-      className: cn("mt-auto flex flex-col gap-2 p-6", className),
+      className: cn("mt-auto flex flex-col gap-2 p-dialog", className),
       ...props
     }
   );
@@ -124,5 +124,5 @@ function DrawerDescription({
 }
 
 export { Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger };
-//# sourceMappingURL=chunk-O2KRH6BS.js.map
-//# sourceMappingURL=chunk-O2KRH6BS.js.map
+//# sourceMappingURL=chunk-EBV2XEHD.js.map
+//# sourceMappingURL=chunk-EBV2XEHD.js.map

package/dist/{chunk-O2KRH6BS.js.map → chunk-EBV2XEHD.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/overlay/drawer.tsx"],"names":["DrawerPrimitive"],"mappings":";;;;AAsCA,SAAS,MAAA,CAAO;AAAA,EACd,GAAG;AACL,CAAA,EAAsD;AACpD,EAAA,2BAAQA,QAAA,CAAgB,IAAA,EAAhB,EAAqB,WAAA,EAAU,QAAA,EAAU,GAAG,KAAA,EAAO,CAAA;AAC7D;AAGA,SAAS,aAAA,CAAc;AAAA,EACrB,GAAG;AACL,CAAA,EAAyD;AACvD,EAAA,2BAAQA,QAAA,CAAgB,OAAA,EAAhB,EAAwB,WAAA,EAAU,gBAAA,EAAkB,GAAG,KAAA,EAAO,CAAA;AACxE;AAGA,SAAS,YAAA,CAAa;AAAA,EACpB,GAAG;AACL,CAAA,EAAwD;AACtD,EAAA,2BAAQA,QAAA,CAAgB,MAAA,EAAhB,EAAuB,WAAA,EAAU,eAAA,EAAiB,GAAG,KAAA,EAAO,CAAA;AACtE;AAGA,SAAS,WAAA,CAAY;AAAA,EACnB,GAAG;AACL,CAAA,EAAuD;AACrD,EAAA,2BAAQA,QAAA,CAAgB,KAAA,EAAhB,EAAsB,WAAA,EAAU,cAAA,EAAgB,GAAG,KAAA,EAAO,CAAA;AACpE;AAGA,SAAS,aAAA,CAAc;AAAA,EACrB,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAyD;AACvD,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA,CAAgB,OAAA;AAAA,IAAhB;AAAA,MACC,WAAA,EAAU,gBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,wJAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;AAGA,SAAS,aAAA,CAAc;AAAA,EACrB,SAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAyD;AACvD,EAAA,uBACE,IAAA,CAAC,YAAA,EAAA,EAAa,WAAA,EAAU,eAAA,EACtB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,aAAA,EAAA,EAAc,CAAA;AAAA,oBACf,IAAA;AAAA,MAACA,QAAA,CAAgB,OAAA;AAAA,MAAhB;AAAA,QACC,WAAA,EAAU,gBAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA,UACT,oEAAA;AAAA,UACA,gQAAA;AAAA,UACA,qRAAA;AAAA,UACA,6NAAA;AAAA,UACA,uNAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,iIAAA,EAAkI,CAAA;AAAA,UAChJ;AAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ;AAGA,SAAS,YAAA,CAAa,EAAE,SAAA,EAAW,GAAG,OAAM,EAAgC;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,eAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,2BAAA,EAA6B,SAAS,CAAA;AAAA,MACnD,GAAG;AAAA;AAAA,GACN;AAEJ;AAGA,SAAS,UAAA,CAAW,EAAE,SAAA,EAAW,GAAG,OAAM,EAAgC;AACxE,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,aAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,kCAAA,EAAoC,SAAS,CAAA;AAAA,MAC1D,GAAG;AAAA;AAAA,GACN;AAEJ;AAGA,SAAS,YAAA,CAAa,EAAE,SAAA,EAAW,GAAG,OAAM,EAAgC;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,eAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,iCAAA,EAAmC,SAAS,CAAA;AAAA,MACzD,GAAG;AAAA;AAAA,GACN;AAEJ;AAGA,SAAS,WAAA,CAAY;AAAA,EACnB,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAuD;AACrD,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA,CAAgB,KAAA;AAAA,IAAhB;AAAA,MACC,WAAA,EAAU,cAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,+BAAA,EAAiC,SAAS,CAAA;AAAA,MACvD,GAAG;AAAA;AAAA,GACN;AAEJ;AAGA,SAAS,iBAAA,CAAkB;AAAA,EACzB,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA6D;AAC3D,EAAA,uBACE,GAAA;AAAA,IAACA,QAAA,CAAgB,WAAA;AAAA,IAAhB;AAAA,MACC,WAAA,EAAU,oBAAA;AAAA,MACV,SAAA,EAAW,EAAA,CAAG,+BAAA,EAAiC,SAAS,CAAA;AAAA,MACvD,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-O2KRH6BS.js","sourcesContent":["import * as React from \"react\";\nimport { Drawer as DrawerPrimitive } from \"vaul\";\n\nimport { cn } from \"../../lib/utils\";\n\n/**\n * Swipeable drawer component built on Vaul.\n *\n * Slides from any edge of the screen and can be dismissed by swiping.\n * Set the `direction` prop on the root to control direction (`\"top\"`, `\"bottom\"`,\n * `\"left\"`, `\"right\"`). Always wrap content in `DrawerBody` for proper scrolling.\n *\n * @example\n * ```tsx\n * <Drawer open={open} onOpenChange={setOpen}>\n *   <DrawerTrigger asChild>\n *     <Button variant=\"outline\">Open Drawer</Button>\n *   </DrawerTrigger>\n *   <DrawerContent>\n *     <DrawerHeader>\n *       <DrawerTitle>Task Details</DrawerTitle>\n *       <DrawerDescription>\n *         View and edit task information.\n *       </DrawerDescription>\n *     </DrawerHeader>\n *     <DrawerBody>\n *       <p>Scrollable content goes here.</p>\n *     </DrawerBody>\n *     <DrawerFooter>\n *       <Button>Save</Button>\n *       <DrawerClose asChild>\n *         <Button variant=\"outline\">Cancel</Button>\n *       </DrawerClose>\n *     </DrawerFooter>\n *   </DrawerContent>\n * </Drawer>\n * ```\n */\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\n/** Element that opens the drawer when clicked. Use `asChild` to merge into your own button. */\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\n/** Portal that renders drawer content outside the DOM hierarchy. */\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />;\n}\n\n/** Button that closes the drawer. Use `asChild` to merge into your own button. */\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the drawer panel. */\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Drawer content panel that slides in from the configured direction. Includes a drag handle for bottom drawers. */\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          \"group/drawer-content bg-background fixed z-50 flex h-auto flex-col\",\n          \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\n          \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\n          \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n          \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  );\n}\n\n/** Container for DrawerTitle and DrawerDescription at the top of the drawer. */\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\"flex flex-col gap-1.5 p-6\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Scrollable body area for drawer content. Always wrap main content in this component. */\nfunction DrawerBody({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-body\"\n      className={cn(\"flex-1 overflow-y-auto px-6 py-4\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Container for action buttons at the bottom of the drawer. Pushed to the bottom via `mt-auto`. */\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn(\"mt-auto flex flex-col gap-2 p-6\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Accessible title rendered inside DrawerHeader. */\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn(\"text-foreground font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Accessible description rendered inside DrawerHeader below the title. */\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerBody,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n};"]}
+{"version":3,"sources":["../src/components/overlay/drawer.tsx"],"names":["DrawerPrimitive"],"mappings":"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","file":"chunk-EBV2XEHD.js","sourcesContent":["import * as React from \"react\";\nimport { Drawer as DrawerPrimitive } from \"vaul\";\n\nimport { cn } from \"../../lib/utils\";\n\n/**\n * Swipeable drawer component built on Vaul.\n *\n * Slides from any edge of the screen and can be dismissed by swiping.\n * Set the `direction` prop on the root to control direction (`\"top\"`, `\"bottom\"`,\n * `\"left\"`, `\"right\"`). Always wrap content in `DrawerBody` for proper scrolling.\n *\n * @example\n * ```tsx\n * <Drawer open={open} onOpenChange={setOpen}>\n *   <DrawerTrigger asChild>\n *     <Button variant=\"outline\">Open Drawer</Button>\n *   </DrawerTrigger>\n *   <DrawerContent>\n *     <DrawerHeader>\n *       <DrawerTitle>Task Details</DrawerTitle>\n *       <DrawerDescription>\n *         View and edit task information.\n *       </DrawerDescription>\n *     </DrawerHeader>\n *     <DrawerBody>\n *       <p>Scrollable content goes here.</p>\n *     </DrawerBody>\n *     <DrawerFooter>\n *       <Button>Save</Button>\n *       <DrawerClose asChild>\n *         <Button variant=\"outline\">Cancel</Button>\n *       </DrawerClose>\n *     </DrawerFooter>\n *   </DrawerContent>\n * </Drawer>\n * ```\n */\nfunction Drawer({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />;\n}\n\n/** Element that opens the drawer when clicked. Use `asChild` to merge into your own button. */\nfunction DrawerTrigger({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />;\n}\n\n/** Portal that renders drawer content outside the DOM hierarchy. */\nfunction DrawerPortal({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />;\n}\n\n/** Button that closes the drawer. Use `asChild` to merge into your own button. */\nfunction DrawerClose({\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />;\n}\n\n/** Semi-transparent backdrop rendered behind the drawer panel. */\nfunction DrawerOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      data-slot=\"drawer-overlay\"\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Drawer content panel that slides in from the configured direction. Includes a drag handle for bottom drawers. */\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        data-slot=\"drawer-content\"\n        className={cn(\n          \"group/drawer-content bg-background fixed z-50 flex h-auto flex-col\",\n          \"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b\",\n          \"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t\",\n          \"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n          \"data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block\" />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  );\n}\n\n/** Container for DrawerTitle and DrawerDescription at the top of the drawer. */\nfunction DrawerHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-header\"\n      className={cn(\"flex flex-col gap-1.5 p-dialog\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Scrollable body area for drawer content. Always wrap main content in this component. */\nfunction DrawerBody({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-body\"\n      className={cn(\"flex-1 overflow-y-auto p-dialog\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Container for action buttons at the bottom of the drawer. Pushed to the bottom via `mt-auto`. */\nfunction DrawerFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"drawer-footer\"\n      className={cn(\"mt-auto flex flex-col gap-2 p-dialog\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Accessible title rendered inside DrawerHeader. */\nfunction DrawerTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      data-slot=\"drawer-title\"\n      className={cn(\"text-foreground font-semibold\", className)}\n      {...props}\n    />\n  );\n}\n\n/** Accessible description rendered inside DrawerHeader below the title. */\nfunction DrawerDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      data-slot=\"drawer-description\"\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Drawer,\n  DrawerPortal,\n  DrawerOverlay,\n  DrawerTrigger,\n  DrawerClose,\n  DrawerContent,\n  DrawerHeader,\n  DrawerBody,\n  DrawerFooter,\n  DrawerTitle,\n  DrawerDescription,\n};"]}

package/dist/{chunk-UTF42GJR.js → chunk-HDTHGIQR.js}

@@ -1,4 +1,4 @@
-import { inputVariants } from './chunk-HXMY2NQ3.js';
+import { inputVariants } from './chunk-4NBDYSSQ.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { EyeOff, Eye } from 'lucide-react';
@@ -35,5 +35,5 @@ var PasswordInput = React.forwardRef(
 PasswordInput.displayName = "PasswordInput";
 
 export { PasswordInput };
-//# sourceMappingURL=chunk-UTF42GJR.js.map
-//# sourceMappingURL=chunk-UTF42GJR.js.map
+//# sourceMappingURL=chunk-HDTHGIQR.js.map
+//# sourceMappingURL=chunk-HDTHGIQR.js.map

package/dist/{chunk-UTF42GJR.js.map → chunk-HDTHGIQR.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/password-input.tsx"],"names":[],"mappings":";;;;;;AAiCA,IAAM,aAAA,GAAsB,KAAA,CAAA,UAAA;AAAA,EAC1B,CAAC,EAAE,SAAA,EAAW,MAAM,GAAG,KAAA,IAAS,GAAA,KAAQ;AACtC,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAU,eAAS,KAAK,CAAA;AAElD,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,UAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAM,UAAU,MAAA,GAAS,UAAA;AAAA,UACzB,GAAA;AAAA,UACA,WAAA,EAAU,OAAA;AAAA,UACV,SAAA,EAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,SAAA,EAAW,EAAA,CAAG,+EAAA,EAAiF,SAAS,CAAA,EAAG,CAAC,CAAA;AAAA,UAC/I,GAAG;AAAA;AAAA,OACN;AAAA,sBACA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,QAAA,EAAU,EAAA;AAAA,UACV,SAAA,EAAU,mIAAA;AAAA,UACV,SAAS,MAAM,UAAA,CAAW,CAAC,CAAA,KAAM,CAAC,CAAC,CAAA;AAAA,UACnC,YAAA,EAAY,UAAU,eAAA,GAAkB,eAAA;AAAA,UAEvC,QAAA,EAAA,OAAA,uBACE,MAAA,EAAA,EAAO,SAAA,EAAU,WAAU,CAAA,mBAE5B,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAU;AAAA;AAAA;AAE7B,KAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,aAAA,CAAc,WAAA,GAAc,eAAA","file":"chunk-UTF42GJR.js","sourcesContent":["import * as React from \"react\";\nimport { type VariantProps } from \"class-variance-authority\";\nimport { Eye, EyeOff } from \"lucide-react\";\n\nimport { cn } from \"../../lib/utils\";\nimport { inputVariants } from \"./input\";\n\ninterface PasswordInputProps\n  extends Omit<React.ComponentProps<\"input\">, \"type\" | \"size\">,\n    VariantProps<typeof inputVariants> {}\n\n/**\n * Password input with a built-in show/hide toggle button.\n *\n * Extends native `<input>` (minus `type` which is managed internally).\n * Shares the same size variants as `Input`.\n *\n * @example\n * ```tsx\n * // Default size\n * <PasswordInput placeholder=\"Enter password\" />\n *\n * // Sizes: xs (24px) | sm (28px) | default (32px) | lg (36px) | xl (44px)\n * <PasswordInput size=\"xl\" placeholder=\"Password\" />\n *\n * // Controlled\n * <PasswordInput\n *   value={password}\n *   onChange={(e) => setPassword(e.target.value)}\n *   placeholder=\"Password\"\n * />\n * ```\n */\nconst PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(\n  ({ className, size, ...props }, ref) => {\n    const [visible, setVisible] = React.useState(false);\n\n    return (\n      <div className=\"relative\">\n        <input\n          type={visible ? \"text\" : \"password\"}\n          ref={ref}\n          data-slot=\"input\"\n          className={cn(inputVariants({ size, className: cn(\"pr-10 [&::-ms-reveal]:hidden [&::-webkit-credentials-auto-fill-button]:hidden\", className) }))}\n          {...props}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          className=\"absolute right-0 top-0 flex h-full w-10 items-center justify-center text-muted-foreground hover:text-foreground transition-colors\"\n          onClick={() => setVisible((v) => !v)}\n          aria-label={visible ? \"Hide password\" : \"Show password\"}\n        >\n          {visible ? (\n            <EyeOff className=\"h-4 w-4\" />\n          ) : (\n            <Eye className=\"h-4 w-4\" />\n          )}\n        </button>\n      </div>\n    );\n  },\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\nexport type { PasswordInputProps };\n"]}
+{"version":3,"sources":["../src/components/inputs/password-input.tsx"],"names":[],"mappings":";;;;;;AAiCA,IAAM,aAAA,GAAsB,KAAA,CAAA,UAAA;AAAA,EAC1B,CAAC,EAAE,SAAA,EAAW,MAAM,GAAG,KAAA,IAAS,GAAA,KAAQ;AACtC,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAU,eAAS,KAAK,CAAA;AAElD,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,UAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAM,UAAU,MAAA,GAAS,UAAA;AAAA,UACzB,GAAA;AAAA,UACA,WAAA,EAAU,OAAA;AAAA,UACV,SAAA,EAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,SAAA,EAAW,EAAA,CAAG,+EAAA,EAAiF,SAAS,CAAA,EAAG,CAAC,CAAA;AAAA,UAC/I,GAAG;AAAA;AAAA,OACN;AAAA,sBACA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,QAAA,EAAU,EAAA;AAAA,UACV,SAAA,EAAU,mIAAA;AAAA,UACV,SAAS,MAAM,UAAA,CAAW,CAAC,CAAA,KAAM,CAAC,CAAC,CAAA;AAAA,UACnC,YAAA,EAAY,UAAU,eAAA,GAAkB,eAAA;AAAA,UAEvC,QAAA,EAAA,OAAA,uBACE,MAAA,EAAA,EAAO,SAAA,EAAU,WAAU,CAAA,mBAE5B,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAU;AAAA;AAAA;AAE7B,KAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,aAAA,CAAc,WAAA,GAAc,eAAA","file":"chunk-HDTHGIQR.js","sourcesContent":["import * as React from \"react\";\nimport { type VariantProps } from \"class-variance-authority\";\nimport { Eye, EyeOff } from \"lucide-react\";\n\nimport { cn } from \"../../lib/utils\";\nimport { inputVariants } from \"./input\";\n\ninterface PasswordInputProps\n  extends Omit<React.ComponentProps<\"input\">, \"type\" | \"size\">,\n    VariantProps<typeof inputVariants> {}\n\n/**\n * Password input with a built-in show/hide toggle button.\n *\n * Extends native `<input>` (minus `type` which is managed internally).\n * Shares the same size variants as `Input`.\n *\n * @example\n * ```tsx\n * // Default size\n * <PasswordInput placeholder=\"Enter password\" />\n *\n * // Sizes: xs (24px) | sm (28px) | default (32px) | lg (36px) | xl (44px)\n * <PasswordInput size=\"xl\" placeholder=\"Password\" />\n *\n * // Controlled\n * <PasswordInput\n *   value={password}\n *   onChange={(e) => setPassword(e.target.value)}\n *   placeholder=\"Password\"\n * />\n * ```\n */\nconst PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(\n  ({ className, size, ...props }, ref) => {\n    const [visible, setVisible] = React.useState(false);\n\n    return (\n      <div className=\"relative\">\n        <input\n          type={visible ? \"text\" : \"password\"}\n          ref={ref}\n          data-slot=\"input\"\n          className={cn(inputVariants({ size, className: cn(\"pr-10 [&::-ms-reveal]:hidden [&::-webkit-credentials-auto-fill-button]:hidden\", className) }))}\n          {...props}\n        />\n        <button\n          type=\"button\"\n          tabIndex={-1}\n          className=\"absolute right-0 top-0 flex h-full w-10 items-center justify-center text-muted-foreground hover:text-foreground transition-colors\"\n          onClick={() => setVisible((v) => !v)}\n          aria-label={visible ? \"Hide password\" : \"Show password\"}\n        >\n          {visible ? (\n            <EyeOff className=\"h-4 w-4\" />\n          ) : (\n            <Eye className=\"h-4 w-4\" />\n          )}\n        </button>\n      </div>\n    );\n  },\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\nexport type { PasswordInputProps };\n"]}

package/dist/{chunk-TLQE77WF.js → chunk-V3S2AZKJ.js}

@@ -1,4 +1,4 @@
-import { Input } from './chunk-HXMY2NQ3.js';
+import { Input } from './chunk-4NBDYSSQ.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-7NMNLY7F.js';
 import { Button } from './chunk-BOV3Q2JH.js';
 import { cn } from './chunk-DGPY4WP3.js';
@@ -139,5 +139,5 @@ function ColorPicker({
 }
 
 export { ColorPicker };
-//# sourceMappingURL=chunk-TLQE77WF.js.map
-//# sourceMappingURL=chunk-TLQE77WF.js.map
+//# sourceMappingURL=chunk-V3S2AZKJ.js.map
+//# sourceMappingURL=chunk-V3S2AZKJ.js.map

package/dist/{chunk-TLQE77WF.js.map → chunk-V3S2AZKJ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/color-picker.tsx"],"names":[],"mappings":"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","file":"chunk-TLQE77WF.js","sourcesContent":["import * as React from \"react\";\nimport { Check } from \"lucide-react\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from \"./button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../overlay/popover\";\nimport { Input } from \"./input\";\n\nconst PRESET_COLORS = [\n  \"#EF4444\", // Red\n  \"#F97316\", // Orange\n  \"#F59E0B\", // Amber\n  \"#EAB308\", // Yellow\n  \"#84CC16\", // Lime\n  \"#22C55E\", // Green\n  \"#10B981\", // Emerald\n  \"#14B8A6\", // Teal\n  \"#06B6D4\", // Cyan\n  \"#0EA5E9\", // Sky\n  \"#3B82F6\", // Blue\n  \"#6366F1\", // Indigo\n  \"#8B5CF6\", // Purple\n  \"#A855F7\", // Violet\n  \"#D946EF\", // Fuchsia\n  \"#EC4899\", // Pink\n  \"#F43F5E\", // Rose\n  \"#64748B\", // Slate\n  \"#6B7280\", // Gray\n  \"#000000\", // Black\n];\n\ninterface ColorPickerProps {\n  /** Currently selected color as a hex string (e.g., `\"#3B82F6\"`). */\n  value?: string;\n  /** Callback fired when a color is selected. Receives a hex string. */\n  onChange?: (color: string) => void;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the color picker is disabled. */\n  disabled?: boolean;\n  /** Whether to show the preset color grid. Defaults to `true`. */\n  showPresets?: boolean;\n  /** Whether to show the custom hex input with native color picker. Defaults to `true`. */\n  showInput?: boolean;\n}\n\n/**\n * Color picker with a popover containing preset color swatches and an optional custom hex input.\n * The trigger button shows the currently selected color swatch and its hex value.\n *\n * @example\n * ```tsx\n * const [color, setColor] = useState(\"#3B82F6\");\n *\n * <ColorPicker\n *   value={color}\n *   onChange={setColor}\n *   showPresets\n *   showInput\n * />\n * ```\n */\nexport function ColorPicker({\n  value = \"#3B82F6\",\n  onChange,\n  className,\n  disabled,\n  showPresets = true,\n  showInput = true,\n}: ColorPickerProps) {\n  const [customColor, setCustomColor] = React.useState(value);\n\n  const handleColorChange = (color: string) => {\n    setCustomColor(color);\n    onChange?.(color);\n  };\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-start gap-2\",\n            className\n          )}\n        >\n          <div\n            className=\"h-4 w-4 rounded border border-border\"\n            style={{ backgroundColor: value }}\n          />\n          <span className=\"flex-1 text-left\">{value}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-64 p-3\" align=\"start\">\n        <div className=\"space-y-3\">\n          {showPresets && (\n            <div>\n              <div className=\"text-xs font-medium mb-2 text-foreground\">\n                Màu mặc định\n              </div>\n              <div className=\"grid grid-cols-10 gap-1.5\">\n                {PRESET_COLORS.map((color) => (\n                  <button\n                    key={color}\n                    type=\"button\"\n                    className={cn(\n                      \"h-6 w-6 rounded border-2 transition-all hover:scale-110\",\n                      value === color\n                        ? \"border-foreground ring-2 ring-foreground ring-offset-1\"\n                        : \"border-border\"\n                    )}\n                    style={{ backgroundColor: color }}\n                    onClick={() => handleColorChange(color)}\n                  >\n                    {value === color && (\n                      <Check className=\"w-3 h-3 text-white mx-auto drop-shadow\" />\n                    )}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n\n          {showInput && (\n            <div>\n              <div className=\"text-xs font-medium mb-2 text-foreground\">\n                Màu tùy chỉnh\n              </div>\n              <div className=\"flex gap-2\">\n                <div className=\"relative flex-1\">\n                  <Input\n                    value={customColor}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setCustomColor(e.target.value)}\n                    onBlur={() => {\n                      // Validate hex color\n                      if (/^#[0-9A-F]{6}$/i.test(customColor)) {\n                        handleColorChange(customColor);\n                      } else {\n                        setCustomColor(value);\n                      }\n                    }}\n                    placeholder=\"#000000\"\n                    className=\"pr-10\"\n                  />\n                  <input\n                    type=\"color\"\n                    value={customColor}\n                    onChange={(e) => {\n                      setCustomColor(e.target.value);\n                      handleColorChange(e.target.value);\n                    }}\n                    className=\"absolute right-2 top-1/2 -translate-y-1/2 h-6 w-6 rounded border border-border cursor-pointer\"\n                  />\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/inputs/color-picker.tsx"],"names":[],"mappings":"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","file":"chunk-V3S2AZKJ.js","sourcesContent":["import * as React from \"react\";\nimport { Check } from \"lucide-react\";\nimport { cn } from \"../../lib/utils\";\nimport { Button } from \"./button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../overlay/popover\";\nimport { Input } from \"./input\";\n\nconst PRESET_COLORS = [\n  \"#EF4444\", // Red\n  \"#F97316\", // Orange\n  \"#F59E0B\", // Amber\n  \"#EAB308\", // Yellow\n  \"#84CC16\", // Lime\n  \"#22C55E\", // Green\n  \"#10B981\", // Emerald\n  \"#14B8A6\", // Teal\n  \"#06B6D4\", // Cyan\n  \"#0EA5E9\", // Sky\n  \"#3B82F6\", // Blue\n  \"#6366F1\", // Indigo\n  \"#8B5CF6\", // Purple\n  \"#A855F7\", // Violet\n  \"#D946EF\", // Fuchsia\n  \"#EC4899\", // Pink\n  \"#F43F5E\", // Rose\n  \"#64748B\", // Slate\n  \"#6B7280\", // Gray\n  \"#000000\", // Black\n];\n\ninterface ColorPickerProps {\n  /** Currently selected color as a hex string (e.g., `\"#3B82F6\"`). */\n  value?: string;\n  /** Callback fired when a color is selected. Receives a hex string. */\n  onChange?: (color: string) => void;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the color picker is disabled. */\n  disabled?: boolean;\n  /** Whether to show the preset color grid. Defaults to `true`. */\n  showPresets?: boolean;\n  /** Whether to show the custom hex input with native color picker. Defaults to `true`. */\n  showInput?: boolean;\n}\n\n/**\n * Color picker with a popover containing preset color swatches and an optional custom hex input.\n * The trigger button shows the currently selected color swatch and its hex value.\n *\n * @example\n * ```tsx\n * const [color, setColor] = useState(\"#3B82F6\");\n *\n * <ColorPicker\n *   value={color}\n *   onChange={setColor}\n *   showPresets\n *   showInput\n * />\n * ```\n */\nexport function ColorPicker({\n  value = \"#3B82F6\",\n  onChange,\n  className,\n  disabled,\n  showPresets = true,\n  showInput = true,\n}: ColorPickerProps) {\n  const [customColor, setCustomColor] = React.useState(value);\n\n  const handleColorChange = (color: string) => {\n    setCustomColor(color);\n    onChange?.(color);\n  };\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-start gap-2\",\n            className\n          )}\n        >\n          <div\n            className=\"h-4 w-4 rounded border border-border\"\n            style={{ backgroundColor: value }}\n          />\n          <span className=\"flex-1 text-left\">{value}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-64 p-3\" align=\"start\">\n        <div className=\"space-y-3\">\n          {showPresets && (\n            <div>\n              <div className=\"text-xs font-medium mb-2 text-foreground\">\n                Màu mặc định\n              </div>\n              <div className=\"grid grid-cols-10 gap-1.5\">\n                {PRESET_COLORS.map((color) => (\n                  <button\n                    key={color}\n                    type=\"button\"\n                    className={cn(\n                      \"h-6 w-6 rounded border-2 transition-all hover:scale-110\",\n                      value === color\n                        ? \"border-foreground ring-2 ring-foreground ring-offset-1\"\n                        : \"border-border\"\n                    )}\n                    style={{ backgroundColor: color }}\n                    onClick={() => handleColorChange(color)}\n                  >\n                    {value === color && (\n                      <Check className=\"w-3 h-3 text-white mx-auto drop-shadow\" />\n                    )}\n                  </button>\n                ))}\n              </div>\n            </div>\n          )}\n\n          {showInput && (\n            <div>\n              <div className=\"text-xs font-medium mb-2 text-foreground\">\n                Màu tùy chỉnh\n              </div>\n              <div className=\"flex gap-2\">\n                <div className=\"relative flex-1\">\n                  <Input\n                    value={customColor}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setCustomColor(e.target.value)}\n                    onBlur={() => {\n                      // Validate hex color\n                      if (/^#[0-9A-F]{6}$/i.test(customColor)) {\n                        handleColorChange(customColor);\n                      } else {\n                        setCustomColor(value);\n                      }\n                    }}\n                    placeholder=\"#000000\"\n                    className=\"pr-10\"\n                  />\n                  <input\n                    type=\"color\"\n                    value={customColor}\n                    onChange={(e) => {\n                      setCustomColor(e.target.value);\n                      handleColorChange(e.target.value);\n                    }}\n                    className=\"absolute right-2 top-1/2 -translate-y-1/2 h-6 w-6 rounded border border-border cursor-pointer\"\n                  />\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}

package/dist/{chunk-5K6RO5R3.js → chunk-VPTIRPZW.js}

@@ -22,7 +22,8 @@ function UIProvider({
   defaultTheme,
   locales,
   defaultLocale,
-  fallbackLocale
+  fallbackLocale,
+  dateFnsLocale
 }) {
   const [theme, setThemeState] = useState(() => defaultTheme ?? loadSavedTheme());
   const setTheme = useCallback((t) => setThemeState(t), []);
@@ -43,7 +44,7 @@ function UIProvider({
     defaultLocale: defaultLocale ?? firstLocale,
     fallbackLocale: fallbackLocale ?? defaultLocale ?? firstLocale
   } : void 0;
-  return /* @__PURE__ */ jsx(UIContext.Provider, { value: { theme, setTheme, locale }, children });
+  return /* @__PURE__ */ jsx(UIContext.Provider, { value: { theme, setTheme, locale, dateFnsLocale }, children });
 }
 function useTheme() {
   const ctx = useContext(UIContext);
@@ -53,6 +54,9 @@ function useTheme() {
 function useUILocales() {
   return useContext(UIContext)?.locale;
 }
+function useDateFnsLocale() {
+  return useContext(UIContext)?.dateFnsLocale;
+}
 function resolveTranslatableConfig(translatable, providerLocales) {
   if (translatable === true) {
     return providerLocales;
@@ -66,6 +70,6 @@ function resolveTranslatableConfig(translatable, providerLocales) {
   return Object.keys(merged.locales).length > 0 ? merged : void 0;
 }
 
-export { UIProvider, resolveTranslatableConfig, useTheme, useUILocales };
-//# sourceMappingURL=chunk-5K6RO5R3.js.map
-//# sourceMappingURL=chunk-5K6RO5R3.js.map
+export { UIProvider, resolveTranslatableConfig, useDateFnsLocale, useTheme, useUILocales };
+//# sourceMappingURL=chunk-VPTIRPZW.js.map
+//# sourceMappingURL=chunk-VPTIRPZW.js.map

package/dist/chunk-VPTIRPZW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/providers/ui-provider.tsx"],"names":[],"mappings":"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","file":"chunk-VPTIRPZW.js","sourcesContent":["import { createContext, useContext, useState, useEffect, useCallback, ReactNode } from 'react';\n\n// ─── Theme ────────────────────────────────────────────────────────────────────\n\nexport type Theme = 'light' | 'dark' | 'system';\n\n// ─── Locale ───────────────────────────────────────────────────────────────────\n\nexport type LocaleCode = string;\n\n/**\n * Map of locale code → display label.\n * @example { en: 'English', vi: 'Tiếng Việt', ja: '日本語' }\n */\nexport type LocaleMap = Record<LocaleCode, string>;\n\n/** Value shape for translatable fields: locale code → string content. */\nexport type TranslatableValue = Record<LocaleCode, string>;\n\n/** Locale configuration used by UIProvider and translatable fields. */\nexport interface UILocaleConfig {\n  /** Available locales. e.g. `{ en: 'English', vi: 'Tiếng Việt' }` */\n  locales: LocaleMap;\n  /** Locale shown by default when a translatable field is first rendered. */\n  defaultLocale: LocaleCode;\n  /** Locale to fall back to when the active locale has no value. */\n  fallbackLocale: LocaleCode;\n}\n\n/**\n * `true`  — inherit UIProvider's locale config.\n * `object` — override per-field (merged with provider config).\n */\nexport type TranslatableConfig = true | Partial<UILocaleConfig>;\n\n// ─── Context ──────────────────────────────────────────────────────────────────\n\ninterface UIContextValue {\n  theme: Theme;\n  setTheme: (theme: Theme) => void;\n  locale: UILocaleConfig | undefined;\n  dateFnsLocale: object | undefined;\n}\n\nconst UIContext = createContext<UIContextValue | undefined>(undefined);\n\n// ─── Helpers ──────────────────────────────────────────────────────────────────\n\nfunction loadSavedTheme(): Theme {\n  if (typeof window === 'undefined') return 'system';\n  const saved = localStorage.getItem('omnify_theme');\n  if (saved === 'light' || saved === 'dark' || saved === 'system') return saved;\n  return 'system';\n}\n\nfunction applyTheme(theme: Theme) {\n  const root = document.documentElement;\n  if (theme === 'system') {\n    root.classList.toggle('dark', window.matchMedia('(prefers-color-scheme: dark)').matches);\n  } else {\n    root.classList.toggle('dark', theme === 'dark');\n  }\n}\n\n// ─── UIProvider ───────────────────────────────────────────────────────────────\n\nexport interface UIProviderProps {\n  children: ReactNode;\n  /**\n   * Initial theme. Defaults to user's saved localStorage value or `'system'`.\n   */\n  defaultTheme?: Theme;\n  /**\n   * Available locales for translatable fields.\n   * @example { en: 'English', vi: 'Tiếng Việt', ja: '日本語' }\n   */\n  locales?: LocaleMap;\n  /**\n   * Locale shown first in translatable fields.\n   * Defaults to the first key in `locales`.\n   */\n  defaultLocale?: LocaleCode;\n  /**\n   * Locale used when a field has no value for the active locale.\n   * Defaults to `defaultLocale`.\n   */\n  fallbackLocale?: LocaleCode;\n  /**\n   * date-fns `Locale` object used by date components (DatePicker, CalendarMini, etc.).\n   * Typed as `object` to avoid importing date-fns as a direct dependency.\n   *\n   * @example\n   * ```tsx\n   * import { ja } from 'date-fns/locale';\n   * <UIProvider dateFnsLocale={ja}>{children}</UIProvider>\n   * ```\n   */\n  dateFnsLocale?: object;\n}\n\n/**\n * Root provider for @omnifyjp/ui — handles dark mode and translatable field config.\n *\n * @example\n * ```tsx\n * <UIProvider\n *   locales={{ en: 'English', vi: 'Tiếng Việt', ja: '日本語' }}\n *   defaultLocale=\"en\"\n *   fallbackLocale=\"en\"\n * >\n *   {children}\n * </UIProvider>\n * ```\n */\nexport function UIProvider({\n  children,\n  defaultTheme,\n  locales,\n  defaultLocale,\n  fallbackLocale,\n  dateFnsLocale,\n}: UIProviderProps) {\n  const [theme, setThemeState] = useState<Theme>(() => defaultTheme ?? loadSavedTheme());\n\n  const setTheme = useCallback((t: Theme) => setThemeState(t), []);\n\n  useEffect(() => {\n    localStorage.setItem('omnify_theme', theme);\n    applyTheme(theme);\n  }, [theme]);\n\n  useEffect(() => {\n    if (theme !== 'system') return;\n    const mq = window.matchMedia('(prefers-color-scheme: dark)');\n    const handler = () => applyTheme('system');\n    mq.addEventListener('change', handler);\n    return () => mq.removeEventListener('change', handler);\n  }, [theme]);\n\n  const firstLocale = locales ? Object.keys(locales)[0] : undefined;\n  const locale: UILocaleConfig | undefined =\n    locales && firstLocale\n      ? {\n          locales,\n          defaultLocale: defaultLocale ?? firstLocale,\n          fallbackLocale: fallbackLocale ?? defaultLocale ?? firstLocale,\n        }\n      : undefined;\n\n  return (\n    <UIContext.Provider value={{ theme, setTheme, locale, dateFnsLocale }}>\n      {children}\n    </UIContext.Provider>\n  );\n}\n\n// ─── Hooks ────────────────────────────────────────────────────────────────────\n\n/** Access theme and setTheme. Must be inside UIProvider. */\nexport function useTheme(): { theme: Theme; setTheme: (t: Theme) => void } {\n  const ctx = useContext(UIContext);\n  if (!ctx) throw new Error('useTheme must be used within UIProvider');\n  return { theme: ctx.theme, setTheme: ctx.setTheme };\n}\n\n/**\n * Returns the locale config from UIProvider.\n * Returns `undefined` when no `locales` prop was passed to UIProvider.\n */\nexport function useUILocales(): UILocaleConfig | undefined {\n  return useContext(UIContext)?.locale;\n}\n\n/**\n * Returns the date-fns `Locale` object from UIProvider.\n * Returns `undefined` when no `dateFnsLocale` prop was passed.\n */\nexport function useDateFnsLocale(): object | undefined {\n  return useContext(UIContext)?.dateFnsLocale;\n}\n\n/**\n * Resolves the effective UILocaleConfig for a translatable field.\n * Merges inline `TranslatableConfig` with the provider's locale config.\n */\nexport function resolveTranslatableConfig(\n  translatable: TranslatableConfig,\n  providerLocales: UILocaleConfig | undefined,\n): UILocaleConfig | undefined {\n  if (translatable === true) {\n    return providerLocales;\n  }\n  const base = providerLocales ?? { locales: {}, defaultLocale: '', fallbackLocale: '' };\n  const merged: UILocaleConfig = {\n    locales: translatable.locales ?? base.locales,\n    defaultLocale: translatable.defaultLocale ?? base.defaultLocale,\n    fallbackLocale: translatable.fallbackLocale ?? base.fallbackLocale,\n  };\n  return Object.keys(merged.locales).length > 0 ? merged : undefined;\n}\n"]}

package/dist/{chunk-OUOGSSRT.js → chunk-YN26HHZ4.js}

@@ -23,9 +23,9 @@ function PageContainer({
   }
   if (variant === "split") {
     return /* @__PURE__ */ jsxs("div", { className: `h-full flex flex-col ${className}`, children: [
-      (title || extra) && /* @__PURE__ */ jsx("div", { className: "px-page py-4 border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      (title || extra) && /* @__PURE__ */ jsx("div", { className: "px-page py-3 border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-          title && /* @__PURE__ */ jsx("h1", { className: "text-page-title font-semibold mb-2", children: title }),
+          title && /* @__PURE__ */ jsx("h1", { className: "text-page-title font-semibold mb-1", children: title }),
           subtitle && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: subtitle })
         ] }),
         extra && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: extra })
@@ -40,9 +40,9 @@ function PageContainer({
   }
   return /* @__PURE__ */ jsxs("div", { className: `h-full flex flex-col ${className}`, children: [
     (title || extra) && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("div", { className: "px-page py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "px-page py-3", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
-          title && /* @__PURE__ */ jsx("h1", { className: "text-page-title font-semibold mb-2", children: title }),
+          title && /* @__PURE__ */ jsx("h1", { className: "text-page-title font-semibold mb-1", children: title }),
           subtitle && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: subtitle })
         ] }),
         extra && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: extra })
@@ -52,7 +52,7 @@ function PageContainer({
     /* @__PURE__ */ jsx("main", { className: `flex-1 overflow-y-auto p-page ${contentClassName}`, children }),
     footer && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(Separator, {}),
-      /* @__PURE__ */ jsx("div", { className: "px-page py-4", children: footer })
+      /* @__PURE__ */ jsx("div", { className: "px-page py-3", children: footer })
     ] })
   ] });
 }
@@ -67,5 +67,5 @@ function FullWidthPageContainer(props) {
 }
 
 export { FullWidthPageContainer, PageContainer, SplitPageContainer, StandardPageContainer };
-//# sourceMappingURL=chunk-OUOGSSRT.js.map
-//# sourceMappingURL=chunk-OUOGSSRT.js.map
+//# sourceMappingURL=chunk-YN26HHZ4.js.map
+//# sourceMappingURL=chunk-YN26HHZ4.js.map

package/dist/{chunk-OUOGSSRT.js.map → chunk-YN26HHZ4.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/layout/page-container.tsx"],"names":[],"mappings":"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","file":"chunk-OUOGSSRT.js","sourcesContent":["import { ReactNode } from 'react';\nimport { Separator } from '../display/separator';\n\nexport interface PageContainerProps {\n  /**\n   * Page title\n   */\n  title?: string;\n\n  /**\n   * Subtitle or description below title\n   */\n  subtitle?: string;\n\n  /**\n   * Extra content (buttons, actions) displayed on the right side of header\n   */\n  extra?: ReactNode;\n\n  /**\n   * Main page content\n   */\n  children: ReactNode;\n\n  /**\n   * Footer content displayed at the bottom\n   */\n  footer?: ReactNode;\n\n  /**\n   * Sidebar content displayed on left or right\n   */\n  sidebar?: ReactNode;\n\n  /**\n   * Sidebar position\n   * @default 'right'\n   */\n  sidebarPosition?: 'left' | 'right';\n\n  /**\n   * Sidebar width\n   * @default 'w-80'\n   */\n  sidebarWidth?: string;\n\n  /**\n   * Layout variant\n   * - 'standard': Default padded layout with header\n   * - 'full': Full width, no padding (for boards, gantt)\n   * - 'split': Layout with sidebar inside page\n   * @default 'standard'\n   */\n  variant?: 'standard' | 'full' | 'split';\n\n  /**\n   * Custom container className\n   */\n  className?: string;\n\n  /**\n   * Custom content className\n   */\n  contentClassName?: string;\n\n  /**\n   * Show separator below header\n   * @default true for standard variant\n   */\n  showHeaderSeparator?: boolean;\n}\n\n/**\n * PageContainer - Flexible page layout component\n *\n * @example\n * // Standard layout with title and actions\n * <PageContainer\n *   title=\"Dashboard\"\n *   subtitle=\"Overview of all projects\"\n *   extra={<Button>Create</Button>}\n * >\n *   <div>Content here</div>\n * </PageContainer>\n *\n * @example\n * // Split layout with right sidebar\n * <PageContainer\n *   title=\"Task Detail\"\n *   variant=\"split\"\n *   sidebar={<CommentSection />}\n *   sidebarPosition=\"right\"\n * >\n *   <div>Main content</div>\n * </PageContainer>\n *\n * @example\n * // Full width layout (no padding)\n * <PageContainer variant=\"full\">\n *   <KanbanBoard />\n * </PageContainer>\n */\nexport function PageContainer({\n  title,\n  subtitle,\n  extra,\n  children,\n  footer,\n  sidebar,\n  sidebarPosition = 'right',\n  sidebarWidth = 'w-80',\n  variant = 'standard',\n  className = '',\n  contentClassName = '',\n  showHeaderSeparator = true,\n}: PageContainerProps) {\n  // Full width variant - no padding, no header\n  if (variant === 'full') {\n    return (\n      <div className={`h-full flex flex-col ${className}`}>\n        {children}\n        {footer && <div className=\"border-t border-border\">{footer}</div>}\n      </div>\n    );\n  }\n\n  // Split variant - with sidebar\n  if (variant === 'split') {\n    return (\n      <div className={`h-full flex flex-col ${className}`}>\n        {(title || extra) && (\n          <div className=\"px-page py-4 border-b border-border\">\n            <div className=\"flex items-start justify-between gap-4\">\n              <div className=\"flex-1 min-w-0\">\n                {title && <h1 className=\"text-page-title font-semibold mb-2\">{title}</h1>}\n                {subtitle && <p className=\"text-sm text-muted-foreground\">{subtitle}</p>}\n              </div>\n              {extra && <div className=\"flex-shrink-0\">{extra}</div>}\n            </div>\n          </div>\n        )}\n\n        <div className=\"flex-1 flex overflow-hidden\">\n          {sidebar && sidebarPosition === 'left' && (\n            <aside className={`${sidebarWidth} border-r border-border overflow-y-auto flex-shrink-0`}>\n              {sidebar}\n            </aside>\n          )}\n\n          <main className={`flex-1 overflow-y-auto ${contentClassName}`}>\n            {children}\n          </main>\n\n          {sidebar && sidebarPosition === 'right' && (\n            <aside className={`${sidebarWidth} border-l border-border overflow-y-auto flex-shrink-0`}>\n              {sidebar}\n            </aside>\n          )}\n        </div>\n\n        {footer && (\n          <div className=\"border-t border-border\">\n            {footer}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  // Standard variant - default padded layout\n  return (\n    <div className={`h-full flex flex-col ${className}`}>\n      {(title || extra) && (\n        <>\n          <div className=\"px-page py-4\">\n            <div className=\"flex items-start justify-between gap-4\">\n              <div className=\"flex-1 min-w-0\">\n                {title && <h1 className=\"text-page-title font-semibold mb-2\">{title}</h1>}\n                {subtitle && <p className=\"text-sm text-muted-foreground\">{subtitle}</p>}\n              </div>\n              {extra && <div className=\"flex-shrink-0\">{extra}</div>}\n            </div>\n          </div>\n          {showHeaderSeparator && <Separator />}\n        </>\n      )}\n\n      <main className={`flex-1 overflow-y-auto p-page ${contentClassName}`}>\n        {children}\n      </main>\n\n      {footer && (\n        <>\n          <Separator />\n          <div className=\"px-page py-4\">\n            {footer}\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n\nexport function StandardPageContainer(props: Omit<PageContainerProps, 'variant'>) {\n  return <PageContainer {...props} variant=\"standard\" />;\n}\n\nexport function SplitPageContainer(props: Omit<PageContainerProps, 'variant'>) {\n  return <PageContainer {...props} variant=\"split\" />;\n}\n\nexport function FullWidthPageContainer(props: Omit<PageContainerProps, 'variant' | 'title' | 'subtitle' | 'extra'>) {\n  return <PageContainer {...props} variant=\"full\" />;\n}\n"]}
+{"version":3,"sources":["../src/components/layout/page-container.tsx"],"names":[],"mappings":"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","file":"chunk-YN26HHZ4.js","sourcesContent":["import { ReactNode } from 'react';\nimport { Separator } from '../display/separator';\n\nexport interface PageContainerProps {\n  /**\n   * Page title\n   */\n  title?: string;\n\n  /**\n   * Subtitle or description below title\n   */\n  subtitle?: string;\n\n  /**\n   * Extra content (buttons, actions) displayed on the right side of header\n   */\n  extra?: ReactNode;\n\n  /**\n   * Main page content\n   */\n  children: ReactNode;\n\n  /**\n   * Footer content displayed at the bottom\n   */\n  footer?: ReactNode;\n\n  /**\n   * Sidebar content displayed on left or right\n   */\n  sidebar?: ReactNode;\n\n  /**\n   * Sidebar position\n   * @default 'right'\n   */\n  sidebarPosition?: 'left' | 'right';\n\n  /**\n   * Sidebar width\n   * @default 'w-80'\n   */\n  sidebarWidth?: string;\n\n  /**\n   * Layout variant\n   * - 'standard': Default padded layout with header\n   * - 'full': Full width, no padding (for boards, gantt)\n   * - 'split': Layout with sidebar inside page\n   * @default 'standard'\n   */\n  variant?: 'standard' | 'full' | 'split';\n\n  /**\n   * Custom container className\n   */\n  className?: string;\n\n  /**\n   * Custom content className\n   */\n  contentClassName?: string;\n\n  /**\n   * Show separator below header\n   * @default true for standard variant\n   */\n  showHeaderSeparator?: boolean;\n}\n\n/**\n * PageContainer - Flexible page layout component\n *\n * @example\n * // Standard layout with title and actions\n * <PageContainer\n *   title=\"Dashboard\"\n *   subtitle=\"Overview of all projects\"\n *   extra={<Button>Create</Button>}\n * >\n *   <div>Content here</div>\n * </PageContainer>\n *\n * @example\n * // Split layout with right sidebar\n * <PageContainer\n *   title=\"Task Detail\"\n *   variant=\"split\"\n *   sidebar={<CommentSection />}\n *   sidebarPosition=\"right\"\n * >\n *   <div>Main content</div>\n * </PageContainer>\n *\n * @example\n * // Full width layout (no padding)\n * <PageContainer variant=\"full\">\n *   <KanbanBoard />\n * </PageContainer>\n */\nexport function PageContainer({\n  title,\n  subtitle,\n  extra,\n  children,\n  footer,\n  sidebar,\n  sidebarPosition = 'right',\n  sidebarWidth = 'w-80',\n  variant = 'standard',\n  className = '',\n  contentClassName = '',\n  showHeaderSeparator = true,\n}: PageContainerProps) {\n  // Full width variant - no padding, no header\n  if (variant === 'full') {\n    return (\n      <div className={`h-full flex flex-col ${className}`}>\n        {children}\n        {footer && <div className=\"border-t border-border\">{footer}</div>}\n      </div>\n    );\n  }\n\n  // Split variant - with sidebar\n  if (variant === 'split') {\n    return (\n      <div className={`h-full flex flex-col ${className}`}>\n        {(title || extra) && (\n          <div className=\"px-page py-3 border-b border-border\">\n            <div className=\"flex items-start justify-between gap-4\">\n              <div className=\"flex-1 min-w-0\">\n                {title && <h1 className=\"text-page-title font-semibold mb-1\">{title}</h1>}\n                {subtitle && <p className=\"text-sm text-muted-foreground\">{subtitle}</p>}\n              </div>\n              {extra && <div className=\"flex-shrink-0\">{extra}</div>}\n            </div>\n          </div>\n        )}\n\n        <div className=\"flex-1 flex overflow-hidden\">\n          {sidebar && sidebarPosition === 'left' && (\n            <aside className={`${sidebarWidth} border-r border-border overflow-y-auto flex-shrink-0`}>\n              {sidebar}\n            </aside>\n          )}\n\n          <main className={`flex-1 overflow-y-auto ${contentClassName}`}>\n            {children}\n          </main>\n\n          {sidebar && sidebarPosition === 'right' && (\n            <aside className={`${sidebarWidth} border-l border-border overflow-y-auto flex-shrink-0`}>\n              {sidebar}\n            </aside>\n          )}\n        </div>\n\n        {footer && (\n          <div className=\"border-t border-border\">\n            {footer}\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  // Standard variant - default padded layout\n  return (\n    <div className={`h-full flex flex-col ${className}`}>\n      {(title || extra) && (\n        <>\n          <div className=\"px-page py-3\">\n            <div className=\"flex items-start justify-between gap-4\">\n              <div className=\"flex-1 min-w-0\">\n                {title && <h1 className=\"text-page-title font-semibold mb-1\">{title}</h1>}\n                {subtitle && <p className=\"text-sm text-muted-foreground\">{subtitle}</p>}\n              </div>\n              {extra && <div className=\"flex-shrink-0\">{extra}</div>}\n            </div>\n          </div>\n          {showHeaderSeparator && <Separator />}\n        </>\n      )}\n\n      <main className={`flex-1 overflow-y-auto p-page ${contentClassName}`}>\n        {children}\n      </main>\n\n      {footer && (\n        <>\n          <Separator />\n          <div className=\"px-page py-3\">\n            {footer}\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n\nexport function StandardPageContainer(props: Omit<PageContainerProps, 'variant'>) {\n  return <PageContainer {...props} variant=\"standard\" />;\n}\n\nexport function SplitPageContainer(props: Omit<PageContainerProps, 'variant'>) {\n  return <PageContainer {...props} variant=\"split\" />;\n}\n\nexport function FullWidthPageContainer(props: Omit<PageContainerProps, 'variant' | 'title' | 'subtitle' | 'extra'>) {\n  return <PageContainer {...props} variant=\"full\" />;\n}\n"]}

package/dist/{chunk-DNPRGSOD.js → chunk-ZUBW2ERW.js}

@@ -1,5 +1,5 @@
-import { useUILocales, resolveTranslatableConfig } from './chunk-5K6RO5R3.js';
 import { TranslatableField } from './chunk-YU55YBID.js';
+import { useUILocales, resolveTranslatableConfig } from './chunk-VPTIRPZW.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { jsx } from 'react/jsx-runtime';
@@ -66,5 +66,5 @@ var Textarea = React.forwardRef(
 Textarea.displayName = "Textarea";
 
 export { Textarea };
-//# sourceMappingURL=chunk-DNPRGSOD.js.map
-//# sourceMappingURL=chunk-DNPRGSOD.js.map
+//# sourceMappingURL=chunk-ZUBW2ERW.js.map
+//# sourceMappingURL=chunk-ZUBW2ERW.js.map

package/dist/{chunk-DNPRGSOD.js.map → chunk-ZUBW2ERW.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/textarea.tsx"],"names":["textareaRest","value","onChange"],"mappings":";;;;;;AAsDA,IAAM,aAAA,GACJ,4cAAA;AAyBF,IAAM,QAAA,GAAiB,KAAA,CAAA,UAAA;AAAA,EACrB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,YAAA,EAAc,GAAG,MAAK,GAAI,KAAA;AAE7C,IAAA,MAAM,kBAAkB,YAAA,EAAa;AAGrC,IAAA,IAAI,iBAAiB,MAAA,EAAW;AAC9B,MAAA,MAAM,MAAA,GAAS,yBAAA,CAA0B,YAAA,EAAc,eAAe,CAAA;AAGtE,MAAA,IAAI,CAAC,MAAA,EAAQ;AACX,QAAA,MAAM,EAAE,KAAA,EAAO,EAAA,EAAI,UAAU,GAAA,EAAK,GAAGA,eAAa,GAAI,IAAA;AACtD,QAAA,uBACE,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,GAAA;AAAA,YACA,WAAA,EAAU,UAAA;AAAA,YACV,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,YACrC,GAAIA;AAAA;AAAA,SACP;AAAA,MAEJ;AAEA,MAAA,MAAM,EAAE,KAAA,EAAAC,MAAAA,GAAQ,EAAC,EAAG,UAAAC,SAAAA,EAAU,MAAA,EAAQ,GAAGF,aAAAA,EAAa,GAAI,IAAA;AAE1D,MAAA,uBACE,GAAA;AAAA,QAAC,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,KAAA,EAAOC,MAAAA;AAAA,UACP,QAAA,EAAUC,cAAa,MAAM;AAAA,UAAC,CAAA,CAAA;AAAA,UAC9B,MAAA;AAAA,UAEC,QAAA,EAAA,CAAC,EAAE,KAAA,EAAO,WAAA,EAAa,UAAU,YAAA,EAAc,mBAAA,EAAqB,UAAS,qBAC5E,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,WAAA,EAAU,UAAA;AAAA,cACV,mBAAA,EAAiB,IAAA;AAAA,cACjB,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,cACtC,KAAA,EAAO,WAAA;AAAA,cACP,WAAA,EAAa,uBAAwBF,aAAAA,CAAmE,WAAA;AAAA,cACxG,UAAU,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cAC3C,GAAIA,aAAAA;AAAA,cACL,cAAA,EAAc,QAAA,IAAaA,aAAAA,CAAmE,cAAc,CAAA,IAAK;AAAA;AAAA;AACnH;AAAA,OAEJ;AAAA,IAEJ;AAGA,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,GAAG,cAAa,GAAI,IAAA;AAC7C,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAA,EAAU,UAAA;AAAA,QACV,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,QACtC,KAAA;AAAA,QACA,QAAA;AAAA,QACC,GAAI;AAAA;AAAA,KACP;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-DNPRGSOD.js","sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\nimport { TranslatableField } from './translatable-field';\nimport { useUILocales, resolveTranslatableConfig } from '../../providers/ui-provider';\nimport type { TranslatableConfig, TranslatableValue } from '../../providers/ui-provider';\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\ntype NativeTextareaProps = Omit<React.ComponentProps<'textarea'>, 'value' | 'onChange'>;\n\ninterface StandardTextareaProps extends NativeTextareaProps {\n  /** Translatable mode disabled (default). */\n  translatable?: never;\n  value?: string;\n  onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n}\n\ninterface TranslatableTextareaProps extends NativeTextareaProps {\n  /**\n   * Enable locale-switching tabs on this textarea.\n   * - `true` — inherit UIProvider's locale config\n   * - `object` — override locales/defaultLocale/fallbackLocale per field\n   *\n   * @example\n   * ```tsx\n   * // Uses UIProvider config\n   * <Textarea translatable value={val} onChange={setVal} />\n   *\n   * // Custom per-field config\n   * <Textarea\n   *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n   *   value={val}\n   *   onChange={setVal}\n   * />\n   * ```\n   */\n  translatable: TranslatableConfig;\n  value?: TranslatableValue;\n  onChange?: (value: TranslatableValue) => void;\n  /**\n   * Per-locale validation errors. Truthy string = that locale is invalid.\n   * The active locale's error is forwarded as `aria-invalid` on the textarea;\n   * all locale tabs with errors show a red dot indicator.\n   *\n   * @example `{ en: 'Required', vi: 'Too long (120/100)' }`\n   */\n  errors?: Partial<Record<string, string>>;\n}\n\nexport type TextareaProps = StandardTextareaProps | TranslatableTextareaProps;\n\n// ─── Base class ───────────────────────────────────────────────────────────────\n\nconst textareaClass =\n  \"resize-none border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-input-background px-3 py-2 text-base transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\";\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Multi-line text input with auto-sizing via `field-sizing-content`.\n * Supports translatable mode via the `translatable` prop.\n *\n * @example\n * ```tsx\n * // Standard\n * <Textarea placeholder=\"Enter a description...\" />\n * <Textarea value={content} onChange={(e) => setContent(e.target.value)} />\n *\n * // Translatable — uses UIProvider's locale config\n * <Textarea translatable value={val} onChange={setVal} />\n *\n * // Translatable — custom config\n * <Textarea\n *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n *   value={val}\n *   onChange={setVal}\n * />\n * ```\n */\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (props, ref) => {\n    const { className, translatable, ...rest } = props as TranslatableTextareaProps & { className?: string };\n\n    const providerLocales = useUILocales();\n\n    // ── Translatable mode ──────────────────────────────────────────────────\n    if (translatable !== undefined) {\n      const config = resolveTranslatableConfig(translatable, providerLocales);\n\n      // Fallback: if no locale config available, render standard textarea\n      if (!config) {\n        const { value: _v, onChange: _oc, ...textareaRest } = rest as TranslatableTextareaProps;\n        return (\n          <textarea\n            ref={ref}\n            data-slot=\"textarea\"\n            className={cn(textareaClass, className)}\n            {...(textareaRest as NativeTextareaProps)}\n          />\n        );\n      }\n\n      const { value = {}, onChange, errors, ...textareaRest } = rest as TranslatableTextareaProps;\n\n      return (\n        <TranslatableField\n          config={config}\n          value={value as TranslatableValue}\n          onChange={onChange ?? (() => {})}\n          errors={errors}\n        >\n          {({ value: localeValue, onChange: localeChange, fallbackPlaceholder, hasError }) => (\n            <textarea\n              ref={ref}\n              data-slot=\"textarea\"\n              data-translatable\n              className={cn(textareaClass, className)}\n              value={localeValue}\n              placeholder={fallbackPlaceholder ?? (textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>).placeholder}\n              onChange={(e) => localeChange(e.target.value)}\n              {...(textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>)}\n              aria-invalid={hasError || (textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>)['aria-invalid'] || undefined}\n            />\n          )}\n        </TranslatableField>\n      );\n    }\n\n    // ── Standard mode ──────────────────────────────────────────────────────\n    const { value, onChange, ...textareaRest } = rest as StandardTextareaProps;\n    return (\n      <textarea\n        ref={ref}\n        data-slot=\"textarea\"\n        className={cn(textareaClass, className)}\n        value={value}\n        onChange={onChange}\n        {...(textareaRest as NativeTextareaProps)}\n      />\n    );\n  },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n"]}
+{"version":3,"sources":["../src/components/inputs/textarea.tsx"],"names":["textareaRest","value","onChange"],"mappings":";;;;;;AAsDA,IAAM,aAAA,GACJ,4cAAA;AAyBF,IAAM,QAAA,GAAiB,KAAA,CAAA,UAAA;AAAA,EACrB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,YAAA,EAAc,GAAG,MAAK,GAAI,KAAA;AAE7C,IAAA,MAAM,kBAAkB,YAAA,EAAa;AAGrC,IAAA,IAAI,iBAAiB,MAAA,EAAW;AAC9B,MAAA,MAAM,MAAA,GAAS,yBAAA,CAA0B,YAAA,EAAc,eAAe,CAAA;AAGtE,MAAA,IAAI,CAAC,MAAA,EAAQ;AACX,QAAA,MAAM,EAAE,KAAA,EAAO,EAAA,EAAI,UAAU,GAAA,EAAK,GAAGA,eAAa,GAAI,IAAA;AACtD,QAAA,uBACE,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,GAAA;AAAA,YACA,WAAA,EAAU,UAAA;AAAA,YACV,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,YACrC,GAAIA;AAAA;AAAA,SACP;AAAA,MAEJ;AAEA,MAAA,MAAM,EAAE,KAAA,EAAAC,MAAAA,GAAQ,EAAC,EAAG,UAAAC,SAAAA,EAAU,MAAA,EAAQ,GAAGF,aAAAA,EAAa,GAAI,IAAA;AAE1D,MAAA,uBACE,GAAA;AAAA,QAAC,iBAAA;AAAA,QAAA;AAAA,UACC,MAAA;AAAA,UACA,KAAA,EAAOC,MAAAA;AAAA,UACP,QAAA,EAAUC,cAAa,MAAM;AAAA,UAAC,CAAA,CAAA;AAAA,UAC9B,MAAA;AAAA,UAEC,QAAA,EAAA,CAAC,EAAE,KAAA,EAAO,WAAA,EAAa,UAAU,YAAA,EAAc,mBAAA,EAAqB,UAAS,qBAC5E,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,WAAA,EAAU,UAAA;AAAA,cACV,mBAAA,EAAiB,IAAA;AAAA,cACjB,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,cACtC,KAAA,EAAO,WAAA;AAAA,cACP,WAAA,EAAa,uBAAwBF,aAAAA,CAAmE,WAAA;AAAA,cACxG,UAAU,CAAC,CAAA,KAAM,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,cAC3C,GAAIA,aAAAA;AAAA,cACL,cAAA,EAAc,QAAA,IAAaA,aAAAA,CAAmE,cAAc,CAAA,IAAK;AAAA;AAAA;AACnH;AAAA,OAEJ;AAAA,IAEJ;AAGA,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,GAAG,cAAa,GAAI,IAAA;AAC7C,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAA,EAAU,UAAA;AAAA,QACV,SAAA,EAAW,EAAA,CAAG,aAAA,EAAe,SAAS,CAAA;AAAA,QACtC,KAAA;AAAA,QACA,QAAA;AAAA,QACC,GAAI;AAAA;AAAA,KACP;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-ZUBW2ERW.js","sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\nimport { TranslatableField } from './translatable-field';\nimport { useUILocales, resolveTranslatableConfig } from '../../providers/ui-provider';\nimport type { TranslatableConfig, TranslatableValue } from '../../providers/ui-provider';\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\ntype NativeTextareaProps = Omit<React.ComponentProps<'textarea'>, 'value' | 'onChange'>;\n\ninterface StandardTextareaProps extends NativeTextareaProps {\n  /** Translatable mode disabled (default). */\n  translatable?: never;\n  value?: string;\n  onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;\n}\n\ninterface TranslatableTextareaProps extends NativeTextareaProps {\n  /**\n   * Enable locale-switching tabs on this textarea.\n   * - `true` — inherit UIProvider's locale config\n   * - `object` — override locales/defaultLocale/fallbackLocale per field\n   *\n   * @example\n   * ```tsx\n   * // Uses UIProvider config\n   * <Textarea translatable value={val} onChange={setVal} />\n   *\n   * // Custom per-field config\n   * <Textarea\n   *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n   *   value={val}\n   *   onChange={setVal}\n   * />\n   * ```\n   */\n  translatable: TranslatableConfig;\n  value?: TranslatableValue;\n  onChange?: (value: TranslatableValue) => void;\n  /**\n   * Per-locale validation errors. Truthy string = that locale is invalid.\n   * The active locale's error is forwarded as `aria-invalid` on the textarea;\n   * all locale tabs with errors show a red dot indicator.\n   *\n   * @example `{ en: 'Required', vi: 'Too long (120/100)' }`\n   */\n  errors?: Partial<Record<string, string>>;\n}\n\nexport type TextareaProps = StandardTextareaProps | TranslatableTextareaProps;\n\n// ─── Base class ───────────────────────────────────────────────────────────────\n\nconst textareaClass =\n  \"resize-none border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-input-background px-3 py-2 text-base transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\";\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * Multi-line text input with auto-sizing via `field-sizing-content`.\n * Supports translatable mode via the `translatable` prop.\n *\n * @example\n * ```tsx\n * // Standard\n * <Textarea placeholder=\"Enter a description...\" />\n * <Textarea value={content} onChange={(e) => setContent(e.target.value)} />\n *\n * // Translatable — uses UIProvider's locale config\n * <Textarea translatable value={val} onChange={setVal} />\n *\n * // Translatable — custom config\n * <Textarea\n *   translatable={{ locales: { en: 'English', vi: 'Tiếng Việt' }, fallbackLocale: 'en' }}\n *   value={val}\n *   onChange={setVal}\n * />\n * ```\n */\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (props, ref) => {\n    const { className, translatable, ...rest } = props as TranslatableTextareaProps & { className?: string };\n\n    const providerLocales = useUILocales();\n\n    // ── Translatable mode ──────────────────────────────────────────────────\n    if (translatable !== undefined) {\n      const config = resolveTranslatableConfig(translatable, providerLocales);\n\n      // Fallback: if no locale config available, render standard textarea\n      if (!config) {\n        const { value: _v, onChange: _oc, ...textareaRest } = rest as TranslatableTextareaProps;\n        return (\n          <textarea\n            ref={ref}\n            data-slot=\"textarea\"\n            className={cn(textareaClass, className)}\n            {...(textareaRest as NativeTextareaProps)}\n          />\n        );\n      }\n\n      const { value = {}, onChange, errors, ...textareaRest } = rest as TranslatableTextareaProps;\n\n      return (\n        <TranslatableField\n          config={config}\n          value={value as TranslatableValue}\n          onChange={onChange ?? (() => {})}\n          errors={errors}\n        >\n          {({ value: localeValue, onChange: localeChange, fallbackPlaceholder, hasError }) => (\n            <textarea\n              ref={ref}\n              data-slot=\"textarea\"\n              data-translatable\n              className={cn(textareaClass, className)}\n              value={localeValue}\n              placeholder={fallbackPlaceholder ?? (textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>).placeholder}\n              onChange={(e) => localeChange(e.target.value)}\n              {...(textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>)}\n              aria-invalid={hasError || (textareaRest as React.TextareaHTMLAttributes<HTMLTextAreaElement>)['aria-invalid'] || undefined}\n            />\n          )}\n        </TranslatableField>\n      );\n    }\n\n    // ── Standard mode ──────────────────────────────────────────────────────\n    const { value, onChange, ...textareaRest } = rest as StandardTextareaProps;\n    return (\n      <textarea\n        ref={ref}\n        data-slot=\"textarea\"\n        className={cn(textareaClass, className)}\n        value={value}\n        onChange={onChange}\n        {...(textareaRest as NativeTextareaProps)}\n      />\n    );\n  },\n);\nTextarea.displayName = \"Textarea\";\n\nexport { Textarea };\n"]}

package/dist/components/domain/calendar/calendar-event-sheet.d.ts

@@ -1,4 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Locale } from 'date-fns';
 
 /** Extended event data shape for the detail sheet, including description, location, and attendees. */
 interface CalendarEventSheetEvent {
@@ -47,6 +48,8 @@ interface CalendarEventSheetProps {
     categoryStyles?: Record<string, string>;
     /** Localizable UI labels with English defaults. */
     labels?: CalendarEventSheetLabels;
+    /** date-fns Locale object for formatting dates. Falls back to UIProvider's `dateFnsLocale`. */
+    locale?: Locale;
 }
 /**
  * Side sheet that displays full event details including title, category badge,
@@ -63,6 +66,6 @@ interface CalendarEventSheetProps {
  * />
  * ```
  */
-declare function CalendarEventSheet({ event, open, onOpenChange, onDelete, categoryLabel, categoryStyles, labels: labelsProp, }: CalendarEventSheetProps): react_jsx_runtime.JSX.Element | null;
+declare function CalendarEventSheet({ event, open, onOpenChange, onDelete, categoryLabel, categoryStyles, labels: labelsProp, locale: localeProp, }: CalendarEventSheetProps): react_jsx_runtime.JSX.Element | null;
 
 export { CalendarEventSheet, type CalendarEventSheetEvent, type CalendarEventSheetLabels, type CalendarEventSheetProps };

package/dist/components/domain/calendar/calendar-event-sheet.js

@@ -1,4 +1,5 @@
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from '../../../chunk-VOLR236J.js';
+import { useDateFnsLocale } from '../../../chunk-VPTIRPZW.js';
 import { Separator } from '../../../chunk-KCUSO3CK.js';
 import { CalendarCategoryBadge } from '../../../chunk-IXEPDTUE.js';
 import '../../../chunk-5SAUUOCN.js';
@@ -20,9 +21,12 @@ function CalendarEventSheet({
   onDelete,
   categoryLabel,
   categoryStyles,
-  labels: labelsProp
+  labels: labelsProp,
+  locale: localeProp
 }) {
   const labels = { ...defaultLabels, ...labelsProp };
+  const contextLocale = useDateFnsLocale();
+  const locale = localeProp ?? contextLocale;
   if (!event) return null;
   const timeDisplay = event.allDay ? labels.allDay : `${format(event.start, "HH:mm")} - ${format(event.end, "HH:mm")}`;
   return /* @__PURE__ */ jsx(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsxs(SheetContent, { className: "sm:max-w-md", children: [
@@ -42,7 +46,7 @@ function CalendarEventSheet({
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 text-sm", children: [
           /* @__PURE__ */ jsx(Clock, { className: "w-4 h-4 text-muted-foreground flex-shrink-0" }),
           /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx("p", { className: "font-medium", children: format(event.start, "EEEE, MMMM d, yyyy") }),
+            /* @__PURE__ */ jsx("p", { className: "font-medium", children: format(event.start, "EEEE, MMMM d, yyyy", locale ? { locale } : void 0) }),
             /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: timeDisplay })
           ] })
         ] }),