@g4rcez/components 4.0.1 → 4.1.1

package/dist/{context-BFXNJVn2.js → use-translations-DSltA7H_.js}

@@ -1,6 +1,6 @@
-import { Fragment as g, createContext as h } from "react";
-import { jsxs as C } from "react/jsx-runtime";
-const y = {
+import { Fragment as h, createContext as C, useContext as y } from "react";
+import { jsxs as T } from "react/jsx-runtime";
+const $ = {
   hex: (e) => e,
   raw: (e) => e,
   hsl: (e) => `hsl(${e})`,
@@ -17,7 +17,7 @@ const y = {
     return l.concat(t(n, u, s));
   }
   return l.concat(i(n, t, a, s));
-}, []), $ = (e, t, a = "", r = "") => Object.entries(e).reduce((l, [o, n]) => {
+}, []), F = (e, t, a = "", r = "") => Object.entries(e).reduce((l, [o, n]) => {
   const s = r === "" ? `${a}${o}` : `${r}-${o}`;
   if (typeof n == "string") {
     const u = r === "" ? `${a}${o}` : o;
@@ -25,7 +25,7 @@ const y = {
   }
   return {
     ...l,
-    [o]: $(n, t, a, s)
+    [o]: F(n, t, a, s)
   };
 }, {}), p = {
   default: (e) => `:root { ${e} }`,
@@ -33,22 +33,22 @@ const y = {
 }, c = (e, t) => {
   const a = t.value || ((l, o) => o), r = e.map((l) => `${l.key}: ${a(l.key, l.value)}`).join(";");
   return t.result(r);
-}, S = {
+}, w = {
   default: (e) => c(e, { result: p.default }),
   dark: (e) => c(e, { result: p.dark })
 }, d = (e) => (t, a, r) => {
   const l = { key: `--${r}`, value: `${t}` };
   return e ? e(l) : l;
-}, T = (e) => ({ key: e.key.replace(/^--/, "--z-"), value: e.value }), b = (e, t) => {
-  const a = i(e.colors, d(t?.colors)), r = i(e.spacing, d(t?.spacing)), l = i(e.rounded, d(t?.rounded)), o = i(e.shadow, d(t?.rounded)), n = i(e.zIndex, d(t?.zIndex ?? T)), s = e.custom ? i(e.custom, d(t?.customTokens)) : [];
+}, m = (e) => ({ key: e.key.replace(/^--/, "--z-"), value: e.value }), b = (e, t) => {
+  const a = i(e.colors, d(t?.colors)), r = i(e.spacing, d(t?.spacing)), l = i(e.rounded, d(t?.rounded)), o = i(e.shadow, d(t?.rounded)), n = i(e.zIndex, d(t?.zIndex ?? m)), s = e.custom ? i(e.custom, d(t?.customTokens)) : [];
   return a.concat(r, l, s, n, o);
-}, w = (e, t) => c(b(e), {
+}, P = (e, t) => c(b(e), {
   result: (a) => `html${t ? `.${t}` : ""} {${a}}`,
   value: (a, r) => r.replace("hsla(", "").replace(")", "")
-}), f = (e, t) => b(e, t).reduce((r, l) => ({ ...r, [l.key]: l.value }), {}), P = (e, t) => c(b(e, t), {
+}), L = (e, t) => b(e, t).reduce((r, l) => ({ ...r, [l.key]: l.value }), {}), D = (e, t) => c(b(e, t), {
   result: (a) => `html${t?.name ? `.${t.name}` : ""} {${a}}`,
   value: (a, r) => r
-}), F = {
+}), g = {
   autocompleteEmpty: "Nothing here...",
   calendarBackMonth: "Back month",
   calendarFromDate: "From",
@@ -108,7 +108,7 @@ const y = {
   tableFilterValueTitle: "Value",
   tableGroupLabel: "Group",
   tableGroupLabelWithCount: "Group",
-  tablePaginationFooter: (e) => /* @__PURE__ */ C(g, { children: [
+  tablePaginationFooter: (e) => /* @__PURE__ */ T(h, { children: [
     e.current,
     " to ",
     e.pages,
@@ -135,27 +135,35 @@ const y = {
   uploadIdleButton: "Choose your files",
   uploadDragging: (e) => `Dragging ${e.n} ${e.n > 0 ? "files" : "file"}`,
   uploadDialogTitle: "Details of your file",
-  datepickerPlaceholder: (e) => "day/month/year"
-}, m = {
+  datepickerPlaceholder: (e) => "day/month/year",
+  spinnerLoading: "Loading",
+  skeletonLoading: "Loading content",
+  closeButton: "Close",
+  fileUploadZoneLabel: "File upload area. Drag files here or press Enter to browse."
+}, v = {
   input: { iconFeedback: !0 },
   table: { operations: !0, sorters: !0, filters: !0, sticky: void 0 }
-}, D = h({
-  parser: y.hsla,
-  tweaks: m,
+}, k = C({
+  parser: $.hsla,
+  tweaks: v,
   floatingRef: void 0,
-  map: F,
+  map: g,
   locale: void 0
-});
+}), N = () => {
+  const e = y(k);
+  return e ? e.map : g;
+};
 export {
-  D as C,
-  m as a,
-  S as b,
-  $ as c,
-  F as d,
-  w as e,
-  f,
-  P as g,
-  y as p,
-  i as r
+  k as C,
+  v as a,
+  w as b,
+  F as c,
+  g as d,
+  P as e,
+  L as f,
+  D as g,
+  $ as p,
+  i as r,
+  N as u
 };
-//# sourceMappingURL=context-BFXNJVn2.js.map
+//# sourceMappingURL=use-translations-DSltA7H_.js.map

package/dist/use-translations-DSltA7H_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-translations-DSltA7H_.js","sources":["../src/styles/design-tokens.ts","../src/config/default-translations.tsx","../src/config/default-tweaks.ts","../src/config/context.ts","../src/hooks/use-translations.ts"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { DesignTokens, DesignTokensBuilder, DesignTokensParser, GeneralTokens, Token } from \"./theme.types\";\n\nexport const parsers = {\n    hex: (v: string) => v,\n    raw: (v: string) => v,\n    hsl: (v: string) => `hsl(${v})` as const,\n    rgb: (v: string) => `rgb(${v})` as const,\n    z: (_, __, k) => `var(--z-${k})` as const,\n    hsla: (v: string) => `hsla(${v})` as const,\n    rgba: (v: string) => `rgba(${v})` as const,\n    cssVariable: (_, __, k) => `var(--${k})` as const,\n    formatWithVar: (format: string) => (_: string, __: string, v: string) => `${format}(var(--${v}), <alpha-value>)` as const,\n} satisfies Record<string, DesignTokensParser>;\n\nexport const reduceTokens = <T extends GeneralTokens>(colors: T, parse: DesignTokensBuilder, prefix: string = \"\", append: string = \"\"): Token[] =>\n    Object.entries(colors).reduce<Token[]>((acc, [key, value]) => {\n        const combine = append === \"\" ? `${prefix}${key}` : `${append}-${key}`;\n        if (typeof value === \"string\") {\n            const k = append === \"\" ? `${prefix}${key}` : key;\n            return acc.concat(parse(value, k, combine));\n        }\n        return acc.concat(reduceTokens(value, parse, prefix, combine));\n    }, []);\n\nexport const createDesignTokens = <T extends GeneralTokens, Fn extends DesignTokensParser>(\n    colors: T,\n    parse: Fn,\n    prefix: string = \"\",\n    append: string = \"\"\n): T =>\n    Object.entries(colors).reduce<T>((acc, [key, value]) => {\n        const combine = append === \"\" ? `${prefix}${key}` : `${append}-${key}`;\n        if (typeof value === \"string\") {\n            const k = append === \"\" ? `${prefix}${key}` : key;\n            return { ...acc, [k]: parse(value, key, combine) };\n        }\n        return {\n            ...acc,\n            [key]: createDesignTokens(value, parse, prefix, combine),\n        };\n    }, {} as T);\n\nconst modifiers = {\n    default: (variables: string) => `:root { ${variables} }`,\n    dark: (variables: string) => `html.dark {${variables}}`,\n};\n\nconst createStyleContent = (\n    tokens: Token[],\n    modifiers: {\n        result: (str: string) => string;\n        value?: (k: string, v: string) => string;\n    }\n) => {\n    const v = modifiers.value || ((_: string, s: string) => s);\n    const content = tokens.map((token) => `${token.key}: ${v(token.key, token.value)}`).join(\";\");\n    return modifiers.result(content);\n};\n\nexport const createStyles = {\n    default: (tokens: Token[]) => createStyleContent(tokens, { result: modifiers.default }),\n    dark: (tokens: Token[]) => createStyleContent(tokens, { result: modifiers.dark }),\n};\n\ntype TokenParsersType = \"colors\" | \"spacing\" | \"rounded\" | \"customTokens\" | \"zIndex\";\n\ntype TokenCustomParser = (t: Token) => Token;\n\nexport type TokenRemap = Partial<Record<TokenParsersType, TokenCustomParser> & { name: string }>;\n\nconst fn =\n    (p?: TokenCustomParser): DesignTokensBuilder =>\n    (value, _, key) => {\n        const r = { key: `--${key}`, value: `${value}` };\n        return p ? p(r) : r;\n    };\n\nconst zIndexParser = (t: Token): Token => ({ key: t.key.replace(/^--/, \"--z-\"), value: t.value });\n\nconst createTokens = (theme: DesignTokens, map?: TokenRemap) => {\n    const colors = reduceTokens(theme.colors, fn(map?.colors));\n    const spacing = reduceTokens(theme.spacing, fn(map?.spacing));\n    const rounded = reduceTokens(theme.rounded, fn(map?.rounded));\n    const shadow = reduceTokens(theme.shadow, fn(map?.rounded));\n    const zIndex = reduceTokens(theme.zIndex, fn(map?.zIndex ?? zIndexParser));\n    const customTokens = theme.custom ? reduceTokens(theme.custom, fn(map?.customTokens)) : [];\n    return colors.concat(spacing, rounded, customTokens, zIndex, shadow);\n};\n\nexport const createTheme = (theme: DesignTokens, name?: string) =>\n    createStyleContent(createTokens(theme), {\n        result: (variables: string) => `html${name ? `.${name}` : \"\"} {${variables}}`,\n        value: (_, v) => v.replace(\"hsla(\", \"\").replace(\")\", \"\"),\n    });\n\nexport const createCssProperties = (theme: DesignTokens, map?: TokenRemap): CSSProperties => {\n    const tokens = createTokens(theme, map);\n    return tokens.reduce<CSSProperties>((acc, el) => ({ ...acc, [el.key]: el.value }), {});\n};\n\nexport const createTokenStyles = (theme: DesignTokens, map?: TokenRemap) =>\n    createStyleContent(createTokens(theme, map), {\n        result: (variables: string) => `html${map?.name ? `.${map.name}` : \"\"} {${variables}}`,\n        value: (_, v) => v,\n    });\n","import React, { Fragment } from \"react\";\n\nexport const defaultTranslations = {\n    autocompleteEmpty: \"Nothing here...\",\n    calendarBackMonth: \"Back month\",\n    calendarFromDate: \"From\",\n    calendarMonthLabel: \"Month\",\n    calendarNextMonth: \"Next month\",\n    calendarDatetimeTitle: \"Time\",\n    calendarToDate: \"To\",\n    calendarToday: \"Today\",\n    pageCalendarMonthView: \"Month view\",\n    pageCalendarWeekView: \"Week view\",\n    pageCalendarDayView: \"Day view\",\n    pageCalendarPrevious: \"Previous\",\n    pageCalendarNext: \"Next\",\n    pageCalendarToday: \"Today\",\n    pageCalendarAddEvent: \"Add event\",\n    pageCalendarWeekLabel: (n: number) => `Week ${n}`,\n    pageCalendarFilter: \"Filter:\",\n    pageCalendarMoreEvents: (n: number) => `+${n} more...`,\n    pageCalendarLabel: \"Calendar\",\n    pageCalendarNavigation: \"Calendar navigation\",\n    pageCalendarMonthGrid: \"Calendar month\",\n    pageCalendarFilterEnabled: \"enabled\",\n    pageCalendarFilterDisabled: \"disabled\",\n    pageCalendarEventCount: (n: number) => (n === 1 ? \"1 event\" : `${n} events`),\n    pageCalendarEventAt: (title: string, time: string) => `${title} at ${time}`,\n    commandPaletteEmpty: \"Nothing here...\",\n    commandPaletteLoading: \"Loading...\",\n    datePickerCalendarButtonLabel: \"Click to open a date picker\",\n    emptyDataMessage: \"No data\",\n    inputCaretDown: \"Click to see all options\",\n    inputCloseValue: \"Click to clear the value\",\n    inputOptionalLabel: \"Optional\",\n    wizardNext: \"Next\",\n    wizardPrev: \"Previous\",\n    wizardFinish: \"Finish\",\n    wizardSkip: \"Skip\",\n    multiSelectInnerPlaceholder: \"Search...\",\n    multiSelectSelectedLabel: \"Selected\",\n    tableColumnResizer: \"Resize column\",\n    tableFilterColumnPlaceholder: \"Filter by\",\n    tableFilterColumnTitle: \"Filter by\",\n    tableFilterDropdownTitle: \"Filters\",\n    tableFilterDropdownTitleUnique: \"Filter by\",\n    tableFilterLabel: \"Filters\",\n    tableFilterNewFilter: \"New filter\",\n    tableFilterOperatorPlaceholder: \"Equals to...\",\n    tableFilterOperatorTitle: \"Operation\",\n    tableFilterTypeContains: \"Contains\",\n    tableFilterTypeEndsWith: \"Ends with\",\n    tableFilterTypeGreaterThan: \"Greater than\",\n    tableFilterTypeIs: \"Is\",\n    tableFilterTypeIsNot: \"Is not\",\n    tableFilterTypeLessThan: \"Less than\",\n    tableFilterTypeNotContains: \"Not contains\",\n    tableFilterTypeStartsWith: \"Starts with\",\n    tableFilterValuePlaceholder: \"Something...\",\n    tableFilterValueTitle: \"Value\",\n    tableGroupLabel: \"Group\",\n    tableGroupLabelWithCount: \"Group\",\n    tablePaginationFooter: (pagination: { pages: number; totalItems: number; sizes?: number[]; current: number; select: React.ReactNode }) => (\n        <Fragment>\n            {pagination.current} to {pagination.pages} of {pagination.totalItems} items.{Array.isArray(pagination.sizes) ? pagination.select : null}{\" \"}\n            per page.\n        </Fragment>\n    ),\n    tablePaginationNext: \"Next\",\n    tablePaginationPrevious: \"Previous\",\n    tablePaginationSelectLabel: \"Select the size of page\",\n    tableSortAddButton: \"Add sort\",\n    tableSortAsc: \"Ascending\",\n    tableSortDesc: \"Descending\",\n    tableSortDropdownTitle: \"Order by\",\n    tableSortOrderByLabel: \"Order by\",\n    tableSortOrderInputPlaceholder: \"Order by\",\n    tableSortOrderInputTitle: \"Order by\",\n    tableSortTypeInputPlaceholder: \"Ascending\",\n    tableSortTypeInputTitle: \"Sort type\",\n\n    uploadIdle: \"You can drag your files here\",\n    uploadIdleButton: \"Choose your files\",\n    uploadDragging: (props: { n: number }) => `Dragging ${props.n} ${props.n > 0 ? \"files\" : \"file\"}`,\n    uploadDialogTitle: \"Details of your file\",\n\n    datepickerPlaceholder: (_: string) => \"day/month/year\",\n    spinnerLoading: \"Loading\",\n    skeletonLoading: \"Loading content\",\n    closeButton: \"Close\",\n    fileUploadZoneLabel: \"File upload area. Drag files here or press Enter to browse.\",\n};\n\nexport type Translations = typeof defaultTranslations;\n","export type Tweaks = {\n    table: {\n        sorters: boolean;\n        filters: boolean;\n        operations: boolean;\n        sticky: number | undefined;\n    };\n    input: {\n        iconFeedback: boolean;\n    };\n};\n\nexport const defaultTweaks: Tweaks = {\n    input: { iconFeedback: true },\n    table: { operations: true, sorters: true, filters: true, sticky: undefined },\n};\n","\"use client\";\nimport { createContext } from \"react\";\nimport type { IconProps } from \"@phosphor-icons/react\";\nimport type { Locales } from \"the-mask-input\";\nimport type { ContextType } from \"../hooks/use-components-provider\";\nimport { parsers } from \"../styles/design-tokens\";\nimport { defaultTranslations, type Translations } from \"./default-translations\";\nimport { defaultTweaks, type Tweaks } from \"./default-tweaks\";\n\nexport type ContextProps = Partial<{\n    tweaks: Partial<Tweaks>;\n    map: Partial<Translations>;\n    locale: Locales | undefined;\n    parser: typeof parsers.hsla;\n    rootFloating?: HTMLElement | null;\n    iconWeight: IconProps[\"weight\"];\n}>;\n\nexport const Context = createContext<ContextType>({\n    parser: parsers.hsla,\n    tweaks: defaultTweaks,\n    floatingRef: undefined,\n    map: defaultTranslations,\n    locale: undefined as Locales | undefined,\n});\n","import { useContext } from \"react\";\nimport { Context } from \"../config/context\";\nimport { defaultTranslations } from \"../config/default-translations\";\n\nexport const useTranslations = () => {\n    const ctx = useContext(Context);\n    if (!ctx) return defaultTranslations;\n    return ctx.map!;\n};\n"],"names":["parsers","v","_","__","k","format","reduceTokens","colors","parse","prefix","append","acc","key","value","combine","createDesignTokens","modifiers","variables","createStyleContent","tokens","s","content","token","createStyles","fn","p","r","zIndexParser","t","createTokens","theme","map","spacing","rounded","shadow","zIndex","customTokens","createTheme","name","createCssProperties","el","createTokenStyles","defaultTranslations","n","title","time","pagination","jsxs","Fragment","props","defaultTweaks","Context","createContext","useTranslations","ctx","useContext"],"mappings":"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"}

package/package.json

@@ -1,99 +1,42 @@
 {
     "name": "@g4rcez/components",
-    "description": "Customizable react components.",
-    "version": "4.0.1",
-    "sideEffects": false,
+    "version": "4.1.1",
     "private": false,
-    "packageManager": "pnpm@10.12.3",
-    "license": "MIT",
-    "engines": {
-        "node": ">=20.14.0"
+    "description": "Customizable react components.",
+    "keywords": [
+        "agent-skill",
+        "ai-agents",
+        "claude-skill",
+        "components",
+        "design-system",
+        "react",
+        "skill",
+        "tailwindcss"
+    ],
+    "homepage": "https://github.com/g4rcez/components#readme",
+    "bugs": {
+        "url": "https://github.com/g4rcez/components/issues"
     },
+    "license": "MIT",
     "author": {
-        "email": "allan.f.garcez@gmail.com",
         "name": "Allan Garcez",
+        "email": "allan.f.garcez@gmail.com",
         "url": "https://garcez.dev"
     },
-    "bugs": {
-        "url": "https://github.com/g4rcez/components/issues"
-    },
     "repository": {
-        "url": "https://github.com/g4rcez/components",
-        "type": "git"
-    },
-    "scripts": {
-        "watch": "vite build --watch --minify false",
-        "prepublishOnly": "npm run build",
-        "build": "rm -rf ./dist; vite build; npm run lib:types; npm run preset; npm run lib:css; cp -r ai dist",
-        "format": "npx prettier --write .",
-        "lib:css": "BUILD_LIB=true tailwind -i ./src/index.css -o ./dist/index.css --minify",
-        "lib:tailwind": "tsc -p tsconfig.tailwind.json",
-        "lib:types": "tsc -p tsconfig.lib.json",
-        "preset": "tsc -p tsconfig.styles.json && tsc -p tsconfig.tailwind.json",
-        "test": "vitest run",
-        "test:watch": "vitest watch"
-    },
-    "peerDependencies": {
-        "react": ">=18",
-        "react-dom": ">=18"
-    },
-    "dependencies": {
-        "@base-ui/react": "1.2.0",
-        "@floating-ui/react": "0.27.18",
-        "@phosphor-icons/react": "2.1.10",
-        "class-variance-authority": "0.7.1",
-        "clsx": "2.1.1",
-        "date-fns": "4.1.0",
-        "linq-arrays": "3.2.5",
-        "motion": "12.34.3",
-        "pretty-bytes": "7.1.0",
-        "qs": "6.15.0",
-        "react-dropzone": "15.0.0",
-        "react-use-measure": "2.1.7",
-        "react-virtuoso": "4.18.1",
-        "sidekicker": "0.1.10",
-        "storage-manager-js": "4.2.6-5",
-        "tailwind-merge": "3.4.0",
-        "the-mask-input": "3.3.13",
-        "use-typed-reducer": "4.3.0",
-        "zod": "3.25.67"
-    },
-    "devDependencies": {
-        "@eslint/js": "9.39.2",
-        "@tailwindcss/forms": "0.5.11",
-        "@testing-library/jest-dom": "^6.9.1",
-        "@testing-library/react": "^16.3.2",
-        "@types/node": "25.3.1",
-        "@types/qs": "6.14.0",
-        "@types/react": "19.2.14",
-        "@types/react-dom": "19.2.3",
-        "@vitejs/plugin-react": "5.1.4",
-        "eslint": "10.0.2",
-        "eslint-config-react-app": "7.0.1",
-        "eslint-plugin-jsx-a11y": "6.10.2",
-        "eslint-plugin-react-hooks": "7.0.1",
-        "eslint-plugin-react-refresh": "0.4.20",
-        "globals": "17.3.0",
-        "jsdom": "^28.1.0",
-        "postcss": "8.5.6",
-        "prettier": "3.8.1",
-        "tailwindcss": "3.4.14",
-        "tslib": "2.8.1",
-        "typescript": "5.9.3",
-        "typescript-eslint": "8.35.0",
-        "vite": "7.3.1",
-        "vite-tsconfig-paths": "6.1.1",
-        "vitest": "4.0.18"
+        "type": "git",
+        "url": "https://github.com/g4rcez/components"
     },
     "source": "./src/index.ts",
-    "types": "./dist/index.d.ts",
-    "main": "./dist/index.js",
-    "module": "./dist/index.js",
     "files": [
         "dist",
         "dist/index.css",
-        "dist/ai"
+        "ai"
     ],
+    "sideEffects": false,
+    "main": "./dist/index.js",
+    "module": "./dist/index.js",
+    "types": "./dist/index.d.ts",
     "exports": {
         ".": {
             "types": {
@@ -152,12 +95,6 @@
             "require": "./dist/components/form/form.js",
             "default": "./dist/components/form/form.js"
         },
-        "./transfer-list": {
-            "type": "./dist/components/form/transfer-list.d.ts",
-            "import": "./dist/components/form/transfer-list.js",
-            "require": "./dist/components/form/transfer-list.js",
-            "default": "./dist/components/form/transfer-list.js"
-        },
         "./radiobox": {
             "type": "./dist/components/form/radiobox.d.ts",
             "import": "./dist/components/form/radiobox.js",
@@ -296,6 +233,82 @@
             "require": "./dist/components/display/alert.js",
             "default": "./dist/components/display/alert.js"
         },
-        "./ai/*": "./**"
+        "./ai/*": "./ai/*"
+    },
+    "scripts": {
+        "watch": "vite build --watch --minify false",
+        "prepublishOnly": "npm run build",
+        "build": "rm -rf ./dist; vite build; npm run lib:types; npm run preset; npm run lib:css",
+        "format": "oxfmt --write .",
+        "lint": "oxlint .",
+        "lib:css": "BUILD_LIB=true tailwind -i ./src/index.css -o ./dist/index.css --minify",
+        "lib:tailwind": "tsc -p tsconfig.tailwind.json",
+        "lib:types": "tsc -p tsconfig.lib.json",
+        "preset": "tsc -p tsconfig.styles.json && tsc -p tsconfig.tailwind.json",
+        "test": "vitest run",
+        "test:watch": "vitest watch"
+    },
+    "dependencies": {
+        "@base-ui/react": "1.2.0",
+        "@floating-ui/react": "0.27.18",
+        "@phosphor-icons/react": "2.1.10",
+        "class-variance-authority": "0.7.1",
+        "clsx": "2.1.1",
+        "date-fns": "4.1.0",
+        "linq-arrays": "3.2.5",
+        "motion": "12.34.3",
+        "pretty-bytes": "7.1.0",
+        "qs": "6.15.0",
+        "react-dropzone": "15.0.0",
+        "react-use-measure": "2.1.7",
+        "react-virtuoso": "4.18.1",
+        "sidekicker": "0.1.10",
+        "storage-manager-js": "4.2.6-5",
+        "tailwind-merge": "3.4.0",
+        "the-mask-input": "3.3.13",
+        "use-typed-reducer": "4.3.0",
+        "zod": "3.25.67"
+    },
+    "devDependencies": {
+        "@tailwindcss/forms": "0.5.11",
+        "@testing-library/jest-dom": "^6.9.1",
+        "@testing-library/react": "^16.3.2",
+        "@types/node": "25.3.1",
+        "@types/qs": "6.14.0",
+        "@types/react": "19.2.14",
+        "@types/react-dom": "19.2.3",
+        "@vitejs/plugin-react": "5.1.4",
+        "jsdom": "^28.1.0",
+        "postcss": "8.5.6",
+        "tailwindcss": "3.4.14",
+        "tslib": "2.8.1",
+        "typescript": "5.9.3",
+        "vite": "7.3.1",
+        "vite-tsconfig-paths": "6.1.1",
+        "vitest": "4.0.18"
+    },
+    "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+    },
+    "engines": {
+        "node": ">=20.14.0"
+    },
+    "packageManager": "pnpm@10.12.3",
+    "agents": {
+        "skills": [
+            {
+                "name": "g4rcez-components",
+                "path": "./ai/SKILL.md",
+                "docs": "./ai/docs/index.md",
+                "version": "1"
+            }
+        ]
+    },
+    "skill": {
+        "name": "g4rcez-components",
+        "path": "./ai/SKILL.md",
+        "docs": "./ai/docs/index.md",
+        "version": "1"
     }
 }

package/dist/ai/SKILL.md

@@ -1,266 +0,0 @@
----
-name: g4rcez-components
-description: >
-  Use when: setting up @g4rcez/components in a new project, migrating native
-  HTML elements or hand-rolled UI to this design system, building any React UI
-  that should use @g4rcez/components, or when the user's project already has
-  @g4rcez/components as a dependency. Covers installation, Tailwind preset,
-  theming with createTokenStyles/TokenRemap, ComponentsProvider/tweaks,
-  parsers, the full component catalog (components, hooks, React, UI,
-  design-system, tokens, Tailwind, forms, modals, notifications, tables,
-  calendar, theming), and native-element migration.
----
-
-# @g4rcez/components — Agent Skill
-
-A React design system built on Tailwind CSS and design tokens. This skill covers
-installation, Tailwind preset setup, theming APIs, conventions, the full
-component catalog, and migration from native HTML patterns.
-
----
-
-## 1 — Package Structure & Installation
-
-```bash
-pnpm add @g4rcez/components
-```
-
-When installed in `node_modules`, the package follows this structure:
-- `node_modules/@g4rcez/components/dist/` — Compiled JS/TS and CSS.
-- `node_modules/@g4rcez/components/index.css` — Main stylesheet.
-- `node_modules/@g4rcez/components/ai/` — This skill and detailed markdown documentation.
-- `node_modules/@g4rcez/components/ai/docs/` — Component-specific documentation files.
-
-### Tailwind Preset (recommended)
-
-Add the library preset in your `tailwind.config.ts` (or `.js`). The preset
-wires all design tokens as Tailwind utilities.
-
-```ts
-// tailwind.config.ts
-import preset from "@g4rcez/components/preset.tailwind";
-
-export default {
-  presets: [preset],
-  content: [
-    "./src/**/*.{ts,tsx}",
-    // include node_modules so Tailwind scans the library's classes:
-    "./node_modules/@g4rcez/components/dist/**/*.js",
-  ],
-};
-```
-
-### Theme class (required)
-
-Apply `light` or `dark` on your root element:
-
-```tsx
-<html className="light">…</html>
-// or
-<html className="dark">…</html>
-```
-
-### ComponentsProvider (optional, mandatory for dark-mode)
-
-Wrap your app root to enable i18n strings, locale-aware masks, and the
-programmatic `Modal.confirm` utility:
-
-```tsx
-import { ComponentsProvider } from "@g4rcez/components";
-
-export default function App({ children }) {
-  return (
-    <ComponentsProvider locale="en-US">
-      {children}
-    </ComponentsProvider>
-  );
-}
-```
-
----
-
-## 2 — Theme Setup with createTokenStyles
-
-Use `createTokenStyles` to generate scoped CSS strings for light and dark
-themes, then inject them into `<head>`.
-
-### API
-
-```ts
-import {
-  createTokenStyles,
-  createCssProperties,
-  type TokenRemap,
-} from "@g4rcez/components";
-```
-
-| Function | Signature | Returns |
-|----------|-----------|---------|
-| `createTokenStyles` | `(theme: DesignTokens, map?: TokenRemap) => string` | Scoped CSS string, e.g. `html { --primary: … }` |
-| `createCssProperties` | `(theme: DesignTokens, map?: TokenRemap) => CSSProperties` | Inline style object with CSS custom properties |
-
-- When `map.name` is set (e.g. `"dark"`), the output is scoped to
-  `html.dark { … }` instead of `html { … }`.
-- Use `createTokenStyles` for `<style>` injection; use `createCssProperties`
-  for inline `style` props.
-
-### Two-theme pattern (light + dark)
-
-```tsx
-import {
-  createTokenStyles,
-  type TokenRemap,
-  defaultLightTheme,
-  defaultDarkTheme,
-} from "@g4rcez/components";
-
-const tokenRemap: TokenRemap = {
-  colors: (t) => {
-    // Strip hsla( prefix and ) suffix for Tailwind opacity utility support
-    t.value = t.value.replace("hsla(", "").replace(/\)$/, "");
-    return t;
-  },
-};
-
-const stylesLight = createTokenStyles(defaultLightTheme, tokenRemap);
-const stylesDark  = createTokenStyles(defaultDarkTheme, {
-  ...tokenRemap,
-  name: "dark", // scopes output to html.dark { … }
-});
-
-// In your layout:
-export default function RootLayout({ children }) {
-  return (
-    <html lang="en">
-      <head>
-        <style dangerouslySetInnerHTML={{ __html: stylesLight }} />
-        <style dangerouslySetInnerHTML={{ __html: stylesDark }} />
-      </head>
-      <body>{children}</body>
-    </html>
-  );
-}
-```
-
----
-
-## 3 — TokenRemap
-
-`TokenRemap` lets you transform each design token value before it is emitted
-as a CSS custom property.
-
-```ts
-export type TokenRemap = Partial<
-  Record<
-    "colors" | "spacing" | "rounded" | "customTokens" | "zIndex",
-    (t: Token) => Token
-  > & { name: string }
->;
-```
-
-### Why strip `hsla(…)` in the colors transformer
-
-Tailwind v4 opacity utilities (e.g. `bg-primary/50`) expect raw channel values
-like `210 40% 60%` — not a wrapped `hsla(210 40% 60%)`.
-
----
-
-## 4 — ComponentsProvider & Tweaks
-
-```tsx
-import { ComponentsProvider, type Tweaks, parsers } from "@g4rcez/components";
-
-const tweaks: Tweaks = {
-  table: {
-    sorters:    true,   // show/hide column sort controls
-    filters:    true,   // show/hide column filter controls
-    operations: true,   // show/hide table operation buttons
-    sticky:     55,     // px offset for sticky header
-  },
-};
-
-<ComponentsProvider
-  locale="en-US"
-  tweaks={tweaks}
-  parser={parsers.hsla}
->
-  {children}
-</ComponentsProvider>
-```
-
----
-
-## 5 — Key Conventions
-
-### Never use raw Tailwind color classes
-
-```tsx
-// ❌ Wrong
-<div className="bg-blue-500 text-white">…</div>
-
-// ✅ Right — use design-token classes
-<div className="bg-primary text-primary-foreground">…</div>
-```
-
-### Always use component `theme` / `variant` props
-
-```tsx
-// ❌ Wrong
-<button className="bg-red-600 text-white">Delete</button>
-
-// ✅ Right
-<Button theme="danger">Delete</Button>
-```
-
----
-
-## 6 — Component Catalog
-
-### Import paths
-
-The library supports both barrel imports and sub-path imports for better tree-shaking.
-
-| Component | Main Export | Sub-path Export |
-|-----------|-------------|-----------------|
-| `Button` | `@g4rcez/components` | `@g4rcez/components/button` |
-| `Input` | `@g4rcez/components` | `@g4rcez/components/input` |
-| `Modal` | `@g4rcez/components` | `@g4rcez/components/modal` |
-| `Table` | `@g4rcez/components` | `@g4rcez/components/table` |
-| `Select` | `@g4rcez/components` | `@g4rcez/components/select` |
-
-See `node_modules/@g4rcez/components/ai/docs/index.md` for the full list of exports.
-
----
-
-## 7 — Migration Guide
-
-Use this table when migrating native HTML elements to library equivalents.
-
-| Native / custom pattern | Library replacement |
-|-------------------------|---------------------|
-| `<button>` | `Button` |
-| `<input type="text">` | `Input` |
-| `<input type="date">` | `DatePicker` |
-| `<input type="checkbox">` | `Checkbox` |
-| `<select>` | `Select` |
-| Custom modal / dialog | `Modal` (type `"dialog"`) |
-| Side panel / drawer | `Modal` (type `"drawer"`) |
-| Toast / notifications | `Notifications` |
-| Data table | `Table` |
-
----
-
-## 8 — Where to Find Detailed Docs
-
-For any specific component, read its doc file for full props, design tokens,
-and usage examples. These files are located within the package in `node_modules`:
-
-`node_modules/@g4rcez/components/ai/docs/<ComponentName>.md`
-
-**Examples:**
-- `node_modules/@g4rcez/components/ai/docs/Button.md`
-- `node_modules/@g4rcez/components/ai/docs/Input.md`
-- `node_modules/@g4rcez/components/ai/docs/Modal.md`
-- `node_modules/@g4rcez/components/ai/docs/Table.md`
-- `node_modules/@g4rcez/components/ai/docs/Form.md`
-