@payfit/unity-components 0.0.0-alpha.8 → 1.0.0

package/dist/esm/components/full-page-loader/FullPageLoader.mjs

@@ -1,26 +0,0 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { useId as o } from "react-aria";
-import { FormattedMessage as s } from "react-intl";
-import { tv as t } from "tailwind-variants";
-import { Spinner as i } from "../spinner/Spinner.mjs";
-const n = t({
-  // add the component styles
-  base: "uy-w-full uy-h-screen uy-flex uy-place-items-center uy-justify-center"
-}), m = ({ label: r }) => {
-  const a = o();
-  return /* @__PURE__ */ l("main", { id: a, className: n(), "aria-busy": "true", children: [
-    /* @__PURE__ */ e("h1", { className: "uy-sr-only", children: r ?? /* @__PURE__ */ e(
-      s,
-      {
-        id: "unity:component:full-page-loader:label",
-        defaultMessage: "Content is loading..."
-      }
-    ) }),
-    /* @__PURE__ */ e(i, { label: "", size: "medium", role: "presentation" })
-  ] });
-};
-m.displayName = "FullPageLoader";
-export {
-  m as FullPageLoader,
-  n as fullPageLoader
-};

package/dist/esm/components/grid/Grid.d.mts

@@ -1,54 +0,0 @@
-import { VariantProps } from 'tailwind-variants';
-import { grid } from './Grid.variants.mjs';
-export type GridContainerVariantProps = VariantProps<typeof grid>;
-type ElementType = 'div' | 'span' | 'section' | 'nav' | 'aside' | 'header' | 'footer' | 'main' | 'article';
-export interface GridProps {
-    /** Render the grid container as a specific HTML element */
-    asElement?: ElementType;
-    /** Create an inline grid container instead of a block-level container */
-    inline?: GridContainerVariantProps['inline'];
-    /** Set the number of columns in the grid. Use 6 for small grids or 12 for larger ones */
-    cols?: GridContainerVariantProps['cols'];
-    /** Set the grid template rows. Use any valid syntax from CSS' grid-template-rows property */
-    rows?: string;
-    /** Set the grid template areas. Use any valid syntax from CSS' grid-template-areas property */
-    areas?: string;
-    /** Control how grid items flow. Use 'row', 'col', 'dense', 'row-dense', or 'col-dense' */
-    flow?: GridContainerVariantProps['flow'];
-    /** Align grid items along the inline axis within their cells. Use 'start', 'center', 'end', or 'stretch' */
-    justifyItems?: GridContainerVariantProps['justifyItems'];
-    /** Align grid items along the block axis within their cells. Use 'start', 'center', 'end', 'stretch', or 'baseline' */
-    alignItems?: GridContainerVariantProps['alignItems'];
-    /** Add custom classes to the grid container */
-    className?: string;
-    /** The content to be laid out using CSS Grid */
-    children?: React.ReactNode;
-}
-/**
- * The Grid component provides a powerful and intuitive way to create grid layouts using CSS Grid.
- * Use it to create responsive grid layouts with precise control over item placement and alignment.
- *
- * Key features:
- * - Create 6 or 12 column grids with the `cols` prop
- * - Control item flow with the `flow` prop
- * - Align items with `justifyItems` and `alignItems` props
- * - Create inline grids with the `inline` prop
- *
- * Use GridItem components inside Grid to control individual item behavior.
- * @example
- * ```tsx
- * // Create a basic 12-column grid
- * <Grid cols={12}>
- *   <div>Item 1</div>
- *   <div>Item 2</div>
- * </Grid>
- *
- * // Create a grid with items aligned to center
- * <Grid justifyItems="center" alignItems="center">
- *   <div>Item 1</div>
- *   <div>Item 2</div>
- * </Grid>
- * ```
- */
-export declare const Grid: import('react').ForwardRefExoticComponent<GridProps & Omit<import('react').HTMLAttributes<HTMLElement>, keyof GridProps> & import('react').RefAttributes<HTMLDivElement>>;
-export {};

package/dist/esm/components/grid/Grid.mjs

@@ -1,38 +0,0 @@
-import { jsx as y } from "react/jsx-runtime";
-import { forwardRef as N } from "react";
-import { grid as f } from "./Grid.variants.mjs";
-const g = N(
-  ({
-    asElement: r = "div",
-    className: e,
-    children: a,
-    inline: t,
-    cols: m,
-    flow: o,
-    justifyItems: l,
-    alignItems: i,
-    rows: s,
-    areas: d,
-    ...c
-  }, p) => {
-    const u = {
-      "--uy-grid-template-rows": s,
-      gridTemplateAreas: d
-    }, n = f({
-      inline: t,
-      cols: m,
-      flow: o,
-      justifyItems: l,
-      alignItems: i,
-      className: [
-        s ? "uy-grid-rows-[var(--uy-grid-template-rows)]" : "",
-        e
-      ]
-    });
-    return /* @__PURE__ */ y(r, { ref: p, className: n, style: u, ...c, children: a });
-  }
-);
-g.displayName = "Grid";
-export {
-  g as Grid
-};

package/dist/esm/components/grid/Grid.variants.d.mts

@@ -1,394 +0,0 @@
-import { VariantProps } from 'tailwind-variants';
-export declare const grid: import('tailwind-variants').TVReturnType<{
-    inline: {
-        true: string;
-        false: string;
-    };
-    cols: {
-        6: string;
-        12: string;
-    };
-    flow: {
-        row: string;
-        col: string;
-        dense: string;
-        'row-dense': string;
-        'col-dense': string;
-    };
-    justifyItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    alignItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, "uy-layout-grid-xs md:uy-layout-grid-md lg:uy-layout-grid-lg", {
-    responsiveVariants: true;
-}, {
-    inline: {
-        true: string;
-        false: string;
-    };
-    cols: {
-        6: string;
-        12: string;
-    };
-    flow: {
-        row: string;
-        col: string;
-        dense: string;
-        'row-dense': string;
-        'col-dense': string;
-    };
-    justifyItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    alignItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    inline: {
-        true: string;
-        false: string;
-    };
-    cols: {
-        6: string;
-        12: string;
-    };
-    flow: {
-        row: string;
-        col: string;
-        dense: string;
-        'row-dense': string;
-        'col-dense': string;
-    };
-    justifyItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    alignItems: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, "uy-layout-grid-xs md:uy-layout-grid-md lg:uy-layout-grid-lg", {
-    responsiveVariants: true;
-}, unknown, unknown, undefined>>;
-export type GridVariants = VariantProps<typeof grid>;
-export declare const gridItem: import('tailwind-variants').TVReturnType<{
-    colSpan: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '1/2': string;
-        '1/3': string;
-        '2/3': string;
-        '1/4': string;
-        '3/4': string;
-        '1/6': string;
-        '5/6': string;
-        full: string;
-    };
-    colStart: {
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        auto: string;
-    };
-    colEnd: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        auto: string;
-    };
-    justify: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    align: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, undefined, {
-    responsiveVariants: true;
-}, {
-    colSpan: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '1/2': string;
-        '1/3': string;
-        '2/3': string;
-        '1/4': string;
-        '3/4': string;
-        '1/6': string;
-        '5/6': string;
-        full: string;
-    };
-    colStart: {
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        auto: string;
-    };
-    colEnd: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        auto: string;
-    };
-    justify: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    align: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    colSpan: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '1/2': string;
-        '1/3': string;
-        '2/3': string;
-        '1/4': string;
-        '3/4': string;
-        '1/6': string;
-        '5/6': string;
-        full: string;
-    };
-    colStart: {
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        auto: string;
-    };
-    colEnd: {
-        '1': string;
-        '2': string;
-        '3': string;
-        '4': string;
-        '5': string;
-        '6': string;
-        '7': string;
-        '8': string;
-        '9': string;
-        '10': string;
-        '11': string;
-        '12': string;
-        '13': string;
-        '-1': string;
-        '-2': string;
-        '-3': string;
-        '-4': string;
-        '-5': string;
-        '-6': string;
-        '-7': string;
-        '-8': string;
-        '-9': string;
-        '-10': string;
-        '-11': string;
-        '-12': string;
-        '-13': string;
-        auto: string;
-    };
-    justify: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-    };
-    align: {
-        initial: string;
-        start: string;
-        end: string;
-        center: string;
-        stretch: string;
-        baseline: string;
-    };
-}, undefined, undefined, {
-    responsiveVariants: true;
-}, unknown, unknown, undefined>>;
-export type GridItemVariants = VariantProps<typeof gridItem>;

package/dist/esm/components/grid/Grid.variants.mjs

@@ -1,164 +0,0 @@
-import { tv as t } from "tailwind-variants";
-const l = t(
-  {
-    base: "uy-layout-grid-xs md:uy-layout-grid-md lg:uy-layout-grid-lg",
-    variants: {
-      // Display mode
-      inline: {
-        true: "uy-inline-grid",
-        false: ""
-      },
-      cols: {
-        6: "[--uy-layout-grid-lg__columns:6] [--uy-layout-grid-md__columns:6] [--uy-layout-grid-xs__columns:6]",
-        12: "[--uy-layout-grid-lg__columns:12] [--uy-layout-grid-md__columns:12] [--uy-layout-grid-xs__columns:12]"
-      },
-      // Flow
-      flow: {
-        row: "uy-grid-flow-row",
-        col: "uy-grid-flow-col",
-        dense: "uy-grid-flow-dense",
-        "row-dense": "uy-grid-flow-row-dense",
-        "col-dense": "uy-grid-flow-col-dense"
-      },
-      // Justify items
-      justifyItems: {
-        initial: "",
-        start: "uy-justify-items-start",
-        end: "uy-justify-items-end",
-        center: "uy-justify-items-center",
-        stretch: "uy-justify-items-stretch"
-      },
-      // Align items
-      alignItems: {
-        initial: "",
-        start: "uy-items-start",
-        end: "uy-items-end",
-        center: "uy-items-center",
-        stretch: "uy-items-stretch",
-        baseline: "uy-items-baseline uy-items-base"
-      }
-    },
-    defaultVariants: {
-      inline: !1,
-      flow: "row",
-      justifyItems: "initial",
-      alignItems: "initial"
-    }
-  },
-  {
-    responsiveVariants: !0
-  }
-), s = t(
-  {
-    variants: {
-      colSpan: {
-        1: "uy-col-span-1",
-        2: "uy-col-span-2",
-        3: "uy-col-span-3",
-        4: "uy-col-span-4",
-        5: "uy-col-span-5",
-        6: "uy-col-span-6",
-        7: "md:uy-col-span-7",
-        8: "md:uy-col-span-8",
-        9: "md:uy-col-span-9",
-        10: "md:uy-col-span-10",
-        11: "md:uy-col-span-11",
-        12: "md:uy-col-span-12",
-        "1/2": "uy-col-span-3 md:uy-col-span-6",
-        "1/3": "uy-col-span-2 md:uy-col-span-4",
-        "2/3": "uy-col-span-4 md:uy-col-span-8",
-        "1/4": "uy-col-span-1 md:uy-col-span-3",
-        "3/4": "uy-col-span-3 md:uy-col-span-9",
-        "1/6": "uy-col-span-1 md:uy-col-span-2",
-        "5/6": "uy-col-span-5 md:uy-col-span-10",
-        full: "uy-col-span-full"
-      },
-      // Column start for 12-column grid
-      colStart: {
-        "-1": "-uy-col-start-1",
-        "-2": "-uy-col-start-2",
-        "-3": "-uy-col-start-3",
-        "-4": "-uy-col-start-4",
-        "-5": "-uy-col-start-5",
-        "-6": "-uy-col-start-6",
-        "-7": "-uy-col-start-7",
-        "-8": "-uy-col-start-8",
-        "-9": "-uy-col-start-9",
-        "-10": "-uy-col-start-10",
-        "-11": "-uy-col-start-11",
-        "-12": "-uy-col-start-12",
-        "-13": "-uy-col-start-13",
-        1: "uy-col-start-1",
-        2: "uy-col-start-2",
-        3: "uy-col-start-3",
-        4: "uy-col-start-4",
-        5: "uy-col-start-5",
-        6: "uy-col-start-6",
-        7: "uy-col-start-7",
-        8: "uy-col-start-8",
-        9: "uy-col-start-9",
-        10: "uy-col-start-10",
-        11: "uy-col-start-11",
-        12: "uy-col-start-12",
-        13: "uy-col-start-13",
-        auto: "uy-col-start-auto"
-      },
-      colEnd: {
-        1: "uy-col-end-1",
-        2: "uy-col-end-2",
-        3: "uy-col-end-3",
-        4: "uy-col-end-4",
-        5: "uy-col-end-5",
-        6: "uy-col-end-6",
-        7: "uy-col-end-7",
-        8: "uy-col-end-8",
-        9: "uy-col-end-9",
-        10: "uy-col-end-10",
-        11: "uy-col-end-11",
-        12: "uy-col-end-12",
-        13: "uy-col-end-13",
-        "-1": "-uy-col-end-1",
-        "-2": "-uy-col-end-2",
-        "-3": "-uy-col-end-3",
-        "-4": "-uy-col-end-4",
-        "-5": "-uy-col-end-5",
-        "-6": "-uy-col-end-6",
-        "-7": "-uy-col-end-7",
-        "-8": "-uy-col-end-8",
-        "-9": "-uy-col-end-9",
-        "-10": "-uy-col-end-10",
-        "-11": "-uy-col-end-11",
-        "-12": "-uy-col-end-12",
-        "-13": "-uy-col-end-13",
-        auto: "uy-col-end-auto"
-      },
-      // Self alignment
-      justify: {
-        initial: "",
-        start: "uy-justify-self-start",
-        end: "uy-justify-self-end",
-        center: "uy-justify-self-center",
-        stretch: "uy-justify-self-stretch"
-      },
-      align: {
-        initial: "uy-self-auto",
-        start: "uy-self-start",
-        end: "uy-self-end",
-        center: "uy-self-center",
-        stretch: "uy-self-stretch",
-        baseline: "uy-self-baseline"
-      }
-    },
-    defaultVariants: {
-      justify: "initial",
-      align: "initial"
-    }
-  },
-  {
-    responsiveVariants: !0
-  }
-);
-export {
-  l as grid,
-  s as gridItem
-};