@persona/design-system 0.10.6 → 0.10.8

package/dist/{PageLayout-DCe3F76N.mjs.map → PageLayout-DjtGrvJa.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"PageLayout-DCe3F76N.mjs","names":[],"sources":["../src/patterns/PageLayout/PageLayout.tsx","../src/patterns/PageLayout/PageLayoutFrame.tsx","../src/patterns/PageLayout/SingleColumnLayout.tsx","../src/patterns/PageLayout/SplitColumnLayout.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nexport const Backdrop = styled.div`\n  position: relative;\n  width: 100%;\n  padding: ${Spacing[7]} ${Spacing[5]};\n\n  display: flex;\n  flex-direction: column;\n`;\n\nconst StyledContainer = styled('div')`\n  position: relative;\n  width: 100%;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n`;\n\nexport const Container = ({\n  children,\n  ...rest\n}: { children: ReactNode } & ComponentPropsWithoutRef<'div'>) => {\n  return <StyledContainer {...rest}>{children}</StyledContainer>;\n};\n\nexport const Section = styled('div')`\n  width: 100%;\n  padding: ${Spacing[7]};\n`;\n","import { type ReactNode, useLayoutEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport Grid, { GRID_BREAKPOINTS, GridItem } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nexport type PageLayoutWidth = 'standard' | 'wide';\n\nexport interface PageLayoutChromeProps {\n  /**\n   * `standard` uses the fixed grid (centered, max 1408px). `wide` uses the fluid grid.\n   *\n   * @defaultValue 'standard'\n   */\n  width?: PageLayoutWidth;\n  /** Tab group. Sits above the page notice and scrolls with the page. Omit to skip the region and its gap. */\n  tabs?: ReactNode;\n  /** Page notice under the tabs. Omit to skip the region and its gap. */\n  pageNotice?: ReactNode;\n}\n\nconst topPadding = (condensed: boolean) => (condensed ? Spacing[5] : Spacing[6]);\n\nconst Root = styled.div<{ $condensed: boolean; $tabs: boolean }>`\n  width: 100%;\n  min-width: ${GRID_BREAKPOINTS.sm - 1}px;\n  padding-top: ${({ $condensed, $tabs }) => ($tabs ? Spacing[5] : topPadding($condensed))};\n  padding-bottom: ${({ $condensed }) => topPadding($condensed)};\n`;\n\nconst gridMode = (width: PageLayoutWidth): 'fixed' | 'fluid' =>\n  width === 'wide' ? 'fluid' : 'fixed';\n\nconst FullWidthBand = ({ mode, children }: { mode: 'fixed' | 'fluid'; children: ReactNode }) => (\n  <Grid mode={mode}>\n    <GridItem span={12}>{children}</GridItem>\n  </Grid>\n);\n\nexport const PageLayoutFrame = ({\n  width = 'standard',\n  tabs,\n  pageNotice,\n  children,\n}: PageLayoutChromeProps & { children: ReactNode }) => {\n  const mode = gridMode(width);\n  const ref = useRef<HTMLDivElement>(null);\n  const [condensed, setCondensed] = useState(false);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (!node) {\n      return;\n    }\n    const update = () => setCondensed(node.offsetWidth < GRID_BREAKPOINTS.md);\n    update();\n    const observer = new ResizeObserver(update);\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, []);\n\n  return (\n    <Root ref={ref} $condensed={condensed} $tabs={Boolean(tabs)}>\n      <Stack spacing={Spacing[5]}>\n        {tabs && <FullWidthBand mode={mode}>{tabs}</FullWidthBand>}\n        {pageNotice && <FullWidthBand mode={mode}>{pageNotice}</FullWidthBand>}\n        <Grid mode={mode}>{children}</Grid>\n      </Stack>\n    </Root>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { GridItem } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nimport { PageLayoutFrame, type PageLayoutChromeProps } from './PageLayoutFrame';\n\nexport interface SingleColumnLayoutProps extends PageLayoutChromeProps {\n  /** Primary page content. Direct children stack vertically. */\n  main: ReactNode;\n}\n\nexport const SingleColumnLayout = ({ main, ...chrome }: SingleColumnLayoutProps) => (\n  <PageLayoutFrame {...chrome}>\n    <GridItem span={12}>\n      <Stack spacing={Spacing[4]}>{main}</Stack>\n    </GridItem>\n  </PageLayoutFrame>\n);\n","import type { ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { GridItem, type GridSpan, useGridBreakpoint } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nimport { PageLayoutFrame, type PageLayoutChromeProps } from './PageLayoutFrame';\n\nconst SPLIT_COLUMN_SPANS = { main: 8, aside: 4 } as const satisfies Record<string, GridSpan>;\n\nexport interface SplitColumnLayoutProps extends PageLayoutChromeProps {\n  /** Primary column. Direct children stack vertically and stay in this column. */\n  main: ReactNode;\n  /** Supporting column. Direct children stack vertically and stay in this column. */\n  aside: ReactNode;\n}\n\nconst Region = ({ children }: { children: ReactNode }) => (\n  <Stack spacing={Spacing[4]}>{children}</Stack>\n);\n\nconst SplitBody = ({ main, aside }: { main: ReactNode; aside: ReactNode }) => {\n  const stacked = useGridBreakpoint() === 'xs';\n  const mainSpan = stacked ? 12 : SPLIT_COLUMN_SPANS.main;\n  const asideSpan = stacked ? 12 : SPLIT_COLUMN_SPANS.aside;\n\n  return (\n    <>\n      <GridItem span={mainSpan}>\n        <Region>{main}</Region>\n      </GridItem>\n      <GridItem span={asideSpan}>\n        <aside>\n          <Region>{aside}</Region>\n        </aside>\n      </GridItem>\n    </>\n  );\n};\n\nexport const SplitColumnLayout = ({ main, aside, ...chrome }: SplitColumnLayoutProps) => (\n  <PageLayoutFrame {...chrome}>\n    <SplitBody main={main} aside={aside} />\n  </PageLayoutFrame>\n);\n"],"mappings":";;;;;;;AAKA,MAAa,WAAW,OAAO,GAAG;;;aAGrB,QAAQ,GAAG,GAAG,QAAQ,GAAG;;;;;AAMtC,MAAM,kBAAkB,OAAO,MAAM;;;;;;;;;AAUrC,MAAa,aAAa,EACxB,UACA,GAAG,WAC4D;AAC/D,QAAO,oBAAC,iBAAD;EAAiB,GAAI;EAAO;EAA2B,CAAA;;AAGhE,MAAa,UAAU,OAAO,MAAM;;aAEvB,QAAQ,GAAG;;;;ACVxB,MAAM,cAAc,cAAwB,YAAY,QAAQ,KAAK,QAAQ;AAE7E,MAAM,OAAO,OAAO,GAA4C;;eAEjD,iBAAiB,KAAK,EAAE;kBACrB,EAAE,YAAY,YAAa,QAAQ,QAAQ,KAAK,WAAW,WAAW,CAAE;qBACrE,EAAE,iBAAiB,WAAW,WAAW,CAAC;;AAG/D,MAAM,YAAY,UAChB,UAAU,SAAS,UAAU;AAE/B,MAAM,iBAAiB,EAAE,MAAM,eAC7B,oBAAC,MAAD;CAAY;WACV,oBAAC,UAAD;EAAU,MAAM;EAAK;EAAoB,CAAA;CACpC,CAAA;AAGT,MAAa,mBAAmB,EAC9B,QAAQ,YACR,MACA,YACA,eACqD;CACrD,MAAM,OAAO,SAAS,MAAM;CAC5B,MAAM,MAAM,OAAuB,KAAK;CACxC,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;AAEjD,uBAAsB;EACpB,MAAM,OAAO,IAAI;AACjB,MAAI,CAAC,KACH;EAEF,MAAM,eAAe,aAAa,KAAK,cAAc,iBAAiB,GAAG;AACzE,UAAQ;EACR,MAAM,WAAW,IAAI,eAAe,OAAO;AAC3C,WAAS,QAAQ,KAAK;AACtB,eAAa,SAAS,YAAY;IACjC,EAAE,CAAC;AAEN,QACE,oBAAC,MAAD;EAAW;EAAK,YAAY;EAAW,OAAO,QAAQ,KAAK;YACzD,qBAAC,OAAD;GAAO,SAAS,QAAQ;aAAxB;IACG,QAAQ,oBAAC,eAAD;KAAqB;eAAO;KAAqB,CAAA;IACzD,cAAc,oBAAC,eAAD;KAAqB;eAAO;KAA2B,CAAA;IACtE,oBAAC,MAAD;KAAY;KAAO;KAAgB,CAAA;IAC7B;;EACH,CAAA;;;;ACxDX,MAAa,sBAAsB,EAAE,MAAM,GAAG,aAC5C,oBAAC,iBAAD;CAAiB,GAAI;WACnB,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,OAAD;GAAO,SAAS,QAAQ;aAAK;GAAa,CAAA;EACjC,CAAA;CACK,CAAA;;;ACVpB,MAAM,qBAAqB;CAAE,MAAM;CAAG,OAAO;CAAG;AAShD,MAAM,UAAU,EAAE,eAChB,oBAAC,OAAD;CAAO,SAAS,QAAQ;CAAK;CAAiB,CAAA;AAGhD,MAAM,aAAa,EAAE,MAAM,YAAmD;CAC5E,MAAM,UAAU,mBAAmB,KAAK;CACxC,MAAM,WAAW,UAAU,KAAK,mBAAmB;CACnD,MAAM,YAAY,UAAU,KAAK,mBAAmB;AAEpD,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,QAAD,EAAA,UAAS,MAAc,CAAA;EACd,CAAA,EACX,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,SAAD,EAAA,UACE,oBAAC,QAAD,EAAA,UAAS,OAAe,CAAA,EAClB,CAAA;EACC,CAAA,CACV,EAAA,CAAA;;AAIP,MAAa,qBAAqB,EAAE,MAAM,OAAO,GAAG,aAClD,oBAAC,iBAAD;CAAiB,GAAI;WACnB,oBAAC,WAAD;EAAiB;EAAa;EAAS,CAAA;CACvB,CAAA"}
+{"version":3,"file":"PageLayout-DjtGrvJa.mjs","names":[],"sources":["../src/patterns/PageLayout/PageLayout.tsx","../src/patterns/PageLayout/PageLayoutFrame.tsx","../src/patterns/PageLayout/SingleColumnLayout.tsx","../src/patterns/PageLayout/SplitColumnLayout.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nexport const Backdrop = styled.div`\n  position: relative;\n  width: 100%;\n  padding: ${Spacing[7]} ${Spacing[5]};\n\n  display: flex;\n  flex-direction: column;\n`;\n\nconst StyledContainer = styled('div')`\n  position: relative;\n  width: 100%;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n`;\n\nexport const Container = ({\n  children,\n  ...rest\n}: { children: ReactNode } & ComponentPropsWithoutRef<'div'>) => {\n  return <StyledContainer {...rest}>{children}</StyledContainer>;\n};\n\nexport const Section = styled('div')`\n  width: 100%;\n  padding: ${Spacing[7]};\n`;\n","import { type ReactNode, useLayoutEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport Grid, { GRID_BREAKPOINTS, GridItem } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nexport type PageLayoutWidth = 'standard' | 'wide';\n\nexport interface PageLayoutChromeProps {\n  /**\n   * `standard` uses the fixed grid (centered, max 1408px). `wide` uses the fluid grid.\n   *\n   * @defaultValue 'standard'\n   */\n  width?: PageLayoutWidth;\n  /** Tab group. Sits above the page notice and scrolls with the page. Omit to skip the region and its gap. */\n  tabs?: ReactNode;\n  /** Page notice under the tabs. Omit to skip the region and its gap. */\n  pageNotice?: ReactNode;\n}\n\nconst topPadding = (condensed: boolean) => (condensed ? Spacing[5] : Spacing[6]);\n\nconst Root = styled.div<{ $condensed: boolean; $tabs: boolean }>`\n  width: 100%;\n  min-width: ${GRID_BREAKPOINTS.sm - 1}px;\n  padding-top: ${({ $condensed, $tabs }) => ($tabs ? Spacing[5] : topPadding($condensed))};\n  padding-bottom: ${({ $condensed }) => topPadding($condensed)};\n`;\n\nconst gridMode = (width: PageLayoutWidth): 'fixed' | 'fluid' =>\n  width === 'wide' ? 'fluid' : 'fixed';\n\nconst FullWidthBand = ({ mode, children }: { mode: 'fixed' | 'fluid'; children: ReactNode }) => (\n  <Grid mode={mode}>\n    <GridItem span={12}>{children}</GridItem>\n  </Grid>\n);\n\nexport const PageLayoutFrame = ({\n  width = 'standard',\n  tabs,\n  pageNotice,\n  children,\n}: PageLayoutChromeProps & { children: ReactNode }) => {\n  const mode = gridMode(width);\n  const ref = useRef<HTMLDivElement>(null);\n  const [condensed, setCondensed] = useState(false);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (!node) {\n      return;\n    }\n    const update = () => setCondensed(node.offsetWidth < GRID_BREAKPOINTS.md);\n    update();\n    const observer = new ResizeObserver(update);\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, []);\n\n  return (\n    <Root ref={ref} $condensed={condensed} $tabs={Boolean(tabs)}>\n      <Stack spacing={Spacing[5]}>\n        {tabs && <FullWidthBand mode={mode}>{tabs}</FullWidthBand>}\n        {pageNotice && <FullWidthBand mode={mode}>{pageNotice}</FullWidthBand>}\n        <Grid mode={mode}>{children}</Grid>\n      </Stack>\n    </Root>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { GridItem } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nimport { PageLayoutFrame, type PageLayoutChromeProps } from './PageLayoutFrame';\n\nexport interface SingleColumnLayoutProps extends PageLayoutChromeProps {\n  /** Primary page content. Direct children stack vertically. */\n  main: ReactNode;\n}\n\nexport const SingleColumnLayout = ({ main, ...chrome }: SingleColumnLayoutProps) => (\n  <PageLayoutFrame {...chrome}>\n    <GridItem span={12}>\n      <Stack spacing={Spacing[4]}>{main}</Stack>\n    </GridItem>\n  </PageLayoutFrame>\n);\n","import type { ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport { GridItem, type GridSpan, useGridBreakpoint } from '#src/components/Grid';\nimport { Stack } from '#src/components/Stack';\n\nimport { PageLayoutFrame, type PageLayoutChromeProps } from './PageLayoutFrame';\n\nconst SPLIT_COLUMN_SPANS = { main: 8, aside: 4 } as const satisfies Record<string, GridSpan>;\n\nexport interface SplitColumnLayoutProps extends PageLayoutChromeProps {\n  /** Primary column. Direct children stack vertically and stay in this column. */\n  main: ReactNode;\n  /** Supporting column. Direct children stack vertically and stay in this column. */\n  aside: ReactNode;\n}\n\nconst Region = ({ children }: { children: ReactNode }) => (\n  <Stack spacing={Spacing[4]}>{children}</Stack>\n);\n\nconst SplitBody = ({ main, aside }: { main: ReactNode; aside: ReactNode }) => {\n  const stacked = useGridBreakpoint() === 'xs';\n  const mainSpan = stacked ? 12 : SPLIT_COLUMN_SPANS.main;\n  const asideSpan = stacked ? 12 : SPLIT_COLUMN_SPANS.aside;\n\n  return (\n    <>\n      <GridItem span={mainSpan}>\n        <Region>{main}</Region>\n      </GridItem>\n      <GridItem span={asideSpan}>\n        <aside>\n          <Region>{aside}</Region>\n        </aside>\n      </GridItem>\n    </>\n  );\n};\n\nexport const SplitColumnLayout = ({ main, aside, ...chrome }: SplitColumnLayoutProps) => (\n  <PageLayoutFrame {...chrome}>\n    <SplitBody main={main} aside={aside} />\n  </PageLayoutFrame>\n);\n"],"mappings":";;;;;;;AAKA,MAAa,WAAW,OAAO,GAAG;;;aAGrB,QAAQ,GAAG,GAAG,QAAQ,GAAG;;;;;AAMtC,MAAM,kBAAkB,OAAO,MAAM;;;;;;;;;AAUrC,MAAa,aAAa,EACxB,UACA,GAAG,WAC4D;AAC/D,QAAO,oBAAC,iBAAD;EAAiB,GAAI;EAAO;EAA2B,CAAA;;AAGhE,MAAa,UAAU,OAAO,MAAM;;aAEvB,QAAQ,GAAG;;;;ACVxB,MAAM,cAAc,cAAwB,YAAY,QAAQ,KAAK,QAAQ;AAE7E,MAAM,OAAO,OAAO,GAA4C;;eAEjD,iBAAiB,KAAK,EAAE;kBACrB,EAAE,YAAY,YAAa,QAAQ,QAAQ,KAAK,WAAW,WAAW,CAAE;qBACrE,EAAE,iBAAiB,WAAW,WAAW,CAAC;;AAG/D,MAAM,YAAY,UAChB,UAAU,SAAS,UAAU;AAE/B,MAAM,iBAAiB,EAAE,MAAM,eAC7B,oBAAC,MAAD;CAAY;WACV,oBAAC,UAAD;EAAU,MAAM;EAAK;EAAoB,CAAA;CACpC,CAAA;AAGT,MAAa,mBAAmB,EAC9B,QAAQ,YACR,MACA,YACA,eACqD;CACrD,MAAM,OAAO,SAAS,MAAM;CAC5B,MAAM,MAAM,OAAuB,KAAK;CACxC,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;AAEjD,uBAAsB;EACpB,MAAM,OAAO,IAAI;AACjB,MAAI,CAAC,KACH;EAEF,MAAM,eAAe,aAAa,KAAK,cAAc,iBAAiB,GAAG;AACzE,UAAQ;EACR,MAAM,WAAW,IAAI,eAAe,OAAO;AAC3C,WAAS,QAAQ,KAAK;AACtB,eAAa,SAAS,YAAY;IACjC,EAAE,CAAC;AAEN,QACE,oBAAC,MAAD;EAAW;EAAK,YAAY;EAAW,OAAO,QAAQ,KAAK;YACzD,qBAAC,OAAD;GAAO,SAAS,QAAQ;aAAxB;IACG,QAAQ,oBAAC,eAAD;KAAqB;eAAO;KAAqB,CAAA;IACzD,cAAc,oBAAC,eAAD;KAAqB;eAAO;KAA2B,CAAA;IACtE,oBAAC,MAAD;KAAY;KAAO;KAAgB,CAAA;IAC7B;;EACH,CAAA;;;;ACxDX,MAAa,sBAAsB,EAAE,MAAM,GAAG,aAC5C,oBAAC,iBAAD;CAAiB,GAAI;WACnB,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,OAAD;GAAO,SAAS,QAAQ;aAAK;GAAa,CAAA;EACjC,CAAA;CACK,CAAA;;;ACVpB,MAAM,qBAAqB;CAAE,MAAM;CAAG,OAAO;CAAG;AAShD,MAAM,UAAU,EAAE,eAChB,oBAAC,OAAD;CAAO,SAAS,QAAQ;CAAK;CAAiB,CAAA;AAGhD,MAAM,aAAa,EAAE,MAAM,YAAmD;CAC5E,MAAM,UAAU,mBAAmB,KAAK;CACxC,MAAM,WAAW,UAAU,KAAK,mBAAmB;CACnD,MAAM,YAAY,UAAU,KAAK,mBAAmB;AAEpD,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,QAAD,EAAA,UAAS,MAAc,CAAA;EACd,CAAA,EACX,oBAAC,UAAD;EAAU,MAAM;YACd,oBAAC,SAAD,EAAA,UACE,oBAAC,QAAD,EAAA,UAAS,OAAe,CAAA,EAClB,CAAA;EACC,CAAA,CACV,EAAA,CAAA;;AAIP,MAAa,qBAAqB,EAAE,MAAM,OAAO,GAAG,aAClD,oBAAC,iBAAD;CAAiB,GAAI;WACnB,oBAAC,WAAD;EAAiB;EAAa;EAAS,CAAA;CACvB,CAAA"}

package/dist/PageLayout.d.mts

@@ -1,2 +1,2 @@
-import { n as Container, r as Section, t as Backdrop } from "./PageLayout-DfAbeFIh.mjs";
+import { n as Container, r as Section, t as Backdrop } from "./PageLayout-BdVM37bV.mjs";
 export { Backdrop, Container, Section };

package/dist/{PageLayoutFrame-CQLREOBH.d.mts → PageLayoutFrame-4QGs7x-t.d.mts}

@@ -25,4 +25,4 @@ declare const PageLayoutFrame: ({
 }) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { PageLayoutFrame as n, PageLayoutWidth as r, PageLayoutChromeProps as t };
-//# sourceMappingURL=PageLayoutFrame-CQLREOBH.d.mts.map
+//# sourceMappingURL=PageLayoutFrame-4QGs7x-t.d.mts.map

package/dist/PageLayoutFrame.d.mts

@@ -1,2 +1,2 @@
-import { n as PageLayoutFrame, r as PageLayoutWidth, t as PageLayoutChromeProps } from "./PageLayoutFrame-CQLREOBH.mjs";
+import { n as PageLayoutFrame, r as PageLayoutWidth, t as PageLayoutChromeProps } from "./PageLayoutFrame-4QGs7x-t.mjs";
 export { PageLayoutChromeProps, PageLayoutFrame, PageLayoutWidth };

package/dist/{PageSelector-BOe4EzbS.d.mts → PageSelector-B5CcAzss.d.mts}

@@ -1,5 +1,5 @@
-import { n as HStackProps } from "./Stack-DrYxBkiF.mjs";
-import { t as PaginationParams } from "./types-6L0ptM6-.mjs";
+import { n as HStackProps } from "./Stack-CODxfzhl.mjs";
+import { t as PaginationParams } from "./types-CRymR_J9.mjs";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -33,4 +33,4 @@ declare function PageSelector({
 }: PageSelectorProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { PageInput as n, PageSelector as r, PAGE_LIMIT_BEFORE_SCROLL_MODE as t };
-//# sourceMappingURL=PageSelector-BOe4EzbS.d.mts.map
+//# sourceMappingURL=PageSelector-B5CcAzss.d.mts.map

package/dist/PageSelector.d.mts

@@ -1,2 +1,2 @@
-import { n as PageInput, r as PageSelector, t as PAGE_LIMIT_BEFORE_SCROLL_MODE } from "./PageSelector-BOe4EzbS.mjs";
+import { n as PageInput, r as PageSelector, t as PAGE_LIMIT_BEFORE_SCROLL_MODE } from "./PageSelector-B5CcAzss.mjs";
 export { PAGE_LIMIT_BEFORE_SCROLL_MODE, PageInput, PageSelector as default };

package/dist/{Pagination-Dpc6TadZ.mjs → Pagination-C8hPOu0l.mjs}

@@ -1,5 +1,5 @@
 import { a as styled } from "./styledComponentsInterop-Cs5CCPRy.mjs";
-import { l as usePDSStrings } from "./i18n-CKRi992F.mjs";
+import { l as usePDSStrings } from "./i18n-DaOKaFc2.mjs";
 import { semanticColor } from "./lib/semanticColor.mjs";
 import { t as HStack } from "./Stack-Bzom2BTR.mjs";
 import { n as Button } from "./IconButton-DftINsp7.mjs";
@@ -198,4 +198,4 @@ var Pagination_default = Pagination;
 //#endregion
 export { MIN_PAGE_SIZE as a, DEFAULT_PAGE_SIZE_OPTIONS as i, PAGE_LIMIT_BEFORE_SCROLL_MODE as n, PageSelector as r, Pagination_default as t };
 
-//# sourceMappingURL=Pagination-Dpc6TadZ.mjs.map
+//# sourceMappingURL=Pagination-C8hPOu0l.mjs.map

package/dist/{Pagination-Dpc6TadZ.mjs.map → Pagination-C8hPOu0l.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Pagination-Dpc6TadZ.mjs","names":[],"sources":["../src/components/Pagination/constants.ts","../src/components/Pagination/PageSelector.tsx","../src/components/Pagination/PageSizeSelector.tsx","../src/components/Pagination/Pagination.tsx","../src/components/Pagination/index.ts"],"sourcesContent":["export const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100, 300];\nexport const MIN_PAGE_SIZE = 10;\n","import { debounce } from 'lodash-es';\nimport { useEffect, useMemo, useState } from 'react';\nimport styled from 'styled-components';\n\nimport Button from '@persona/design-system/components/Button';\nimport { Input } from '@persona/design-system/components/Input';\nimport { HStack } from '@persona/design-system/components/Stack';\nimport { Spacing } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\n\nimport type { PaginationParams } from './types';\n\n// After a certain limit, it no longer makes sense for someone\n// to jump to the last page. Deep paging has performance limitations. A collection\n// with exactly this many pages still gets the page input: servers that cap paging\n// at this limit (Kaminari's max_pages) report every page up to it as reachable.\nexport const PAGE_LIMIT_BEFORE_SCROLL_MODE = 100;\n\nconst PageSelectorStack = styled(HStack).attrs({ justify: 'flex-end' })`\n  padding: ${Spacing[2]};\n`;\n\nexport const PageInput = styled(HStack).attrs({ align: 'center' })`\n  white-space: nowrap;\n`;\n\ninterface PageSelectorProps {\n  paginationParams: PaginationParams;\n  handlePageLinkClick: (pageNumber: number) => void;\n  isLoading?: boolean;\n  /**\n   * Called with the new page number after the page changes (next, prev, or\n   * typed input). Lets the consumer react to page changes -- e.g. scroll the\n   * page back to the top.\n   */\n  onPageChange?: (pageNumber: number) => void;\n  /**\n   * `total-pages` is only a lower bound: render it as `13+` and keep Next enabled past it. See\n   * `Pagination`'s prop of the same name.\n   */\n  totalIsLowerBound?: boolean;\n}\n\nexport default function PageSelector({\n  paginationParams,\n  handlePageLinkClick,\n  isLoading,\n  onPageChange,\n  totalIsLowerBound = false,\n}: PageSelectorProps) {\n  const strings = usePDSStrings();\n  const {\n    'current-page': currentPage,\n    'total-pages': totalPages,\n    'lower-bound': lowerBound,\n  } = paginationParams ?? {};\n  const [selectedPage, setSelectedPage] = useState<number | undefined>(currentPage);\n  // Next stays enabled at the last page the totals know of when more may follow.\n  const morePagesMayFollow = lowerBound || totalIsLowerBound;\n  // Paged past a minimum page count, how many pages there are is no longer known.\n  const totalUnknown = lowerBound || (totalIsLowerBound && currentPage > totalPages);\n\n  // We don't use useDebounced to avoid function object reference issues.\n  const handlePageLinkClickDebounced = useMemo(\n    () => debounce(handlePageLinkClick, 500),\n    [handlePageLinkClick],\n  );\n\n  // Keep input state synced to pagination state when other user action changes\n  // pagination state.\n  useEffect(() => {\n    if (currentPage != null) {\n      setSelectedPage(currentPage);\n    }\n  }, [currentPage]);\n\n  if (!paginationParams) {\n    return <div />;\n  }\n\n  return (\n    <PageSelectorStack data-test='pagination__page-selector' id='pagination__page-selector'>\n      <PageInput>\n        {totalPages <= PAGE_LIMIT_BEFORE_SCROLL_MODE && !totalUnknown ? (\n          <Input\n            aria-label={strings.goToPageNumber}\n            size='sm'\n            inputSize={2}\n            onChange={(e) => {\n              const value = e.target.valueAsNumber;\n              if (Number.isNaN(value)) {\n                setSelectedPage(undefined);\n              } else {\n                // Setting unbounded value feels smoother as the value is not corrected until after the fetch via useEffect.\n                setSelectedPage(value);\n                const boundedValue = Math.min(Math.max(e.target.valueAsNumber, 1), totalPages);\n                handlePageLinkClickDebounced(boundedValue);\n                onPageChange?.(boundedValue);\n              }\n            }}\n            onBlur={(e) => {\n              // Fill blank value on blur.\n              if (Number.isNaN(e.target.valueAsNumber)) {\n                setSelectedPage(currentPage);\n              }\n            }}\n            min={1}\n            max={totalPages}\n            type='number'\n            disabled={isLoading}\n            value={selectedPage ?? ''}\n          />\n        ) : (\n          currentPage + ' '\n        )}\n        {strings.pageCount(\n          currentPage,\n          totalUnknown\n            ? strings.many\n            : totalIsLowerBound\n              ? strings.atLeast(totalPages)\n              : totalPages,\n        )}\n      </PageInput>\n      <Button\n        id='pagination__page-selector--left'\n        disabled={currentPage === 1 || isLoading}\n        onClick={() => {\n          if (currentPage !== 1) {\n            const prevPageNum = currentPage - 1;\n            setSelectedPage(prevPageNum);\n            handlePageLinkClick(prevPageNum);\n            onPageChange?.(prevPageNum);\n          }\n        }}\n        data-test='pagination__page-selector-paddle-left'\n        variant='inverse'\n        size='sm'\n        width='auto'\n        aria-label={strings.previousPage}\n      >\n        {strings.previousShort}\n      </Button>\n      <Button\n        id='pagination__page-selector--right'\n        disabled={(currentPage === totalPages && !morePagesMayFollow) || isLoading}\n        onClick={() => {\n          if (currentPage !== totalPages || morePagesMayFollow) {\n            const nextPageNum = currentPage + 1;\n            setSelectedPage(nextPageNum);\n            handlePageLinkClick(nextPageNum);\n            onPageChange?.(nextPageNum);\n          }\n        }}\n        data-test='pagination__page-selector-paddle-right'\n        variant='inverse'\n        size='sm'\n        width='auto'\n        aria-label={strings.nextPage}\n      >\n        {strings.next}\n      </Button>\n    </PageSelectorStack>\n  );\n}\n","import styled from 'styled-components';\n\nimport Select, { Option } from '@persona/design-system/components/Select';\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\nimport { semanticColor } from '#src/lib/semanticColor';\n\nconst Selector = styled('div')`\n  padding: ${Spacing[2]};\n  display: flex;\n  justify-content: flex-end;\n`;\n\nconst Label = styled.label`\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  gap: ${Spacing[2]};\n  padding: ${Spacing[2]};\n`;\n\ninterface PageSizeOptionProps {\n  currentPageSize: number;\n  pageSizeOption: number;\n}\n\nexport const PageSizeOption = styled('div')<PageSizeOptionProps>`\n  padding: 0 ${Spacing[1]};\n  color: ${({ theme }) => semanticColor(theme, 'FgAccentStatic', Color.PrimaryPurple)};\n  cursor: pointer;\n\n  ${({ currentPageSize, pageSizeOption }) => {\n    if (currentPageSize === pageSizeOption) {\n      return `\n        ${Typography.TextMediumBold};\n        text-decoration: underline;\n      `;\n    }\n  }};\n\n  &:hover {\n    text-decoration: underline;\n  }\n`;\n\ninterface PageSizeSelectorProps {\n  pageSize: number;\n  pageSizeOptions: number[];\n  handlePageSizeClick: (pageSize: number) => void;\n  /**\n   * Element the options menu renders into. Pass a container inside the surrounding dialog when the\n   * pager sits in a clipping container, where the menu would otherwise be cut off.\n   */\n  menuPortalContainer?: HTMLElement | null;\n}\n\nconst PageSizeSelector = ({\n  pageSize,\n  pageSizeOptions,\n  handlePageSizeClick,\n  menuPortalContainer,\n}: PageSizeSelectorProps) => {\n  const strings = usePDSStrings();\n  // Add pageSize to selector just in case it isn't part of the options so UI doesn't look weird\n  const pageSizes = [\n    ...pageSizeOptions,\n    ...(pageSizeOptions.includes(pageSize) ? [] : [pageSize]),\n  ].sort((a, b) => a - b);\n\n  return (\n    <Selector data-test='pagination__page-size-selector'>\n      <Label>\n        {strings.itemsPerPage}\n        <Select\n          value={pageSize.toString()}\n          onValueChange={(val) => handlePageSizeClick(Number(val))}\n          size='sm'\n          portal={menuPortalContainer != null}\n          portalContainer={menuPortalContainer}\n        >\n          {pageSizes.map((size) => (\n            <Option key={size} value={size.toString()}>\n              {size}\n            </Option>\n          ))}\n        </Select>\n      </Label>\n    </Selector>\n  );\n};\n\nexport default PageSizeSelector;\n","import styled from 'styled-components';\n\nimport { Color, Typography } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\nimport { semanticColor } from '#src/lib/semanticColor';\n\nimport { DEFAULT_PAGE_SIZE_OPTIONS } from './constants';\nimport PageSelector from './PageSelector';\nimport PageSizeSelector from './PageSizeSelector';\nimport type { PaginationParams } from './types';\n\n// NB: this is configured in config/initializers/kaminari.rb\nconst MAX_PAGES = 100;\n\nconst Container = styled('nav')`\n  ${Typography.TextMedium};\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n`;\n\nexport const PaginationInfo = styled('div')`\n  display: flex;\n  align-items: center;\n\n  color: ${({ theme }) => semanticColor(theme, 'FgPrimary', Color.TextPrimary)};\n`;\n\ninterface PaginationProps {\n  pageSize?: number;\n  pageSizeOptions?: number[];\n  paginationParams?: PaginationParams;\n  handlePageSizeClick: (pageSize: number) => void;\n  handlePageLinkClick: (pageNumber: number) => void;\n  isLoading?: boolean;\n  showPageSizeSelector?: boolean;\n  /**\n   * Called with the new page number after the page changes. Lets the consumer\n   * react to page changes -- e.g. scroll the page back to the top.\n   */\n  onPageChange?: (pageNumber: number) => void;\n  /**\n   * Element the page-size menu renders into. Pass a container inside the surrounding dialog when\n   * the pager sits in a clipping container, where the menu would otherwise be cut off.\n   */\n  menuPortalContainer?: HTMLElement | null;\n  /**\n   * The totals in `paginationParams` are only a lower bound: there are at least that many items\n   * and pages, e.g. when the server counts a bounded number of pages ahead. They render as `650+`\n   * and `13+`, any page up to `total-pages` can still be typed in, and Next stays enabled past it.\n   * `lower-bound` in `paginationParams`, a total that is not known at all, takes precedence.\n   */\n  totalIsLowerBound?: boolean;\n}\n\nconst Pagination = ({\n  pageSize,\n  pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,\n  paginationParams,\n  handlePageSizeClick,\n  handlePageLinkClick,\n  isLoading,\n  showPageSizeSelector = true,\n  onPageChange,\n  menuPortalContainer,\n  totalIsLowerBound = false,\n}: PaginationProps) => {\n  const strings = usePDSStrings();\n\n  if (!paginationParams || !pageSize) {\n    return <div />;\n  }\n\n  const {\n    'current-page': currentPage,\n    'total-count': totalCount,\n    'total-pages': totalPages,\n    'lower-bound': lowerBound,\n  } = paginationParams;\n\n  // If the total number of pages is the same as MAX_PAGES, we guess that the total number of\n  // items might be limited by max pages, and that the total could change based on page size.\n  // To limit user confusion here, we use 'many' instead of a specific number.\n  // Paged past the minimum the totals give, how many there are is no longer known: render it like\n  // `lower-bound` rather than an item range that ends before it starts.\n  const pastKnownTotal = totalIsLowerBound && !lowerBound && currentPage > totalPages;\n  const totalUnknown = lowerBound || pastKnownTotal;\n  const totalAtLeast = totalIsLowerBound && !totalUnknown;\n  const totalCountDisplay =\n    totalUnknown || totalPages >= MAX_PAGES\n      ? strings.many\n      : totalAtLeast\n        ? strings.atLeast(totalCount)\n        : totalCount;\n\n  const lastItemIndex = totalUnknown\n    ? currentPage * pageSize\n    : Math.min(currentPage * pageSize, totalCount);\n  const firstItemIndex = pageSize * (currentPage - 1) + 1;\n\n  return (\n    <Container role='navigation' aria-label={strings.pagination}>\n      {showPageSizeSelector && (\n        <PageSizeSelector\n          pageSize={pageSize}\n          pageSizeOptions={pageSizeOptions}\n          handlePageSizeClick={handlePageSizeClick}\n          menuPortalContainer={menuPortalContainer}\n        />\n      )}\n      {totalCount > 0 && (\n        <>\n          <div>{strings.showingItems(firstItemIndex, lastItemIndex, totalCountDisplay)}</div>\n          <PaginationInfo>\n            <PageSelector\n              paginationParams={paginationParams}\n              handlePageLinkClick={handlePageLinkClick}\n              isLoading={isLoading}\n              onPageChange={onPageChange}\n              totalIsLowerBound={totalIsLowerBound && !lowerBound}\n            />\n          </PaginationInfo>\n        </>\n      )}\n    </Container>\n  );\n};\n\nexport default Pagination;\n","import Pagination from './Pagination';\n\nexport { default as PageSelector, PAGE_LIMIT_BEFORE_SCROLL_MODE } from './PageSelector';\nexport * from './constants';\nexport default Pagination;\n"],"mappings":"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"}
+{"version":3,"file":"Pagination-C8hPOu0l.mjs","names":[],"sources":["../src/components/Pagination/constants.ts","../src/components/Pagination/PageSelector.tsx","../src/components/Pagination/PageSizeSelector.tsx","../src/components/Pagination/Pagination.tsx","../src/components/Pagination/index.ts"],"sourcesContent":["export const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100, 300];\nexport const MIN_PAGE_SIZE = 10;\n","import { debounce } from 'lodash-es';\nimport { useEffect, useMemo, useState } from 'react';\nimport styled from 'styled-components';\n\nimport Button from '@persona/design-system/components/Button';\nimport { Input } from '@persona/design-system/components/Input';\nimport { HStack } from '@persona/design-system/components/Stack';\nimport { Spacing } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\n\nimport type { PaginationParams } from './types';\n\n// After a certain limit, it no longer makes sense for someone\n// to jump to the last page. Deep paging has performance limitations. A collection\n// with exactly this many pages still gets the page input: servers that cap paging\n// at this limit (Kaminari's max_pages) report every page up to it as reachable.\nexport const PAGE_LIMIT_BEFORE_SCROLL_MODE = 100;\n\nconst PageSelectorStack = styled(HStack).attrs({ justify: 'flex-end' })`\n  padding: ${Spacing[2]};\n`;\n\nexport const PageInput = styled(HStack).attrs({ align: 'center' })`\n  white-space: nowrap;\n`;\n\ninterface PageSelectorProps {\n  paginationParams: PaginationParams;\n  handlePageLinkClick: (pageNumber: number) => void;\n  isLoading?: boolean;\n  /**\n   * Called with the new page number after the page changes (next, prev, or\n   * typed input). Lets the consumer react to page changes -- e.g. scroll the\n   * page back to the top.\n   */\n  onPageChange?: (pageNumber: number) => void;\n  /**\n   * `total-pages` is only a lower bound: render it as `13+` and keep Next enabled past it. See\n   * `Pagination`'s prop of the same name.\n   */\n  totalIsLowerBound?: boolean;\n}\n\nexport default function PageSelector({\n  paginationParams,\n  handlePageLinkClick,\n  isLoading,\n  onPageChange,\n  totalIsLowerBound = false,\n}: PageSelectorProps) {\n  const strings = usePDSStrings();\n  const {\n    'current-page': currentPage,\n    'total-pages': totalPages,\n    'lower-bound': lowerBound,\n  } = paginationParams ?? {};\n  const [selectedPage, setSelectedPage] = useState<number | undefined>(currentPage);\n  // Next stays enabled at the last page the totals know of when more may follow.\n  const morePagesMayFollow = lowerBound || totalIsLowerBound;\n  // Paged past a minimum page count, how many pages there are is no longer known.\n  const totalUnknown = lowerBound || (totalIsLowerBound && currentPage > totalPages);\n\n  // We don't use useDebounced to avoid function object reference issues.\n  const handlePageLinkClickDebounced = useMemo(\n    () => debounce(handlePageLinkClick, 500),\n    [handlePageLinkClick],\n  );\n\n  // Keep input state synced to pagination state when other user action changes\n  // pagination state.\n  useEffect(() => {\n    if (currentPage != null) {\n      setSelectedPage(currentPage);\n    }\n  }, [currentPage]);\n\n  if (!paginationParams) {\n    return <div />;\n  }\n\n  return (\n    <PageSelectorStack data-test='pagination__page-selector' id='pagination__page-selector'>\n      <PageInput>\n        {totalPages <= PAGE_LIMIT_BEFORE_SCROLL_MODE && !totalUnknown ? (\n          <Input\n            aria-label={strings.goToPageNumber}\n            size='sm'\n            inputSize={2}\n            onChange={(e) => {\n              const value = e.target.valueAsNumber;\n              if (Number.isNaN(value)) {\n                setSelectedPage(undefined);\n              } else {\n                // Setting unbounded value feels smoother as the value is not corrected until after the fetch via useEffect.\n                setSelectedPage(value);\n                const boundedValue = Math.min(Math.max(e.target.valueAsNumber, 1), totalPages);\n                handlePageLinkClickDebounced(boundedValue);\n                onPageChange?.(boundedValue);\n              }\n            }}\n            onBlur={(e) => {\n              // Fill blank value on blur.\n              if (Number.isNaN(e.target.valueAsNumber)) {\n                setSelectedPage(currentPage);\n              }\n            }}\n            min={1}\n            max={totalPages}\n            type='number'\n            disabled={isLoading}\n            value={selectedPage ?? ''}\n          />\n        ) : (\n          currentPage + ' '\n        )}\n        {strings.pageCount(\n          currentPage,\n          totalUnknown\n            ? strings.many\n            : totalIsLowerBound\n              ? strings.atLeast(totalPages)\n              : totalPages,\n        )}\n      </PageInput>\n      <Button\n        id='pagination__page-selector--left'\n        disabled={currentPage === 1 || isLoading}\n        onClick={() => {\n          if (currentPage !== 1) {\n            const prevPageNum = currentPage - 1;\n            setSelectedPage(prevPageNum);\n            handlePageLinkClick(prevPageNum);\n            onPageChange?.(prevPageNum);\n          }\n        }}\n        data-test='pagination__page-selector-paddle-left'\n        variant='inverse'\n        size='sm'\n        width='auto'\n        aria-label={strings.previousPage}\n      >\n        {strings.previousShort}\n      </Button>\n      <Button\n        id='pagination__page-selector--right'\n        disabled={(currentPage === totalPages && !morePagesMayFollow) || isLoading}\n        onClick={() => {\n          if (currentPage !== totalPages || morePagesMayFollow) {\n            const nextPageNum = currentPage + 1;\n            setSelectedPage(nextPageNum);\n            handlePageLinkClick(nextPageNum);\n            onPageChange?.(nextPageNum);\n          }\n        }}\n        data-test='pagination__page-selector-paddle-right'\n        variant='inverse'\n        size='sm'\n        width='auto'\n        aria-label={strings.nextPage}\n      >\n        {strings.next}\n      </Button>\n    </PageSelectorStack>\n  );\n}\n","import styled from 'styled-components';\n\nimport Select, { Option } from '@persona/design-system/components/Select';\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\nimport { semanticColor } from '#src/lib/semanticColor';\n\nconst Selector = styled('div')`\n  padding: ${Spacing[2]};\n  display: flex;\n  justify-content: flex-end;\n`;\n\nconst Label = styled.label`\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  gap: ${Spacing[2]};\n  padding: ${Spacing[2]};\n`;\n\ninterface PageSizeOptionProps {\n  currentPageSize: number;\n  pageSizeOption: number;\n}\n\nexport const PageSizeOption = styled('div')<PageSizeOptionProps>`\n  padding: 0 ${Spacing[1]};\n  color: ${({ theme }) => semanticColor(theme, 'FgAccentStatic', Color.PrimaryPurple)};\n  cursor: pointer;\n\n  ${({ currentPageSize, pageSizeOption }) => {\n    if (currentPageSize === pageSizeOption) {\n      return `\n        ${Typography.TextMediumBold};\n        text-decoration: underline;\n      `;\n    }\n  }};\n\n  &:hover {\n    text-decoration: underline;\n  }\n`;\n\ninterface PageSizeSelectorProps {\n  pageSize: number;\n  pageSizeOptions: number[];\n  handlePageSizeClick: (pageSize: number) => void;\n  /**\n   * Element the options menu renders into. Pass a container inside the surrounding dialog when the\n   * pager sits in a clipping container, where the menu would otherwise be cut off.\n   */\n  menuPortalContainer?: HTMLElement | null;\n}\n\nconst PageSizeSelector = ({\n  pageSize,\n  pageSizeOptions,\n  handlePageSizeClick,\n  menuPortalContainer,\n}: PageSizeSelectorProps) => {\n  const strings = usePDSStrings();\n  // Add pageSize to selector just in case it isn't part of the options so UI doesn't look weird\n  const pageSizes = [\n    ...pageSizeOptions,\n    ...(pageSizeOptions.includes(pageSize) ? [] : [pageSize]),\n  ].sort((a, b) => a - b);\n\n  return (\n    <Selector data-test='pagination__page-size-selector'>\n      <Label>\n        {strings.itemsPerPage}\n        <Select\n          value={pageSize.toString()}\n          onValueChange={(val) => handlePageSizeClick(Number(val))}\n          size='sm'\n          portal={menuPortalContainer != null}\n          portalContainer={menuPortalContainer}\n        >\n          {pageSizes.map((size) => (\n            <Option key={size} value={size.toString()}>\n              {size}\n            </Option>\n          ))}\n        </Select>\n      </Label>\n    </Selector>\n  );\n};\n\nexport default PageSizeSelector;\n","import styled from 'styled-components';\n\nimport { Color, Typography } from '@persona/design-tokens';\n\nimport { usePDSStrings } from '#src/lib/i18n';\nimport { semanticColor } from '#src/lib/semanticColor';\n\nimport { DEFAULT_PAGE_SIZE_OPTIONS } from './constants';\nimport PageSelector from './PageSelector';\nimport PageSizeSelector from './PageSizeSelector';\nimport type { PaginationParams } from './types';\n\n// NB: this is configured in config/initializers/kaminari.rb\nconst MAX_PAGES = 100;\n\nconst Container = styled('nav')`\n  ${Typography.TextMedium};\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n`;\n\nexport const PaginationInfo = styled('div')`\n  display: flex;\n  align-items: center;\n\n  color: ${({ theme }) => semanticColor(theme, 'FgPrimary', Color.TextPrimary)};\n`;\n\ninterface PaginationProps {\n  pageSize?: number;\n  pageSizeOptions?: number[];\n  paginationParams?: PaginationParams;\n  handlePageSizeClick: (pageSize: number) => void;\n  handlePageLinkClick: (pageNumber: number) => void;\n  isLoading?: boolean;\n  showPageSizeSelector?: boolean;\n  /**\n   * Called with the new page number after the page changes. Lets the consumer\n   * react to page changes -- e.g. scroll the page back to the top.\n   */\n  onPageChange?: (pageNumber: number) => void;\n  /**\n   * Element the page-size menu renders into. Pass a container inside the surrounding dialog when\n   * the pager sits in a clipping container, where the menu would otherwise be cut off.\n   */\n  menuPortalContainer?: HTMLElement | null;\n  /**\n   * The totals in `paginationParams` are only a lower bound: there are at least that many items\n   * and pages, e.g. when the server counts a bounded number of pages ahead. They render as `650+`\n   * and `13+`, any page up to `total-pages` can still be typed in, and Next stays enabled past it.\n   * `lower-bound` in `paginationParams`, a total that is not known at all, takes precedence.\n   */\n  totalIsLowerBound?: boolean;\n}\n\nconst Pagination = ({\n  pageSize,\n  pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,\n  paginationParams,\n  handlePageSizeClick,\n  handlePageLinkClick,\n  isLoading,\n  showPageSizeSelector = true,\n  onPageChange,\n  menuPortalContainer,\n  totalIsLowerBound = false,\n}: PaginationProps) => {\n  const strings = usePDSStrings();\n\n  if (!paginationParams || !pageSize) {\n    return <div />;\n  }\n\n  const {\n    'current-page': currentPage,\n    'total-count': totalCount,\n    'total-pages': totalPages,\n    'lower-bound': lowerBound,\n  } = paginationParams;\n\n  // If the total number of pages is the same as MAX_PAGES, we guess that the total number of\n  // items might be limited by max pages, and that the total could change based on page size.\n  // To limit user confusion here, we use 'many' instead of a specific number.\n  // Paged past the minimum the totals give, how many there are is no longer known: render it like\n  // `lower-bound` rather than an item range that ends before it starts.\n  const pastKnownTotal = totalIsLowerBound && !lowerBound && currentPage > totalPages;\n  const totalUnknown = lowerBound || pastKnownTotal;\n  const totalAtLeast = totalIsLowerBound && !totalUnknown;\n  const totalCountDisplay =\n    totalUnknown || totalPages >= MAX_PAGES\n      ? strings.many\n      : totalAtLeast\n        ? strings.atLeast(totalCount)\n        : totalCount;\n\n  const lastItemIndex = totalUnknown\n    ? currentPage * pageSize\n    : Math.min(currentPage * pageSize, totalCount);\n  const firstItemIndex = pageSize * (currentPage - 1) + 1;\n\n  return (\n    <Container role='navigation' aria-label={strings.pagination}>\n      {showPageSizeSelector && (\n        <PageSizeSelector\n          pageSize={pageSize}\n          pageSizeOptions={pageSizeOptions}\n          handlePageSizeClick={handlePageSizeClick}\n          menuPortalContainer={menuPortalContainer}\n        />\n      )}\n      {totalCount > 0 && (\n        <>\n          <div>{strings.showingItems(firstItemIndex, lastItemIndex, totalCountDisplay)}</div>\n          <PaginationInfo>\n            <PageSelector\n              paginationParams={paginationParams}\n              handlePageLinkClick={handlePageLinkClick}\n              isLoading={isLoading}\n              onPageChange={onPageChange}\n              totalIsLowerBound={totalIsLowerBound && !lowerBound}\n            />\n          </PaginationInfo>\n        </>\n      )}\n    </Container>\n  );\n};\n\nexport default Pagination;\n","import Pagination from './Pagination';\n\nexport { default as PageSelector, PAGE_LIMIT_BEFORE_SCROLL_MODE } from './PageSelector';\nexport * from './constants';\nexport default Pagination;\n"],"mappings":"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"}

package/dist/{Pagination-Dy-OSH0Y.d.mts → Pagination-CCKuudiz.d.mts}

@@ -1,4 +1,4 @@
-import { t as PaginationParams } from "./types-6L0ptM6-.mjs";
+import { t as PaginationParams } from "./types-CRymR_J9.mjs";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -44,4 +44,4 @@ declare const Pagination: ({
 }: PaginationProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { PaginationInfo as n, Pagination as t };
-//# sourceMappingURL=Pagination-Dy-OSH0Y.d.mts.map
+//# sourceMappingURL=Pagination-CCKuudiz.d.mts.map

package/dist/Pagination.d.mts

@@ -1,2 +1,2 @@
-import { n as PaginationInfo, t as Pagination } from "./Pagination-Dy-OSH0Y.mjs";
+import { n as PaginationInfo, t as Pagination } from "./Pagination-CCKuudiz.mjs";
 export { PaginationInfo, Pagination as default };

package/dist/{PillShell-B35z66jZ.d.mts → PillShell-B7Bm-dsE.d.mts}

@@ -1,4 +1,4 @@
-import { p as FilterSize } from "./types-DbOD5vE_.mjs";
+import { p as FilterSize } from "./types-DLnCkvTt.mjs";
 import * as _$react from "react";
 import { HTMLAttributes, ReactNode } from "react";
 
@@ -82,4 +82,4 @@ interface PillShellProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'onClick'
 declare const PillShell: _$react.ForwardRefExoticComponent<PillShellProps & _$react.RefAttributes<HTMLSpanElement>>;
 //#endregion
 export { PillShellProps as n, PillShell as t };
-//# sourceMappingURL=PillShell-B35z66jZ.d.mts.map
+//# sourceMappingURL=PillShell-B7Bm-dsE.d.mts.map

package/dist/PillShell.d.mts

@@ -1,2 +1,2 @@
-import { n as PillShellProps, t as PillShell } from "./PillShell-B35z66jZ.mjs";
+import { n as PillShellProps, t as PillShell } from "./PillShell-B7Bm-dsE.mjs";
 export { PillShellProps, PillShell as default };

package/dist/{ProgressIndicator-COCwRZfK.d.mts → ProgressIndicator-BoB5JOfV.d.mts}

@@ -63,4 +63,4 @@ declare const ProgressIndicator: ({
 }: ProgressIndicatorProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { StepStatus as i, ProgressIndicatorProps as n, ProgressIndicatorStep as r, ProgressIndicator as t };
-//# sourceMappingURL=ProgressIndicator-COCwRZfK.d.mts.map
+//# sourceMappingURL=ProgressIndicator-BoB5JOfV.d.mts.map

package/dist/{ProgressIndicator-ISARECzW.mjs → ProgressIndicator-zt3ndT9U.mjs}

@@ -185,4 +185,4 @@ const ProgressIndicator = ({ steps, activeStepId, layout = "vertical", onStepCli
 //#endregion
 export { ProgressIndicator as t };
 
-//# sourceMappingURL=ProgressIndicator-ISARECzW.mjs.map
+//# sourceMappingURL=ProgressIndicator-zt3ndT9U.mjs.map

package/dist/{ProgressIndicator-ISARECzW.mjs.map → ProgressIndicator-zt3ndT9U.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"ProgressIndicator-ISARECzW.mjs","names":[],"sources":["../src/components/ProgressIndicator/ProgressIndicator.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\nimport styled, { css, useTheme } from 'styled-components';\n\nimport { focusOutline } from '@persona/design-system/mixins/focus';\nimport { paragraphMixins } from '@persona/design-system/mixins/text';\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport {\n  CircleCheckFillIcon,\n  CircleFillIcon,\n  CircleNullIcon,\n  CircleWarningFillIcon,\n  WarningFillIcon,\n} from '@persona/icons';\nimport type { PDSIconComponent } from '@persona/icons/types';\n\nimport { withAlpha } from '#src/lib/color';\nimport { type MaybeSemanticTheme, semanticColor, semanticTokens } from '#src/lib/semanticColor';\n\nexport type StepStatus = 'uncompleted' | 'completed' | 'warning' | 'error';\n\nexport interface ProgressIndicatorStep {\n  id: string;\n  label: string;\n  /** @default 'uncompleted' */\n  status?: StepStatus;\n  disabled?: boolean;\n}\n\nexport interface ProgressIndicatorProps extends ComponentPropsWithoutRef<'ol'> {\n  steps: ProgressIndicatorStep[];\n  /** id of the step that should receive the active visual state */\n  activeStepId?: string;\n  /** @default 'vertical' */\n  layout?: 'vertical' | 'horizontal';\n  /**\n   * Called when a clickable step is activated via click or keyboard.\n   *\n   * Clickability rules:\n   * - `completed`, `warning`, and `error` steps are clickable (navigate back to review/edit)\n   * - The active step is not clickable (user is already there)\n   * - Upcoming `uncompleted` steps are not clickable (sequential progression required)\n   */\n  onStepClick?: (stepId: string) => void;\n}\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\n/**\n * Completed, warning, and error steps can be navigated back to.\n * The current step (first uncompleted or error) is also clickable so the user can\n * return to it after navigating back to an earlier step.\n * Active and upcoming steps (beyond the current) are not clickable.\n */\nfunction resolveClickable(\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n  isCurrent: boolean,\n): boolean {\n  if (isDisabled || isActive) {\n    return false;\n  }\n  return status === 'completed' || status === 'warning' || status === 'error' || isCurrent;\n}\n\nfunction resolveIcon(status: StepStatus, isCurrent: boolean): PDSIconComponent {\n  if (status === 'completed') {\n    return CircleCheckFillIcon;\n  }\n  if (status === 'warning') {\n    return WarningFillIcon;\n  }\n  if (status === 'error') {\n    return CircleWarningFillIcon;\n  }\n  if (isCurrent) {\n    return CircleFillIcon;\n  }\n  return CircleNullIcon;\n}\n\nfunction resolveIconColor(\n  theme: MaybeSemanticTheme,\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n) {\n  if (isDisabled) {\n    return semanticColor(theme, 'FgDisabled', Color.BorderIconDisabled);\n  }\n  if (status === 'completed') {\n    return semanticColor(theme, 'StatusSuccess3', Color.BorderIconSuccess);\n  }\n  if (status === 'warning') {\n    return semanticColor(theme, 'FgWarning1', Color.BorderIconWarning);\n  }\n  if (status === 'error') {\n    return semanticColor(theme, 'StatusDanger4', Color.BorderIconDanger);\n  }\n  return isActive\n    ? semanticColor(theme, 'FgAccent', Color.BorderIconActive)\n    : semanticColor(theme, 'FgSecondary', Color.BorderIconSecondary);\n}\n\nfunction resolveTextColor(\n  theme: MaybeSemanticTheme,\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n) {\n  if (isDisabled) {\n    return semanticColor(theme, 'FgDisabled', Color.TextDisabled);\n  }\n  if (isActive) {\n    return semanticColor(theme, 'FgAccent', Color.TextActive);\n  }\n  if (status === 'uncompleted') {\n    return semanticColor(theme, 'FgSecondary', Color.TextSecondary);\n  }\n  return semanticColor(theme, 'FgPrimary', Color.TextPrimary);\n}\n\n// ─── Styled components ────────────────────────────────────────────────────────\n\nconst StepList = styled.ol<{ $layout: 'vertical' | 'horizontal' }>`\n  display: flex;\n  flex-direction: ${({ $layout }) => ($layout === 'horizontal' ? 'row' : 'column')};\n  gap: ${({ $layout }) => ($layout === 'horizontal' ? Spacing[2] : '0px')};\n  list-style: none;\n  margin: 0;\n  padding: 0;\n`;\n\nconst StepItem = styled.li<{ $layout: 'vertical' | 'horizontal' }>`\n  display: flex;\n  align-items: center;\n\n  ${({ $layout }) =>\n    $layout === 'horizontal' &&\n    css`\n      width: fit-content;\n      white-space: nowrap;\n    `}\n`;\n\nconst StepContent = styled.button<{\n  $isActive: boolean;\n  $isClickable: boolean;\n  $interactive: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  width: 100%;\n  padding: ${Spacing[2]};\n  border-radius: ${BorderRadius.Md};\n  border: none;\n  margin: 0;\n  font: inherit;\n  color: inherit;\n  text-align: left;\n  outline: none;\n  cursor: ${({ $isClickable, $interactive }) => ($interactive && $isClickable ? 'pointer' : 'default')};\n\n  ${({ theme, $isActive, $isClickable, $interactive }) => {\n    const tokens = semanticTokens(theme);\n    if ($isActive) {\n      return css`\n        background-color: ${\n          tokens\n            ? withAlpha(tokens.SurfaceAccent, tokens.Opacity25)\n            : Color.BackgroundInteractiveActive\n        };\n      `;\n    }\n    if ($interactive && $isClickable) {\n      return css`\n        background-color: ${tokens ? 'transparent' : Color.BackgroundInteractiveDefault};\n        &:hover {\n          background-color: ${semanticColor(theme, 'SurfaceSecondary', Color.BackgroundInteractiveHover)};\n        }\n      `;\n    }\n    return css`\n      background-color: transparent;\n    `;\n  }}\n\n  ${focusOutline}\n\n  &:focus-visible {\n    position: relative;\n    z-index: 1;\n  }\n`;\n\nconst IconWrapper = styled.span<{ $color: string }>`\n  display: inline-flex;\n  flex-shrink: 0;\n  width: 16px;\n  height: 16px;\n  color: ${({ $color }) => $color};\n  line-height: 0;\n`;\n\nconst StepLabel = styled.span<{ $isActive: boolean; $color: string }>`\n  ${({ $isActive }) => ($isActive ? paragraphMixins.mdBold : paragraphMixins.md)};\n  color: ${({ $color }) => $color};\n`;\n\n// ─── Step ─────────────────────────────────────────────────────────────────────\n\ninterface StepProps {\n  step: ProgressIndicatorStep;\n  isActive: boolean;\n  isCurrent: boolean;\n  layout: 'vertical' | 'horizontal';\n  onStepClick?: (stepId: string) => void;\n}\n\nconst Step = ({ step, isActive, isCurrent, layout, onStepClick }: StepProps) => {\n  const { id, label, status = 'uncompleted', disabled = false } = step;\n\n  const interactive = Boolean(onStepClick);\n  const isClickable = resolveClickable(status, isActive, disabled, isCurrent);\n  const isInteractionDisabled = disabled || (!isActive && !isCurrent && status === 'uncompleted');\n  const theme = useTheme();\n  const iconColor = resolveIconColor(theme, status, isActive, disabled);\n  const textColor = resolveTextColor(theme, status, isActive, disabled);\n\n  const Icon = resolveIcon(status, isCurrent);\n\n  return (\n    <StepItem\n      $layout={layout}\n      aria-current={!interactive && isActive ? 'step' : undefined}\n      aria-disabled={!interactive && isInteractionDisabled ? true : undefined}\n    >\n      <StepContent\n        {...(interactive && isClickable\n          ? { type: 'button' as const, onClick: () => onStepClick?.(id) }\n          : { as: 'div' as const })}\n        aria-current={interactive && isActive ? 'step' : undefined}\n        aria-disabled={interactive && isInteractionDisabled ? true : undefined}\n        $isActive={isActive}\n        $isClickable={isClickable}\n        $interactive={interactive}\n      >\n        <IconWrapper $color={iconColor} aria-hidden='true'>\n          <Icon />\n        </IconWrapper>\n        <StepLabel $isActive={isActive} $color={textColor}>\n          {label}\n        </StepLabel>\n      </StepContent>\n    </StepItem>\n  );\n};\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * ProgressIndicator guides users through a sequence of steps.\n *\n * Interaction rules:\n * - **Completed / warning / error** steps are clickable — navigate back to review or fix.\n * - **Warning** does not block forward progression; later uncompleted steps remain reachable.\n * - **Error** blocks forward progression — treat it as the terminal step in the sequence.\n * - **Active** step is not clickable — the user is already there.\n * - **Upcoming (uncompleted)** steps are not clickable — sequential progression required.\n *\n * Navigation does not clear later steps. If a change on an earlier step\n * invalidates later data, the affected steps should be flagged and require\n * re-confirmation before submission — this logic lives in the consuming component.\n *\n * @example\n * ```tsx\n * <ProgressIndicator\n *   steps={[\n *     { id: 'identity', label: 'Identity', status: 'completed' },\n *     { id: 'address',  label: 'Address',  status: 'uncompleted' },\n *     { id: 'review',   label: 'Review',   status: 'uncompleted' },\n *   ]}\n *   activeStepId=\"address\"\n *   onStepClick={(id) => navigate(id)}\n * />\n * ```\n */\nexport const ProgressIndicator = ({\n  steps,\n  activeStepId,\n  layout = 'vertical',\n  onStepClick,\n  'aria-label': ariaLabel = 'Progress',\n  ...rest\n}: ProgressIndicatorProps) => {\n  // The \"current\" step is the first uncompleted or error step — where the user should work next.\n  // Warning steps are skipped so forward progression is not blocked.\n  // This is independent of activeStepId, which only controls the visual highlight.\n  const currentStepId = steps.find(\n    ({ status = 'uncompleted' }) => status === 'uncompleted' || status === 'error',\n  )?.id;\n\n  return (\n    <StepList $layout={layout} role='list' aria-label={ariaLabel} {...rest}>\n      {steps.map((step) => (\n        <Step\n          key={step.id}\n          step={step}\n          isActive={step.id === activeStepId}\n          isCurrent={step.id === currentStepId}\n          layout={layout}\n          onStepClick={onStepClick}\n        />\n      ))}\n    </StepList>\n  );\n};\n\nexport default ProgressIndicator;\n"],"mappings":"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"}
+{"version":3,"file":"ProgressIndicator-zt3ndT9U.mjs","names":[],"sources":["../src/components/ProgressIndicator/ProgressIndicator.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\nimport styled, { css, useTheme } from 'styled-components';\n\nimport { focusOutline } from '@persona/design-system/mixins/focus';\nimport { paragraphMixins } from '@persona/design-system/mixins/text';\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport {\n  CircleCheckFillIcon,\n  CircleFillIcon,\n  CircleNullIcon,\n  CircleWarningFillIcon,\n  WarningFillIcon,\n} from '@persona/icons';\nimport type { PDSIconComponent } from '@persona/icons/types';\n\nimport { withAlpha } from '#src/lib/color';\nimport { type MaybeSemanticTheme, semanticColor, semanticTokens } from '#src/lib/semanticColor';\n\nexport type StepStatus = 'uncompleted' | 'completed' | 'warning' | 'error';\n\nexport interface ProgressIndicatorStep {\n  id: string;\n  label: string;\n  /** @default 'uncompleted' */\n  status?: StepStatus;\n  disabled?: boolean;\n}\n\nexport interface ProgressIndicatorProps extends ComponentPropsWithoutRef<'ol'> {\n  steps: ProgressIndicatorStep[];\n  /** id of the step that should receive the active visual state */\n  activeStepId?: string;\n  /** @default 'vertical' */\n  layout?: 'vertical' | 'horizontal';\n  /**\n   * Called when a clickable step is activated via click or keyboard.\n   *\n   * Clickability rules:\n   * - `completed`, `warning`, and `error` steps are clickable (navigate back to review/edit)\n   * - The active step is not clickable (user is already there)\n   * - Upcoming `uncompleted` steps are not clickable (sequential progression required)\n   */\n  onStepClick?: (stepId: string) => void;\n}\n\n// ─── Helpers ─────────────────────────────────────────────────────────────────\n\n/**\n * Completed, warning, and error steps can be navigated back to.\n * The current step (first uncompleted or error) is also clickable so the user can\n * return to it after navigating back to an earlier step.\n * Active and upcoming steps (beyond the current) are not clickable.\n */\nfunction resolveClickable(\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n  isCurrent: boolean,\n): boolean {\n  if (isDisabled || isActive) {\n    return false;\n  }\n  return status === 'completed' || status === 'warning' || status === 'error' || isCurrent;\n}\n\nfunction resolveIcon(status: StepStatus, isCurrent: boolean): PDSIconComponent {\n  if (status === 'completed') {\n    return CircleCheckFillIcon;\n  }\n  if (status === 'warning') {\n    return WarningFillIcon;\n  }\n  if (status === 'error') {\n    return CircleWarningFillIcon;\n  }\n  if (isCurrent) {\n    return CircleFillIcon;\n  }\n  return CircleNullIcon;\n}\n\nfunction resolveIconColor(\n  theme: MaybeSemanticTheme,\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n) {\n  if (isDisabled) {\n    return semanticColor(theme, 'FgDisabled', Color.BorderIconDisabled);\n  }\n  if (status === 'completed') {\n    return semanticColor(theme, 'StatusSuccess3', Color.BorderIconSuccess);\n  }\n  if (status === 'warning') {\n    return semanticColor(theme, 'FgWarning1', Color.BorderIconWarning);\n  }\n  if (status === 'error') {\n    return semanticColor(theme, 'StatusDanger4', Color.BorderIconDanger);\n  }\n  return isActive\n    ? semanticColor(theme, 'FgAccent', Color.BorderIconActive)\n    : semanticColor(theme, 'FgSecondary', Color.BorderIconSecondary);\n}\n\nfunction resolveTextColor(\n  theme: MaybeSemanticTheme,\n  status: StepStatus,\n  isActive: boolean,\n  isDisabled: boolean,\n) {\n  if (isDisabled) {\n    return semanticColor(theme, 'FgDisabled', Color.TextDisabled);\n  }\n  if (isActive) {\n    return semanticColor(theme, 'FgAccent', Color.TextActive);\n  }\n  if (status === 'uncompleted') {\n    return semanticColor(theme, 'FgSecondary', Color.TextSecondary);\n  }\n  return semanticColor(theme, 'FgPrimary', Color.TextPrimary);\n}\n\n// ─── Styled components ────────────────────────────────────────────────────────\n\nconst StepList = styled.ol<{ $layout: 'vertical' | 'horizontal' }>`\n  display: flex;\n  flex-direction: ${({ $layout }) => ($layout === 'horizontal' ? 'row' : 'column')};\n  gap: ${({ $layout }) => ($layout === 'horizontal' ? Spacing[2] : '0px')};\n  list-style: none;\n  margin: 0;\n  padding: 0;\n`;\n\nconst StepItem = styled.li<{ $layout: 'vertical' | 'horizontal' }>`\n  display: flex;\n  align-items: center;\n\n  ${({ $layout }) =>\n    $layout === 'horizontal' &&\n    css`\n      width: fit-content;\n      white-space: nowrap;\n    `}\n`;\n\nconst StepContent = styled.button<{\n  $isActive: boolean;\n  $isClickable: boolean;\n  $interactive: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  width: 100%;\n  padding: ${Spacing[2]};\n  border-radius: ${BorderRadius.Md};\n  border: none;\n  margin: 0;\n  font: inherit;\n  color: inherit;\n  text-align: left;\n  outline: none;\n  cursor: ${({ $isClickable, $interactive }) => ($interactive && $isClickable ? 'pointer' : 'default')};\n\n  ${({ theme, $isActive, $isClickable, $interactive }) => {\n    const tokens = semanticTokens(theme);\n    if ($isActive) {\n      return css`\n        background-color: ${\n          tokens\n            ? withAlpha(tokens.SurfaceAccent, tokens.Opacity25)\n            : Color.BackgroundInteractiveActive\n        };\n      `;\n    }\n    if ($interactive && $isClickable) {\n      return css`\n        background-color: ${tokens ? 'transparent' : Color.BackgroundInteractiveDefault};\n        &:hover {\n          background-color: ${semanticColor(theme, 'SurfaceSecondary', Color.BackgroundInteractiveHover)};\n        }\n      `;\n    }\n    return css`\n      background-color: transparent;\n    `;\n  }}\n\n  ${focusOutline}\n\n  &:focus-visible {\n    position: relative;\n    z-index: 1;\n  }\n`;\n\nconst IconWrapper = styled.span<{ $color: string }>`\n  display: inline-flex;\n  flex-shrink: 0;\n  width: 16px;\n  height: 16px;\n  color: ${({ $color }) => $color};\n  line-height: 0;\n`;\n\nconst StepLabel = styled.span<{ $isActive: boolean; $color: string }>`\n  ${({ $isActive }) => ($isActive ? paragraphMixins.mdBold : paragraphMixins.md)};\n  color: ${({ $color }) => $color};\n`;\n\n// ─── Step ─────────────────────────────────────────────────────────────────────\n\ninterface StepProps {\n  step: ProgressIndicatorStep;\n  isActive: boolean;\n  isCurrent: boolean;\n  layout: 'vertical' | 'horizontal';\n  onStepClick?: (stepId: string) => void;\n}\n\nconst Step = ({ step, isActive, isCurrent, layout, onStepClick }: StepProps) => {\n  const { id, label, status = 'uncompleted', disabled = false } = step;\n\n  const interactive = Boolean(onStepClick);\n  const isClickable = resolveClickable(status, isActive, disabled, isCurrent);\n  const isInteractionDisabled = disabled || (!isActive && !isCurrent && status === 'uncompleted');\n  const theme = useTheme();\n  const iconColor = resolveIconColor(theme, status, isActive, disabled);\n  const textColor = resolveTextColor(theme, status, isActive, disabled);\n\n  const Icon = resolveIcon(status, isCurrent);\n\n  return (\n    <StepItem\n      $layout={layout}\n      aria-current={!interactive && isActive ? 'step' : undefined}\n      aria-disabled={!interactive && isInteractionDisabled ? true : undefined}\n    >\n      <StepContent\n        {...(interactive && isClickable\n          ? { type: 'button' as const, onClick: () => onStepClick?.(id) }\n          : { as: 'div' as const })}\n        aria-current={interactive && isActive ? 'step' : undefined}\n        aria-disabled={interactive && isInteractionDisabled ? true : undefined}\n        $isActive={isActive}\n        $isClickable={isClickable}\n        $interactive={interactive}\n      >\n        <IconWrapper $color={iconColor} aria-hidden='true'>\n          <Icon />\n        </IconWrapper>\n        <StepLabel $isActive={isActive} $color={textColor}>\n          {label}\n        </StepLabel>\n      </StepContent>\n    </StepItem>\n  );\n};\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\n/**\n * ProgressIndicator guides users through a sequence of steps.\n *\n * Interaction rules:\n * - **Completed / warning / error** steps are clickable — navigate back to review or fix.\n * - **Warning** does not block forward progression; later uncompleted steps remain reachable.\n * - **Error** blocks forward progression — treat it as the terminal step in the sequence.\n * - **Active** step is not clickable — the user is already there.\n * - **Upcoming (uncompleted)** steps are not clickable — sequential progression required.\n *\n * Navigation does not clear later steps. If a change on an earlier step\n * invalidates later data, the affected steps should be flagged and require\n * re-confirmation before submission — this logic lives in the consuming component.\n *\n * @example\n * ```tsx\n * <ProgressIndicator\n *   steps={[\n *     { id: 'identity', label: 'Identity', status: 'completed' },\n *     { id: 'address',  label: 'Address',  status: 'uncompleted' },\n *     { id: 'review',   label: 'Review',   status: 'uncompleted' },\n *   ]}\n *   activeStepId=\"address\"\n *   onStepClick={(id) => navigate(id)}\n * />\n * ```\n */\nexport const ProgressIndicator = ({\n  steps,\n  activeStepId,\n  layout = 'vertical',\n  onStepClick,\n  'aria-label': ariaLabel = 'Progress',\n  ...rest\n}: ProgressIndicatorProps) => {\n  // The \"current\" step is the first uncompleted or error step — where the user should work next.\n  // Warning steps are skipped so forward progression is not blocked.\n  // This is independent of activeStepId, which only controls the visual highlight.\n  const currentStepId = steps.find(\n    ({ status = 'uncompleted' }) => status === 'uncompleted' || status === 'error',\n  )?.id;\n\n  return (\n    <StepList $layout={layout} role='list' aria-label={ariaLabel} {...rest}>\n      {steps.map((step) => (\n        <Step\n          key={step.id}\n          step={step}\n          isActive={step.id === activeStepId}\n          isCurrent={step.id === currentStepId}\n          layout={layout}\n          onStepClick={onStepClick}\n        />\n      ))}\n    </StepList>\n  );\n};\n\nexport default ProgressIndicator;\n"],"mappings":"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"}

package/dist/ProgressIndicator.d.mts

@@ -1,2 +1,2 @@
-import { i as StepStatus, n as ProgressIndicatorProps, r as ProgressIndicatorStep, t as ProgressIndicator } from "./ProgressIndicator-COCwRZfK.mjs";
+import { i as StepStatus, n as ProgressIndicatorProps, r as ProgressIndicatorStep, t as ProgressIndicator } from "./ProgressIndicator-BoB5JOfV.mjs";
 export { ProgressIndicator, ProgressIndicator as default, ProgressIndicatorProps, ProgressIndicatorStep, StepStatus };

package/dist/{PseudoClassProps-D_f-JUT1.d.mts → PseudoClassProps-CIuO49a4.d.mts}

@@ -9,4 +9,4 @@ interface PseudoClassProps {
 }
 //#endregion
 export { PseudoClassProps as t };
-//# sourceMappingURL=PseudoClassProps-D_f-JUT1.d.mts.map
+//# sourceMappingURL=PseudoClassProps-CIuO49a4.d.mts.map

package/dist/PseudoClassProps.d.mts

@@ -1,2 +1,2 @@
-import { t as PseudoClassProps } from "./PseudoClassProps-D_f-JUT1.mjs";
+import { t as PseudoClassProps } from "./PseudoClassProps-CIuO49a4.mjs";
 export { PseudoClassProps as default };

package/dist/{RadioGroup-pyGpWhhj.d.mts → RadioGroup-D_z37ZOU.d.mts}

@@ -18,4 +18,4 @@ interface RadioGroupProps extends ComponentPropsWithoutRef<'div'> {
 declare const RadioGroup: VFC<RadioGroupProps>;
 //#endregion
 export { RadioGroupProps as n, RadioGroup as t };
-//# sourceMappingURL=RadioGroup-pyGpWhhj.d.mts.map
+//# sourceMappingURL=RadioGroup-D_z37ZOU.d.mts.map

package/dist/RadioGroup.d.mts

@@ -1,2 +1,2 @@
-import { n as RadioGroupProps, t as RadioGroup } from "./RadioGroup-pyGpWhhj.mjs";
+import { n as RadioGroupProps, t as RadioGroup } from "./RadioGroup-D_z37ZOU.mjs";
 export { RadioGroup, RadioGroup as default, RadioGroupProps };

package/dist/{RangeCalendar-BiugsdSP.d.mts → RangeCalendar-CLCp70w6.d.mts}

@@ -1,4 +1,4 @@
-import { a as DateFilterPreset } from "./types-rDQg74j-.mjs";
+import { a as DateFilterPreset } from "./types-DQVUNrrN.mjs";
 import { Ref } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { DateRange, RangeCalendarProps } from "react-aria";
@@ -37,4 +37,4 @@ declare const RangeCalendar: ({
 }: RangeCalendarProps$1) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { RangeCalendarProps$1 as n, RangeCalendar as t };
-//# sourceMappingURL=RangeCalendar-BiugsdSP.d.mts.map
+//# sourceMappingURL=RangeCalendar-CLCp70w6.d.mts.map

package/dist/RangeCalendar.d.mts

@@ -1,2 +1,2 @@
-import { n as RangeCalendarProps, t as RangeCalendar } from "./RangeCalendar-BiugsdSP.mjs";
+import { n as RangeCalendarProps, t as RangeCalendar } from "./RangeCalendar-CLCp70w6.mjs";
 export { RangeCalendarProps, RangeCalendar as default };

package/dist/RangeCalendarPresets.d.mts

@@ -1,4 +1,4 @@
-import { a as DateFilterPreset } from "./types-rDQg74j-.mjs";
+import { a as DateFilterPreset } from "./types-DQVUNrrN.mjs";
 import * as _$react from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { RangeCalendarState } from "react-stately";

package/dist/{RouterContext-BUdfr1it.d.mts → RouterContext-DchdVyIX.d.mts}

@@ -1,4 +1,4 @@
-import { n as RouterAdapter } from "./types-Dhz6VMKx.mjs";
+import { n as RouterAdapter } from "./types-BRYGqFVm.mjs";
 import * as _$react from "react";
 import { FC, PropsWithChildren } from "react";
 
@@ -8,4 +8,4 @@ declare const RouterProvider: FC<PropsWithChildren<RouterAdapter>>;
 declare const useRouter: () => RouterAdapter | null;
 //#endregion
 export { RouterProvider as n, useRouter as r, RouterContext as t };
-//# sourceMappingURL=RouterContext-BUdfr1it.d.mts.map
+//# sourceMappingURL=RouterContext-DchdVyIX.d.mts.map

package/dist/RouterContext.d.mts

@@ -1,2 +1,2 @@
-import { n as RouterProvider, r as useRouter, t as RouterContext } from "./RouterContext-BUdfr1it.mjs";
+import { n as RouterProvider, r as useRouter, t as RouterContext } from "./RouterContext-DchdVyIX.mjs";
 export { RouterContext, RouterProvider, useRouter };

package/dist/{RouterLink-BKbfvJcM.d.mts → RouterLink-B6ikC5Kq.d.mts}

@@ -1,8 +1,8 @@
-import { r as RouterLinkComponentProps } from "./types-Dhz6VMKx.mjs";
+import { r as RouterLinkComponentProps } from "./types-BRYGqFVm.mjs";
 import * as _$react from "react";
 
 //#region src/lib/router/RouterLink.d.ts
 declare const RouterLink: _$react.ForwardRefExoticComponent<Omit<RouterLinkComponentProps, "ref"> & _$react.RefAttributes<HTMLAnchorElement>>;
 //#endregion
 export { RouterLink as t };
-//# sourceMappingURL=RouterLink-BKbfvJcM.d.mts.map
+//# sourceMappingURL=RouterLink-B6ikC5Kq.d.mts.map

package/dist/RouterLink.d.mts

@@ -1,2 +1,2 @@
-import { t as RouterLink } from "./RouterLink-BKbfvJcM.mjs";
+import { t as RouterLink } from "./RouterLink-B6ikC5Kq.mjs";
 export { RouterLink as default };

package/dist/RuleEditorFields.d.mts

@@ -1,5 +1,5 @@
-import { d as FilterRuleValue, f as FilterRuleValueChange, l as FilterOperator, o as FilterField, p as FilterSize, u as FilterRule } from "./types-DbOD5vE_.mjs";
-import { t as FieldRegistry } from "./FieldRegistry-a44G08fS.mjs";
+import { d as FilterRuleValue, f as FilterRuleValueChange, l as FilterOperator, o as FilterField, p as FilterSize, u as FilterRule } from "./types-DLnCkvTt.mjs";
+import { t as FieldRegistry } from "./FieldRegistry-C2NVPhMO.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 

package/dist/RulesPill.d.mts

@@ -1,4 +1,4 @@
-import { n as CompoundExpression, p as FilterSize } from "./types-DbOD5vE_.mjs";
+import { n as CompoundExpression, p as FilterSize } from "./types-DLnCkvTt.mjs";
 import * as _$react from "react";
 import { HTMLAttributes } from "react";
 

package/dist/{SearchInput-BejaiGsS.d.mts → SearchInput-D42v7MLp.d.mts}

@@ -1,4 +1,4 @@
-import { n as InputSizes } from "./input-gtTnb9M8.mjs";
+import { n as InputSizes } from "./input-JDU1Goyr.mjs";
 import { FocusEventHandler, ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -50,4 +50,4 @@ declare const SearchInput: ({
 }: OmniSearchProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { SearchInput as n, OmniSearchProps as t };
-//# sourceMappingURL=SearchInput-BejaiGsS.d.mts.map
+//# sourceMappingURL=SearchInput-D42v7MLp.d.mts.map

package/dist/SearchInput.d.mts

@@ -1,2 +1,2 @@
-import { n as SearchInput, t as OmniSearchProps } from "./SearchInput-BejaiGsS.mjs";
+import { n as SearchInput, t as OmniSearchProps } from "./SearchInput-D42v7MLp.mjs";
 export { OmniSearchProps, SearchInput as default };

package/dist/SectionHeading.d.mts

@@ -1,4 +1,4 @@
-import { i as TextAction, n as IconAction, r as MenuAction } from "./Action-Bmo8B-Q3.mjs";
+import { i as TextAction, n as IconAction, r as MenuAction } from "./Action-CHWYwpYR.mjs";
 import { ComponentPropsWithoutRef, FC, ReactElement, ReactNode } from "react";
 
 //#region src/components/CardV2/SectionHeading.d.ts

package/dist/{SegmentedControl-UV03Ujqn.d.mts → SegmentedControl-yVK6kkcx.d.mts}

@@ -57,4 +57,4 @@ interface SegmentedControlItemProps extends Omit<ToggleButtonProps, 'isDisabled'
 declare const SegmentedControlItem: _$react.ForwardRefExoticComponent<SegmentedControlItemProps & _$react.RefAttributes<HTMLButtonElement>>;
 //#endregion
 export { SegmentedControlProps as i, SegmentedControlItem as n, SegmentedControlItemProps as r, SegmentedControl as t };
-//# sourceMappingURL=SegmentedControl-UV03Ujqn.d.mts.map
+//# sourceMappingURL=SegmentedControl-yVK6kkcx.d.mts.map

package/dist/SegmentedControl.d.mts

@@ -1,2 +1,2 @@
-import { i as SegmentedControlProps, n as SegmentedControlItem, r as SegmentedControlItemProps, t as SegmentedControl } from "./SegmentedControl-UV03Ujqn.mjs";
+import { i as SegmentedControlProps, n as SegmentedControlItem, r as SegmentedControlItemProps, t as SegmentedControl } from "./SegmentedControl-yVK6kkcx.mjs";
 export { SegmentedControl, SegmentedControl as default, SegmentedControlItem, SegmentedControlItemProps, SegmentedControlProps };

package/dist/{Select-BLqHxJUz.d.mts → Select-CaG6OQi1.d.mts}

@@ -1,5 +1,5 @@
-import { l as MenuItemProps } from "./Menu-ByYFNvgS.mjs";
-import { n as InputSizes, t as InputMixinProps } from "./input-gtTnb9M8.mjs";
+import { l as MenuItemProps } from "./Menu-BfjvH8mr.mjs";
+import { n as InputSizes, t as InputMixinProps } from "./input-JDU1Goyr.mjs";
 import * as _$react from "react";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -80,4 +80,4 @@ declare const Select: _$react.ForwardRefExoticComponent<SelectProps & _$react.Re
 declare const Option: _$react.ForwardRefExoticComponent<SelectPrimitive.SelectItemProps & MenuItemProps<"div"> & _$react.RefAttributes<HTMLDivElement>>;
 //#endregion
 export { SelectProps as i, Select as n, SelectHeader as r, Option as t };
-//# sourceMappingURL=Select-BLqHxJUz.d.mts.map
+//# sourceMappingURL=Select-CaG6OQi1.d.mts.map

package/dist/Select.d.mts

@@ -1,2 +1,2 @@
-import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "./Select-BLqHxJUz.mjs";
+import { i as SelectProps, n as Select, r as SelectHeader, t as Option } from "./Select-CaG6OQi1.mjs";
 export { Option, Select, Select as default, SelectHeader, SelectProps };

package/dist/{SingleColumnLayout-DBo35psH.d.mts → SingleColumnLayout-D2bpX7X1.d.mts}

@@ -1,4 +1,4 @@
-import { t as PageLayoutChromeProps } from "./PageLayoutFrame-CQLREOBH.mjs";
+import { t as PageLayoutChromeProps } from "./PageLayoutFrame-4QGs7x-t.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -13,4 +13,4 @@ declare const SingleColumnLayout: ({
 }: SingleColumnLayoutProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { SingleColumnLayoutProps as n, SingleColumnLayout as t };
-//# sourceMappingURL=SingleColumnLayout-DBo35psH.d.mts.map
+//# sourceMappingURL=SingleColumnLayout-D2bpX7X1.d.mts.map

package/dist/SingleColumnLayout.d.mts

@@ -1,2 +1,2 @@
-import { n as SingleColumnLayoutProps, t as SingleColumnLayout } from "./SingleColumnLayout-DBo35psH.mjs";
+import { n as SingleColumnLayoutProps, t as SingleColumnLayout } from "./SingleColumnLayout-D2bpX7X1.mjs";
 export { SingleColumnLayout, SingleColumnLayoutProps };

package/dist/SmartTextInput.d.mts

@@ -1,9 +1,9 @@
-import { t as ASTNode } from "./types-dmItSshr.mjs";
-import { dt as ObjectSchemaMap, n as JsonSchema, st as FunctionJsonSchema } from "./jsonSchema-DUkfAip_.mjs";
-import { n as PossibleChainSchema, t as ChainRoot } from "./chainTypes-aF5rWav-.mjs";
-import { a as Mode, i as FunctionFormRenderProps, n as CustomFunctionDetailRenderProps, s as PopoverFooterRenderer, t as CodeChainFunctionPanelRenderProps, u as ValueType } from "./types-XjJqUj-p.mjs";
-import { n as useChain } from "./useChain-7ztbfujM.mjs";
-import { t as ContextMenuExamples } from "./listbox-options-CkwENvff.mjs";
+import { t as ASTNode } from "./types-DeVO4sCM.mjs";
+import { dt as ObjectSchemaMap, n as JsonSchema, st as FunctionJsonSchema } from "./jsonSchema-C4lfpDrt.mjs";
+import { n as PossibleChainSchema, t as ChainRoot } from "./chainTypes-C5mXGz6T.mjs";
+import { a as Mode, i as FunctionFormRenderProps, n as CustomFunctionDetailRenderProps, s as PopoverFooterRenderer, t as CodeChainFunctionPanelRenderProps, u as ValueType } from "./types-02Ij0dgs.mjs";
+import { n as useChain } from "./useChain-B--KAtdN.mjs";
+import { t as ContextMenuExamples } from "./listbox-options-CDAOiyUH.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 

package/dist/SmartTextInputField.d.mts

@@ -1,5 +1,5 @@
-import { o as ImplementsFormField } from "./inputFields-Dfpxi68z.mjs";
-import { n as TableBoxField } from "./TableBoxField-C7MGSie9.mjs";
+import { o as ImplementsFormField } from "./inputFields-BnCdmuBt.mjs";
+import { n as TableBoxField } from "./TableBoxField-0uIGzBhF.mjs";
 import SmartTextInput from "./SmartTextInput.mjs";
 import { CSSProperties, ComponentProps } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";

package/dist/SmartTextInputFunctionDialog.d.mts

@@ -1,7 +1,7 @@
-import { i as StackProps } from "./Stack-DrYxBkiF.mjs";
-import { s as MethodChainNode } from "./methodChainTypes-BtbYWrdP.mjs";
-import { n as PossibleChainSchema, t as ChainRoot } from "./chainTypes-aF5rWav-.mjs";
-import { i as FunctionFormRenderProps, n as CustomFunctionDetailRenderProps, o as OpenCodeChainFunctionPanel, r as FunctionAtCursor } from "./types-XjJqUj-p.mjs";
+import { i as StackProps } from "./Stack-CODxfzhl.mjs";
+import { s as MethodChainNode } from "./methodChainTypes-De6sHGyd.mjs";
+import { n as PossibleChainSchema, t as ChainRoot } from "./chainTypes-C5mXGz6T.mjs";
+import { i as FunctionFormRenderProps, n as CustomFunctionDetailRenderProps, o as OpenCodeChainFunctionPanel, r as FunctionAtCursor } from "./types-02Ij0dgs.mjs";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 

package/dist/SmartTextInputListbox.d.mts

@@ -1,5 +1,5 @@
-import { a as Mode } from "./types-XjJqUj-p.mjs";
-import { a as SmartTextInputOption } from "./listbox-options-CkwENvff.mjs";
+import { a as Mode } from "./types-02Ij0dgs.mjs";
+import { a as SmartTextInputOption } from "./listbox-options-CDAOiyUH.mjs";
 import { ListBoxProps } from "react-aria-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import { ComboBoxState } from "react-stately";

package/dist/SmartTextInputPopover.d.mts

@@ -1,4 +1,4 @@
-import { a as SmartTextInputOption } from "./listbox-options-CkwENvff.mjs";
+import { a as SmartTextInputOption } from "./listbox-options-CDAOiyUH.mjs";
 import { ReactNode } from "react";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";

package/dist/{SplitColumnLayout-C6m_mwdf.d.mts → SplitColumnLayout-CRDSDHHm.d.mts}

@@ -1,4 +1,4 @@
-import { t as PageLayoutChromeProps } from "./PageLayoutFrame-CQLREOBH.mjs";
+import { t as PageLayoutChromeProps } from "./PageLayoutFrame-4QGs7x-t.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -16,4 +16,4 @@ declare const SplitColumnLayout: ({
 }: SplitColumnLayoutProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { SplitColumnLayoutProps as n, SplitColumnLayout as t };
-//# sourceMappingURL=SplitColumnLayout-C6m_mwdf.d.mts.map
+//# sourceMappingURL=SplitColumnLayout-CRDSDHHm.d.mts.map

package/dist/SplitColumnLayout.d.mts

@@ -1,2 +1,2 @@
-import { n as SplitColumnLayoutProps, t as SplitColumnLayout } from "./SplitColumnLayout-C6m_mwdf.mjs";
+import { n as SplitColumnLayoutProps, t as SplitColumnLayout } from "./SplitColumnLayout-CRDSDHHm.mjs";
 export { SplitColumnLayout, SplitColumnLayoutProps };

package/dist/{Stack-DrYxBkiF.d.mts → Stack-CODxfzhl.d.mts}

@@ -44,4 +44,4 @@ type HStackProps = ComponentPropsWithoutRef<'div'> & StackProps;
 declare const HStack: (props: HStackProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { StackProps as i, HStackProps as n, Stack as r, HStack as t };
-//# sourceMappingURL=Stack-DrYxBkiF.d.mts.map
+//# sourceMappingURL=Stack-CODxfzhl.d.mts.map

package/dist/Stack.d.mts

@@ -1,2 +1,2 @@
-import { i as StackProps, n as HStackProps, r as Stack, t as HStack } from "./Stack-DrYxBkiF.mjs";
+import { i as StackProps, n as HStackProps, r as Stack, t as HStack } from "./Stack-CODxfzhl.mjs";
 export { HStack, HStackProps, Stack, Stack as default, StackProps };

package/dist/{StatusIndicator-pWl1-FLb.mjs → StatusIndicator-Zf75KK3O.mjs}

@@ -312,4 +312,4 @@ const StatusIndicator = ({ status, type, background = "filled", showIcon = true,
 //#endregion
 export { StatusIndicator as n, STATUSES as t };
 
-//# sourceMappingURL=StatusIndicator-pWl1-FLb.mjs.map
+//# sourceMappingURL=StatusIndicator-Zf75KK3O.mjs.map