@bspk/ui 1.1.34 → 1.2.0

package/dist/utils/demo.d.ts

@@ -1,4 +1,5 @@
-import { AlertVariant } from '../index.js';
+import { AlertVariant } from '-/types/common';
+import { ComponentMeta } from '-/types/meta';
 export type TypeProperty = {
     name: string;
     description?: string;
@@ -15,7 +16,6 @@ export type TypeProperty = {
 };
 export type DemoAction = (message: string, variant?: AlertVariant) => void;
 export type DemoSetState<Props = Record<string, unknown>> = (next: Partial<Props> | ((prev: Props) => Partial<Props>)) => void;
-export type ComponentPhase = 'AccessibilityReview' | 'Backlog' | 'DesignReview' | 'ProductionReady' | 'Utility' | 'WorkInProgress';
 export type TypePropertyDemo = Omit<TypeProperty, 'example'> & {
     libraryDefault?: TypeProperty['default'];
     label?: string;
@@ -32,26 +32,35 @@ export type ComponentExampleRenderProps<Props = Record<string, unknown>> = {
     preset?: DemoPreset;
     setState: DemoSetState<Props>;
     Component: React.ComponentType<Props>;
-    context?: {
-        [key: string]: unknown;
-        preset?: DemoPreset;
+    variant?: {
+        name: string;
+        value: unknown;
     };
     id: string;
 };
 export type ComponentExampleRender<Props = Record<string, unknown>> = (params: ComponentExampleRenderProps<Props>) => React.ReactNode;
-export type ComponentExample<Props = Record<string, unknown>, PropName = keyof Props> = {
+type ComponentVariantOverride<Props> = {
+    [K in keyof Props]?: Props[K] | {
+        options: Props[K][];
+    };
+};
+export type ComponentVariantOverrides<Props = Record<string, unknown>, PropName extends keyof Props = keyof Props> = {
+    [Key in PropName]?: ComponentVariantOverride<Props> | false | ((props: Props) => ComponentVariantOverride<Props>);
+};
+export type ComponentExample<Props = Record<string, unknown>, PropName extends keyof Props = keyof Props> = {
     /**
      * The style of the wrapping component.
      *
-     * //
+     * @example
+     *     { width: '100%' },
      */
     containerStyle?: React.CSSProperties | ((propState: Props) => React.CSSProperties);
     /**
-     * True to hide all or a list of variants to hide.
+     * False to hide all or a record of variants to hide or modify props.
      *
-     * Helpful for hiding variants that can have unexpected collisions with the other examples.
+     * Helpful for hiding or setting static default props for specific variants
      */
-    hideVariants?: PropName[] | true;
+    variants?: ComponentVariantOverrides<Props> | boolean;
     /**
      * This is used to set the initial propState of the component.
      *
@@ -74,10 +83,19 @@ export type ComponentExample<Props = Record<string, unknown>, PropName = keyof P
     render?: ComponentExampleRender<Props>;
     /** We may not want certain props editable in the props table. */
     disableProps?: PropName[];
+    /** The sections of the example. */
+    sections?: {
+        title: string;
+        content: (params: {
+            Component: React.ComponentType<Props>;
+            props: Props;
+        }) => React.ReactNode;
+    }[];
 };
 export type ComponentExampleFn<Props = Record<string, unknown>> = (params: {
     setState: DemoSetState<Props>;
     action: DemoAction;
+    componentsMeta: ComponentMeta[];
 }) => ComponentExample<Props>;
 export type Preset<Props> = {
     /** The name of the preset. This is used to display the preset in the UI. */
@@ -91,3 +109,4 @@ export type DemoPreset<P = Record<string, unknown>> = Preset<P> & {
     value: string;
 };
 export declare function createUid(prefix?: string): string;
+export {};

package/dist/utils/demo.js.map

@@ -1 +1 @@
-{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../src/utils/demo.ts"],"names":[],"mappings":"AAAA,uDAAuD;AAsHvD,MAAM,UAAU,SAAS,CAAC,SAAiB,KAAK;IAC5C,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;AACrE,CAAC"}
+{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../src/utils/demo.ts"],"names":[],"mappings":"AAAA,uDAAuD;AA8HvD,MAAM,UAAU,SAAS,CAAC,SAAiB,KAAK;IAC5C,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;AACrE,CAAC"}

package/dist/utils/fileUploads.d.ts

@@ -0,0 +1,51 @@
+export declare const DEFAULT_ERROR_MESSAGE = "There was an error uploading the file. Please try again.";
+export type FileUploadStatus = 'complete' | 'error' | 'failed' | 'idle' | 'uploading';
+export type FileEntry = {
+    /**
+     * The unique identifier for the file entry.
+     *
+     * This is generated client-side and should be unique for each file.
+     *
+     * This is useful for tracking the file during upload and handling cancellation.
+     *
+     * @required
+     */
+    id: string;
+    /** The name of the file. */
+    fileName: string;
+    /**
+     * The status of the uploading file.
+     *
+     * @default idle
+     */
+    status?: FileUploadStatus;
+    /**
+     * The size of the file being uploaded in MB.
+     *
+     * @required
+     */
+    fileSize: number;
+    /**
+     * A number between 0 and 100 representing the percentage of the upload completed.
+     *
+     * @default 0
+     * @minimum 0
+     * @maximum 100
+     */
+    progress?: number;
+    /**
+     * The error message to display when the upload fails.
+     *
+     * If status is 'error', this message will be displayed by default: "There was an error uploading the file. Please
+     * try again."
+     */
+    errorMessage?: string;
+};
+/**
+ * Common MIME types
+ *
+ * This list includes commonly used MIME types for various file formats.
+ *
+ * This is not an exhaustive list, but it covers many of the most frequently used types and can be extended as needed.
+ */
+export type MimeType = 'application/json' | 'application/octet-stream' | 'application/pdf' | 'application/x-www-form-urlencoded' | 'application/xml' | 'application/zip' | 'audio/mpeg' | 'audio/wav' | 'image/gif' | 'image/jpeg' | 'image/png' | 'image/svg+xml' | 'image/webp' | 'text/css' | 'text/html' | 'text/javascript' | 'text/plain' | 'video/mp4' | 'video/webm';

package/dist/utils/fileUploads.js

@@ -0,0 +1,2 @@
+export const DEFAULT_ERROR_MESSAGE = 'There was an error uploading the file. Please try again.';
+//# sourceMappingURL=fileUploads.js.map

package/dist/utils/fileUploads.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fileUploads.js","sourceRoot":"","sources":["../../src/utils/fileUploads.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,qBAAqB,GAAG,0DAA0D,CAAC"}

package/dist/utils/handleKeyDown.d.ts

@@ -0,0 +1,12 @@
+import { KeyboardEventCode } from './keyboard';
+export type KeysCallback = Partial<Record<KeyboardEventCode, (event: React.KeyboardEvent) => void>>;
+/**
+ * Handles multiple keydown events with specific callbacks for each key.
+ *
+ * @param keysCallback - An object where keys are keyboard event codes and values are callback functions.
+ * @returns A function that can be used as an event handler for keydown events.
+ */
+export declare function handleKeyDown(keysCallback: KeysCallback, { stopPropagation, preventDefault }?: {
+    stopPropagation?: boolean;
+    preventDefault?: boolean;
+}): (event: React.KeyboardEvent) => boolean;

package/dist/utils/handleKeyDown.js

@@ -0,0 +1,20 @@
+/**
+ * Handles multiple keydown events with specific callbacks for each key.
+ *
+ * @param keysCallback - An object where keys are keyboard event codes and values are callback functions.
+ * @returns A function that can be used as an event handler for keydown events.
+ */
+export function handleKeyDown(keysCallback, { stopPropagation = true, preventDefault = true } = {}) {
+    return (event) => {
+        const callback = keysCallback[event.code];
+        if (callback) {
+            callback(event);
+            if (stopPropagation)
+                event.stopPropagation();
+            if (preventDefault)
+                event.preventDefault();
+        }
+        return !!callback;
+    };
+}
+//# sourceMappingURL=handleKeyDown.js.map

package/dist/utils/handleKeyDown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handleKeyDown.js","sourceRoot":"","sources":["../../src/utils/handleKeyDown.ts"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CACzB,YAA0B,EAC1B,EAAE,eAAe,GAAG,IAAI,EAAE,cAAc,GAAG,IAAI,KAA8D,EAAE;IAE/G,OAAO,CAAC,KAA0B,EAAE,EAAE;QAClC,MAAM,QAAQ,GAAG,YAAY,CAAC,KAAK,CAAC,IAAyB,CAAC,CAAC;QAC/D,IAAI,QAAQ,EAAE,CAAC;YACX,QAAQ,CAAC,KAAK,CAAC,CAAC;YAChB,IAAI,eAAe;gBAAE,KAAK,CAAC,eAAe,EAAE,CAAC;YAC7C,IAAI,cAAc;gBAAE,KAAK,CAAC,cAAc,EAAE,CAAC;QAC/C,CAAC;QACD,OAAO,CAAC,CAAC,QAAQ,CAAC;IACtB,CAAC,CAAC;AACN,CAAC"}

package/dist/utils/keyboard.js

@@ -1,4 +1,4 @@
-export const EVENT_KEY = Object.freeze({
+export const EVENT_KEY = {
     Backspace: 'Backspace',
     Tab: 'Tab',
     Enter: 'Enter',
@@ -133,6 +133,6 @@ export const EVENT_KEY = Object.freeze({
     '<': '<',
     '>': '>',
     '?': '?',
-});
+};
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
 //# sourceMappingURL=keyboard.js.map

package/dist/utils/keyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard.js","sourceRoot":"","sources":["../../src/utils/keyboard.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"keyboard.js","sourceRoot":"","sources":["../../src/utils/keyboard.ts"],"names":[],"mappings":"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"}

package/dist/utils/random.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Returns a random integer between min and max (inclusive).
+ *
+ * @param min - The minimum value (inclusive).
+ * @param max - The maximum value (inclusive).
+ * @returns A random integer between min and max.
+ */
+export declare function randomNumber(min?: number, max?: number): number;
+/**
+ * Returns a random string of alphanumeric characters.
+ *
+ * @param length - The length of the random ID to generate.
+ * @returns A random string of the specified length containing alphanumeric characters.
+ */
+export declare function randomString(length?: number): string;

package/dist/utils/random.js

@@ -0,0 +1,26 @@
+/**
+ * Returns a random integer between min and max (inclusive).
+ *
+ * @param min - The minimum value (inclusive).
+ * @param max - The maximum value (inclusive).
+ * @returns A random integer between min and max.
+ */
+export function randomNumber(min = 0, max = 100) {
+    return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+/**
+ * Returns a random string of alphanumeric characters.
+ *
+ * @param length - The length of the random ID to generate.
+ * @returns A random string of the specified length containing alphanumeric characters.
+ */
+export function randomString(length = 8) {
+    const chars = 'abcdefghijklmnopqrstuvwxyz0123456789';
+    let result = '';
+    const rand = new Uint32Array(length);
+    window.crypto.getRandomValues(rand);
+    for (let i = 0; i < length; i++)
+        result += chars[rand[i] % chars.length];
+    return result;
+}
+//# sourceMappingURL=random.js.map

package/dist/utils/random.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"random.js","sourceRoot":"","sources":["../../src/utils/random.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAAC,GAAG,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG;IAC3C,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;AAC7D,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAAC,SAAiB,CAAC;IAC3C,MAAM,KAAK,GAAG,sCAAsC,CAAC;IACrD,IAAI,MAAM,GAAG,EAAE,CAAC;IAChB,MAAM,IAAI,GAAG,IAAI,WAAW,CAAC,MAAM,CAAC,CAAC;IACrC,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACpC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE;QAAE,MAAM,IAAI,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IACzE,OAAO,MAAM,CAAC;AAClB,CAAC"}

package/dist/utils/scrollElementIntoView.d.ts

@@ -4,5 +4,5 @@
  * @param element -- The element to scroll into view.
  * @param container -- The container to scroll.
  */
-export declare function scrollElementIntoView(element: HTMLElement, container: HTMLElement): void;
+export declare function scrollElementIntoView(element?: Element | null, container?: Element | null): void;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/utils/scrollElementIntoView.js

@@ -5,6 +5,8 @@
  * @param container -- The container to scroll.
  */
 export function scrollElementIntoView(element, container) {
+    if (!element || !container)
+        return;
     const elementRect = element.getBoundingClientRect();
     const containerRect = container.getBoundingClientRect();
     if (elementRect.top < containerRect.top) {

package/dist/utils/scrollElementIntoView.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollElementIntoView.js","sourceRoot":"","sources":["../../src/utils/scrollElementIntoView.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CAAC,OAAoB,EAAE,SAAsB;IAC9E,MAAM,WAAW,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAEpD,MAAM,aAAa,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;IAExD,IAAI,WAAW,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,EAAE,CAAC;QACtC,oCAAoC;QACpC,SAAS,CAAC,SAAS,IAAI,aAAa,CAAC,GAAG,GAAG,WAAW,CAAC,GAAG,CAAC;IAC/D,CAAC;SAAM,IAAI,WAAW,CAAC,MAAM,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC;QACnD,oCAAoC;QACpC,SAAS,CAAC,SAAS,IAAI,WAAW,CAAC,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC;IACrE,CAAC;IAED,IAAI,WAAW,CAAC,IAAI,GAAG,aAAa,CAAC,IAAI,EAAE,CAAC;QACxC,6CAA6C;QAC7C,SAAS,CAAC,UAAU,IAAI,aAAa,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC;IAClE,CAAC;SAAM,IAAI,WAAW,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,EAAE,CAAC;QACjD,8CAA8C;QAC9C,SAAS,CAAC,UAAU,IAAI,WAAW,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC;IACpE,CAAC;AACL,CAAC;AAED,sDAAsD"}
+{"version":3,"file":"scrollElementIntoView.js","sourceRoot":"","sources":["../../src/utils/scrollElementIntoView.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CAAC,OAAwB,EAAE,SAA0B;IACtF,IAAI,CAAC,OAAO,IAAI,CAAC,SAAS;QAAE,OAAO;IAEnC,MAAM,WAAW,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAEpD,MAAM,aAAa,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;IAExD,IAAI,WAAW,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,EAAE,CAAC;QACtC,oCAAoC;QACpC,SAAS,CAAC,SAAS,IAAI,aAAa,CAAC,GAAG,GAAG,WAAW,CAAC,GAAG,CAAC;IAC/D,CAAC;SAAM,IAAI,WAAW,CAAC,MAAM,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC;QACnD,oCAAoC;QACpC,SAAS,CAAC,SAAS,IAAI,WAAW,CAAC,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC;IACrE,CAAC;IAED,IAAI,WAAW,CAAC,IAAI,GAAG,aAAa,CAAC,IAAI,EAAE,CAAC;QACxC,6CAA6C;QAC7C,SAAS,CAAC,UAAU,IAAI,aAAa,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC;IAClE,CAAC;SAAM,IAAI,WAAW,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,EAAE,CAAC;QACjD,8CAA8C;QAC9C,SAAS,CAAC,UAAU,IAAI,WAAW,CAAC,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC;IACpE,CAAC;AACL,CAAC;AAED,sDAAsD"}

package/meta.ts

@@ -14,13 +14,19 @@ import { fileURLToPath } from 'url';
 
 import * as TJS from 'typescript-json-schema';
 
-import { ComponentMeta, TypeProperty, UtilityMeta, TypeMeta, ComponentPhase } from './meta-types';
+import {
+    ComponentMeta,
+    TypeProperty,
+    UtilityMeta,
+    TypeMeta,
+    ComponentPhase,
+    COMPONENT_PHASE_ORDER,
+} from './src/types/meta';
 
 const RESET = '\x1b[0m';
 const BLUE = '\x1b[34m';
 const GREEN = '\x1b[32m';
 const ORANGE = '\x1b[38;5;208m';
-const YELLOW = '\x1b[33m';
 
 function getArgValue(name: string, defaultValue: string = ''): string {
     const arg = process.argv.find((arg2) => arg2.startsWith(`${name}=`));
@@ -31,6 +37,7 @@ const outDirectory = getArgValue('out');
 const uiHash = getArgValue('hash');
 const build = getArgValue('build', '0');
 const target = getArgValue('target');
+const mode = getArgValue('mode', 'production');
 
 if (!outDirectory) {
     console.error('Please provide a path to the meta file.');
@@ -162,11 +169,6 @@ function generateComponentMeta({
         return null;
     }
 
-    if (!content.includes(".bspkName = '")) {
-        console.warn(`No bspkName found for component ${name} for ${componentFile}`);
-        return null;
-    }
-
     const componentDoc = [...(jsDocs || [])].find((doc) => doc.name === name);
 
     if (!componentDoc) {
@@ -207,21 +209,12 @@ function generateComponentMeta({
         usage,
         css,
         hasTouchTarget: css.includes('data-touch-target'),
-        phase: (COMPONENT_PHASES.includes(componentDoc.phase as ComponentPhase)
+        phase: (COMPONENT_PHASE_ORDER.includes(componentDoc.phase as ComponentPhase)
             ? componentDoc.phase
             : 'Backlog') as ComponentPhase,
     } as ComponentMeta;
 }
 
-const COMPONENT_PHASES: ComponentPhase[] = [
-    'AccessibilityReview',
-    'Backlog',
-    'DesignReview',
-    'ProductionReady',
-    'Utility',
-    'WorkInProgress',
-] as const;
-
 async function generateUtilityMeta(utilityFile: string): Promise<UtilityMeta | null> {
     const content = fs.readFileSync(utilityFile, 'utf-8');
 
@@ -289,7 +282,8 @@ function generateTypes() {
                 '-/hooks/*': ['src/hooks/*'],
                 '-/styles/*': ['src/styles/*'],
                 '-/utils/*': ['src/utils/*'],
-                '-': ['src/index.ts'],
+                '-/types/*': ['src/types/*'],
+                '-/constants/*': ['src/constants/*'],
             },
         },
         rootPath,
@@ -513,14 +507,7 @@ async function createMeta() {
 
     const uiVersion = `${execSync('npm view @bspk/ui version', { encoding: 'utf-8' }).trim()}`;
 
-    let mode = 'production';
-
-    if (uiHash === 'local' || process.env.DEV_GIT_TOKEN) {
-        mode = 'development';
-        console.info(`${ORANGE}Development meta build.${RESET}`);
-    } else {
-        console.info(`${YELLOW}Production meta build.${RESET}`);
-    }
+    console.info(`${ORANGE}${mode} meta build.${RESET}`);
 
     const metaJsonPath = path.join(outDirectory, 'data.json');
 
@@ -552,12 +539,12 @@ async function createMeta() {
             `export const componentsMeta = meta.componentsMeta as ComponentMeta[];
 export const utilitiesMeta = meta.utilitiesMeta as UtilityMeta[];
 export const typesMeta = meta.typesMeta as TypeMeta[];
-export const MODE = meta.MODE as 'development' | 'production';
+export const MODE = meta.MODE as 'development' | 'production' | 'test';
 export const UI_HASH = meta.UI_HASH as string;
 export const VERSION = meta.VERSION as string;
 export const BUILD = meta.BUILD as string;`,
 
-            fs.readFileSync(path.resolve(__dirname, 'meta-types.ts'), { encoding: 'utf-8' }),
+            fs.readFileSync(path.resolve(__dirname, './src/types/meta.ts'), { encoding: 'utf-8' }),
 
             `export type MetaComponentName = '${metaComponentNames.join("' | '")}';`,