@regardio/react 0.6.0 → 0.7.3

package/dist/grid/index.d.mts

@@ -1,1185 +1,80 @@
-import * as react5 from "react";
 import { HTMLAttributes } from "react";
-import { VariantProps } from "@regardio/tailwind/utils";
-import * as tailwind_variants0 from "tailwind-variants";
 
 //#region src/grid/grid-item.d.ts
-declare const gridItem: tailwind_variants0.TVReturnType<{
-  end: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-  rowSpan: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  span: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanLg: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanMd: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanSm: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXl: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXs: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  start: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, undefined, {
-  end: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-  rowSpan: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  span: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanLg: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanMd: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanSm: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXl: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXs: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  start: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, tailwind_variants0.TVReturnType<{
-  end: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-  rowSpan: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  span: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanLg: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanMd: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanSm: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXl: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  spanXs: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    full: {
-      root: string;
-    };
-  };
-  start: {
-    1: {
-      root: string;
-    };
-    2: {
-      root: string;
-    };
-    3: {
-      root: string;
-    };
-    4: {
-      root: string;
-    };
-    5: {
-      root: string;
-    };
-    6: {
-      root: string;
-    };
-    7: {
-      root: string;
-    };
-    8: {
-      root: string;
-    };
-    9: {
-      root: string;
-    };
-    10: {
-      root: string;
-    };
-    11: {
-      root: string;
-    };
-    12: {
-      root: string;
-    };
-    13: {
-      root: string;
-    };
-    auto: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, undefined, unknown, unknown, undefined>>;
-type GridItemVariants = VariantProps<typeof gridItem>;
+declare const GRID_ITEM_VARIANTS: {
+  readonly end: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, "auto"];
+  readonly rowSpan: readonly [1, 2, 3, 4, 5, 6, "full"];
+  readonly span: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly spanLg: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly spanMd: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly spanSm: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly spanXl: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly spanXs: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, "full"];
+  readonly start: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, "auto"];
+};
+interface GridItemVariantProps {
+  end?: (typeof GRID_ITEM_VARIANTS.end)[number];
+  rowSpan?: (typeof GRID_ITEM_VARIANTS.rowSpan)[number];
+  span?: (typeof GRID_ITEM_VARIANTS.span)[number];
+  spanLg?: (typeof GRID_ITEM_VARIANTS.spanLg)[number];
+  spanMd?: (typeof GRID_ITEM_VARIANTS.spanMd)[number];
+  spanSm?: (typeof GRID_ITEM_VARIANTS.spanSm)[number];
+  spanXl?: (typeof GRID_ITEM_VARIANTS.spanXl)[number];
+  spanXs?: (typeof GRID_ITEM_VARIANTS.spanXs)[number];
+  start?: (typeof GRID_ITEM_VARIANTS.start)[number];
+}
+interface GridItemSlotProps {
+  class?: string;
+  className?: string;
+}
+interface GridItemSlots {
+  root: (props?: GridItemSlotProps) => string;
+}
+type GridItemStyleFn = (props?: GridItemVariantProps) => GridItemSlots;
+declare const gridItem: GridItemStyleFn;
+type GridItemVariants = GridItemVariantProps;
 interface GridItemProps extends HTMLAttributes<HTMLDivElement>, GridItemVariants {
   classNames?: {
     root?: string;
   };
+  ref?: React.Ref<HTMLDivElement>;
 }
-declare const GridItem: react5.ForwardRefExoticComponent<GridItemProps & react5.RefAttributes<HTMLDivElement>>;
+declare const GridItem: ({
+  children,
+  className,
+  classNames,
+  span,
+  spanXs,
+  spanSm,
+  spanMd,
+  spanLg,
+  spanXl,
+  start,
+  end,
+  rowSpan,
+  ref,
+  ...props
+}: GridItemProps) => React.JSX.Element;
 //#endregion
 //#region src/grid/grid-root.d.ts
-declare const grid: tailwind_variants0.TVReturnType<{
-  align: {
-    center: {
-      root: string;
-    };
-    end: {
-      root: string;
-    };
-    start: {
-      root: string;
-    };
-    stretch: {
-      root: string;
-    };
-  };
-  flow: {
-    column: {
-      root: string;
-    };
-    dense: {
-      root: string;
-    };
-    row: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, undefined, {
-  align: {
-    center: {
-      root: string;
-    };
-    end: {
-      root: string;
-    };
-    start: {
-      root: string;
-    };
-    stretch: {
-      root: string;
-    };
-  };
-  flow: {
-    column: {
-      root: string;
-    };
-    dense: {
-      root: string;
-    };
-    row: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, tailwind_variants0.TVReturnType<{
-  align: {
-    center: {
-      root: string;
-    };
-    end: {
-      root: string;
-    };
-    start: {
-      root: string;
-    };
-    stretch: {
-      root: string;
-    };
-  };
-  flow: {
-    column: {
-      root: string;
-    };
-    dense: {
-      root: string;
-    };
-    row: {
-      root: string;
-    };
-  };
-}, {
-  root: string[];
-}, undefined, unknown, unknown, undefined>>;
-type GridVariants = VariantProps<typeof grid>;
+declare const GRID_VARIANTS: {
+  readonly align: readonly ["center", "end", "start", "stretch"];
+  readonly flow: readonly ["column", "dense", "row"];
+};
+interface GridVariantProps {
+  align?: (typeof GRID_VARIANTS.align)[number];
+  flow?: (typeof GRID_VARIANTS.flow)[number];
+}
+interface GridSlotProps {
+  class?: string;
+  className?: string;
+}
+interface GridSlots {
+  root: (props?: GridSlotProps) => string;
+}
+type GridStyleFn = (props?: GridVariantProps) => GridSlots;
+declare const grid: GridStyleFn;
+type GridVariants = GridVariantProps;
 interface GridContextValue {
   styles: ReturnType<typeof grid>;
 }
@@ -1188,8 +83,17 @@ interface GridRootProps extends HTMLAttributes<HTMLDivElement>, GridVariants {
   classNames?: {
     root?: string;
   };
+  ref?: React.Ref<HTMLDivElement>;
 }
-declare const GridRoot: react5.ForwardRefExoticComponent<GridRootProps & react5.RefAttributes<HTMLDivElement>>;
+declare const GridRoot: ({
+  children,
+  className,
+  classNames,
+  flow,
+  align,
+  ref,
+  ...props
+}: GridRootProps) => React.JSX.Element;
 declare namespace index_parts_d_exports {
   export { GridItem as Item, GridRoot as Root };
 }