@povio/ui 0.0.4 → 0.0.6

package/dist/config/i18n.d.ts

@@ -0,0 +1,315 @@
+export declare const ns = "ui";
+export declare const resources: {
+    readonly en: {
+        readonly ui: {
+            ui: {
+                openAlt: string;
+                closeAlt: string;
+                clearAlt: string;
+                loadingState: {
+                    text: string;
+                };
+                select: {
+                    closeAlt: string;
+                    selectAll: string;
+                    clearSelection: string;
+                    allOption: string;
+                    search: string;
+                    clearSearch: string;
+                };
+                datePicker: {
+                    today: string;
+                    clear: string;
+                    save: string;
+                    presets: {
+                        thisWeek: string;
+                        lastWeek: string;
+                        thisAndLastWeek: string;
+                        thisMonth: string;
+                        thisAndLastMonth: string;
+                        thisYear: string;
+                        lastYear: string;
+                        thisAndLastYear: string;
+                        soFar: string;
+                    };
+                    errors: {
+                        endDateBeforeStart: string;
+                    };
+                };
+                modal: {
+                    closeBtn: string;
+                };
+                autocomplete: {
+                    createNewBtn: string;
+                };
+                password: {
+                    reveal: string;
+                    hide: string;
+                };
+                textEditor: {
+                    textStyle: {
+                        label: string;
+                        normal: string;
+                        heading1: string;
+                        heading2: string;
+                        heading3: string;
+                        heading4: string;
+                        heading5: string;
+                        heading6: string;
+                    };
+                    marks: {
+                        bold: string;
+                        italic: string;
+                        underline: string;
+                        strikethrough: string;
+                    };
+                    textAlign: {
+                        label: string;
+                        left: string;
+                        center: string;
+                        right: string;
+                        justify: string;
+                    };
+                    link: {
+                        label: string;
+                        apply: string;
+                        remove: string;
+                        urlLabel: string;
+                        urlPlaceholder: string;
+                    };
+                };
+                tag: {
+                    dismiss: string;
+                };
+                clearInput: string;
+                pagination: {
+                    nextBtn: string;
+                    backBtn: string;
+                    firstBtn: string;
+                    lastBtn: string;
+                    resultsPerPage: string;
+                };
+                confirmation: {
+                    cancel: string;
+                    confirm: string;
+                };
+                fileUpload: {
+                    emptyText: string;
+                    uploadText: string;
+                    browse: string;
+                    noFileUploaded: string;
+                    upload: string;
+                    uploadFile: string;
+                    or: string;
+                    removeFile: string;
+                    cancel: string;
+                };
+                table: {
+                    column: string;
+                    show: string;
+                    configureColumns: string;
+                };
+            };
+            zodErrors: {
+                required: string;
+                invalid: string;
+                string: {
+                    includes: string;
+                    startsWith: string;
+                    endsWith: string;
+                    constraint: string;
+                    contains: string;
+                    containsAtLeast: string;
+                    containsOver: string;
+                    containsAtMost: string;
+                    containsUnder: string;
+                };
+                array: {
+                    contains: string;
+                    containsAtLeast: string;
+                    containsMoreThan: string;
+                    containsAtMost: string;
+                    containsLessThan: string;
+                };
+                number: {
+                    exact: string;
+                    greaterThanOrEqual: string;
+                    greaterThan: string;
+                    over: string;
+                    lessThanOrEqual: string;
+                    lessThan: string;
+                    multipleOf: string;
+                };
+                date: {
+                    invalid: string;
+                    exact: string;
+                    greaterThanOrEqual: string;
+                    greaterThan: string;
+                    smallerThanOrEqual: string;
+                    smallerThan: string;
+                };
+            };
+            sharedErrors: {
+                dataValidation: string;
+                internalError: string;
+                networkError: string;
+                canceledError: string;
+                unknownError: string;
+            };
+        };
+    };
+    readonly sl: {
+        readonly ui: {
+            ui: {
+                openAlt: string;
+                closeAlt: string;
+                clearAlt: string;
+                loadingState: {
+                    text: string;
+                };
+                select: {
+                    closeAlt: string;
+                    selectAll: string;
+                    clearSelection: string;
+                    allOption: string;
+                    search: string;
+                    clearSearch: string;
+                };
+                datePicker: {
+                    today: string;
+                    clear: string;
+                    save: string;
+                    presets: {
+                        thisWeek: string;
+                        lastWeek: string;
+                        thisAndLastWeek: string;
+                        thisMonth: string;
+                        thisAndLastMonth: string;
+                        thisYear: string;
+                        lastYear: string;
+                        thisAndLastYear: string;
+                        soFar: string;
+                    };
+                    errors: {
+                        endDateBeforeStart: string;
+                    };
+                };
+                modal: {
+                    closeBtn: string;
+                };
+                autocomplete: {
+                    createNewBtn: string;
+                };
+                password: {
+                    reveal: string;
+                    hide: string;
+                };
+                textEditor: {
+                    textStyle: {
+                        label: string;
+                        normal: string;
+                        heading1: string;
+                        heading2: string;
+                        heading3: string;
+                        heading4: string;
+                        heading5: string;
+                        heading6: string;
+                    };
+                    marks: {
+                        bold: string;
+                        italic: string;
+                        underline: string;
+                        strikethrough: string;
+                    };
+                    textAlign: {
+                        label: string;
+                        left: string;
+                        center: string;
+                        right: string;
+                        justify: string;
+                    };
+                    link: {
+                        label: string;
+                        apply: string;
+                        remove: string;
+                        urlLabel: string;
+                        urlPlaceholder: string;
+                    };
+                };
+                pagination: {
+                    nextBtn: string;
+                    backBtn: string;
+                    firstBtn: string;
+                    lastBtn: string;
+                    resultsPerPage: string;
+                };
+                confirmation: {
+                    cancel: string;
+                    confirm: string;
+                };
+                fileUpload: {
+                    emptyText: string;
+                    uploadText: string;
+                    browse: string;
+                    noFileUploaded: string;
+                    upload: string;
+                    uploadFile: string;
+                    or: string;
+                    removeFile: string;
+                    cancel: string;
+                };
+                table: {
+                    column: string;
+                    show: string;
+                    configureColumns: string;
+                };
+            };
+            zodErrors: {
+                required: string;
+                invalid: string;
+                string: {
+                    includes: string;
+                    startsWith: string;
+                    endsWith: string;
+                    constraint: string;
+                    contains: string;
+                    containsAtLeast: string;
+                    containsOver: string;
+                    containsAtMost: string;
+                    containsUnder: string;
+                };
+                array: {
+                    contains: string;
+                    containsAtLeast: string;
+                    containsMoreThan: string;
+                    containsAtMost: string;
+                    containsLessThan: string;
+                };
+                number: {
+                    exact: string;
+                    greaterThanOrEqual: string;
+                    greaterThan: string;
+                    over: string;
+                    lessThanOrEqual: string;
+                    lessThan: string;
+                    multipleOf: string;
+                };
+                date: {
+                    invalid: string;
+                    exact: string;
+                    greaterThanOrEqual: string;
+                    greaterThan: string;
+                    smallerThanOrEqual: string;
+                    smallerThan: string;
+                };
+            };
+            sharedErrors: {
+                dataValidation: string;
+                internalError: string;
+                networkError: string;
+                canceledError: string;
+                unknownError: string;
+            };
+        };
+    };
+};

package/dist/config/i18n.js

@@ -0,0 +1,15 @@
+import translationEN from "../assets/locales/en/translation.json.js";
+import translationSL from "../assets/locales/sl/translation.json.js";
+const ns = "ui";
+const resources = {
+  en: {
+    [ns]: translationEN
+  },
+  sl: {
+    [ns]: translationSL
+  }
+};
+export {
+  ns,
+  resources
+};

package/dist/config/router.context.d.ts

@@ -0,0 +1,20 @@
+import { PropsWithChildren } from 'react';
+import { UrlObject } from 'url';
+interface UIRouterProviderProps {
+    push: (url: UrlObject | string) => Promise<boolean>;
+    replace: (url: UrlObject | string) => Promise<boolean>;
+    query: NodeJS.Dict<string | string[]>;
+    pathname: string;
+}
+interface UIRouterContextValue {
+    push: (url: UrlObject | string) => Promise<boolean>;
+    replace: (url: UrlObject | string) => Promise<boolean>;
+    pathname: string;
+    query: NodeJS.Dict<string | string[]>;
+    searchParams: URLSearchParams;
+}
+export declare namespace UIRouter {
+    const UIRouterProvider: ({ children, pathname, push, query, replace, }: PropsWithChildren<UIRouterProviderProps>) => import("react/jsx-runtime").JSX.Element;
+    const useUIRouter: () => UIRouterContextValue;
+}
+export {};

package/dist/config/router.context.js

@@ -0,0 +1,43 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, use } from "react";
+import { RouterProvider } from "react-aria";
+var UIRouter;
+((UIRouter2) => {
+  const UIRouterContext = createContext(null);
+  UIRouter2.UIRouterProvider = ({
+    children,
+    pathname,
+    push,
+    query,
+    replace
+  }) => {
+    const searchParams = new URLSearchParams();
+    for (const [k, v] of Object.entries(query)) {
+      if (Array.isArray(v)) {
+        for (const item of v) {
+          searchParams.append(k, item);
+        }
+      } else {
+        searchParams.set(k, v);
+      }
+    }
+    const value = {
+      searchParams,
+      pathname,
+      push,
+      query,
+      replace
+    };
+    return /* @__PURE__ */ jsx(UIRouterContext, { value, children: /* @__PURE__ */ jsx(RouterProvider, { navigate: (href) => push(href), children }) });
+  };
+  UIRouter2.useUIRouter = () => {
+    const context = use(UIRouterContext);
+    if (!context) {
+      throw new Error("useUIRouter must be used within a UIRouterContext");
+    }
+    return context;
+  };
+})(UIRouter || (UIRouter = {}));
+export {
+  UIRouter
+};

package/dist/config/uiConfig.context.d.ts

@@ -0,0 +1,28 @@
+import { PropsWithChildren } from 'react';
+import { CheckboxProps } from '#ui/components/inputs/Checkbox/Checkbox';
+import { NumberInputProps } from '#ui/components/inputs/Input/NumberInput/NumberInput';
+import { TextInputProps } from '#ui/components/inputs/Input/TextInput/TextInput';
+import { RadioGroupProps } from '#ui/components/inputs/RadioGroup/RadioGroup';
+import { SelectBaseProps } from '#ui/components/inputs/Selection/shared/SelectBase';
+import { SliderProps } from '#ui/components/inputs/Slider/Slider';
+import { ToggleProps } from '#ui/components/inputs/Toggle/Toggle';
+export declare namespace UIConfig {
+    type DeepRequired<T> = {
+        [P in keyof T]-?: T[P] extends object ? DeepRequired<T[P]> : Exclude<T[P], null | undefined>;
+    };
+    export interface Options {
+        input: Pick<TextInputProps, "variant" | "isClearable" | "hideLabel" | "as" | "size">;
+        numberInput: Pick<NumberInputProps, "formatOptions">;
+        radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel">;
+        checkbox: Pick<CheckboxProps, "variant">;
+        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable">;
+        toggle: Pick<ToggleProps, "variant">;
+        slider: Pick<SliderProps, "minValue" | "maxValue">;
+    }
+    interface ProviderProps {
+        config?: Partial<Options>;
+    }
+    export const Provider: ({ config, children }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
+    export const useConfig: () => DeepRequired<Options>;
+    export {};
+}

package/dist/config/uiConfig.context.js

@@ -0,0 +1,62 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, use } from "react";
+import { useDeepCompareMemo } from "../hooks/useDeepCompare.js";
+import { ObjectUtils } from "../utils/object.utils.js";
+var UIConfig;
+((UIConfig2) => {
+  const DEFAULT_CONFIG = {
+    input: {
+      variant: "outlined",
+      as: "default",
+      size: "default",
+      isClearable: false,
+      hideLabel: false
+    },
+    numberInput: {
+      formatOptions: {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 3
+      }
+    },
+    radioGroup: {
+      variant: "default",
+      hideLabel: false
+    },
+    checkbox: {
+      variant: "default"
+    },
+    select: {
+      selectionMode: "single",
+      isSearchable: false
+    },
+    toggle: {
+      variant: "default"
+    },
+    slider: {
+      minValue: 0,
+      maxValue: 100
+    }
+  };
+  const Context = createContext(DEFAULT_CONFIG);
+  UIConfig2.Provider = ({ config = {}, children }) => {
+    const parentConfig = use(Context) || DEFAULT_CONFIG;
+    const value = useDeepCompareMemo(() => {
+      return ObjectUtils.deepConditionalMerge(
+        parentConfig,
+        config,
+        (val) => val !== null && val !== void 0
+      );
+    }, [config, parentConfig]);
+    return /* @__PURE__ */ jsx(Context.Provider, { value, children });
+  };
+  UIConfig2.useConfig = () => {
+    const context = use(Context);
+    if (!context) {
+      throw new Error("UIConfig.useConfig must be used within a UIConfig.Provider");
+    }
+    return context;
+  };
+})(UIConfig || (UIConfig = {}));
+export {
+  UIConfig
+};

package/dist/config/uiStyle.context.d.ts

@@ -0,0 +1,84 @@
+import { ClassProp } from 'class-variance-authority/types';
+import { PropsWithChildren } from 'react';
+import { ButtonVariantProps } from '#ui/components/buttons/Button/button.cva';
+import { PillButtonVariants } from '#ui/components/buttons/PillButton/pillButton.cva';
+import { CheckboxVariantProps } from '#ui/components/inputs/Checkbox/checkbox.cva';
+import { RadioVariantProps } from '#ui/components/inputs/RadioGroup/radio.cva';
+import { InputBaseProps, InputSideProps, InputSizeProps } from '#ui/components/inputs/shared/input.cva';
+import { LabelBaseProps } from '#ui/components/inputs/shared/label.cva';
+import { ToggleVariantProps } from '#ui/components/inputs/Toggle/toggle.cva';
+import { AlertVariantProps } from '#ui/components/status/Alert/alert.cva';
+import { ToastVariantProps } from '#ui/components/status/Toast/toast.cva';
+import { TableDataVariantProps, TableHeadRowVariantProps, TableRowVariantProps } from '#ui/components/table/table.cva';
+import { LinkVariantProps } from '#ui/components/text/Link/link.cva';
+import { TagVariantProps } from '#ui/components/text/Tag/tag.cva';
+import { TypographyVariantProps } from '#ui/components/text/Typography/typography.cva';
+import { CompoundMapper } from '#ui/utils/compoundMapper';
+export declare namespace UIStyle {
+    export type Cva<T> = (props: T & ClassProp) => string;
+    interface Options {
+        button: {
+            cva?: Cva<ButtonVariantProps>;
+            sizeCva?: Cva<ButtonVariantProps>;
+            contentCva?: Cva<ButtonVariantProps>;
+            iconSize?: Cva<Pick<ButtonVariantProps, "size">>;
+            typography?: CompoundMapper<TypographyVariantProps, ButtonVariantProps>;
+        };
+        pillButton: {
+            cva?: Cva<PillButtonVariants>;
+            typography?: CompoundMapper<TypographyVariantProps, PillButtonVariants>;
+        };
+        checkbox: {
+            cva?: Cva<CheckboxVariantProps>;
+            typography?: CompoundMapper<TypographyVariantProps, CheckboxVariantProps>;
+        };
+        radio: {
+            cva?: Cva<RadioVariantProps>;
+            typography?: CompoundMapper<TypographyVariantProps, RadioVariantProps>;
+        };
+        status: {
+            iconCva?: Cva<ToastVariantProps>;
+            separatorCva?: Cva<ToastVariantProps>;
+        };
+        toast: {
+            cva?: Cva<ToastVariantProps>;
+            buttonColor?: CompoundMapper<Pick<ButtonVariantProps, "color" | "inverted">, ToastVariantProps>;
+        };
+        alert: {
+            cva?: Cva<AlertVariantProps>;
+        };
+        input: {
+            baseCva?: Cva<InputBaseProps>;
+            sizeCva?: Cva<InputSizeProps>;
+            sideCva?: Cva<InputSideProps>;
+        };
+        label: {
+            cva?: Cva<LabelBaseProps>;
+            typography?: CompoundMapper<TypographyVariantProps, LabelBaseProps>;
+        };
+        toggle: {
+            cva?: Cva<ToggleVariantProps>;
+            typography?: CompoundMapper<TypographyVariantProps, ToggleVariantProps>;
+        };
+        typography: {
+            cva?: Cva<TypographyVariantProps>;
+        };
+        link: {
+            cva?: Cva<LinkVariantProps>;
+        };
+        tag: {
+            cva?: Cva<TagVariantProps>;
+        };
+        table: {
+            headRowCva?: Cva<TableHeadRowVariantProps>;
+            rowCva?: Cva<TableRowVariantProps>;
+            dataCva?: Cva<TableDataVariantProps>;
+        };
+    }
+    interface ProviderProps {
+        config?: Partial<Options>;
+    }
+    export const Provider: ({ children, config }: PropsWithChildren<ProviderProps>) => import("react/jsx-runtime").JSX.Element;
+    export const useConfig: () => Partial<Options> | null | undefined;
+    export {};
+}

package/dist/config/uiStyle.context.js

@@ -0,0 +1,16 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, use } from "react";
+var UIStyle;
+((UIStyle2) => {
+  const Context = createContext(null);
+  UIStyle2.Provider = ({ children, config }) => {
+    return /* @__PURE__ */ jsx(Context.Provider, { value: config, children });
+  };
+  UIStyle2.useConfig = () => {
+    const context = use(Context);
+    return context;
+  };
+})(UIStyle || (UIStyle = {}));
+export {
+  UIStyle
+};

package/dist/helpers/dynamicColumns.d.ts

@@ -0,0 +1,44 @@
+import { CellContext, ColumnDef, ColumnMeta } from '@tanstack/react-table';
+import { ReactNode } from 'react';
+import { FieldPath } from 'react-hook-form';
+import { z } from 'zod';
+type NestedTypeFromKey<T, K extends string> = K extends keyof T ? T[K] : K extends `${infer First}.${infer Rest}` ? First extends keyof T ? NestedTypeFromKey<T[First], Rest> : never : never;
+type SchemaType<TSchema extends z.ZodObject<any>> = z.infer<TSchema>;
+type SchemaKey<TSchema extends z.ZodObject<any>> = keyof SchemaType<TSchema>;
+type NestedSchemaKey<TSchema extends z.ZodObject<any>> = FieldPath<SchemaType<TSchema>>;
+type SchemaValue<TSchema extends z.ZodObject<any>> = SchemaType<TSchema>[SchemaKey<TSchema>];
+type ColumnMetaType<TSchema extends z.ZodObject<any>> = ColumnMeta<SchemaType<TSchema>, SchemaValue<TSchema>>;
+type GetNestedValueType<TSchema extends z.ZodObject<any>, K extends string> = NestedTypeFromKey<SchemaType<TSchema>, K>;
+type NestedSchemaKeyOrString<TSchema extends z.ZodObject<any>> = NestedSchemaKey<TSchema> | (string & {});
+type DynamicColumnDef<TSchema extends z.ZodObject<any>, TValue = any> = Omit<ColumnDef<SchemaType<TSchema>, TValue>, "accessorKey" | "cell"> & {
+    cell?: ((props: CellContext<SchemaType<TSchema>, TValue>) => any) | NestedSchemaKey<TSchema>;
+};
+type ColumnsConfig<TSchema extends z.ZodObject<any>> = {
+    [K in NestedSchemaKey<TSchema>]?: DynamicColumnDef<TSchema, GetNestedValueType<TSchema, K>> | ((props: CellContext<SchemaType<TSchema>, GetNestedValueType<TSchema, K>>) => any) | NestedSchemaKey<TSchema> | boolean;
+};
+type CustomColumnDef<TSchema extends z.ZodObject<any>> = Omit<ColumnDef<SchemaType<TSchema>, any>, "accessorKey" | "cell"> & {
+    accessorKey?: NestedSchemaKeyOrString<TSchema>;
+    cell?: ((props: CellContext<SchemaType<TSchema>, any>) => any) | NestedSchemaKey<TSchema>;
+};
+type CustomColumnsConfig<TSchema extends z.ZodObject<any>> = Record<string, CustomColumnDef<TSchema> | ((props: CellContext<SchemaType<TSchema>, undefined>) => any) | NestedSchemaKey<TSchema>>;
+export interface DynamicColumnsOptions<TSchema extends z.ZodObject<any>> {
+    columns?: ColumnsConfig<TSchema>;
+    customColumns?: CustomColumnsConfig<TSchema>;
+    order?: NestedSchemaKeyOrString<TSchema>[];
+    sortable?: NestedSchemaKeyOrString<TSchema>[] | z.ZodEnum<any>;
+    disableFormatting?: NestedSchemaKeyOrString<TSchema>[];
+    emptyValue?: ReactNode;
+    namespace?: string;
+    overridePresetLocales?: boolean;
+    globalMeta?: Omit<ColumnMetaType<TSchema>, "sortKey">;
+    globalWrapper?: (children: ReactNode) => ReactNode;
+    includeAll?: boolean;
+}
+export declare const sortColumns: <TSchema extends z.ZodObject<any>>(columns: ColumnDef<SchemaType<TSchema>>[], orderKeys?: DynamicColumnsOptions<TSchema>["order"]) => ColumnDef<SchemaType<TSchema>>[];
+interface DynamicColumnsParams<TSchema extends z.ZodObject<any>> {
+    schema: TSchema;
+    preset?: ColumnDef<SchemaType<TSchema>>[];
+    options: DynamicColumnsOptions<TSchema>;
+}
+export declare const dynamicColumns: <TSchema extends z.ZodObject<any>>({ schema, preset, options, }: DynamicColumnsParams<TSchema>) => ColumnDef<SchemaType<TSchema>>[];
+export {};