@noxickon/onyx 2.0.3 → 3.0.0

package/dist/utils/builder/test/buildMailTo.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/builder/test/buildUrl.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/cn/index.d.ts

@@ -0,0 +1 @@
+export { cn } from './src/cn';

package/dist/utils/cn/src/cn.d.ts

@@ -0,0 +1,2 @@
+import { ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;

package/dist/utils/cn/test/cn.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/copyToClipboard/index.d.ts

@@ -0,0 +1 @@
+export { copyToClipboard } from './src/copyToClipboard';

package/dist/utils/copyToClipboard/src/copyToClipboard.d.ts

@@ -0,0 +1 @@
+export declare function copyToClipboard(text: string): Promise<boolean>;

package/dist/utils/copyToClipboard/test/copyToClipboard.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/createId/index.d.ts

@@ -0,0 +1,2 @@
+export type * from './src/createId.types';
+export { createId, generateRandomString } from './src/createId';

package/dist/utils/createId/src/createId.d.ts

@@ -0,0 +1,3 @@
+import { OxCreateIdFunction } from './createId.types';
+export declare const generateRandomString: (length: number) => string;
+export declare const createId: OxCreateIdFunction;

package/dist/utils/createId/src/createId.types.d.ts

@@ -0,0 +1,10 @@
+export interface OxCreateIdOptions {
+    length?: number;
+    separator?: string;
+}
+export type OxCreateIdFunction = {
+    (): string;
+    (prefix: string): string;
+    (prefix: string, options: OxCreateIdOptions): string;
+    (options: OxCreateIdOptions): string;
+};

package/dist/utils/createId/test/createId.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/errorHelper/index.d.ts

@@ -0,0 +1,2 @@
+export type * from './src/errorHelper.types';
+export { handleFormErrors, handleGraphQLFormErrors, parseGraphQLErrors } from './src/errorHelper';

package/dist/utils/errorHelper/src/errorHelper.d.ts

@@ -0,0 +1,4 @@
+import { OxFormState, OxGraphQLError, OxParsedError } from './errorHelper.types';
+export declare const parseGraphQLErrors: (errors: OxGraphQLError[]) => OxParsedError[];
+export declare const handleFormErrors: (errors: OxParsedError[], formState: OxFormState) => void;
+export declare const handleGraphQLFormErrors: (errors: OxGraphQLError[], formState: OxFormState) => void;

package/dist/utils/errorHelper/src/errorHelper.types.d.ts

@@ -0,0 +1,17 @@
+export interface OxParsedError {
+    code: string;
+    field?: string;
+    message: string;
+    path?: string[];
+}
+export interface OxGraphQLError {
+    extensions?: {
+        code?: string;
+        field?: string;
+    };
+    message: string;
+    path?: string[];
+}
+export interface OxFormState {
+    setError: (field: string, message: string) => void;
+}

package/dist/utils/errorHelper/test/errorHelper.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/formatter/index.d.ts

@@ -0,0 +1,6 @@
+export type * from './src/formatter.types';
+export { formatBytes } from './src/formatBytes';
+export { formatCurrency } from './src/formatCurrency';
+export { formatDate } from './src/formatDate';
+export { formatNumber } from './src/formatNumber';
+export { formatTimestamp } from './src/formatTimestamp';

package/dist/utils/formatter/src/formatBytes.d.ts

@@ -0,0 +1,2 @@
+import { OxFormatBytesOptions } from './formatter.types';
+export declare function formatBytes(bytes: number, options?: OxFormatBytesOptions): string;

package/dist/utils/formatter/src/formatCurrency.d.ts

@@ -0,0 +1,2 @@
+import { OxFormatCurrencyOptions } from './formatter.types';
+export declare function formatCurrency(amount: number, options?: OxFormatCurrencyOptions): string;

package/dist/utils/formatter/src/formatDate.d.ts

@@ -0,0 +1,2 @@
+import { OxFormatDateOptions } from './formatter.types';
+export declare function formatDate(date: Date | string | number, options?: OxFormatDateOptions): string;

package/dist/utils/formatter/src/formatNumber.d.ts

@@ -0,0 +1,2 @@
+import { OxFormatNumberOptions } from './formatter.types';
+export declare function formatNumber(number_: number, options?: OxFormatNumberOptions): string;

package/dist/utils/formatter/src/formatTimestamp.d.ts

@@ -0,0 +1 @@
+export declare const formatTimestamp: (date: Date) => string;

package/dist/utils/formatter/src/formatter.types.d.ts

@@ -0,0 +1,18 @@
+export interface OxFormatCurrencyOptions {
+    currency?: string;
+    locale?: string;
+}
+export interface OxFormatDateOptions {
+    format?: 'short' | 'medium' | 'long' | 'full';
+    locale?: string;
+}
+export interface OxFormatNumberOptions {
+    compact?: boolean;
+    decimals?: number;
+    locale?: string;
+}
+export interface OxFormatBytesOptions {
+    binary?: boolean;
+    decimals?: number;
+    locale?: string;
+}

package/dist/utils/formatter/test/formatBytes.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/formatter/test/formatCurrency.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/formatter/test/formatDate.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/formatter/test/formatNumber.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/formatter/test/formatTimestamp.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/hasDataSlot/index.d.ts

@@ -0,0 +1 @@
+export * from './src/hasDataSlot';

package/dist/utils/hasDataSlot/src/hasDataSlot.d.ts

@@ -0,0 +1,3 @@
+export declare function hasDataSlot(element: React.ReactNode, slot: string): element is React.ReactElement<{
+    'data-ox-slot': string;
+}>;

package/dist/utils/hasDataSlot/test/hasDataSlot.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/index.d.ts

@@ -0,0 +1,9 @@
+export * from './builder';
+export * from './cn';
+export * from './copyToClipboard';
+export * from './createId';
+export * from './errorHelper';
+export * from './formatter';
+export * from './hasDataSlot';
+export * from './scrollToElement';
+export * from './validation';

package/dist/utils/scrollToElement/index.d.ts

@@ -0,0 +1,2 @@
+export type * from './src/scrollToElement.types';
+export { scrollToElement } from './src/scrollToElement';

package/dist/utils/scrollToElement/src/scrollToElement.d.ts

@@ -0,0 +1,2 @@
+import { OxScrollToElementOptions } from './scrollToElement.types';
+export declare function scrollToElement(target: string | Element, options?: OxScrollToElementOptions): Promise<void>;

package/dist/utils/scrollToElement/src/scrollToElement.types.d.ts

@@ -0,0 +1,7 @@
+export interface OxScrollToElementOptions {
+    behavior?: 'smooth' | 'instant' | 'auto';
+    block?: 'start' | 'center' | 'end' | 'nearest';
+    inline?: 'start' | 'center' | 'end' | 'nearest';
+    offset?: number;
+    timeout?: number;
+}

package/dist/utils/scrollToElement/test/scrollToElement.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/utils.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../chunks/ui-Dfv80f9y.js");exports.buildMailTo=r.buildMailTo;exports.buildUrl=r.buildUrl;exports.cn=r.cn;exports.copyToClipboard=r.copyToClipboard;exports.createId=r.createId;exports.formatBytes=r.formatBytes;exports.formatCurrency=r.formatCurrency;exports.formatDate=r.formatDate;exports.formatNumber=r.formatNumber;exports.formatTimestamp=r.formatTimestamp;exports.generateRandomString=r.generateRandomString;exports.handleFormErrors=r.handleFormErrors;exports.handleGraphQLFormErrors=r.handleGraphQLFormErrors;exports.hasDataSlot=r.hasDataSlot;exports.parseGraphQLErrors=r.parseGraphQLErrors;exports.scrollToElement=r.scrollToElement;exports.validateEmail=r.validateEmail;exports.validatePhone=r.validatePhone;exports.validateUrl=r.validateUrl;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../chunks/ui-B0Ma5GdK.js");exports.buildMailTo=r.buildMailTo;exports.buildUrl=r.buildUrl;exports.cn=r.cn;exports.copyToClipboard=r.copyToClipboard;exports.createId=r.createId;exports.formatBytes=r.formatBytes;exports.formatCurrency=r.formatCurrency;exports.formatDate=r.formatDate;exports.formatNumber=r.formatNumber;exports.formatTimestamp=r.formatTimestamp;exports.generateRandomString=r.generateRandomString;exports.handleFormErrors=r.handleFormErrors;exports.handleGraphQLFormErrors=r.handleGraphQLFormErrors;exports.hasDataSlot=r.hasDataSlot;exports.parseGraphQLErrors=r.parseGraphQLErrors;exports.scrollToElement=r.scrollToElement;exports.validateEmail=r.validateEmail;exports.validatePhone=r.validatePhone;exports.validateUrl=r.validateUrl;

package/dist/utils/utils.es.js

@@ -1,4 +1,4 @@
-import { ab as s, aa as o, a0 as e, ac as t, ad as l, ah as m, ai as d, aj as i, ak as n, al as p, ae as f, af as h, a3 as c, am as b, ag as E, an as u, ao as T, aq as g, ap as v } from "../chunks/ui-DaFpw1V6.js";
+import { ak as s, aj as o, af as e, al as t, am as l, ar as m, as as d, at as i, au as n, av as p, an as f, ao as h, ap as c, aw as u, aq as E, ax as b, ay as v, aA as y, az as T } from "../chunks/ui-DrKTwQ0M.js";
 export {
   s as buildMailTo,
   o as buildUrl,
@@ -13,10 +13,10 @@ export {
   f as generateRandomString,
   h as handleFormErrors,
   c as handleGraphQLFormErrors,
-  b as hasDataSlot,
+  u as hasDataSlot,
   E as parseGraphQLErrors,
-  u as scrollToElement,
-  T as validateEmail,
-  g as validatePhone,
-  v as validateUrl
+  b as scrollToElement,
+  v as validateEmail,
+  y as validatePhone,
+  T as validateUrl
 };

package/dist/utils/validation/index.d.ts

@@ -0,0 +1,4 @@
+export type * from './src/validation.types';
+export { validateEmail } from './src/validateEmail';
+export { validateUrl } from './src/validateUrl';
+export { validatePhone } from './src/validatePhone';

package/dist/utils/validation/src/constants.d.ts

@@ -0,0 +1,57 @@
+export declare const COUNTRY_CODES: {
+    readonly US: "+1";
+    readonly CA: "+1";
+    readonly DE: "+49";
+    readonly AT: "+43";
+    readonly CH: "+41";
+    readonly IT: "+39";
+    readonly FR: "+33";
+    readonly ES: "+34";
+    readonly UK: "+44";
+    readonly GB: "+44";
+    readonly NL: "+31";
+    readonly BE: "+32";
+    readonly SE: "+46";
+    readonly NO: "+47";
+    readonly DK: "+45";
+    readonly FI: "+358";
+    readonly PL: "+48";
+    readonly CZ: "+420";
+    readonly HU: "+36";
+    readonly RO: "+40";
+    readonly BG: "+359";
+    readonly HR: "+385";
+    readonly SI: "+386";
+    readonly SK: "+421";
+    readonly EE: "+372";
+    readonly LV: "+371";
+    readonly LT: "+370";
+    readonly AU: "+61";
+    readonly NZ: "+64";
+    readonly JP: "+81";
+    readonly KR: "+82";
+    readonly CN: "+86";
+    readonly IN: "+91";
+    readonly RU: "+7";
+    readonly BR: "+55";
+    readonly AR: "+54";
+    readonly MX: "+52";
+    readonly CL: "+56";
+    readonly CO: "+57";
+    readonly PE: "+51";
+    readonly VE: "+58";
+    readonly ZA: "+27";
+    readonly EG: "+20";
+    readonly NG: "+234";
+    readonly KE: "+254";
+    readonly GH: "+233";
+    readonly MA: "+212";
+    readonly TN: "+216";
+    readonly DZ: "+213";
+};
+export declare const US_LOCAL_NUMBER_LENGTH = 7;
+export declare const US_TEST_AREA_CODE = "555";
+export declare const MAX_URL_LENGTH = 2083;
+export declare const MAX_EMAIL_LENGTH = 254;
+export declare const MAX_LOCAL_PART_LENGTH = 64;
+export declare const MAX_DOMAIN_PART_LENGTH = 253;

package/dist/utils/validation/src/validateEmail.d.ts

@@ -0,0 +1,2 @@
+import { OxValidateEmailOptions } from './validation.types';
+export declare const validateEmail: (email: string, options?: OxValidateEmailOptions) => boolean;

package/dist/utils/validation/src/validatePhone.d.ts

@@ -0,0 +1,2 @@
+import { OxValidatePhoneOptions } from './validation.types';
+export declare const validatePhone: (phone: string, options?: OxValidatePhoneOptions) => boolean;

package/dist/utils/validation/src/validateUrl.d.ts

@@ -0,0 +1,2 @@
+import { OxValidateUrlOptions } from './validation.types';
+export declare const validateUrl: (url: string, options?: OxValidateUrlOptions) => boolean;

package/dist/utils/validation/src/validation.types.d.ts

@@ -0,0 +1,13 @@
+export interface OxValidatePhoneOptions {
+    allowedCountries?: string[];
+    strict?: boolean;
+}
+export interface OxValidateEmailOptions {
+    allowLocalhost?: boolean;
+    requireTld?: boolean;
+}
+export interface OxValidateUrlOptions {
+    allowLocalhost?: boolean;
+    protocols?: string[];
+    requireProtocol?: boolean;
+}

package/dist/utils/validation/test/validateEmail.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/validation/test/validatePhone.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/utils/validation/test/validateUrl.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@noxickon/onyx",
-  "version": "2.0.3",
+  "version": "3.0.0",
   "type": "module",
   "main": "./dist/onyx.umd.js",
   "module": "./dist/onyx.es.js",
@@ -39,45 +39,67 @@
       "types": "./dist/utils.d.ts",
       "import": "./dist/utils/utils.es.js"
     },
+    "./legacy": {
+      "types": "./dist/legacy.d.ts",
+      "import": "./dist/legacy/legacy.es.js"
+    },
     "./styles": "./dist/onyx.css",
     "./shared": "./dist/shared.css",
     "./animations": "./dist/animations.css"
   },
   "files": [
-    "dist"
+    "dist",
+    "AI-README.md"
   ],
   "scripts": {
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "type-check": "tsc --project tsconfig.app.json --noEmit",
+    "format:all": "prettier --write . && eslint . --fix",
     "dev": "storybook dev -p 6006",
     "build": "tsc -b && vite build",
     "build:analyze": "ANALYZE=true npm run build",
-    "prepublishOnly": " npm run build",
     "publish:dev": "npm version prerelease --preid=dev --no-git-tag-version && npm publish --tag dev",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "format:all": "prettier --write . && eslint . --fix",
     "preview": "vite preview",
     "build:storybook": "npm run build && storybook build",
     "preview:storybook": "vite preview --outDir storybook-static",
     "format": "prettier --write .",
     "test": "vitest run",
     "test:coverage": "vitest run --coverage",
-    "coverage:preview": "vite preview --outDir coverage"
+    "preview:coverage": "vite preview --outDir coverage",
+    "prepublishOnly": "npm run build",
+    "pipeline": "npm run lint && npm run build && npm run test:coverage"
   },
   "peerDependencies": {
     "@apollo/client": "^4.0.0",
-    "@mdi/js": "^7.0.0",
+    "@mdi/js": "^7.4.47",
+    "@mdi/react": "^1.6.1",
     "graphql": "^16.0.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "react": "^19.2.1",
+    "react-dom": "^19.2.1"
+  },
+  "peerDependenciesMeta": {
+    "@mdi/react": {
+      "optional": true
+    },
+    "@mdi/js": {
+      "optional": true
+    }
   },
   "dependencies": {
-    "@mdi/react": "^1.6.1",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@floating-ui/react": "^0.27.16",
     "@tailwindcss/vite": "^4.1.11",
+    "@tanstack/react-virtual": "^3.13.13",
     "axios": "^1.11.0",
+    "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "colord": "^2.9.3",
     "date-fns": "^4.1.0",
     "es-toolkit": "^1.39.8",
+    "lucide-react": "^0.559.0",
     "recharts": "^3.1.0",
     "tailwind-merge": "^3.3.1",
     "tailwindcss": "^4.1.11",
@@ -85,53 +107,56 @@
   },
   "devDependencies": {
     "@apollo/client": "^4.0.0",
-    "@chromatic-com/storybook": "^4.1.1",
-    "@eslint/js": "^9.32.0",
+    "@chromatic-com/storybook": "^4.1.3",
+    "@eslint/js": "^9.39.1",
     "@mdi/js": "^7.4.47",
-    "@storybook/addon-docs": "^9.1.10",
-    "@storybook/addon-onboarding": "^9.1.10",
-    "@storybook/addon-vitest": "^9.1.10",
-    "@storybook/react-vite": "^9.1.10",
+    "@mdi/react": "^1.6.1",
+    "@noxickon/codex": "^0.1.14",
+    "@storybook/addon-docs": "^10.1.2",
+    "@storybook/addon-onboarding": "^10.1.2",
+    "@storybook/react-vite": "^10.1.2",
     "@tailwindcss/typography": "^0.5.16",
     "@testing-library/jest-dom": "^6.6.4",
     "@testing-library/react": "^16.3.0",
     "@types/jest-axe": "^3.5.9",
+    "@types/node": "^24.9.2",
     "@types/react": "^19.1.9",
     "@types/react-dom": "^19.1.7",
     "@vitejs/plugin-react": "^5.0.1",
-    "@vitest/browser": "^3.2.4",
-    "@vitest/coverage-v8": "^3.2.4",
+    "@vitest/browser": "^4.0.9",
+    "@vitest/coverage-v8": "^4.0.9",
     "babel-plugin-react-compiler": "^1.0.0",
     "canvas": "^3.1.2",
     "eslint": "^9.32.0",
-    "eslint-plugin-perfectionist": "^4.15.0",
-    "eslint-plugin-react-hooks": "^7.0.0",
-    "eslint-plugin-react-refresh": "^0.4.20",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-better-tailwindcss": "^3.7.10",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-perfectionist": "^4.15.1",
+    "eslint-plugin-react-compiler": "^19.1.0-rc.2",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
     "eslint-plugin-sort-destructure-keys": "^2.0.0",
-    "eslint-plugin-storybook": "^9.1.10",
-    "eslint-plugin-unused-imports": "^4.1.4",
+    "eslint-plugin-storybook": "^10.1.2",
+    "eslint-plugin-unicorn": "^62.0.0",
+    "eslint-plugin-unused-imports": "^4.3.0",
     "globals": "^16.3.0",
     "graphql": "^16.11.0",
     "jest-axe": "^10.0.0",
     "jsdom": "^27.0.0",
     "playwright": "^1.54.2",
-    "prettier": "^3.6.2",
-    "prettier-plugin-tailwindcss": "^0.7.1",
-    "react": "^19.1.1",
-    "react-dom": "^19.1.1",
+    "prettier": "^3.7.4",
+    "react": "^19.2.1",
+    "react-dom": "^19.2.1",
+    "remark-gfm": "^4.0.1",
     "rollup-plugin-visualizer": "^6.0.5",
-    "storybook": "^9.1.10",
-    "typescript": "^5.9.2",
-    "typescript-eslint": "^8.38.0",
+    "storybook": "^10.1.2",
+    "storybook-addon-tag-badges": "^3.0.2",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.46.4",
     "vite": "^7.0.6",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
-    "vitest": "^3.2.4"
-  },
-  "eslintConfig": {
-    "extends": [
-      "plugin:storybook/recommended"
-    ]
+    "vitest": "^4.0.9"
   },
   "overrides": {
     "storybook": "$storybook"