@atom-learning/components 9.0.0-beta.1 → 9.0.0-beta.3

package/dist/components/badge/Badge.d.ts

@@ -16,6 +16,11 @@ export declare const Badge: (({ ref, size, overflow, ...rest }: BadgeProps) => R
     Icon: (props: React.ComponentProps<typeof Icon>) => React.JSX.Element;
     Text: ({ children, ...rest }: {
         overflow?: "ellipsis" | "wrap" | undefined;
+    } & {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
     } & Omit<{
@@ -25,6 +30,6 @@ export declare const Badge: (({ ref, size, overflow, ...rest }: BadgeProps) => R
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
-    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "overflow">) => React.JSX.Element;
+    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "family" | "noCapsize" | "overflow" | "size" | "weight">) => React.JSX.Element;
 };
 export {};

package/dist/components/badge/BadgeText.d.ts

@@ -6,6 +6,11 @@ declare const StyledBadgeText: import("../..").PolymorphicComponent<import("../.
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>, {
     overflow?: "ellipsis" | "wrap" | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;
 type BadgeTextProps = React.ComponentProps<typeof StyledBadgeText>;
 export declare const BadgeText: ({ children, ...rest }: BadgeTextProps) => React.JSX.Element;

package/dist/components/data-table/DataTable.context.js

@@ -6,7 +6,7 @@ import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 import { v4 } from "@lukeed/uuid";
 import { getCoreRowModel, getExpandedRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
-import useDeepCompareEffect from "use-deep-compare-effect";
+import { useDeepCompareEffectNoCheck } from "use-deep-compare-effect";
 //#region src/components/data-table/DataTable.context.tsx
 var DataTableContext = React$1.createContext(null);
 var DataTableProvider = ({ columns, data: dataProp = [], getAsyncData, defaultSort, initialState = void 0, disabledRows, enableRowSelection, onRowSelectionChange, children }) => {
@@ -46,7 +46,7 @@ var DataTableProvider = ({ columns, data: dataProp = [], getAsyncData, defaultSo
 	React$1.useEffect(() => {
 		runAsyncData({});
 	}, [runAsyncData]);
-	useDeepCompareEffect(() => {
+	useDeepCompareEffectNoCheck(() => {
 		if (!dataProp) return;
 		setData({
 			results: dataProp,

package/dist/components/data-table/DataTable.context.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.context.js","names":[],"sources":["../../../src/components/data-table/DataTable.context.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  type DataTableContextType,\n  type InitialState,\n  type TableData,\n  type TablePosition,\n  type AsyncDataOptions,\n  type AsyncDataResult,\n  type DefaultSort,\n  type GetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: DefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: GetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps) => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<AsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<AsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as AsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (_error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount:\n      getAsyncData && paginationState\n        ? Math.ceil(getTotalRows() / paginationState.pageSize)\n        : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row) => (row as Row<unknown>).subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated\n      ? (setPaginationState as OnChangeFn<PaginationState>)\n      : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      hasAsyncData: !!getAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId,\n    getAsyncData\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"mappings":"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"}
+{"version":3,"file":"DataTable.context.js","names":[],"sources":["../../../src/components/data-table/DataTable.context.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\n// Use the named export, not the default: the CJS build's Node-mode interop\n// (__toESM(mod, 1)) shadows this package's `default` with the whole module\n// object, so a default import resolves to a non-callable object at runtime.\n// NoCheck is equivalent here — the dep (`dataProp`) is always an array, so the\n// default export's dev-only all-primitive guard would never fire.\nimport { useDeepCompareEffectNoCheck as useDeepCompareEffect } from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  type DataTableContextType,\n  type InitialState,\n  type TableData,\n  type TablePosition,\n  type AsyncDataOptions,\n  type AsyncDataResult,\n  type DefaultSort,\n  type GetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: DefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: GetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps) => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<AsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<AsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as AsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (_error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount:\n      getAsyncData && paginationState\n        ? Math.ceil(getTotalRows() / paginationState.pageSize)\n        : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row) => (row as Row<unknown>).subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated\n      ? (setPaginationState as OnChangeFn<PaginationState>)\n      : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      hasAsyncData: !!getAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId,\n    getAsyncData\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"mappings":";;;;;;;;;;AAuCA,IAAM,mBACJ,QAAM,cAAoD,IAAI;AAehE,IAAa,qBAAqB,EAChC,SACA,MAAM,WAAW,CAAC,GAClB,cACA,aACA,eAAe,KAAA,GACf,cACA,oBACA,sBACA,eAC4B;CAC5B,MAAM,UAAU,QAAM,OAAO,GAAK,CAAC;CAEnC,MAAM,CAAC,MAAM,WAAW,QAAM,SAA0B;EACtD,SAAS,YAAY,CAAC;EACtB,OAAO,UAAU,UAAU;CAC7B,CAAC;CAED,MAAM,CAAC,cAAc,mBAAmB,QAAM,SAA4B,CAAC,CAAC;CAC5E,MAAM,CAAC,UAAU,eAAe,QAAM,SAAwB,CAAC,CAAC;CAEhE,MAAM,CAAC,eAAe,oBAAoB,QAAM,SAAwB;EACtE,KAAK;EACL,QAAQ;EACR,WAAW;EACX,WAAW;CACb,CAAC;CAED,MAAM,EAAE,aAAa,iBAAiB,iBAAiB,uBACrD,cAAc,cAAc,UAAU;CAExC,MAAM,CAAC,gBAAgB,qBAAqB,QAAM,SAChD,eAAe,IACjB;CAEA,MAAM,CAAC,cAAc,mBAAmB,QAAM,SAAiB,EAAE;CAEjE,MAAM,EAAE,eAAe,YAAY,SAAS,eAC1C,gBAAgB,WAAW;CAE7B,MAAM,eAAe,QAAM,YACzB,OAAO,6BAAwD;EAC7D,IAAI,CAAC,cAAc;EAEnB,IAAI;GACF,kBAAkB,eAAe,OAAO;GAUxC,QAAQ,MARc,gBACpB,cACA,0BACA,iBACA,SACA,YACF,CAEkC;GAClC,kBAAkB,eAAe,SAAS;EAC5C,SAAS,QAAQ;GACf,kBAAkB,eAAe,QAAQ;EAC3C;CACF,GACA;EACE;EACA,iBAAiB;EACjB,iBAAiB;EACjB;EACA;CACF,CACF;CAEA,QAAM,gBAAgB;EACpB,aAAa,CAAC,CAAC;CACjB,GAAG,CAAC,YAAY,CAAC;CAEjB,kCAA2B;EACzB,IAAI,CAAC,UAAU;EAEf,QAAQ;GAAE,SAAS;GAAU,OAAO,SAAS;EAAO,CAAC;CACvD,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,qBAAqB,KAAK;CAEhC,MAAM,QAAQ,cAAuB;EACnC;EACA,MAAM,KAAK;EACX,WACE,gBAAgB,kBACZ,KAAK,KAAK,aAAa,IAAI,gBAAgB,QAAQ,IACnD;EACQ;EACd,OAAO;GACL;GACA;GACA,YAAY;GACZ;GACA;EACF;EACA,kBAAkB,gBAAgB;EAClC,eAAe,gBAAgB;EAC/B,eAAe,mBAAmB,eAAe;EACjD,oBAAoB,CAAC;EACrB;EACA,kBAAkB;EAClB,aAAa,QAAS,IAAqB;EAC3C,uBAAuB,mBAAmB;GACxC,IAAI,sBAAsB,qBAAqB,cAAc;GAC7D,gBAAgB,cAAc;EAChC;EACA,iBAAiB,gBAAgB;EACjC,uBAAuB,cAAc,sBAAsB,IAAI,KAAA;EAC/D,mBACE,cAAc,QAAQ,SAAS,kBAAkB,IAAI,KAAA;EACvD,qBAAqB,oBAAoB;EACzC,qBAAqB,oBAAoB;EACzC,oBAAoB,cACf,qBACD,KAAA;EACJ,iBAAiB;EACjB,sBAAsB;EACtB,iBAAiB,KAAK,UAAU,gBAAgB;GAC9C,MAAM,0BAA0B,cAC9B,UAAU,YAAY,CAAC,CAAC,SAAS,YAAY,YAAY,CAAC;GAI5D,IAFiB,IAAI,QAAQ,GAEf,OAAO;GAErB,MAAM,QAAQ,IAAI,SAAS,QAAQ;GACnC,QAAQ,OAAO,OAAf;IACE,KAAK,UACH,OAAO,uBAAuB,KAAK;IACrC,KAAK;IACL,KAAK,UACH,OAAO,uBAAuB,OAAO,KAAK,CAAC;IAC7C,SACE,OAAO;GACX;EACF;CACF,CAAC;CAED,MAAM,QAA8B,QAAM,cAAc;EACtD,OAAO;GACL,GAAG;GACH;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc,CAAC,CAAC;GAChB;GACA;GACA;GACA;GACA;GACA,SAAS,QAAQ;EACnB;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,iBAAiB,UAAlB;EAAkC;EAC/B;CACwB,CAAA;AAE/B;AAEA,IAAa,qBAAwD;CACnE,MAAM,UAAU,QAAM,WAAW,gBAAgB;CAEjD,IAAI,CAAC,SACH,MAAM,IAAI,MACR,iEACF;CAEF,OAAO;AACT"}

package/dist/components/data-table/DataTable.d.ts

@@ -91,6 +91,11 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
      * If you need more customisation options, you can compose your own implementation with our UI-only input components and `useDataTable`.
      */
     GlobalFilter: ({ onChange, label, hideLabel, ...rest }: Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "size"> & Omit<{
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    } & {
         as?: never;
     } & Omit<{
         size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
@@ -99,7 +104,7 @@ export declare const DataTable: (({ columns, data: dataProp, getAsyncData, defau
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
-    } & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as">, "as" | "ref" | "type"> & {
+    } & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "ref" | "type"> & {
         type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search';
         as?: never;
         disabled?: boolean;

package/dist/components/data-table/DataTable.types.d.ts

@@ -1,4 +1,4 @@
-import type { ColumnOrderTableState, ColumnPinningTableState, ColumnSizingTableState, ExpandedTableState, ColumnFiltersTableState, GlobalFilterTableState, GroupingTableState, PaginationTableState, Row, RowSelectionState, RowSelectionTableState, SortDirection, SortingTableState, Table, VisibilityTableState } from '@tanstack/react-table';
+import type { InitialTableState, Row, RowSelectionState, SortDirection, Table } from '@tanstack/react-table';
 import * as React from 'react';
 export declare enum AsyncDataState {
     NONE = "none",
@@ -50,7 +50,7 @@ export type DataTableContextType<T = unknown> = Table<T> & {
     setData: React.Dispatch<React.SetStateAction<AsyncDataResult>>;
 };
 export type TableData = Array<Record<string, unknown>>;
-export type InitialState = Partial<VisibilityTableState & ColumnOrderTableState & ColumnPinningTableState & ColumnFiltersTableState & GlobalFilterTableState & SortingTableState & ExpandedTableState & GroupingTableState & ColumnSizingTableState & PaginationTableState & RowSelectionTableState>;
+export type InitialState = InitialTableState;
 export type DefaultSort = {
     column: string;
     direction: SortDirection;

package/dist/components/data-table/DataTable.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.types.js","names":[],"sources":["../../../src/components/data-table/DataTable.types.ts"],"sourcesContent":["import type {\n  ColumnOrderTableState,\n  ColumnPinningTableState,\n  ColumnSizingTableState,\n  ExpandedTableState,\n  ColumnFiltersTableState,\n  GlobalFilterTableState,\n  GroupingTableState,\n  PaginationTableState,\n  Row,\n  RowSelectionState,\n  RowSelectionTableState,\n  SortDirection,\n  SortingTableState,\n  Table,\n  VisibilityTableState\n} from '@tanstack/react-table'\nimport * as React from 'react'\n\nexport enum AsyncDataState {\n  NONE = 'none',\n  PENDING = 'pending',\n  FULFILLED = 'fulfilled',\n  REJECTED = 'rejected'\n}\n\nexport type AsyncDataResult = {\n  total: number\n  results: TableData\n}\n\nexport type AsyncDataOptions = {\n  pageIndex: number\n  pageSize: number\n  sortBy?: string\n  sortDirection?: SortDirection\n  globalFilter?: string\n}\n\nexport type GetAsyncData = (\n  options: AsyncDataOptions\n) => Promise<AsyncDataResult | undefined>\n\nexport type TablePosition = {\n  top: number | null\n  bottom: number | null\n  offsetTop: number\n  isVisible: boolean\n}\n\nexport type DataTableContextType<T = unknown> = Table<T> & {\n  setIsSortable: React.Dispatch<React.SetStateAction<boolean>>\n  applyPagination: () => void\n  getTotalRows: () => number\n  isSortable: boolean\n  asyncDataState?: AsyncDataState\n  runAsyncData?: (options: Partial<AsyncDataOptions>) => Promise<void>\n  hasAsyncData: boolean\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  rowSelection: RowSelectionState\n  tablePosition?: TablePosition\n  setTablePosition: React.Dispatch<React.SetStateAction<TablePosition>>\n  data: AsyncDataResult\n  columns: any\n  tableId: string\n  /**\n   * Directly update the data array that the table rows are built from.\n   * This is useful when re-ordering rows, but is high-risk if you're not sure what you're doing!\n   *\n   *  Note in particular that this value is also updated if you update the value of the `DataTable`'s `data` prop\n   *  — it's probably best to only use one of those two methods for any given table.\n   */\n  setData: React.Dispatch<React.SetStateAction<AsyncDataResult>>\n}\n\nexport type TableData = Array<Record<string, unknown>>\n\nexport type InitialState = Partial<\n  VisibilityTableState &\n    ColumnOrderTableState &\n    ColumnPinningTableState &\n    ColumnFiltersTableState &\n    GlobalFilterTableState &\n    SortingTableState &\n    ExpandedTableState &\n    GroupingTableState &\n    ColumnSizingTableState &\n    PaginationTableState &\n    RowSelectionTableState\n>\n\nexport type DefaultSort = { column: string; direction: SortDirection }\n"],"mappings":";;AAmBA,IAAY,iBAAL,yBAAA,gBAAA;CACL,eAAA,UAAA;CACA,eAAA,aAAA;CACA,eAAA,eAAA;CACA,eAAA,cAAA;;AACF,EAAA,CAAA,CAAA"}
+{"version":3,"file":"DataTable.types.js","names":[],"sources":["../../../src/components/data-table/DataTable.types.ts"],"sourcesContent":["import type {\n  InitialTableState,\n  Row,\n  RowSelectionState,\n  SortDirection,\n  Table\n} from '@tanstack/react-table'\nimport * as React from 'react'\n\nexport enum AsyncDataState {\n  NONE = 'none',\n  PENDING = 'pending',\n  FULFILLED = 'fulfilled',\n  REJECTED = 'rejected'\n}\n\nexport type AsyncDataResult = {\n  total: number\n  results: TableData\n}\n\nexport type AsyncDataOptions = {\n  pageIndex: number\n  pageSize: number\n  sortBy?: string\n  sortDirection?: SortDirection\n  globalFilter?: string\n}\n\nexport type GetAsyncData = (\n  options: AsyncDataOptions\n) => Promise<AsyncDataResult | undefined>\n\nexport type TablePosition = {\n  top: number | null\n  bottom: number | null\n  offsetTop: number\n  isVisible: boolean\n}\n\nexport type DataTableContextType<T = unknown> = Table<T> & {\n  setIsSortable: React.Dispatch<React.SetStateAction<boolean>>\n  applyPagination: () => void\n  getTotalRows: () => number\n  isSortable: boolean\n  asyncDataState?: AsyncDataState\n  runAsyncData?: (options: Partial<AsyncDataOptions>) => Promise<void>\n  hasAsyncData: boolean\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  rowSelection: RowSelectionState\n  tablePosition?: TablePosition\n  setTablePosition: React.Dispatch<React.SetStateAction<TablePosition>>\n  data: AsyncDataResult\n  columns: any\n  tableId: string\n  /**\n   * Directly update the data array that the table rows are built from.\n   * This is useful when re-ordering rows, but is high-risk if you're not sure what you're doing!\n   *\n   *  Note in particular that this value is also updated if you update the value of the `DataTable`'s `data` prop\n   *  — it's probably best to only use one of those two methods for any given table.\n   */\n  setData: React.Dispatch<React.SetStateAction<AsyncDataResult>>\n}\n\nexport type TableData = Array<Record<string, unknown>>\n\n// Use tanstack's purpose-built initial-state type rather than composing from\n// the full `*TableState` interfaces: a shallow `Partial<… & PaginationTableState>`\n// leaves `pagination` typed as the full `PaginationState` (requiring `pageIndex`),\n// whereas `InitialTableState` correctly types it as `Partial<PaginationState>` so\n// consumers can pass e.g. `{ pagination: { pageSize } }`.\nexport type InitialState = InitialTableState\n\nexport type DefaultSort = { column: string; direction: SortDirection }\n"],"mappings":";;AASA,IAAY,iBAAL,yBAAA,gBAAA;CACL,eAAA,UAAA;CACA,eAAA,aAAA;CACA,eAAA,eAAA;CACA,eAAA,cAAA;;AACF,EAAA,CAAA,CAAA"}

package/dist/components/data-table/usePagination.d.ts

@@ -1,6 +1,6 @@
 import type { PaginationState } from '@tanstack/react-table';
 import * as React from 'react';
-export declare const usePagination: (initialPaginationState: PaginationState | undefined) => {
+export declare const usePagination: (initialPaginationState: Partial<PaginationState> | undefined) => {
     isPaginated: boolean;
     paginationState: PaginationState | undefined;
     setPaginationState: React.Dispatch<React.SetStateAction<PaginationState | undefined>>;

package/dist/components/data-table/usePagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePagination.js","names":[],"sources":["../../../src/components/data-table/usePagination.ts"],"sourcesContent":["import type { PaginationState } from '@tanstack/react-table'\nimport * as React from 'react'\n\nconst defaultPaginationState: PaginationState = { pageIndex: 0, pageSize: 10 }\nexport const usePagination = (\n  initialPaginationState: PaginationState | undefined\n) => {\n  const [isPaginated, setIsPaginated] = React.useState<boolean>(\n    !!initialPaginationState\n  )\n\n  const [paginationState, setPaginationState] = React.useState<\n    PaginationState | undefined\n  >({\n    ...defaultPaginationState,\n    ...(initialPaginationState || {})\n  })\n\n  const applyPagination = React.useCallback(() => {\n    setIsPaginated(true)\n  }, [])\n\n  return {\n    isPaginated,\n    paginationState,\n    setPaginationState,\n    applyPagination\n  }\n}\n"],"mappings":";;AAGA,IAAM,yBAA0C;CAAE,WAAW;CAAG,UAAU;AAAG;AAC7E,IAAa,iBACX,2BACG;CACH,MAAM,CAAC,aAAa,kBAAkB,QAAM,SAC1C,CAAC,CAAC,sBACJ;CAEA,MAAM,CAAC,iBAAiB,sBAAsB,QAAM,SAElD;EACA,GAAG;EACH,GAAI,0BAA0B,CAAC;CACjC,CAAC;CAMD,OAAO;EACL;EACA;EACA;EACA,iBARsB,QAAM,kBAAkB;GAC9C,eAAe,IAAI;EACrB,GAAG,CAAC,CAMF;CACF;AACF"}
+{"version":3,"file":"usePagination.js","names":[],"sources":["../../../src/components/data-table/usePagination.ts"],"sourcesContent":["import type { PaginationState } from '@tanstack/react-table'\nimport * as React from 'react'\n\nconst defaultPaginationState: PaginationState = { pageIndex: 0, pageSize: 10 }\nexport const usePagination = (\n  // Initial pagination may be partial (e.g. just `pageSize`); defaults below\n  // fill the rest, so the working `paginationState` stays a full PaginationState.\n  initialPaginationState: Partial<PaginationState> | undefined\n) => {\n  const [isPaginated, setIsPaginated] = React.useState<boolean>(\n    !!initialPaginationState\n  )\n\n  const [paginationState, setPaginationState] = React.useState<\n    PaginationState | undefined\n  >({\n    ...defaultPaginationState,\n    ...(initialPaginationState || {})\n  })\n\n  const applyPagination = React.useCallback(() => {\n    setIsPaginated(true)\n  }, [])\n\n  return {\n    isPaginated,\n    paginationState,\n    setPaginationState,\n    applyPagination\n  }\n}\n"],"mappings":";;AAGA,IAAM,yBAA0C;CAAE,WAAW;CAAG,UAAU;AAAG;AAC7E,IAAa,iBAGX,2BACG;CACH,MAAM,CAAC,aAAa,kBAAkB,QAAM,SAC1C,CAAC,CAAC,sBACJ;CAEA,MAAM,CAAC,iBAAiB,sBAAsB,QAAM,SAElD;EACA,GAAG;EACH,GAAI,0BAA0B,CAAC;CACjC,CAAC;CAMD,OAAO;EACL;EACA;EACA;EACA,iBARsB,QAAM,kBAAkB;GAC9C,eAAe,IAAI;EACrB,GAAG,CAAC,CAMF;CACF;AACF"}

package/dist/components/empty-state/EmptyState.d.ts

@@ -25,6 +25,11 @@ export declare const EmptyState: {
     }) => React.JSX.Element;
     Body: (props: {
         size?: ("lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    } & {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
     } & Omit<{
@@ -34,6 +39,6 @@ export declare const EmptyState: {
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
-    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "size">) => React.JSX.Element;
+    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "family" | "noCapsize" | "size" | "weight">) => React.JSX.Element;
 };
 export {};

package/dist/components/empty-state/EmptyStateBody.d.ts

@@ -6,6 +6,11 @@ declare const StyledEmptyStateBody: import("../..").PolymorphicComponent<import(
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>, {
     size?: ("lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;
 type EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody>;
 export declare const EmptyStateBody: (props: EmptyStateBodyProps) => React.JSX.Element;

package/dist/components/file-input/FileInput.d.ts

@@ -1,12 +1,13 @@
 import * as React from 'react';
-import type { StyledComponentProps } from '../../styled';
+import { type StyledComponentProps } from '../../styled';
 import { Button } from '../button/Button';
 export type FileInputProps = Omit<StyledComponentProps<typeof Button, 'label'>, 'as'> & {
     onFileSelect: (selection: FileList | null) => void;
     accept?: string;
     multiple?: boolean;
+    disabled?: boolean;
 };
-export declare function FileInput({ accept, children, multiple, onFileSelect, ...rest }: FileInputProps): React.JSX.Element;
+export declare function FileInput({ accept, children, className, disabled, multiple, onFileSelect, ...rest }: FileInputProps): React.JSX.Element;
 export declare namespace FileInput {
     var displayName: string;
 }

package/dist/components/file-input/FileInput.js

@@ -1,16 +1,19 @@
+import { cn } from "../../styled.js";
 import { Button } from "../button/Button.js";
 import { Icon } from "../icon/Icon.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Upload } from "@atom-learning/icons";
 //#region src/components/file-input/FileInput.tsx
-var FileInput = ({ accept, children, multiple = false, onFileSelect, ...rest }) => {
+var FileInput = ({ accept, children, className, disabled = false, multiple = false, onFileSelect, ...rest }) => {
 	const handleFileSelect = (event) => {
 		const { files } = event.target;
 		onFileSelect(files);
 	};
 	return /* @__PURE__ */ jsxs(Button, {
 		as: "label",
+		"aria-disabled": disabled || void 0,
+		className: cn(disabled && "pointer-events-none cursor-not-allowed opacity-30", className),
 		...rest,
 		children: [
 			/* @__PURE__ */ jsx(Icon, { is: Upload }),
@@ -20,6 +23,7 @@ var FileInput = ({ accept, children, multiple = false, onFileSelect, ...rest })
 				onChange: handleFileSelect,
 				accept,
 				multiple,
+				disabled,
 				hidden: true
 			})
 		]

package/dist/components/file-input/FileInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.js","names":[],"sources":["../../../src/components/file-input/FileInput.tsx"],"sourcesContent":["import { Upload } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport type { StyledComponentProps } from '../../styled'\nimport { Button } from '../button/Button'\nimport { Icon } from '../icon/Icon'\n\n// FileInput always renders the Button as a <label>, so its public props are\n// Button's own props retargeted to the label element\nexport type FileInputProps = Omit<\n  StyledComponentProps<typeof Button, 'label'>,\n  'as'\n> & {\n  onFileSelect: (selection: FileList | null) => void\n  accept?: string\n  multiple?: boolean\n}\n\nexport const FileInput = ({\n  accept,\n  children,\n  multiple = false,\n  onFileSelect,\n  ...rest\n}: FileInputProps) => {\n  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const { files } = event.target\n\n    onFileSelect(files)\n  }\n\n  return (\n    <Button as=\"label\" {...rest}>\n      <Icon is={Upload} />\n      {children}\n      <input\n        type=\"file\"\n        onChange={handleFileSelect}\n        accept={accept}\n        multiple={multiple}\n        hidden\n      />\n    </Button>\n  )\n}\n\nFileInput.displayName = 'FileInput'\n"],"mappings":";;;;;;AAkBA,IAAa,aAAa,EACxB,QACA,UACA,WAAW,OACX,cACA,GAAG,WACiB;CACpB,MAAM,oBAAoB,UAA+C;EACvE,MAAM,EAAE,UAAU,MAAM;EAExB,aAAa,KAAK;CACpB;CAEA,OACE,qBAAC,QAAD;EAAQ,IAAG;EAAQ,GAAI;YAAvB;GACE,oBAAC,MAAD,EAAM,IAAI,OAAS,CAAA;GAClB;GACD,oBAAC,SAAD;IACE,MAAK;IACL,UAAU;IACF;IACE;IACV,QAAA;GACD,CAAA;EACK;;AAEZ;AAEA,UAAU,cAAc"}
+{"version":3,"file":"FileInput.js","names":[],"sources":["../../../src/components/file-input/FileInput.tsx"],"sourcesContent":["import { Upload } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { cn, type StyledComponentProps } from '../../styled'\nimport { Button } from '../button/Button'\nimport { Icon } from '../icon/Icon'\n\n// FileInput always renders the Button as a <label>, so its public props are\n// Button's own props retargeted to the label element\nexport type FileInputProps = Omit<\n  StyledComponentProps<typeof Button, 'label'>,\n  'as'\n> & {\n  onFileSelect: (selection: FileList | null) => void\n  accept?: string\n  multiple?: boolean\n  disabled?: boolean\n}\n\nexport const FileInput = ({\n  accept,\n  children,\n  className,\n  disabled = false,\n  multiple = false,\n  onFileSelect,\n  ...rest\n}: FileInputProps) => {\n  const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const { files } = event.target\n\n    onFileSelect(files)\n  }\n\n  // The rendered element is a <label>, which ignores the `disabled` attribute\n  // and never matches `:disabled`. Disable the hidden input (so the label can't\n  // open the picker) and mirror Button's disabled affordance via aria-disabled\n  // + pointer-events-none/opacity so the state is visible and interaction-free.\n  return (\n    <Button\n      as=\"label\"\n      aria-disabled={disabled || undefined}\n      className={cn(\n        disabled && 'pointer-events-none cursor-not-allowed opacity-30',\n        className\n      )}\n      {...rest}\n    >\n      <Icon is={Upload} />\n      {children}\n      <input\n        type=\"file\"\n        onChange={handleFileSelect}\n        accept={accept}\n        multiple={multiple}\n        disabled={disabled}\n        hidden\n      />\n    </Button>\n  )\n}\n\nFileInput.displayName = 'FileInput'\n"],"mappings":";;;;;;;AAmBA,IAAa,aAAa,EACxB,QACA,UACA,WACA,WAAW,OACX,WAAW,OACX,cACA,GAAG,WACiB;CACpB,MAAM,oBAAoB,UAA+C;EACvE,MAAM,EAAE,UAAU,MAAM;EAExB,aAAa,KAAK;CACpB;CAMA,OACE,qBAAC,QAAD;EACE,IAAG;EACH,iBAAe,YAAY,KAAA;EAC3B,WAAW,GACT,YAAY,qDACZ,SACF;EACA,GAAI;YAPN;GASE,oBAAC,MAAD,EAAM,IAAI,OAAS,CAAA;GAClB;GACD,oBAAC,SAAD;IACE,MAAK;IACL,UAAU;IACF;IACE;IACA;IACV,QAAA;GACD,CAAA;EACK;;AAEZ;AAEA,UAAU,cAAc"}

package/dist/components/input/Input.d.ts

@@ -11,7 +11,12 @@ declare const StyledInputText: import("../..").PolymorphicComponent<import("../.
     noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-}>, unknown>;
+}>, {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>;
 export type InputTextProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> & Omit<React.ComponentProps<typeof StyledInputText>, 'type' | 'as' | 'ref'> & {
     type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search';
     as?: never;

package/dist/components/keyboard-shortcut/KeyboardShortcut.d.ts

@@ -20,7 +20,12 @@ declare const StyledKeyboardShortcutIndicator: import("../..").PolymorphicCompon
     noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-}>, unknown>;
+}>, {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>;
 type KeyboardShortcutIndicatorProps = React.ComponentProps<typeof StyledKeyboardShortcutIndicator>;
 export declare const KeyboardShortcutIndicator: (props: KeyboardShortcutIndicatorProps) => React.JSX.Element;
 export {};

package/dist/components/keyboard-shortcut/index.d.ts

@@ -12,6 +12,11 @@ export declare const KeyboardShortcut: (({ ref, asChild, config, targetWindow, o
     ref?: React.Ref<HTMLDivElement>;
 }) => import("react").JSX.Element) & {
     Indicator: (props: {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    } & {
         as?: never;
     } & Omit<{
         size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
@@ -20,5 +25,5 @@ export declare const KeyboardShortcut: (({ ref, asChild, config, targetWindow, o
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
-    } & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as">) => import("react").JSX.Element;
+    } & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "family" | "noCapsize" | "size" | "weight">) => import("react").JSX.Element;
 };

package/dist/components/navigation/NavigationMenu.d.ts

@@ -35,7 +35,12 @@ export declare const NavigationMenu: {
         noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-    }>, unknown>;
+    }>, {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    }>;
     DropdownTrigger: ({ ref, children, active, ...rest }: React.ComponentProps<import("../..").PolymorphicComponent<React.ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>, {
         active?: boolean | undefined;
     }>>) => React.JSX.Element;

package/dist/components/navigation/NavigationMenuDropdownItem.d.ts

@@ -6,4 +6,9 @@ export declare const NavigationMenuDropdownItemTitle: import("../..").Polymorphi
     noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-}>, unknown>;
+}>, {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>;

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.d.ts

@@ -596,6 +596,11 @@ export declare const NavigationMenuVertical: (({ children, ...rest }: Navigation
     }) => React.JSX.Element, unknown>>) => React.JSX.Element;
     Text: (props: {
         isExpanded?: boolean | undefined;
+    } & {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
     } & Omit<{
@@ -605,6 +610,6 @@ export declare const NavigationMenuVertical: (({ children, ...rest }: Navigation
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     } & {
         as?: never;
-    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "isExpanded">) => React.JSX.Element;
+    } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "as" | "family" | "noCapsize" | "size" | "weight">, "as" | "family" | "isExpanded" | "noCapsize" | "size" | "weight">) => React.JSX.Element;
 };
 export {};

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalText.d.ts

@@ -6,6 +6,11 @@ declare const StyledNavigationMenuVerticalText: import("../..").PolymorphicCompo
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>, {
     isExpanded?: boolean | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;
 type StyledNavigationMenuVerticalTextProps = React.ComponentProps<typeof StyledNavigationMenuVerticalText>;
 export declare const NavigationMenuVerticalText: (props: StyledNavigationMenuVerticalTextProps) => React.JSX.Element;

package/dist/components/segmented-control/SegmentedControl.d.ts

@@ -11,6 +11,11 @@ export declare const SegmentedControl: {
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     }>, {
         size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+    } & {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     }>>, 'size'>) => import("react").JSX.Element;
     Description: (props: Omit<React.ComponentProps<import("../..").PolymorphicComponent<import("../..").PolymorphicComponent<"p", {
         size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
@@ -19,6 +24,11 @@ export declare const SegmentedControl: {
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     }>, {
         size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+    } & {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
     }>>, 'size'>) => import("react").JSX.Element;
     Icon: (props: Omit<React.ComponentProps<typeof import("..").Icon>, 'size'>) => import("react").JSX.Element;
     Content: import("../..").PolymorphicComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>>, unknown>;

package/dist/components/segmented-control/SegmentedControlDescription.d.ts

@@ -6,6 +6,11 @@ declare const StyledText: import("../..").PolymorphicComponent<import("../..").P
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>, {
     size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;
 export declare const SegmentedControlDescription: (props: Omit<React.ComponentProps<typeof StyledText>, 'size'>) => React.JSX.Element;
 export {};

package/dist/components/segmented-control/SegmentedControlHeading.d.ts

@@ -6,6 +6,11 @@ declare const StyledHeading: import("../..").PolymorphicComponent<import("../.."
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>, {
     size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;
 export declare const SegmentedControlHeading: (props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>) => React.JSX.Element;
 export {};

package/dist/components/side-bar/SideBar.d.ts

@@ -27,7 +27,12 @@ export declare const SideBar: (({ theme, className, children, type, offset, styl
         noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-    }>, unknown>;
+    }>, {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    }>;
     Header: import("../..").PolymorphicComponent<"div", unknown>;
     Body: import("../..").PolymorphicComponent<"div", unknown>;
     Footer: import("../..").PolymorphicComponent<"div", unknown>;

package/dist/components/side-bar/SideBarComponents.d.ts

@@ -21,4 +21,9 @@ export declare const SideBarBrandName: import("../..").PolymorphicComponent<impo
     noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-}>, unknown>;
+}>, {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>;

package/dist/components/stepper/StepperStepLabel.d.ts

@@ -6,4 +6,9 @@ export declare const StepperStepLabel: import("../..").PolymorphicComponent<impo
 }>, {
     direction?: "horizontal" | "vertical" | undefined;
     status?: "active" | "completed" | "default" | "reviewed" | "success" | "viewed" | undefined;
+} & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 }>;

package/dist/components/top-bar/TopBar.d.ts

@@ -21,7 +21,12 @@ export declare const TopBar: {
         noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
         family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-    }>, unknown>;
+    }>, {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    }>;
     ActionIcon: ({ ref, icon, ...rest }: Omit<Omit<{
         theme?: ("danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white">>) | undefined;
         appearance?: ("outline" | "simple" | "solid" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "outline" | "simple" | "solid">>) | undefined;

package/dist/components/top-bar/TopBarBrand.d.ts

@@ -8,5 +8,10 @@ export declare const TopBarBrandName: import("../..").PolymorphicComponent<impor
     noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
     family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
-}>, unknown>;
+}>, {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>;
 export declare const TopBarBrand: import("../..").PolymorphicComponent<"a", unknown>;