npm - @persona/design-system - Versions diffs - 0.10.14 → 0.10.15 - Mend

@persona/design-system 0.10.14 → 0.10.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (381) hide show

package/dist/{Pii-BYPkrBuT.mjs.map → Pii-x1UInvWe.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pii-~~BYPkrBuT~~.mjs","names":[],"sources":["../src/components/Pii/Pii.tsx","../src/components/Pii/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport Sticker from '@persona/design-system/components/Sticker';\n\ninterface PiiProps {\n children?: ReactNode;\n isRedacted: boolean;\n hideOnRedacted?: boolean;\n}\n\nconst Pii = ({ children, isRedacted, hideOnRedacted }: PiiProps) => {\n if (isRedacted) {\n return hideOnRedacted ? null : <Sticker data-test='pii__redacted'>Redacted</Sticker>;\n }\n\n if (children == null \|\| children === '') {\n return null;\n }\n\n // There used to be code inserting a classname here in certain cases. There's\n // no other reason for this to be conditionally wrapped in a span, but\n // removing it breaks a lot of tests. Someday, the tests will be fixed...\n // hopefully.\n if (['string', 'number'].includes(typeof children)) {\n return <span>{children}</span>;\n }\n\n return <>{children}</>;\n};\n\nexport default Pii;\n","import Pii from './Pii';\n\nexport default Pii;\n"],"mappings":";;;AAUA,MAAM,OAAO,EAAE,UAAU,YAAY,qBAA+B;AAClE,KAAI,WACF,QAAO,iBAAiB,OAAO,oBAAC,SAAD;EAAS,aAAU;YAAgB;EAAkB,CAAA;AAGtF,KAAI,YAAY,QAAQ,aAAa,GACnC,QAAO;AAOT,KAAI,CAAC,UAAU,SAAS,CAAC,SAAS,OAAO,SAAS,CAChD,QAAO,oBAAC,QAAD,EAAO,UAAgB,CAAA;AAGhC,QAAO,oBAAA,UAAA,EAAG,UAAY,CAAA;;;;ACzBxB,IAAA,cAAe"}
1	+ {"version":3,"file":"Pii-x1UInvWe.mjs","names":[],"sources":["../src/components/Pii/Pii.tsx","../src/components/Pii/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport Sticker from '@persona/design-system/components/Sticker';\n\ninterface PiiProps {\n children?: ReactNode;\n isRedacted: boolean;\n hideOnRedacted?: boolean;\n}\n\nconst Pii = ({ children, isRedacted, hideOnRedacted }: PiiProps) => {\n if (isRedacted) {\n return hideOnRedacted ? null : <Sticker data-test='pii__redacted'>Redacted</Sticker>;\n }\n\n if (children == null \|\| children === '') {\n return null;\n }\n\n // There used to be code inserting a classname here in certain cases. There's\n // no other reason for this to be conditionally wrapped in a span, but\n // removing it breaks a lot of tests. Someday, the tests will be fixed...\n // hopefully.\n if (['string', 'number'].includes(typeof children)) {\n return <span>{children}</span>;\n }\n\n return <>{children}</>;\n};\n\nexport default Pii;\n","import Pii from './Pii';\n\nexport default Pii;\n"],"mappings":";;;AAUA,MAAM,OAAO,EAAE,UAAU,YAAY,qBAA+B;AAClE,KAAI,WACF,QAAO,iBAAiB,OAAO,oBAAC,SAAD;EAAS,aAAU;YAAgB;EAAkB,CAAA;AAGtF,KAAI,YAAY,QAAQ,aAAa,GACnC,QAAO;AAOT,KAAI,CAAC,UAAU,SAAS,CAAC,SAAS,OAAO,SAAS,CAChD,QAAO,oBAAC,QAAD,EAAO,UAAgB,CAAA;AAGhC,QAAO,oBAAA,UAAA,EAAG,UAAY,CAAA;;;;ACzBxB,IAAA,cAAe"}

package/dist/{PillShell-Bkyu5FXB.d.mts → PillShell-DuTRfsS1.d.mts} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { p as FilterSize } from "./types-BJqmRXFV.mjs";
+import { p as FilterSize } from "./types-CnqmdPXi.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-Bkyu5FXB.d.mts.map
+//# sourceMappingURL=PillShell-DuTRfsS1.d.mts.map

package/dist/PillShell.d.mts CHANGED Viewed

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

package/dist/{Popover-DP9DXReH.mjs → Popover-BMX-ff3L.mjs} RENAMED Viewed

@@ -1,11 +1,11 @@
 import { a as styled, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticOnly } from "./lib/semanticColor.mjs";
+import { popoverMotion } from "./mixins/motion.mjs";
+import { semanticScrollbar } from "./mixins/scrollbar.mjs";
 import { t as Card_default } from "./Card-DuQHyroh.mjs";
 import { i as Paragraph } from "./Text-D0vEReED.mjs";
 import { letPointerDownReachDocument } from "./lib/letPointerDownReachDocument.mjs";
 import { mergeRefs, useCloseFocus } from "./lib/useCloseFocus.mjs";
-import { popoverMotion } from "./mixins/motion.mjs";
-import { semanticScrollbar } from "./mixins/scrollbar.mjs";
 import { Children, cloneElement, createContext, forwardRef, isValidElement, useContext, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { XIcon } from "@persona/icons";
@@ -168,4 +168,4 @@ var Popover_default = Object.assign(Popover, {
 //#endregion
 export { PopoverPortal as a, PopoverContent as i, PopoverCard as n, PopoverTrigger as o, PopoverClose as r, Popover_default as s, PopoverAnchor as t };
-//# sourceMappingURL=Popover-DP9DXReH.mjs.map
+//# sourceMappingURL=Popover-BMX-ff3L.mjs.map

package/dist/{Popover-DP9DXReH.mjs.map → Popover-BMX-ff3L.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover-DP9DXReH.mjs","names":["Card"],"sources":["../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as PopoverPrimitive from '@radix-ui/react-popover';\nimport {\n Children,\n cloneElement,\n createContext,\n forwardRef,\n isValidElement,\n type ReactElement,\n type RefObject,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { Spacing } from '@persona/design-tokens';\nimport { XIcon } from '@persona/icons';\n\nimport Card from '#src/components/Card';\nimport { Paragraph } from '#src/components/Text';\nimport { letPointerDownReachDocument } from '#src/lib/letPointerDownReachDocument';\nimport { semanticOnly } from '#src/lib/semanticColor';\nimport { mergeRefs, useCloseFocus } from '#src/lib/useCloseFocus';\nimport { popoverMotion } from '#src/mixins/motion';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverPortal = PopoverPrimitive.Portal;\n\nconst PopoverRootContext = createContext<{\n modal?: boolean;\n triggerRef?: RefObject<HTMLElement \| null>;\n}>({});\n\nexport const PopoverContent = forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n PopoverPrimitive.PopoverContentProps\n>(function PopoverContent(\n {\n onPointerDownCapture,\n onCloseAutoFocus,\n onOpenAutoFocus,\n onInteractOutside,\n onEscapeKeyDown,\n ...props\n },\n ref,\n) {\n const { modal, triggerRef } = useContext(PopoverRootContext);\n const { ref: closeFocusRef, ...closeFocus } = useCloseFocus({\n onCloseAutoFocus,\n onOpenAutoFocus,\n onInteractOutside,\n onEscapeKeyDown,\n modal,\n triggerRef,\n });\n const mergedRef = useMemo(() => mergeRefs(ref, closeFocusRef), [ref, closeFocusRef]);\n return (\n <PopoverPrimitive.Content\n {...props}\n {...closeFocus}\n onOpenAutoFocus={onOpenAutoFocus}\n ref={mergedRef}\n onPointerDownCapture={(event) => {\n onPointerDownCapture?.(event);\n letPointerDownReachDocument(event);\n }}\n />\n );\n});\n\nconst PopoverContentStyled = styled(PopoverContent)<{ zIndex?: number; $maxHeight?: string }>`\n ${popoverMotion('--radix-popover-content-transform-origin')}\n z-index: ${({ zIndex }) => zIndex \|\| 'inherit'};\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${$maxHeight};\n overflow: auto;\n ${semanticScrollbar}\n `}\n`;\n\nconst PopoverCloseButton = styled(PopoverPrimitive.Close)<{ isHeader?: boolean }>`\n ${({ isHeader }) =>\n !isHeader &&\n css`\n position: absolute;\n top: 8px;\n right: 8px;\n `}\n ${({ isHeader }) =>\n isHeader &&\n css`\n height: 16px;\n `}\n background: transparent;\n border: 0;\n cursor: pointer;\n`;\n\nconst PopoverPanel = styled(Card)`\n ${semanticOnly((tokens) => `background-color: ${tokens.SurfaceElevated};`)}\n`;\n\nconst HeadingContainer = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n`;\n\nexport const PopoverClose = (\n props: PopoverPrimitive.PopoverCloseProps & { isHeader?: boolean },\n) => {\n return (\n <PopoverCloseButton {...props}>\n <XIcon />\n </PopoverCloseButton>\n );\n};\n\nexport interface PopoverCardProps extends PopoverPrimitive.PopoverContentProps {\n /*\n Display X button to close popover\n /\n showCloseButton?: boolean;\n\n /\n Remove padding from Card\n /\n noPadding?: boolean;\n\n padding?: Spacing;\n\n /\n Text to display in the header of the card\n /\n heading?: string;\n\n /\n Z-index to apply to the popover content\n /\n zIndex?: number;\n\n /\n Maximum height for the popover content.\n /\n maxHeight?: string;\n}\n\n/\n Card to be used in Popover contexts. Inherits props from Radix UI Popper.Content.\n /\nexport const PopoverCard = forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n PopoverCardProps\n>(function PopoverCard(\n { children, showCloseButton, heading, noPadding, padding, zIndex, maxHeight, ...props },\n ref,\n) {\n const header = heading && (\n <HeadingContainer>\n <Paragraph size='md' weight='bold' color='primary'>\n {heading}\n </Paragraph>\n {showCloseButton && <PopoverClose aria-label='Close' isHeader />}\n </HeadingContainer>\n );\n return (\n <PopoverContentStyled\n asChild\n sideOffset={8}\n collisionPadding={8}\n zIndex={zIndex}\n $maxHeight={maxHeight}\n {...props}\n ref={ref}\n >\n <PopoverPanel elevated>\n {!heading && showCloseButton && <PopoverClose aria-label='Close' />}\n {noPadding ? (\n <>\n {heading && header}\n {children}\n </>\n ) : (\n <Card.Body padding={padding}>\n {heading && header}\n {children}\n </Card.Body>\n )}\n </PopoverPanel>\n </PopoverContentStyled>\n );\n});\n\ninterface PopoverProps extends PopoverPrimitive.PopoverProps {\n /\n Component to use as trigger. Radix UI trigger component props will be merged with this element.\n /\n trigger?: ReactElement;\n\n /\n Props to apply to Popover.Trigger within\n /\n triggerProps?: PopoverPrimitive.PopoverTriggerProps;\n\n /\n An optional element to position the Popover.Content against.\n * If this part is not used, the content will position alongside the trigger.\n /\n anchor?: ReactElement<PopoverPrimitive.PopoverAnchorProps>;\n\n /\n Props to apply to Popover.Card within\n /\n contentProps?: PopoverCardProps;\n\n /\n Render content within a portal\n /\n portal?: boolean;\n\n /\n Props applied to Radix UI Portal component\n /\n portalProps?: PopoverPrimitive.PopoverPortalProps;\n}\n\nconst Popover = ({\n children,\n trigger,\n triggerProps,\n contentProps,\n anchor,\n portal = true,\n portalProps,\n ...props\n}: PopoverProps) => {\n let triggerElem;\n let contentElem;\n let anchorElem = anchor;\n\n const renderChildren = Children.toArray(children).filter((child) => {\n if (isValidElement(child)) {\n switch (child.type) {\n case PopoverPrimitive.Trigger:\n triggerElem = child;\n return false;\n case PopoverCard:\n case PopoverContent:\n case PopoverPrimitive.Content:\n contentElem = child;\n break;\n case PopoverPrimitive.Anchor:\n / @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n anchorElem = child;\n return false;\n }\n }\n\n return true;\n });\n\n const content = contentElem \|\| <PopoverCard {...contentProps}>{renderChildren}</PopoverCard>;\n const triggerRef = useRef<HTMLButtonElement>(null);\n const rootContext = useMemo(() => ({ modal: props.modal, triggerRef }), [props.modal]);\n const ownTrigger: ReactElement \| undefined = triggerElem;\n const ownTriggerRef = (ownTrigger as { ref?: React.Ref<HTMLElement> } \| undefined)?.ref;\n const ownTriggerMergedRef = useMemo(() => mergeRefs(ownTriggerRef, triggerRef), [ownTriggerRef]);\n const triggerPropsRef = (triggerProps as { ref?: React.Ref<HTMLButtonElement> } \| undefined)?.ref;\n const triggerMergedRef = useMemo(() => mergeRefs(triggerPropsRef, triggerRef), [triggerPropsRef]);\n\n return (\n <PopoverRootContext.Provider value={rootContext}>\n <PopoverPrimitive.Root {...props}>\n {ownTrigger\n ? cloneElement(ownTrigger, { ref: ownTriggerMergedRef })\n : trigger && (\n <PopoverTrigger asChild {...triggerProps} ref={triggerMergedRef}>\n {trigger}\n </PopoverTrigger>\n )}\n {anchorElem}\n {portal ? <PopoverPortal {...portalProps}>{content}</PopoverPortal> : content}\n </PopoverPrimitive.Root>\n </PopoverRootContext.Provider>\n );\n};\n\nexport default Object.assign(Popover, {\n Trigger: PopoverTrigger,\n Anchor: PopoverAnchor,\n Portal: PopoverPortal,\n Content: PopoverContent,\n Card: PopoverCard,\n Close: PopoverClose,\n});\n"],"mappings":"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"}
1	+ {"version":3,"file":"Popover-BMX-ff3L.mjs","names":["Card"],"sources":["../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as PopoverPrimitive from '@radix-ui/react-popover';\nimport {\n Children,\n cloneElement,\n createContext,\n forwardRef,\n isValidElement,\n type ReactElement,\n type RefObject,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { Spacing } from '@persona/design-tokens';\nimport { XIcon } from '@persona/icons';\n\nimport Card from '#src/components/Card';\nimport { Paragraph } from '#src/components/Text';\nimport { letPointerDownReachDocument } from '#src/lib/letPointerDownReachDocument';\nimport { semanticOnly } from '#src/lib/semanticColor';\nimport { mergeRefs, useCloseFocus } from '#src/lib/useCloseFocus';\nimport { popoverMotion } from '#src/mixins/motion';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\n\nexport const PopoverTrigger = PopoverPrimitive.Trigger;\nexport const PopoverAnchor = PopoverPrimitive.Anchor;\nexport const PopoverPortal = PopoverPrimitive.Portal;\n\nconst PopoverRootContext = createContext<{\n modal?: boolean;\n triggerRef?: RefObject<HTMLElement \| null>;\n}>({});\n\nexport const PopoverContent = forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n PopoverPrimitive.PopoverContentProps\n>(function PopoverContent(\n {\n onPointerDownCapture,\n onCloseAutoFocus,\n onOpenAutoFocus,\n onInteractOutside,\n onEscapeKeyDown,\n ...props\n },\n ref,\n) {\n const { modal, triggerRef } = useContext(PopoverRootContext);\n const { ref: closeFocusRef, ...closeFocus } = useCloseFocus({\n onCloseAutoFocus,\n onOpenAutoFocus,\n onInteractOutside,\n onEscapeKeyDown,\n modal,\n triggerRef,\n });\n const mergedRef = useMemo(() => mergeRefs(ref, closeFocusRef), [ref, closeFocusRef]);\n return (\n <PopoverPrimitive.Content\n {...props}\n {...closeFocus}\n onOpenAutoFocus={onOpenAutoFocus}\n ref={mergedRef}\n onPointerDownCapture={(event) => {\n onPointerDownCapture?.(event);\n letPointerDownReachDocument(event);\n }}\n />\n );\n});\n\nconst PopoverContentStyled = styled(PopoverContent)<{ zIndex?: number; $maxHeight?: string }>`\n ${popoverMotion('--radix-popover-content-transform-origin')}\n z-index: ${({ zIndex }) => zIndex \|\| 'inherit'};\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${$maxHeight};\n overflow: auto;\n ${semanticScrollbar}\n `}\n`;\n\nconst PopoverCloseButton = styled(PopoverPrimitive.Close)<{ isHeader?: boolean }>`\n ${({ isHeader }) =>\n !isHeader &&\n css`\n position: absolute;\n top: 8px;\n right: 8px;\n `}\n ${({ isHeader }) =>\n isHeader &&\n css`\n height: 16px;\n `}\n background: transparent;\n border: 0;\n cursor: pointer;\n`;\n\nconst PopoverPanel = styled(Card)`\n ${semanticOnly((tokens) => `background-color: ${tokens.SurfaceElevated};`)}\n`;\n\nconst HeadingContainer = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n`;\n\nexport const PopoverClose = (\n props: PopoverPrimitive.PopoverCloseProps & { isHeader?: boolean },\n) => {\n return (\n <PopoverCloseButton {...props}>\n <XIcon />\n </PopoverCloseButton>\n );\n};\n\nexport interface PopoverCardProps extends PopoverPrimitive.PopoverContentProps {\n /*\n Display X button to close popover\n /\n showCloseButton?: boolean;\n\n /\n Remove padding from Card\n /\n noPadding?: boolean;\n\n padding?: Spacing;\n\n /\n Text to display in the header of the card\n /\n heading?: string;\n\n /\n Z-index to apply to the popover content\n /\n zIndex?: number;\n\n /\n Maximum height for the popover content.\n /\n maxHeight?: string;\n}\n\n/\n Card to be used in Popover contexts. Inherits props from Radix UI Popper.Content.\n /\nexport const PopoverCard = forwardRef<\n React.ElementRef<typeof PopoverPrimitive.Content>,\n PopoverCardProps\n>(function PopoverCard(\n { children, showCloseButton, heading, noPadding, padding, zIndex, maxHeight, ...props },\n ref,\n) {\n const header = heading && (\n <HeadingContainer>\n <Paragraph size='md' weight='bold' color='primary'>\n {heading}\n </Paragraph>\n {showCloseButton && <PopoverClose aria-label='Close' isHeader />}\n </HeadingContainer>\n );\n return (\n <PopoverContentStyled\n asChild\n sideOffset={8}\n collisionPadding={8}\n zIndex={zIndex}\n $maxHeight={maxHeight}\n {...props}\n ref={ref}\n >\n <PopoverPanel elevated>\n {!heading && showCloseButton && <PopoverClose aria-label='Close' />}\n {noPadding ? (\n <>\n {heading && header}\n {children}\n </>\n ) : (\n <Card.Body padding={padding}>\n {heading && header}\n {children}\n </Card.Body>\n )}\n </PopoverPanel>\n </PopoverContentStyled>\n );\n});\n\ninterface PopoverProps extends PopoverPrimitive.PopoverProps {\n /\n Component to use as trigger. Radix UI trigger component props will be merged with this element.\n /\n trigger?: ReactElement;\n\n /\n Props to apply to Popover.Trigger within\n /\n triggerProps?: PopoverPrimitive.PopoverTriggerProps;\n\n /\n An optional element to position the Popover.Content against.\n * If this part is not used, the content will position alongside the trigger.\n /\n anchor?: ReactElement<PopoverPrimitive.PopoverAnchorProps>;\n\n /\n Props to apply to Popover.Card within\n /\n contentProps?: PopoverCardProps;\n\n /\n Render content within a portal\n /\n portal?: boolean;\n\n /\n Props applied to Radix UI Portal component\n /\n portalProps?: PopoverPrimitive.PopoverPortalProps;\n}\n\nconst Popover = ({\n children,\n trigger,\n triggerProps,\n contentProps,\n anchor,\n portal = true,\n portalProps,\n ...props\n}: PopoverProps) => {\n let triggerElem;\n let contentElem;\n let anchorElem = anchor;\n\n const renderChildren = Children.toArray(children).filter((child) => {\n if (isValidElement(child)) {\n switch (child.type) {\n case PopoverPrimitive.Trigger:\n triggerElem = child;\n return false;\n case PopoverCard:\n case PopoverContent:\n case PopoverPrimitive.Content:\n contentElem = child;\n break;\n case PopoverPrimitive.Anchor:\n / @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n anchorElem = child;\n return false;\n }\n }\n\n return true;\n });\n\n const content = contentElem \|\| <PopoverCard {...contentProps}>{renderChildren}</PopoverCard>;\n const triggerRef = useRef<HTMLButtonElement>(null);\n const rootContext = useMemo(() => ({ modal: props.modal, triggerRef }), [props.modal]);\n const ownTrigger: ReactElement \| undefined = triggerElem;\n const ownTriggerRef = (ownTrigger as { ref?: React.Ref<HTMLElement> } \| undefined)?.ref;\n const ownTriggerMergedRef = useMemo(() => mergeRefs(ownTriggerRef, triggerRef), [ownTriggerRef]);\n const triggerPropsRef = (triggerProps as { ref?: React.Ref<HTMLButtonElement> } \| undefined)?.ref;\n const triggerMergedRef = useMemo(() => mergeRefs(triggerPropsRef, triggerRef), [triggerPropsRef]);\n\n return (\n <PopoverRootContext.Provider value={rootContext}>\n <PopoverPrimitive.Root {...props}>\n {ownTrigger\n ? cloneElement(ownTrigger, { ref: ownTriggerMergedRef })\n : trigger && (\n <PopoverTrigger asChild {...triggerProps} ref={triggerMergedRef}>\n {trigger}\n </PopoverTrigger>\n )}\n {anchorElem}\n {portal ? <PopoverPortal {...portalProps}>{content}</PopoverPortal> : content}\n </PopoverPrimitive.Root>\n </PopoverRootContext.Provider>\n );\n};\n\nexport default Object.assign(Popover, {\n Trigger: PopoverTrigger,\n Anchor: PopoverAnchor,\n Portal: PopoverPortal,\n Content: PopoverContent,\n Card: PopoverCard,\n Close: PopoverClose,\n});\n"],"mappings":"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"}

package/dist/Popover.d.mts CHANGED Viewed

@@ -1,6 +1,6 @@
+import { Spacing } from "@persona/design-tokens";
 import * as _$react from "react";
 import { ReactElement } from "react";
-import { Spacing } from "@persona/design-tokens";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import * as PopoverPrimitive from "@radix-ui/react-popover";

package/dist/ProgressBar.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { ComponentPropsWithoutRef } from "react";
 import { Color } from "@persona/design-tokens";
+import { ComponentPropsWithoutRef } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 //#region src/components/ProgressBar/ProgressBar.d.ts

package/dist/{ProgressIndicator-zt3ndT9U.mjs → ProgressIndicator-hy1P-RG1.mjs} RENAMED Viewed

@@ -1,8 +1,8 @@
 import { a as styled, o as useTheme, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticColor, semanticTokens } from "./lib/semanticColor.mjs";
-import { paragraphMixins } from "./mixins/text.mjs";
-import { withAlpha } from "./lib/color.mjs";
 import { focusOutline } from "./mixins/focus.mjs";
+import { withAlpha } from "./lib/color.mjs";
+import { paragraphMixins } from "./mixins/text.mjs";
 import { BorderRadius, Color, Spacing } from "@persona/design-tokens";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CircleCheckFillIcon, CircleFillIcon, CircleNullIcon, CircleWarningFillIcon, WarningFillIcon } from "@persona/icons";
@@ -185,4 +185,4 @@ const ProgressIndicator = ({ steps, activeStepId, layout = "vertical", onStepCli
 //#endregion
 export { ProgressIndicator as t };
-//# sourceMappingURL=ProgressIndicator-zt3ndT9U.mjs.map
+//# sourceMappingURL=ProgressIndicator-hy1P-RG1.mjs.map

package/dist/{ProgressIndicator-zt3ndT9U.mjs.map → ProgressIndicator-hy1P-RG1.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"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":";;;;;;;;;;;;;;;AAqDA,SAAS,iBACP,QACA,UACA,YACA,WACS;AACT,KAAI,cAAc,SAChB,QAAO;AAET,QAAO,WAAW,eAAe,WAAW,aAAa,WAAW,WAAW;;AAGjF,SAAS,YAAY,QAAoB,WAAsC;AAC7E,KAAI,WAAW,YACb,QAAO;AAET,KAAI,WAAW,UACb,QAAO;AAET,KAAI,WAAW,QACb,QAAO;AAET,KAAI,UACF,QAAO;AAET,QAAO;;AAGT,SAAS,iBACP,OACA,QACA,UACA,YACA;AACA,KAAI,WACF,QAAO,cAAc,OAAO,cAAc,MAAM,mBAAmB;AAErE,KAAI,WAAW,YACb,QAAO,cAAc,OAAO,kBAAkB,MAAM,kBAAkB;AAExE,KAAI,WAAW,UACb,QAAO,cAAc,OAAO,cAAc,MAAM,kBAAkB;AAEpE,KAAI,WAAW,QACb,QAAO,cAAc,OAAO,iBAAiB,MAAM,iBAAiB;AAEtE,QAAO,WACH,cAAc,OAAO,YAAY,MAAM,iBAAiB,GACxD,cAAc,OAAO,eAAe,MAAM,oBAAoB;;AAGpE,SAAS,iBACP,OACA,QACA,UACA,YACA;AACA,KAAI,WACF,QAAO,cAAc,OAAO,cAAc,MAAM,aAAa;AAE/D,KAAI,SACF,QAAO,cAAc,OAAO,YAAY,MAAM,WAAW;AAE3D,KAAI,WAAW,cACb,QAAO,cAAc,OAAO,eAAe,MAAM,cAAc;AAEjE,QAAO,cAAc,OAAO,aAAa,MAAM,YAAY;;AAK7D,MAAM,WAAW,OAAO,EAA0C;;qBAE7C,EAAE,cAAe,YAAY,eAAe,QAAQ,SAAU;UACzE,EAAE,cAAe,YAAY,eAAe,QAAQ,KAAK,MAAO;;;;;AAM1E,MAAM,WAAW,OAAO,EAA0C;;;;KAI7D,EAAE,cACH,YAAY,gBACZ,GAAG;;;MAGD;;AAGN,MAAM,cAAc,OAAO,MAIzB;;;SAGO,QAAQ,GAAG;;aAEP,QAAQ,GAAG;mBACL,aAAa,GAAG;;;;;;;aAOtB,EAAE,cAAc,mBAAoB,gBAAgB,eAAe,YAAY,UAAW;;KAElG,EAAE,OAAO,WAAW,cAAc,mBAAmB;CACtD,MAAM,SAAS,eAAe,MAAM;AACpC,KAAI,UACF,QAAO,GAAG;4BAEN,SACI,UAAU,OAAO,eAAe,OAAO,UAAU,GACjD,MAAM,4BACX;;AAGL,KAAI,gBAAgB,aAClB,QAAO,GAAG;4BACY,SAAS,gBAAgB,MAAM,6BAA6B;;8BAE1D,cAAc,OAAO,oBAAoB,MAAM,2BAA2B,CAAC;;;AAIrG,QAAO,GAAG;;;EAGV;;IAEA,aAAa;;;;;;;AAQjB,MAAM,cAAc,OAAO,IAAwB;;;;;YAKvC,EAAE,aAAa,OAAO;;;AAIlC,MAAM,YAAY,OAAO,IAA4C;KAChE,EAAE,gBAAiB,YAAY,gBAAgB,SAAS,gBAAgB,GAAI;YACrE,EAAE,aAAa,OAAO;;AAalC,MAAM,QAAQ,EAAE,MAAM,UAAU,WAAW,QAAQ,kBAA6B;CAC9E,MAAM,EAAE,IAAI,OAAO,SAAS,eAAe,WAAW,UAAU;CAEhE,MAAM,cAAc,QAAQ,YAAY;CACxC,MAAM,cAAc,iBAAiB,QAAQ,UAAU,UAAU,UAAU;CAC3E,MAAM,wBAAwB,YAAa,CAAC,YAAY,CAAC,aAAa,WAAW;CACjF,MAAM,QAAQ,UAAU;CACxB,MAAM,YAAY,iBAAiB,OAAO,QAAQ,UAAU,SAAS;CACrE,MAAM,YAAY,iBAAiB,OAAO,QAAQ,UAAU,SAAS;CAErE,MAAM,OAAO,YAAY,QAAQ,UAAU;AAE3C,QACE,oBAAC,UAAD;EACE,SAAS;EACT,gBAAc,CAAC,eAAe,WAAW,SAAS,KAAA;EAClD,iBAAe,CAAC,eAAe,wBAAwB,OAAO,KAAA;YAE9D,qBAAC,aAAD;GACE,GAAK,eAAe,cAChB;IAAE,MAAM;IAAmB,eAAe,cAAc,GAAG;IAAE,GAC7D,EAAE,IAAI,OAAgB;GAC1B,gBAAc,eAAe,WAAW,SAAS,KAAA;GACjD,iBAAe,eAAe,wBAAwB,OAAO,KAAA;GAC7D,WAAW;GACX,cAAc;GACd,cAAc;aARhB,CAUE,oBAAC,aAAD;IAAa,QAAQ;IAAW,eAAY;cAC1C,oBAAC,MAAD,EAAQ,CAAA;IACI,CAAA,EACd,oBAAC,WAAD;IAAW,WAAW;IAAU,QAAQ;cACrC;IACS,CAAA,CACA;;EACL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCf,MAAa,qBAAqB,EAChC,OACA,cACA,SAAS,YACT,aACA,cAAc,YAAY,YAC1B,GAAG,WACyB;CAI5B,MAAM,gBAAgB,MAAM,MACzB,EAAE,SAAS,oBAAoB,WAAW,iBAAiB,WAAW,QACxE,EAAE;AAEH,QACE,oBAAC,UAAD;EAAU,SAAS;EAAQ,MAAK;EAAO,cAAY;EAAW,GAAI;YAC/D,MAAM,KAAK,SACV,oBAAC,MAAD;GAEQ;GACN,UAAU,KAAK,OAAO;GACtB,WAAW,KAAK,OAAO;GACf;GACK;GACb,EANK,KAAK,GAMV,CACF;EACO,CAAA"}
1	+ {"version":3,"file":"ProgressIndicator-hy1P-RG1.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/{Radio-B1H_S-Qj.mjs → Radio-D6Vydkx-.mjs} RENAMED Viewed

@@ -1,12 +1,12 @@
 import { a as styled, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
+import { isChecked, isDisabled, isFocusedVisible, isHovered, isNotDisabled } from "./lib/pseudoClass.mjs";
 import { semanticColor, semanticOnly } from "./lib/semanticColor.mjs";
+import { focusStyle } from "./mixins/focus.mjs";
 import "./variables/transitions.mjs";
 import { opacityOf } from "./lib/color.mjs";
-import { isChecked, isDisabled, isFocusedVisible, isHovered, isNotDisabled } from "./lib/pseudoClass.mjs";
-import { focusStyle } from "./mixins/focus.mjs";
-import { n as useFormField } from "./useFormField-pOVkb5BK.mjs";
-import { forwardRef, useMemo } from "react";
+import { n as useFormField } from "./useFormField-Cd9sH-HM.mjs";
 import { Color, Spacing, Typography } from "@persona/design-tokens";
+import { forwardRef, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { uniqueId } from "lodash-es";
 //#region src/components/Radio/Radio.tsx
@@ -148,4 +148,4 @@ const Radio = forwardRef(function Radio({ id, label, className, value, disabled,
 //#endregion
 export { Radio as t };
-//# sourceMappingURL=Radio-B1H_S-Qj.mjs.map
+//# sourceMappingURL=Radio-D6Vydkx-.mjs.map

package/dist/{Radio-B1H_S-Qj.mjs.map → Radio-D6Vydkx-.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Radio-~~B1H_S-Qj.~~mjs","names":[],"sources":["../src/components/Radio/Radio.tsx"],"sourcesContent":["import { uniqueId } from 'lodash-es';\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n useMemo,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\n\nimport useFormField from '#src/components/FormControl/useFormField';\nimport { opacityOf } from '#src/lib/color';\nimport {\n isChecked,\n isDisabled,\n isFocusedVisible,\n isHovered,\n isNotDisabled,\n} from '#src/lib/pseudoClass';\nimport { semanticColor, semanticOnly } from '#src/lib/semanticColor';\nimport { focusStyle } from '#src/mixins/focus';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nconst Container = styled.div<{ size: 'md' \| 'sm'; disabled?: boolean }>`\n cursor: pointer;\n display: flex;\n align-items: flex-start;\n flex-wrap: nowrap;\n position: relative;\n\n ${({ size }) =>\n size === 'sm' &&\n css`\n align-items: center;\n height: 16px;\n `}\n\n &${isDisabled} {\n cursor: default;\n }\n`;\n\nconst Label = styled.label<{ disabled: boolean; size: 'md' \| 'sm' }>`\n cursor: inherit;\n padding: 0 ${Spacing[2]};\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', Color.TextSecondary)};\n\n ${({ size }) =>\n size === 'sm'\n ? css`\n ${Typography.TextSmall};\n line-height: 16px;\n `\n : css`\n ${Typography.TextMedium};\n `}\n\n ${({ theme, disabled }) =>\n disabled &&\n css`\n cursor: default;\n color: ${semanticColor(theme, 'FgDisabled', theme.color.text.disabled)};\n `}\n`;\n\nconst RadioCircle = styled.div<{ size: 'md' \| 'sm' }>`\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: box-shadow ${TransitionDuration.Fast} ${TransitionEasing.Move};\n border-radius: 100%;\n height: ${Spacing[4]};\n width: ${Spacing[4]};\n flex: 0 0 16px;\n box-sizing: border-box;\n margin-top: ${({ size }) => (size === 'sm' ? 0 : '2px')};\n border: 1px solid ${({ theme }) => semanticColor(theme, 'InputBorderStrong', Color.BorderInputCheckbox)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceDefault', Color.PrimaryWhite)};\n`;\n\nconst RadioInput = styled.input<{ $size: 'md' \| 'sm' }>`\n cursor: inherit;\n height: ${Spacing[4]};\n width: ${Spacing[4]};\n margin: 0;\n border: 0;\n opacity: 0;\n overflow: hidden;\n position: absolute;\n top: ${({ $size }) => ($size === 'sm' ? 0 : '2px')};\n border-radius: 100%;\n z-index: 10; // this needs to be above the dot in the checked input\n\n &${isHovered}${isNotDisabled} ~ ${RadioCircle} {\n border-color: ${({ theme }) =>\n semanticColor(theme, 'InputBorderHoverStrong', Color.BorderInputCheckboxHover)};\n ${semanticOnly((tokens) => `background: ${tokens.InputSurfaceHover};`)}\n }\n\n &${isChecked}, &:checked {\n &${isHovered}${isNotDisabled} ~ ${RadioCircle} {\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentHover', Color.BackgroundInputActiveHover)};\n border-color: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentHover', Color.BackgroundInputActiveHover)};\n }\n }\n\n &${isFocusedVisible}${isNotDisabled} ~ ${RadioCircle} {\n ${focusStyle}\n }\n\n // RadioCircle state styles; Uses pure CSS\n &${isDisabled} + ${RadioCircle} {\n cursor: default;\n background: ${({ theme }) =>\n semanticColor(theme, 'InputSurfaceDisabled', Color.BackgroundInputDisabled)};\n border-color: ${({ theme }) =>\n semanticColor(theme, 'InputBorderDisabled', Color.BorderInputDisabled)};\n ${semanticOnly((tokens) => `opacity: ${opacityOf(tokens.Opacity65)};`)}\n }\n\n &:checked + ${RadioCircle}, &${isChecked} + ${RadioCircle} {\n border-color: ${({ theme }) => semanticColor(theme, 'InputBorderAccent', Color.BackgroundInputActive)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccent', Color.BackgroundInputActive)};\n\n &::after {\n background: ${({ theme }) => semanticColor(theme, 'FgInverseStatic', Color.BackgroundInputDefault)};\n height: 6px;\n width: 6px;\n border-radius: 100%;\n content: '';\n position: absolute;\n }\n }\n\n &:checked${isDisabled} + ${RadioCircle}, &${isChecked}${isDisabled} + ${RadioCircle} {\n border-color: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentDisabled', Color.BackgroundInputActiveDisabled)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentDisabled', Color.BackgroundInputActiveDisabled)};\n }\n`;\n\nexport interface RadioProps extends Omit<ComponentPropsWithoutRef<'input'>, 'size'> {\n /*\n If not provided, a unique ID will be generated.\n */\n id?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n label?: ReactNode;\n disabled?: boolean;\n checked?: boolean;\n value: string;\n 'data-test'?: string;\n size?: 'md' \| 'sm';\n}\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n {\n id,\n label,\n className,\n value,\n disabled,\n checked,\n defaultChecked,\n onChange,\n 'data-test': dataTest,\n size = 'md',\n ...elemProps\n },\n ref,\n) {\n const field = useFormField({ disabled });\n const generatedId = useMemo(() => uniqueId('pds_radio__'), []);\n\n return (\n <Container className={className} disabled={disabled} data-test={dataTest} size={size}>\n <RadioInput\n id={id \|\| generatedId}\n disabled={field.disabled}\n onChange={onChange}\n type='radio'\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n ref={ref}\n $size={size}\n {...elemProps}\n />\n <RadioCircle size={size} />\n {label && (\n <Label htmlFor={id \|\| generatedId} disabled={disabled ?? false} size={size}>\n {label}\n </Label>\n )}\n </Container>\n );\n});\n\nexport default Radio;\n"],"mappings":";;;;;;;;;;;;AAyBA,MAAM,YAAY,OAAO,GAA8C;;;;;;;KAOlE,EAAE,WACH,SAAS,QACT,GAAG;;;MAGD;;KAED,WAAW;;;;AAKhB,MAAM,QAAQ,OAAO,KAA+C;;eAErD,QAAQ,GAAG;YACd,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,cAAc,CAAC;;KAE9E,EAAE,WACH,SAAS,OACL,GAAG;YACC,WAAW,UAAU;;YAGzB,GAAG;YACC,WAAW,WAAW;UACxB;;KAEL,EAAE,OAAO,eACV,YACA,GAAG;;eAEQ,cAAc,OAAO,cAAc,MAAM,MAAM,KAAK,SAAS,CAAC;MACvE;;AAGN,MAAM,cAAc,OAAO,GAA0B;;;;;mCAKF,GAAA,+BAAyB;;YAEhE,QAAQ,GAAG;WACZ,QAAQ,GAAG;;;iBAGL,EAAE,WAAY,SAAS,OAAO,IAAI,MAAO;uBACnC,EAAE,YAAY,cAAc,OAAO,qBAAqB,MAAM,oBAAoB,CAAC;iBACzF,EAAE,YAAY,cAAc,OAAO,uBAAuB,MAAM,aAAa,CAAC;;AAG/F,MAAM,aAAa,OAAO,KAA6B;;YAE3C,QAAQ,GAAG;WACZ,QAAQ,GAAG;;;;;;UAMZ,EAAE,YAAa,UAAU,OAAO,IAAI,MAAO;;;;KAIhD,YAAY,cAAc,KAAK,YAAY;qBAC3B,EAAE,YACjB,cAAc,OAAO,0BAA0B,MAAM,yBAAyB,CAAC;MAC/E,cAAc,WAAW,eAAe,OAAO,kBAAkB,GAAG,CAAC;;;KAGtE,UAAU;OACR,YAAY,cAAc,KAAK,YAAY;qBAC7B,EAAE,YAAY,cAAc,OAAO,2BAA2B,MAAM,2BAA2B,CAAC;uBAC9F,EAAE,YAAY,cAAc,OAAO,2BAA2B,MAAM,2BAA2B,CAAC;;;;KAIlH,mBAAmB,cAAc,KAAK,YAAY;MACjD,WAAW;;;;KAIZ,WAAW,KAAK,YAAY;;mBAEd,EAAE,YACf,cAAc,OAAO,wBAAwB,MAAM,wBAAwB,CAAC;qBAC7D,EAAE,YACjB,cAAc,OAAO,uBAAuB,MAAM,oBAAoB,CAAC;MACvE,cAAc,WAAW,YAAY,UAAU,OAAO,UAAU,CAAC,GAAG,CAAC;;;gBAG3D,YAAY,KAAK,UAAU,KAAK,YAAY;qBACvC,EAAE,YAAY,cAAc,OAAO,qBAAqB,MAAM,sBAAsB,CAAC;mBACvF,EAAE,YAAY,cAAc,OAAO,sBAAsB,MAAM,sBAAsB,CAAC;;;qBAGpF,EAAE,YAAY,cAAc,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;;;;;;;;;aAS5F,WAAW,KAAK,YAAY,KAAK,YAAY,WAAW,KAAK,YAAY;qBACjE,EAAE,YAAY,cAAc,OAAO,8BAA8B,MAAM,8BAA8B,CAAC;mBACxG,EAAE,YAAY,cAAc,OAAO,8BAA8B,MAAM,8BAA8B,CAAC;;;AAkBzH,MAAa,QAAQ,WAAyC,SAAS,MACrE,EACE,IACA,OACA,WACA,OACA,UACA,SACA,gBACA,UACA,aAAa,UACb,OAAO,MACP,GAAG,aAEL,KACA;CACA,MAAM,QAAQ,aAAa,EAAE,UAAU,CAAC;CACxC,MAAM,cAAc,cAAc,SAAS,cAAc,EAAE,EAAE,CAAC;AAE9D,QACE,qBAAC,WAAD;EAAsB;EAAqB;EAAU,aAAW;EAAgB;YAAhF;GACE,oBAAC,YAAD;IACE,IAAI,MAAM;IACV,UAAU,MAAM;IACN;IACV,MAAK;IACE;IACE;IACO;IACX;IACL,OAAO;IACP,GAAI;IACJ,CAAA;GACF,oBAAC,aAAD,EAAmB,MAAQ,CAAA;GAC1B,SACC,oBAAC,OAAD;IAAO,SAAS,MAAM;IAAa,UAAU,YAAY;IAAa;cACnE;IACK,CAAA;GAEA;;EAEd"}
1	+ {"version":3,"file":"Radio-D6Vydkx-.mjs","names":[],"sources":["../src/components/Radio/Radio.tsx"],"sourcesContent":["import { uniqueId } from 'lodash-es';\nimport {\n type ChangeEvent,\n type ComponentPropsWithoutRef,\n forwardRef,\n type ReactNode,\n useMemo,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing, Typography } from '@persona/design-tokens';\n\nimport useFormField from '#src/components/FormControl/useFormField';\nimport { opacityOf } from '#src/lib/color';\nimport {\n isChecked,\n isDisabled,\n isFocusedVisible,\n isHovered,\n isNotDisabled,\n} from '#src/lib/pseudoClass';\nimport { semanticColor, semanticOnly } from '#src/lib/semanticColor';\nimport { focusStyle } from '#src/mixins/focus';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nconst Container = styled.div<{ size: 'md' \| 'sm'; disabled?: boolean }>`\n cursor: pointer;\n display: flex;\n align-items: flex-start;\n flex-wrap: nowrap;\n position: relative;\n\n ${({ size }) =>\n size === 'sm' &&\n css`\n align-items: center;\n height: 16px;\n `}\n\n &${isDisabled} {\n cursor: default;\n }\n`;\n\nconst Label = styled.label<{ disabled: boolean; size: 'md' \| 'sm' }>`\n cursor: inherit;\n padding: 0 ${Spacing[2]};\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', Color.TextSecondary)};\n\n ${({ size }) =>\n size === 'sm'\n ? css`\n ${Typography.TextSmall};\n line-height: 16px;\n `\n : css`\n ${Typography.TextMedium};\n `}\n\n ${({ theme, disabled }) =>\n disabled &&\n css`\n cursor: default;\n color: ${semanticColor(theme, 'FgDisabled', theme.color.text.disabled)};\n `}\n`;\n\nconst RadioCircle = styled.div<{ size: 'md' \| 'sm' }>`\n cursor: pointer;\n display: flex;\n justify-content: center;\n align-items: center;\n transition: box-shadow ${TransitionDuration.Fast} ${TransitionEasing.Move};\n border-radius: 100%;\n height: ${Spacing[4]};\n width: ${Spacing[4]};\n flex: 0 0 16px;\n box-sizing: border-box;\n margin-top: ${({ size }) => (size === 'sm' ? 0 : '2px')};\n border: 1px solid ${({ theme }) => semanticColor(theme, 'InputBorderStrong', Color.BorderInputCheckbox)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceDefault', Color.PrimaryWhite)};\n`;\n\nconst RadioInput = styled.input<{ $size: 'md' \| 'sm' }>`\n cursor: inherit;\n height: ${Spacing[4]};\n width: ${Spacing[4]};\n margin: 0;\n border: 0;\n opacity: 0;\n overflow: hidden;\n position: absolute;\n top: ${({ $size }) => ($size === 'sm' ? 0 : '2px')};\n border-radius: 100%;\n z-index: 10; // this needs to be above the dot in the checked input\n\n &${isHovered}${isNotDisabled} ~ ${RadioCircle} {\n border-color: ${({ theme }) =>\n semanticColor(theme, 'InputBorderHoverStrong', Color.BorderInputCheckboxHover)};\n ${semanticOnly((tokens) => `background: ${tokens.InputSurfaceHover};`)}\n }\n\n &${isChecked}, &:checked {\n &${isHovered}${isNotDisabled} ~ ${RadioCircle} {\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentHover', Color.BackgroundInputActiveHover)};\n border-color: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentHover', Color.BackgroundInputActiveHover)};\n }\n }\n\n &${isFocusedVisible}${isNotDisabled} ~ ${RadioCircle} {\n ${focusStyle}\n }\n\n // RadioCircle state styles; Uses pure CSS\n &${isDisabled} + ${RadioCircle} {\n cursor: default;\n background: ${({ theme }) =>\n semanticColor(theme, 'InputSurfaceDisabled', Color.BackgroundInputDisabled)};\n border-color: ${({ theme }) =>\n semanticColor(theme, 'InputBorderDisabled', Color.BorderInputDisabled)};\n ${semanticOnly((tokens) => `opacity: ${opacityOf(tokens.Opacity65)};`)}\n }\n\n &:checked + ${RadioCircle}, &${isChecked} + ${RadioCircle} {\n border-color: ${({ theme }) => semanticColor(theme, 'InputBorderAccent', Color.BackgroundInputActive)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccent', Color.BackgroundInputActive)};\n\n &::after {\n background: ${({ theme }) => semanticColor(theme, 'FgInverseStatic', Color.BackgroundInputDefault)};\n height: 6px;\n width: 6px;\n border-radius: 100%;\n content: '';\n position: absolute;\n }\n }\n\n &:checked${isDisabled} + ${RadioCircle}, &${isChecked}${isDisabled} + ${RadioCircle} {\n border-color: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentDisabled', Color.BackgroundInputActiveDisabled)};\n background: ${({ theme }) => semanticColor(theme, 'InputSurfaceAccentDisabled', Color.BackgroundInputActiveDisabled)};\n }\n`;\n\nexport interface RadioProps extends Omit<ComponentPropsWithoutRef<'input'>, 'size'> {\n /*\n If not provided, a unique ID will be generated.\n */\n id?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n label?: ReactNode;\n disabled?: boolean;\n checked?: boolean;\n value: string;\n 'data-test'?: string;\n size?: 'md' \| 'sm';\n}\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(function Radio(\n {\n id,\n label,\n className,\n value,\n disabled,\n checked,\n defaultChecked,\n onChange,\n 'data-test': dataTest,\n size = 'md',\n ...elemProps\n },\n ref,\n) {\n const field = useFormField({ disabled });\n const generatedId = useMemo(() => uniqueId('pds_radio__'), []);\n\n return (\n <Container className={className} disabled={disabled} data-test={dataTest} size={size}>\n <RadioInput\n id={id \|\| generatedId}\n disabled={field.disabled}\n onChange={onChange}\n type='radio'\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n ref={ref}\n $size={size}\n {...elemProps}\n />\n <RadioCircle size={size} />\n {label && (\n <Label htmlFor={id \|\| generatedId} disabled={disabled ?? false} size={size}>\n {label}\n </Label>\n )}\n </Container>\n );\n});\n\nexport default Radio;\n"],"mappings":";;;;;;;;;;;;AAyBA,MAAM,YAAY,OAAO,GAA8C;;;;;;;KAOlE,EAAE,WACH,SAAS,QACT,GAAG;;;MAGD;;KAED,WAAW;;;;AAKhB,MAAM,QAAQ,OAAO,KAA+C;;eAErD,QAAQ,GAAG;YACd,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,cAAc,CAAC;;KAE9E,EAAE,WACH,SAAS,OACL,GAAG;YACC,WAAW,UAAU;;YAGzB,GAAG;YACC,WAAW,WAAW;UACxB;;KAEL,EAAE,OAAO,eACV,YACA,GAAG;;eAEQ,cAAc,OAAO,cAAc,MAAM,MAAM,KAAK,SAAS,CAAC;MACvE;;AAGN,MAAM,cAAc,OAAO,GAA0B;;;;;mCAKF,GAAA,+BAAyB;;YAEhE,QAAQ,GAAG;WACZ,QAAQ,GAAG;;;iBAGL,EAAE,WAAY,SAAS,OAAO,IAAI,MAAO;uBACnC,EAAE,YAAY,cAAc,OAAO,qBAAqB,MAAM,oBAAoB,CAAC;iBACzF,EAAE,YAAY,cAAc,OAAO,uBAAuB,MAAM,aAAa,CAAC;;AAG/F,MAAM,aAAa,OAAO,KAA6B;;YAE3C,QAAQ,GAAG;WACZ,QAAQ,GAAG;;;;;;UAMZ,EAAE,YAAa,UAAU,OAAO,IAAI,MAAO;;;;KAIhD,YAAY,cAAc,KAAK,YAAY;qBAC3B,EAAE,YACjB,cAAc,OAAO,0BAA0B,MAAM,yBAAyB,CAAC;MAC/E,cAAc,WAAW,eAAe,OAAO,kBAAkB,GAAG,CAAC;;;KAGtE,UAAU;OACR,YAAY,cAAc,KAAK,YAAY;qBAC7B,EAAE,YAAY,cAAc,OAAO,2BAA2B,MAAM,2BAA2B,CAAC;uBAC9F,EAAE,YAAY,cAAc,OAAO,2BAA2B,MAAM,2BAA2B,CAAC;;;;KAIlH,mBAAmB,cAAc,KAAK,YAAY;MACjD,WAAW;;;;KAIZ,WAAW,KAAK,YAAY;;mBAEd,EAAE,YACf,cAAc,OAAO,wBAAwB,MAAM,wBAAwB,CAAC;qBAC7D,EAAE,YACjB,cAAc,OAAO,uBAAuB,MAAM,oBAAoB,CAAC;MACvE,cAAc,WAAW,YAAY,UAAU,OAAO,UAAU,CAAC,GAAG,CAAC;;;gBAG3D,YAAY,KAAK,UAAU,KAAK,YAAY;qBACvC,EAAE,YAAY,cAAc,OAAO,qBAAqB,MAAM,sBAAsB,CAAC;mBACvF,EAAE,YAAY,cAAc,OAAO,sBAAsB,MAAM,sBAAsB,CAAC;;;qBAGpF,EAAE,YAAY,cAAc,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;;;;;;;;;aAS5F,WAAW,KAAK,YAAY,KAAK,YAAY,WAAW,KAAK,YAAY;qBACjE,EAAE,YAAY,cAAc,OAAO,8BAA8B,MAAM,8BAA8B,CAAC;mBACxG,EAAE,YAAY,cAAc,OAAO,8BAA8B,MAAM,8BAA8B,CAAC;;;AAkBzH,MAAa,QAAQ,WAAyC,SAAS,MACrE,EACE,IACA,OACA,WACA,OACA,UACA,SACA,gBACA,UACA,aAAa,UACb,OAAO,MACP,GAAG,aAEL,KACA;CACA,MAAM,QAAQ,aAAa,EAAE,UAAU,CAAC;CACxC,MAAM,cAAc,cAAc,SAAS,cAAc,EAAE,EAAE,CAAC;AAE9D,QACE,qBAAC,WAAD;EAAsB;EAAqB;EAAU,aAAW;EAAgB;YAAhF;GACE,oBAAC,YAAD;IACE,IAAI,MAAM;IACV,UAAU,MAAM;IACN;IACV,MAAK;IACE;IACE;IACO;IACX;IACL,OAAO;IACP,GAAI;IACJ,CAAA;GACF,oBAAC,aAAD,EAAmB,MAAQ,CAAA;GAC1B,SACC,oBAAC,OAAD;IAAO,SAAS,MAAM;IAAa,UAAU,YAAY;IAAa;cACnE;IACK,CAAA;GAEA;;EAEd"}

package/dist/{RadioGroup-7hdcVhsp.mjs → RadioGroup-C04h3el1.mjs} RENAMED Viewed

@@ -1,8 +1,8 @@
 import { a as styled, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
 import useControlled from "./lib/useControlled.mjs";
-import { t as Radio } from "./Radio-B1H_S-Qj.mjs";
-import { Children, cloneElement } from "react";
+import { t as Radio } from "./Radio-D6Vydkx-.mjs";
 import { Spacing } from "@persona/design-tokens";
+import { Children, cloneElement } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/RadioGroup/RadioGroup.tsx
 const Container = styled.div`
@@ -47,4 +47,4 @@ const RadioGroup = ({ children, defaultValue, name, value: valueProp, onChange,
 //#endregion
 export { RadioGroup as t };
-//# sourceMappingURL=RadioGroup-7hdcVhsp.mjs.map
+//# sourceMappingURL=RadioGroup-C04h3el1.mjs.map

package/dist/{RadioGroup-7hdcVhsp.mjs.map → RadioGroup-C04h3el1.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioGroup-~~7hdcVhsp~~.mjs","names":[],"sources":["../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n Children,\n cloneElement,\n type ComponentPropsWithoutRef,\n type ReactElement,\n type VFC,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport Radio, { type RadioProps } from '#src/components/Radio';\nimport useControlled from '#src/lib/useControlled';\n\nconst Container = styled.div<{ size: 'md' \| 'sm'; horizontal?: boolean }>`\n & > div {\n margin-bottom: ${Spacing[2]};\n }\n\n ${({ horizontal }) =>\n horizontal &&\n css`\n display: flex;\n align-items: center;\n & > div {\n margin-right: ${Spacing[2]};\n }\n `}\n`;\n\nexport interface RadioGroupProps extends ComponentPropsWithoutRef<'div'> {\n defaultValue?: any;\n name?: string;\n value?: any;\n onChange?: (value: any) => void;\n /*\n Direction of radio group\n /\n horizontal?: boolean;\n /\n Size of radio buttons within the group\n /\n size?: 'md' \| 'sm';\n}\n\nexport const RadioGroup: VFC<RadioGroupProps> = ({\n children,\n defaultValue,\n name,\n value: valueProp,\n onChange,\n horizontal = false,\n size = 'md',\n ...elemProps\n}) => {\n const [value, setValue] = useControlled({\n controlledValue: valueProp,\n default: defaultValue,\n });\n\n return (\n <Container role='radiogroup' horizontal={horizontal} size={size} {...elemProps}>\n {/ @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n {Children.map(children, (child: ReactElement<RadioProps>) => {\n if (child?.type === Radio && (typeof valueProp !== 'undefined' \|\| onChange)) {\n return cloneElement(child, {\n name,\n size,\n checked: child.props.value === value,\n onChange: (e: ChangeEvent<HTMLInputElement>) => {\n const newVal = e.target.value;\n if (typeof valueProp !== 'undefined' && onChange) {\n onChange(newVal);\n } else {\n setValue(newVal);\n }\n },\n });\n }\n\n if (name) {\n return cloneElement(child, { name });\n }\n\n return child;\n })}\n </Container>\n );\n};\n\nexport default RadioGroup;\n"],"mappings":";;;;;;;AAeA,MAAM,YAAY,OAAO,GAAgD;;qBAEpD,QAAQ,GAAG;;;KAG3B,EAAE,iBACH,cACA,GAAG;;;;wBAIiB,QAAQ,GAAG;;MAE7B;;AAkBN,MAAa,cAAoC,EAC/C,UACA,cACA,MACA,OAAO,WACP,UACA,aAAa,OACb,OAAO,MACP,GAAG,gBACC;CACJ,MAAM,CAAC,OAAO,YAAY,cAAc;EACtC,iBAAiB;EACjB,SAAS;EACV,CAAC;AAEF,QACE,oBAAC,WAAD;EAAW,MAAK;EAAyB;EAAkB;EAAM,GAAI;YAElE,SAAS,IAAI,WAAW,UAAoC;AAC3D,OAAI,OAAO,SAAS,UAAU,OAAO,cAAc,eAAe,UAChE,QAAO,aAAa,OAAO;IACzB;IACA;IACA,SAAS,MAAM,MAAM,UAAU;IAC/B,WAAW,MAAqC;KAC9C,MAAM,SAAS,EAAE,OAAO;AACxB,SAAI,OAAO,cAAc,eAAe,SACtC,UAAS,OAAO;SAEhB,UAAS,OAAO;;IAGrB,CAAC;AAGJ,OAAI,KACF,QAAO,aAAa,OAAO,EAAE,MAAM,CAAC;AAGtC,UAAO;IACP;EACQ,CAAA"}
1	+ {"version":3,"file":"RadioGroup-C04h3el1.mjs","names":[],"sources":["../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import {\n type ChangeEvent,\n Children,\n cloneElement,\n type ComponentPropsWithoutRef,\n type ReactElement,\n type VFC,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\n\nimport Radio, { type RadioProps } from '#src/components/Radio';\nimport useControlled from '#src/lib/useControlled';\n\nconst Container = styled.div<{ size: 'md' \| 'sm'; horizontal?: boolean }>`\n & > div {\n margin-bottom: ${Spacing[2]};\n }\n\n ${({ horizontal }) =>\n horizontal &&\n css`\n display: flex;\n align-items: center;\n & > div {\n margin-right: ${Spacing[2]};\n }\n `}\n`;\n\nexport interface RadioGroupProps extends ComponentPropsWithoutRef<'div'> {\n defaultValue?: any;\n name?: string;\n value?: any;\n onChange?: (value: any) => void;\n /*\n Direction of radio group\n /\n horizontal?: boolean;\n /\n Size of radio buttons within the group\n /\n size?: 'md' \| 'sm';\n}\n\nexport const RadioGroup: VFC<RadioGroupProps> = ({\n children,\n defaultValue,\n name,\n value: valueProp,\n onChange,\n horizontal = false,\n size = 'md',\n ...elemProps\n}) => {\n const [value, setValue] = useControlled({\n controlledValue: valueProp,\n default: defaultValue,\n });\n\n return (\n <Container role='radiogroup' horizontal={horizontal} size={size} {...elemProps}>\n {/ @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n {Children.map(children, (child: ReactElement<RadioProps>) => {\n if (child?.type === Radio && (typeof valueProp !== 'undefined' \|\| onChange)) {\n return cloneElement(child, {\n name,\n size,\n checked: child.props.value === value,\n onChange: (e: ChangeEvent<HTMLInputElement>) => {\n const newVal = e.target.value;\n if (typeof valueProp !== 'undefined' && onChange) {\n onChange(newVal);\n } else {\n setValue(newVal);\n }\n },\n });\n }\n\n if (name) {\n return cloneElement(child, { name });\n }\n\n return child;\n })}\n </Container>\n );\n};\n\nexport default RadioGroup;\n"],"mappings":";;;;;;;AAeA,MAAM,YAAY,OAAO,GAAgD;;qBAEpD,QAAQ,GAAG;;;KAG3B,EAAE,iBACH,cACA,GAAG;;;;wBAIiB,QAAQ,GAAG;;MAE7B;;AAkBN,MAAa,cAAoC,EAC/C,UACA,cACA,MACA,OAAO,WACP,UACA,aAAa,OACb,OAAO,MACP,GAAG,gBACC;CACJ,MAAM,CAAC,OAAO,YAAY,cAAc;EACtC,iBAAiB;EACjB,SAAS;EACV,CAAC;AAEF,QACE,oBAAC,WAAD;EAAW,MAAK;EAAyB;EAAkB;EAAM,GAAI;YAElE,SAAS,IAAI,WAAW,UAAoC;AAC3D,OAAI,OAAO,SAAS,UAAU,OAAO,cAAc,eAAe,UAChE,QAAO,aAAa,OAAO;IACzB;IACA;IACA,SAAS,MAAM,MAAM,UAAU;IAC/B,WAAW,MAAqC;KAC9C,MAAM,SAAS,EAAE,OAAO;AACxB,SAAI,OAAO,cAAc,eAAe,SACtC,UAAS,OAAO;SAEhB,UAAS,OAAO;;IAGrB,CAAC;AAGJ,OAAI,KACF,QAAO,aAAa,OAAO,EAAE,MAAM,CAAC;AAGtC,UAAO;IACP;EACQ,CAAA"}

package/dist/RichTextEditor.d.mts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { ExtensionWithMenuBar } from "./types7.mjs";
-import { FC } from "react";
 import * as _$styled_components0 from "styled-components";
+import { FC } from "react";
 import { AnyExtension } from "@tiptap/core";
 //#region src/components/RichTextEditor/RichTextEditor.d.ts

package/dist/RuleEditorFields.d.mts CHANGED Viewed

@@ -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-BJqmRXFV.mjs";
-import { t as FieldRegistry } from "./FieldRegistry-CJwGpUVK.mjs";
+import { d as FilterRuleValue, f as FilterRuleValueChange, l as FilterOperator, o as FilterField, p as FilterSize, u as FilterRule } from "./types-CnqmdPXi.mjs";
+import { t as FieldRegistry } from "./FieldRegistry-CD8fjf9Z.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";

package/dist/RulesPill.d.mts CHANGED Viewed

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

package/dist/SectionHeading.d.mts CHANGED Viewed

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

package/dist/{SegmentedControl-BNOJ1FYQ.mjs → SegmentedControl-CaQ2DJsa.mjs} RENAMED Viewed

@@ -1,10 +1,10 @@
 import { a as styled } from "./styledComponentsInterop-Cs5CCPRy.mjs";
 import { semanticColor } from "./lib/semanticColor.mjs";
-import { paragraphMixins } from "./mixins/text.mjs";
 import "./variables/transitions.mjs";
-import { n as useFormField } from "./useFormField-pOVkb5BK.mjs";
-import { createContext, forwardRef, useContext, useEffect, useImperativeHandle, useRef } from "react";
+import { paragraphMixins } from "./mixins/text.mjs";
+import { n as useFormField } from "./useFormField-Cd9sH-HM.mjs";
 import { BorderRadius, Spacing } from "@persona/design-tokens";
+import { createContext, forwardRef, useContext, useEffect, useImperativeHandle, useRef } from "react";
 import { ToggleButton, ToggleButtonGroup } from "react-aria-components";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/SegmentedControl/SegmentedControl.tsx
@@ -120,4 +120,4 @@ const SegmentedControlItem = forwardRef(function SegmentedControlItem({ disabled
 //#endregion
 export { SegmentedControlItem as n, SegmentedControl as t };
-//# sourceMappingURL=SegmentedControl-BNOJ1FYQ.mjs.map
+//# sourceMappingURL=SegmentedControl-CaQ2DJsa.mjs.map

package/dist/{SegmentedControl-BNOJ1FYQ.mjs.map → SegmentedControl-CaQ2DJsa.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SegmentedControl-~~BNOJ1FYQ~~.mjs","names":[],"sources":["../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import {\n createContext,\n forwardRef,\n type Key,\n type ReactNode,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { ToggleButton, ToggleButtonGroup, type ToggleButtonProps } from 'react-aria-components';\nimport styled from 'styled-components';\n\nimport { BorderRadius, Spacing } from '@persona/design-tokens';\n\nimport useFormField from '#src/components/FormControl/useFormField';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nconst SegmentedControlSizeContext = createContext<'sm' \| 'md'>('md');\n\nexport interface SegmentedControlProps {\n id?: string;\n className?: string;\n\n /*\n Current selected key (controlled)\n /\n selectedKey?: Key;\n\n /\n Default selected key (uncontrolled)\n /\n defaultSelectedKey?: Key;\n\n /\n Callback when selection changes\n /\n onSelectionChange?: (key: Key) => void;\n\n /\n Whether the entire component is disabled\n /\n disabled?: boolean;\n\n /\n Whether the component should take full width\n /\n fullWidth?: boolean;\n\n /\n Size of the segmented control\n /\n size?: 'sm' \| 'md';\n\n /\n Accessible label for the group\n /\n 'aria-label'?: string;\n 'aria-required'?: boolean;\n\n /\n Segment components\n /\n children: ReactNode;\n}\n\ninterface StyledSegmentedControlProps {\n id?: string;\n $fullWidth?: boolean;\n $size?: 'sm' \| 'md';\n}\n\nconst StyledSegmentedControl = styled(ToggleButtonGroup)<StyledSegmentedControlProps>`\n display: inline-flex;\n background-color: ${({ theme }) =>\n semanticColor(theme, 'ActionNeutral', theme.color.variants.basic.default)};\n border-radius: 5px;\n padding: 1px;\n width: ${({ $fullWidth }) => ($fullWidth ? '100%' : 'auto')};\n height: ${({ $size = 'md' }) => ($size === 'sm' ? '20px' : '24px')};\n`;\n\n/\n A segmented control component that allows users to select between multiple options.\n * Built with React Aria for accessibility and keyboard navigation.\n /\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n function SegmentedControl(\n {\n id,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n disabled,\n fullWidth = false,\n size = 'md',\n className,\n 'aria-label': ariaLabel,\n 'aria-required': ariaRequired,\n children,\n ...props\n },\n ref,\n ) {\n const field = useFormField({ inputId: id, disabled });\n const segmentedControlRef = useRef<HTMLDivElement>(null);\n const isRequired = ariaRequired;\n\n useImperativeHandle(ref, () => segmentedControlRef.current!, []);\n // react-aria-components filters aria-required from DOM props, so it is applied imperatively.\n useEffect(() => {\n if (isRequired) {\n segmentedControlRef.current?.setAttribute('aria-required', 'true');\n } else {\n segmentedControlRef.current?.removeAttribute('aria-required');\n }\n }, [isRequired]);\n\n return (\n <SegmentedControlSizeContext.Provider value={size}>\n <StyledSegmentedControl\n ref={segmentedControlRef}\n className={className}\n selectionMode='single'\n selectedKeys={selectedKey ? [selectedKey] : undefined}\n defaultSelectedKeys={defaultSelectedKey ? [defaultSelectedKey] : undefined}\n onSelectionChange={(keys) => {\n const key = Array.from(keys)[0];\n if (key && onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n isDisabled={field.disabled}\n aria-label={ariaLabel}\n aria-labelledby={field.labelId}\n aria-describedby={field.helperTextId}\n aria-errormessage={field.hasError ? field.helperTextId : undefined}\n aria-invalid={field.hasError}\n $fullWidth={fullWidth}\n $size={size}\n {...props}\n id={field.inputId}\n >\n {children}\n </StyledSegmentedControl>\n </SegmentedControlSizeContext.Provider>\n );\n },\n);\n\nconst StyledSegment = styled(ToggleButton)<{ $size?: 'sm' \| 'md' }>`\n ${paragraphMixins.sm};\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: transparent;\n border: none;\n border-radius: ${BorderRadius.Md};\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n cursor: pointer;\n flex: 1;\n line-height: 1;\n\n & {\n cursor: inherit;\n }\n padding: 0 ${({ $size = 'md' }) => ($size === 'sm' ? Spacing[1] : Spacing[2])};\n position: relative;\n transition-property: background-color, color, border-color, box-shadow;\n transition-duration: ${TransitionDuration.Fast};\n transition-timing-function: ${TransitionEasing.Move};\n white-space: nowrap;\n\n /* Hover state /\n &[data-hovered] {\n background-color: ${({ theme }) => semanticColor(theme, 'ActionNeutralHover', theme.color.variants.basic.hover)};\n }\n\n / Selected state /\n &[data-selected] {\n background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.primary.white)};\n box-shadow: inset 0 0 0 1px ${({ theme }) => semanticColor(theme, 'BorderDefault', theme.color.border.input)};\n color: ${({ theme }) => semanticColor(theme, 'FgPrimary', theme.color.text.primary)};\n }\n\n / Disabled state /\n &[data-disabled] {\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n / Remove focus outline unless we're using a keyboard /\n &[data-focused]:not([data-focus-visible]) {\n outline: none;\n }\n`;\n\nexport interface SegmentedControlItemProps extends Omit<\n ToggleButtonProps,\n 'isDisabled' \| 'style' \| 'isSelected' \| 'defaultSelected'\n> {\n /\n Whether this control item is disabled\n /\n disabled?: boolean;\n}\n\n/\n A segment item component for use within SegmentedControl.\n */\nconst SegmentedControlItem = forwardRef<HTMLButtonElement, SegmentedControlItemProps>(\n function SegmentedControlItem({ disabled, children, ...props }, ref) {\n const size = useContext(SegmentedControlSizeContext);\n return (\n <StyledSegment ref={ref} isDisabled={disabled} $size={size} {...props}>\n {children}\n </StyledSegment>\n );\n },\n);\n\nexport default SegmentedControl;\nexport { SegmentedControlItem };\n"],"mappings":";;;;;;;;;;AAoBA,MAAM,8BAA8B,cAA2B,KAAK;AAsDpE,MAAM,yBAAyB,OAAO,kBAAkB;;uBAEjC,EAAE,YACrB,cAAc,OAAO,iBAAiB,MAAM,MAAM,SAAS,MAAM,QAAQ,CAAC;;;YAGlE,EAAE,iBAAkB,aAAa,SAAS,OAAQ;aACjD,EAAE,QAAQ,WAAY,UAAU,OAAO,SAAS,OAAQ;;;;;;AAOrE,MAAa,mBAAmB,WAC9B,SAAS,iBACP,EACE,IACA,aACA,oBACA,mBACA,UACA,YAAY,OACZ,OAAO,MACP,WACA,cAAc,WACd,iBAAiB,cACjB,UACA,GAAG,SAEL,KACA;CACA,MAAM,QAAQ,aAAa;EAAE,SAAS;EAAI;EAAU,CAAC;CACrD,MAAM,sBAAsB,OAAuB,KAAK;CACxD,MAAM,aAAa;AAEnB,qBAAoB,WAAW,oBAAoB,SAAU,EAAE,CAAC;AAEhE,iBAAgB;AACd,MAAI,WACF,qBAAoB,SAAS,aAAa,iBAAiB,OAAO;MAElE,qBAAoB,SAAS,gBAAgB,gBAAgB;IAE9D,CAAC,WAAW,CAAC;AAEhB,QACE,oBAAC,4BAA4B,UAA7B;EAAsC,OAAO;YAC3C,oBAAC,wBAAD;GACE,KAAK;GACM;GACX,eAAc;GACd,cAAc,cAAc,CAAC,YAAY,GAAG,KAAA;GAC5C,qBAAqB,qBAAqB,CAAC,mBAAmB,GAAG,KAAA;GACjE,oBAAoB,SAAS;IAC3B,MAAM,MAAM,MAAM,KAAK,KAAK,CAAC;AAC7B,QAAI,OAAO,kBACT,mBAAkB,IAAI;;GAG1B,YAAY,MAAM;GAClB,cAAY;GACZ,mBAAiB,MAAM;GACvB,oBAAkB,MAAM;GACxB,qBAAmB,MAAM,WAAW,MAAM,eAAe,KAAA;GACzD,gBAAc,MAAM;GACpB,YAAY;GACZ,OAAO;GACP,GAAI;GACJ,IAAI,MAAM;GAET;GACsB,CAAA;EACY,CAAA;EAG5C;AAED,MAAM,gBAAgB,OAAO,aAAa;IACtC,gBAAgB,GAAG;;;;;;mBAMJ,aAAa,GAAG;YACvB,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,MAAM,KAAK,UAAU,CAAC;;;;;;;;gBAQ1E,EAAE,QAAQ,WAAY,UAAU,OAAO,QAAQ,KAAK,QAAQ,GAAI;;;iCAG/B;+DACK;;;;;yBAK7B,EAAE,YAAY,cAAc,OAAO,sBAAsB,MAAM,MAAM,SAAS,MAAM,MAAM,CAAC;;;;;yBAK3F,EAAE,YAAY,cAAc,OAAO,kBAAkB,MAAM,MAAM,QAAQ,MAAM,CAAC;mCACtE,EAAE,YAAY,cAAc,OAAO,iBAAiB,MAAM,MAAM,OAAO,MAAM,CAAC;cACnG,EAAE,YAAY,cAAc,OAAO,aAAa,MAAM,MAAM,KAAK,QAAQ,CAAC;;;;;;;;;;;;;;;;;AA4BxF,MAAM,uBAAuB,WAC3B,SAAS,qBAAqB,EAAE,UAAU,UAAU,GAAG,SAAS,KAAK;AAEnE,QACE,oBAAC,eAAD;EAAoB;EAAK,YAAY;EAAU,OAFpC,WAAW,4BAEoC;EAAE,GAAI;EAC7D;EACa,CAAA;EAGrB"}
1	+ {"version":3,"file":"SegmentedControl-CaQ2DJsa.mjs","names":[],"sources":["../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import {\n createContext,\n forwardRef,\n type Key,\n type ReactNode,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { ToggleButton, ToggleButtonGroup, type ToggleButtonProps } from 'react-aria-components';\nimport styled from 'styled-components';\n\nimport { BorderRadius, Spacing } from '@persona/design-tokens';\n\nimport useFormField from '#src/components/FormControl/useFormField';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { paragraphMixins } from '#src/mixins/text';\nimport { TransitionDuration, TransitionEasing } from '#src/variables/transitions';\n\nconst SegmentedControlSizeContext = createContext<'sm' \| 'md'>('md');\n\nexport interface SegmentedControlProps {\n id?: string;\n className?: string;\n\n /*\n Current selected key (controlled)\n /\n selectedKey?: Key;\n\n /\n Default selected key (uncontrolled)\n /\n defaultSelectedKey?: Key;\n\n /\n Callback when selection changes\n /\n onSelectionChange?: (key: Key) => void;\n\n /\n Whether the entire component is disabled\n /\n disabled?: boolean;\n\n /\n Whether the component should take full width\n /\n fullWidth?: boolean;\n\n /\n Size of the segmented control\n /\n size?: 'sm' \| 'md';\n\n /\n Accessible label for the group\n /\n 'aria-label'?: string;\n 'aria-required'?: boolean;\n\n /\n Segment components\n /\n children: ReactNode;\n}\n\ninterface StyledSegmentedControlProps {\n id?: string;\n $fullWidth?: boolean;\n $size?: 'sm' \| 'md';\n}\n\nconst StyledSegmentedControl = styled(ToggleButtonGroup)<StyledSegmentedControlProps>`\n display: inline-flex;\n background-color: ${({ theme }) =>\n semanticColor(theme, 'ActionNeutral', theme.color.variants.basic.default)};\n border-radius: 5px;\n padding: 1px;\n width: ${({ $fullWidth }) => ($fullWidth ? '100%' : 'auto')};\n height: ${({ $size = 'md' }) => ($size === 'sm' ? '20px' : '24px')};\n`;\n\n/\n A segmented control component that allows users to select between multiple options.\n * Built with React Aria for accessibility and keyboard navigation.\n /\nexport const SegmentedControl = forwardRef<HTMLDivElement, SegmentedControlProps>(\n function SegmentedControl(\n {\n id,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n disabled,\n fullWidth = false,\n size = 'md',\n className,\n 'aria-label': ariaLabel,\n 'aria-required': ariaRequired,\n children,\n ...props\n },\n ref,\n ) {\n const field = useFormField({ inputId: id, disabled });\n const segmentedControlRef = useRef<HTMLDivElement>(null);\n const isRequired = ariaRequired;\n\n useImperativeHandle(ref, () => segmentedControlRef.current!, []);\n // react-aria-components filters aria-required from DOM props, so it is applied imperatively.\n useEffect(() => {\n if (isRequired) {\n segmentedControlRef.current?.setAttribute('aria-required', 'true');\n } else {\n segmentedControlRef.current?.removeAttribute('aria-required');\n }\n }, [isRequired]);\n\n return (\n <SegmentedControlSizeContext.Provider value={size}>\n <StyledSegmentedControl\n ref={segmentedControlRef}\n className={className}\n selectionMode='single'\n selectedKeys={selectedKey ? [selectedKey] : undefined}\n defaultSelectedKeys={defaultSelectedKey ? [defaultSelectedKey] : undefined}\n onSelectionChange={(keys) => {\n const key = Array.from(keys)[0];\n if (key && onSelectionChange) {\n onSelectionChange(key);\n }\n }}\n isDisabled={field.disabled}\n aria-label={ariaLabel}\n aria-labelledby={field.labelId}\n aria-describedby={field.helperTextId}\n aria-errormessage={field.hasError ? field.helperTextId : undefined}\n aria-invalid={field.hasError}\n $fullWidth={fullWidth}\n $size={size}\n {...props}\n id={field.inputId}\n >\n {children}\n </StyledSegmentedControl>\n </SegmentedControlSizeContext.Provider>\n );\n },\n);\n\nconst StyledSegment = styled(ToggleButton)<{ $size?: 'sm' \| 'md' }>`\n ${paragraphMixins.sm};\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: transparent;\n border: none;\n border-radius: ${BorderRadius.Md};\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n cursor: pointer;\n flex: 1;\n line-height: 1;\n\n & {\n cursor: inherit;\n }\n padding: 0 ${({ $size = 'md' }) => ($size === 'sm' ? Spacing[1] : Spacing[2])};\n position: relative;\n transition-property: background-color, color, border-color, box-shadow;\n transition-duration: ${TransitionDuration.Fast};\n transition-timing-function: ${TransitionEasing.Move};\n white-space: nowrap;\n\n /* Hover state /\n &[data-hovered] {\n background-color: ${({ theme }) => semanticColor(theme, 'ActionNeutralHover', theme.color.variants.basic.hover)};\n }\n\n / Selected state /\n &[data-selected] {\n background-color: ${({ theme }) => semanticColor(theme, 'SurfacePrimary', theme.color.primary.white)};\n box-shadow: inset 0 0 0 1px ${({ theme }) => semanticColor(theme, 'BorderDefault', theme.color.border.input)};\n color: ${({ theme }) => semanticColor(theme, 'FgPrimary', theme.color.text.primary)};\n }\n\n / Disabled state /\n &[data-disabled] {\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n / Remove focus outline unless we're using a keyboard /\n &[data-focused]:not([data-focus-visible]) {\n outline: none;\n }\n`;\n\nexport interface SegmentedControlItemProps extends Omit<\n ToggleButtonProps,\n 'isDisabled' \| 'style' \| 'isSelected' \| 'defaultSelected'\n> {\n /\n Whether this control item is disabled\n /\n disabled?: boolean;\n}\n\n/\n A segment item component for use within SegmentedControl.\n */\nconst SegmentedControlItem = forwardRef<HTMLButtonElement, SegmentedControlItemProps>(\n function SegmentedControlItem({ disabled, children, ...props }, ref) {\n const size = useContext(SegmentedControlSizeContext);\n return (\n <StyledSegment ref={ref} isDisabled={disabled} $size={size} {...props}>\n {children}\n </StyledSegment>\n );\n },\n);\n\nexport default SegmentedControl;\nexport { SegmentedControlItem };\n"],"mappings":";;;;;;;;;;AAoBA,MAAM,8BAA8B,cAA2B,KAAK;AAsDpE,MAAM,yBAAyB,OAAO,kBAAkB;;uBAEjC,EAAE,YACrB,cAAc,OAAO,iBAAiB,MAAM,MAAM,SAAS,MAAM,QAAQ,CAAC;;;YAGlE,EAAE,iBAAkB,aAAa,SAAS,OAAQ;aACjD,EAAE,QAAQ,WAAY,UAAU,OAAO,SAAS,OAAQ;;;;;;AAOrE,MAAa,mBAAmB,WAC9B,SAAS,iBACP,EACE,IACA,aACA,oBACA,mBACA,UACA,YAAY,OACZ,OAAO,MACP,WACA,cAAc,WACd,iBAAiB,cACjB,UACA,GAAG,SAEL,KACA;CACA,MAAM,QAAQ,aAAa;EAAE,SAAS;EAAI;EAAU,CAAC;CACrD,MAAM,sBAAsB,OAAuB,KAAK;CACxD,MAAM,aAAa;AAEnB,qBAAoB,WAAW,oBAAoB,SAAU,EAAE,CAAC;AAEhE,iBAAgB;AACd,MAAI,WACF,qBAAoB,SAAS,aAAa,iBAAiB,OAAO;MAElE,qBAAoB,SAAS,gBAAgB,gBAAgB;IAE9D,CAAC,WAAW,CAAC;AAEhB,QACE,oBAAC,4BAA4B,UAA7B;EAAsC,OAAO;YAC3C,oBAAC,wBAAD;GACE,KAAK;GACM;GACX,eAAc;GACd,cAAc,cAAc,CAAC,YAAY,GAAG,KAAA;GAC5C,qBAAqB,qBAAqB,CAAC,mBAAmB,GAAG,KAAA;GACjE,oBAAoB,SAAS;IAC3B,MAAM,MAAM,MAAM,KAAK,KAAK,CAAC;AAC7B,QAAI,OAAO,kBACT,mBAAkB,IAAI;;GAG1B,YAAY,MAAM;GAClB,cAAY;GACZ,mBAAiB,MAAM;GACvB,oBAAkB,MAAM;GACxB,qBAAmB,MAAM,WAAW,MAAM,eAAe,KAAA;GACzD,gBAAc,MAAM;GACpB,YAAY;GACZ,OAAO;GACP,GAAI;GACJ,IAAI,MAAM;GAET;GACsB,CAAA;EACY,CAAA;EAG5C;AAED,MAAM,gBAAgB,OAAO,aAAa;IACtC,gBAAgB,GAAG;;;;;;mBAMJ,aAAa,GAAG;YACvB,EAAE,YAAY,cAAc,OAAO,eAAe,MAAM,MAAM,KAAK,UAAU,CAAC;;;;;;;;gBAQ1E,EAAE,QAAQ,WAAY,UAAU,OAAO,QAAQ,KAAK,QAAQ,GAAI;;;iCAG/B;+DACK;;;;;yBAK7B,EAAE,YAAY,cAAc,OAAO,sBAAsB,MAAM,MAAM,SAAS,MAAM,MAAM,CAAC;;;;;yBAK3F,EAAE,YAAY,cAAc,OAAO,kBAAkB,MAAM,MAAM,QAAQ,MAAM,CAAC;mCACtE,EAAE,YAAY,cAAc,OAAO,iBAAiB,MAAM,MAAM,OAAO,MAAM,CAAC;cACnG,EAAE,YAAY,cAAc,OAAO,aAAa,MAAM,MAAM,KAAK,QAAQ,CAAC;;;;;;;;;;;;;;;;;AA4BxF,MAAM,uBAAuB,WAC3B,SAAS,qBAAqB,EAAE,UAAU,UAAU,GAAG,SAAS,KAAK;AAEnE,QACE,oBAAC,eAAD;EAAoB;EAAK,YAAY;EAAU,OAFpC,WAAW,4BAEoC;EAAE,GAAI;EAC7D;EACa,CAAA;EAGrB"}

package/dist/{Select-DbWEgH5c.mjs → Select-Bicuj8VD.mjs} RENAMED Viewed

@@ -1,19 +1,19 @@
 import { a as styled, r as css } from "./styledComponentsInterop-Cs5CCPRy.mjs";
-import { semanticColor } from "./lib/semanticColor.mjs";
-import { paragraphMixins } from "./mixins/text.mjs";
-import { i as Paragraph } from "./Text-D0vEReED.mjs";
 import { isNotDisabled } from "./lib/pseudoClass.mjs";
-import { Z_INDICES } from "./lib/zindex.mjs";
+import { semanticColor } from "./lib/semanticColor.mjs";
 import inputMixin from "./mixins/input.mjs";
 import { popoverMotion } from "./mixins/motion.mjs";
 import { semanticScrollbar } from "./mixins/scrollbar.mjs";
+import { paragraphMixins } from "./mixins/text.mjs";
+import { i as Paragraph } from "./Text-D0vEReED.mjs";
+import { Z_INDICES } from "./lib/zindex.mjs";
 import { t as HStack } from "./Stack-Bzom2BTR.mjs";
-import { t as IconButton } from "./IconButton-Bj1fry_K.mjs";
-import { n as useFormField } from "./useFormField-pOVkb5BK.mjs";
-import { c as MenuList, i as Menu, o as MenuHeading, s as MenuItem } from "./Menu-BVn1jh46.mjs";
-import { n as DropdownMenu_default } from "./DropdownMenu-Ip75l4Th.mjs";
-import { forwardRef } from "react";
+import { t as IconButton } from "./IconButton-kSjnfhWt.mjs";
+import { n as useFormField } from "./useFormField-Cd9sH-HM.mjs";
+import { c as MenuList, i as Menu, o as MenuHeading, s as MenuItem } from "./Menu-DQPxDJ11.mjs";
+import { n as DropdownMenu_default } from "./DropdownMenu-CYZTQS02.mjs";
 import { Color, Spacing } from "@persona/design-tokens";
+import { forwardRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { CaretDownIcon, MoreIcon } from "@persona/icons";
 import { useId } from "react-aria";
@@ -246,4 +246,4 @@ const Option = forwardRef(function Option({ children, subtitle, ...props }, forw
 //#endregion
 export { Select as n, SelectHeader as r, Option as t };
-//# sourceMappingURL=Select-DbWEgH5c.mjs.map
+//# sourceMappingURL=Select-Bicuj8VD.mjs.map

package/dist/{Select-DbWEgH5c.mjs.map → Select-Bicuj8VD.mjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select-DbWEgH5c.mjs","names":["DropdownMenu"],"sources":["../src/components/Select/Select.tsx"],"sourcesContent":["import * as SelectPrimitive from '@radix-ui/react-select';\nimport type { Property } from 'csstype';\nimport { forwardRef, type ReactNode } from 'react';\nimport { useId } from 'react-aria';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport { CaretDownIcon, MoreIcon } from '@persona/icons';\n\nimport { IconButton } from '#src/components/Button';\nimport DropdownMenu from '#src/components/DropdownMenu';\nimport useFormField from '#src/components/FormControl/useFormField';\nimport Menu, {\n MenuHeading,\n MenuItem,\n type MenuItemProps,\n MenuList,\n type MenuProps,\n} from '#src/components/Menu';\nimport { HStack } from '#src/components/Stack';\nimport { Paragraph } from '#src/components/Text';\nimport { isNotDisabled } from '#src/lib/pseudoClass';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { Z_INDICES } from '#src/lib/zindex';\nimport inputMixin, { type InputMixinProps, type InputSizes } from '#src/mixins/input';\nimport { popoverMotion } from '#src/mixins/motion';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\nimport { paragraphMixins } from '#src/mixins/text';\n\nexport interface SelectProps extends InputMixinProps, Omit<SelectPrimitive.SelectProps, 'value'> {\n 'aria-label'?: string;\n placeholder?: string;\n\n /*\n id will be applied to trigger\n /\n id?: string;\n\n /\n Class name will be applied to trigger\n /\n className?: string;\n\n /\n Max height of options menu\n /\n maxHeight?: number;\n\n /\n Min width of the select\n /\n minWidth?: number;\n\n /\n Width of the selected value container\n /\n valueContainerWidth?: 'auto' \| '100%';\n\n /\n Render dropdown menu in a portal.\n /\n portal?: boolean;\n\n /\n Element the portalled menu renders into. Defaults to `document.body`. Pass a container inside\n * the current dialog so the menu escapes clipping ancestors without leaving the dialog's\n * dismiss scope, which would close it on click. Requires `portal`.\n /\n portalContainer?: HTMLElement \| null;\n\n /\n Props to apply to Radix Select.Trigger within\n /\n triggerProps?: SelectPrimitive.SelectTriggerProps;\n\n /\n Props to apply to Radix Select.Content within\n /\n contentProps?: SelectPrimitive.SelectContentProps;\n\n /\n Callback meant for use with `react-hook-form`'s `useForm` (or Persona's `useFormSecurely`)\n /\n onChange?: (event: { target: { value: string } }) => void;\n\n size?: InputSizes;\n\n value?: string \| null;\n\n width?: string;\n\n header?: ReactNode;\n\n footer?: ReactNode;\n\n /\n z-index of content. Please use sparingly.\n */\n zIndex?: Property.ZIndex;\n}\n\ninterface SelectButtonProps extends InputMixinProps {\n isSelectingPlaceholder: boolean;\n $width?: string;\n $minWidth?: number;\n}\n\nconst SelectButton = styled('button')<SelectButtonProps>`\n ${inputMixin};\n display: inline-flex;\n position: relative;\n align-items: center;\n outline: none;\n appearance: none;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding-right: ${Spacing[6]};\n width: ${({ $width }) => $width ?? '100%'};\n min-width: ${({ $minWidth }) => ($minWidth != null ? `${$minWidth}px` : 'auto')};\n\n &${isNotDisabled} {\n cursor: pointer;\n }\n\n ${({ theme, isSelectingPlaceholder, disabled }) =>\n isSelectingPlaceholder &&\n !disabled &&\n css`\n color: ${semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n `}\n`;\n\ninterface SelectValueContainerProps {\n width?: string;\n}\n\nconst SelectValueContainer = styled.span<SelectValueContainerProps>`\n text-overflow: ellipsis;\n min-width: 0px;\n overflow: hidden;\n text-align: start;\n\n ${({ width }) =>\n width &&\n css`\n width: ${width};\n `}\n`;\n\nconst OptionSubtitle = styled.div`\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n font-size: ${({ theme }) => theme.text.paragraph.sm.fontSize};\n margin-top: ${Spacing[1]};\n`;\n\ninterface OptionsMenuProps {\n maxHeight?: number;\n size?: InputSizes;\n}\n\nconst OptionsMenu = styled(Menu)<OptionsMenuProps>`\n width: var(--radix-select-trigger-width);\n max-height: ${({ maxHeight }) => maxHeight ?? '225px !important'};\n overflow-y: auto;\n ${semanticScrollbar}\n margin-bottom: 0;\n\n ${({ size }) => {\n switch (size) {\n case 'md': {\n return css`\n ${MenuList} {\n padding: ${Spacing[2]};\n }\n\n ${OptionItem} {\n ${paragraphMixins.md};\n padding: ${Spacing[2]};\n }\n\n ${MenuHeading} {\n padding: ${Spacing[2]};\n }\n `;\n }\n case 'sm': {\n return css`\n ${MenuList} {\n padding: ${Spacing[1]};\n }\n\n ${OptionItem} {\n ${paragraphMixins.sm};\n padding: ${Spacing[1]};\n }\n\n ${MenuHeading} {\n padding: ${Spacing[1]};\n }\n `;\n }\n }\n }}\n`;\n\nconst SelectContent = styled(SelectPrimitive.Content)<{ $zIndex?: number \| string }>`\n ${popoverMotion('--radix-select-content-transform-origin')}\n z-index: ${({ $zIndex }) => $zIndex \|\| Z_INDICES.dropdown};\n`;\n\nconst SelectHeaderContainer = styled(HStack)`\n display: flex;\n justify-content: space-between;\n padding: ${Spacing[1]} ${Spacing[1]} 0 ${Spacing[1]};\n margin-bottom: ${Spacing[1]};\n`;\n\nconst SelectFooter = styled.div`\n padding: ${Spacing[1]} 0;\n margin-top: ${Spacing[1]};\n border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n`;\n\nconst SelectMenu = forwardRef<HTMLUListElement, MenuProps & OptionsMenuProps>(function SelectMenu(\n props: MenuProps,\n forwardedRef,\n) {\n return <OptionsMenu listRef={forwardedRef} {...props} />;\n});\n\nconst OptionItem = styled(MenuItem)`\n ${paragraphMixins.md};\n padding: ${Spacing[4]};\n`;\n\nconst SelectItem = forwardRef<HTMLDivElement, MenuItemProps>(function SelectItem(\n props: MenuItemProps,\n forwardedRef,\n) {\n return <OptionItem ref={forwardedRef} {...props} />;\n});\n\nconst StyledIconContainer = styled(SelectPrimitive.Icon)<{ disabled?: boolean }>`\n position: absolute;\n right: ${Spacing[2]};\n display: flex;\n justify-content: center;\n\n ${({ theme, disabled }) => css`\n color: ${\n disabled\n ? semanticColor(theme, 'FgDisabled', Color.BorderIconDisabled)\n : semanticColor(theme, 'FgPrimary', Color.BorderIconPrimary)\n };\n `}\n`;\n\ninterface SelectHeaderProps {\n title?: ReactNode;\n menuItems?: ReactNode;\n menuTriggerLabel?: string;\n}\n\nexport const SelectHeader = ({ title, menuItems, menuTriggerLabel }: SelectHeaderProps) => {\n const uniqueId = useId();\n\n return (\n <SelectHeaderContainer align='center'>\n {title && (\n <Paragraph color='primary' weight='bold' size='md'>\n {title}\n </Paragraph>\n )}\n {menuItems && (\n <DropdownMenu\n portal={true}\n trigger={\n <IconButton>\n <MoreIcon />\n </IconButton>\n }\n triggerProps={{\n 'aria-label': menuTriggerLabel,\n id: `select-header-menu-trigger-${uniqueId}`,\n }}\n side='right'\n align='start'\n zIndex={Z_INDICES.layeredDropdown}\n contentProps={{\n // Fix for Radix UI 2.1.15 upgrade breaking changes:\n // 1. Portal rendering causes pointer-events issues preventing dropdown interaction\n // 2. Portal timing causes onFocusOutside to fire immediately, closing dropdown\n style: {\n pointerEvents: 'auto', // Ensure dropdown items receive mouse events\n },\n onFocusOutside: (event) => event.preventDefault(), // Prevent immediate portal closing\n }}\n >\n {menuItems}\n </DropdownMenu>\n )}\n </SelectHeaderContainer>\n );\n};\n\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n { portal = false, portalContainer, size = 'md', ...props }: SelectProps,\n forwardedRef,\n) {\n const {\n 'aria-label': ariaLabel,\n hasError,\n hasWarning,\n focused,\n active,\n hovered,\n disabled,\n placeholder,\n maxHeight,\n children,\n triggerProps,\n contentProps,\n id,\n className,\n onChange,\n onValueChange,\n value,\n width,\n header,\n footer,\n minWidth,\n valueContainerWidth,\n zIndex,\n } = props;\n\n const field = useFormField({ inputId: props.id, disabled, hasWarning, hasError });\n\n const content = (\n <SelectContent\n position='popper'\n side='bottom'\n sideOffset={8}\n $zIndex={zIndex}\n {...contentProps}\n >\n <SelectMenu maxHeight={maxHeight} size={size}>\n {header}\n <SelectPrimitive.Viewport>{children}</SelectPrimitive.Viewport>\n {footer && (\n <>\n <SelectFooter>{footer}</SelectFooter>\n </>\n )}\n </SelectMenu>\n </SelectContent>\n );\n\n return (\n <SelectPrimitive.Root\n {...props}\n onValueChange={(value) => {\n onChange?.({ target: { value } });\n onValueChange?.(value);\n }}\n // Custom behavior to consider null as empty value\n value={value === null ? '' : value}\n >\n <SelectPrimitive.Trigger\n ref={forwardedRef}\n asChild\n id={id}\n className={className}\n disabled={field.disabled}\n aria-describedby={field.helperTextId}\n aria-errormessage={field.hasError ? field.helperTextId : undefined}\n aria-invalid={field.hasError}\n aria-label={ariaLabel}\n {...triggerProps}\n >\n <SelectButton\n hasWarning={field.hasWarning}\n hasError={field.hasError}\n hovered={hovered}\n focused={focused}\n active={active}\n disabled={field.disabled}\n placeholder={placeholder}\n isSelectingPlaceholder={props.value === '' \|\| props.value == null}\n $minWidth={minWidth}\n $size={size}\n $width={width}\n >\n <SelectValueContainer width={valueContainerWidth}>\n <SelectPrimitive.Value placeholder={placeholder} />\n </SelectValueContainer>\n <StyledIconContainer disabled={field.disabled}>\n <CaretDownIcon />\n </StyledIconContainer>\n </SelectButton>\n </SelectPrimitive.Trigger>\n {portal ? (\n <SelectPrimitive.Portal container={portalContainer}>{content}</SelectPrimitive.Portal>\n ) : (\n content\n )}\n </SelectPrimitive.Root>\n );\n});\n\nexport default Select;\n\nexport const Option = forwardRef<HTMLDivElement, SelectPrimitive.SelectItemProps & MenuItemProps>(\n function Option({ children, subtitle, ...props }, forwardedRef) {\n return (\n <SelectPrimitive.Item {...props} ref={forwardedRef} asChild>\n <SelectItem {...props}>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n {subtitle && <OptionSubtitle>{subtitle}</OptionSubtitle>}\n </SelectItem>\n </SelectPrimitive.Item>\n );\n },\n);\n"],"mappings":"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"}
1	+ {"version":3,"file":"Select-Bicuj8VD.mjs","names":["DropdownMenu"],"sources":["../src/components/Select/Select.tsx"],"sourcesContent":["import * as SelectPrimitive from '@radix-ui/react-select';\nimport type { Property } from 'csstype';\nimport { forwardRef, type ReactNode } from 'react';\nimport { useId } from 'react-aria';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport { CaretDownIcon, MoreIcon } from '@persona/icons';\n\nimport { IconButton } from '#src/components/Button';\nimport DropdownMenu from '#src/components/DropdownMenu';\nimport useFormField from '#src/components/FormControl/useFormField';\nimport Menu, {\n MenuHeading,\n MenuItem,\n type MenuItemProps,\n MenuList,\n type MenuProps,\n} from '#src/components/Menu';\nimport { HStack } from '#src/components/Stack';\nimport { Paragraph } from '#src/components/Text';\nimport { isNotDisabled } from '#src/lib/pseudoClass';\nimport { semanticColor } from '#src/lib/semanticColor';\nimport { Z_INDICES } from '#src/lib/zindex';\nimport inputMixin, { type InputMixinProps, type InputSizes } from '#src/mixins/input';\nimport { popoverMotion } from '#src/mixins/motion';\nimport { semanticScrollbar } from '#src/mixins/scrollbar';\nimport { paragraphMixins } from '#src/mixins/text';\n\nexport interface SelectProps extends InputMixinProps, Omit<SelectPrimitive.SelectProps, 'value'> {\n 'aria-label'?: string;\n placeholder?: string;\n\n /*\n id will be applied to trigger\n /\n id?: string;\n\n /\n Class name will be applied to trigger\n /\n className?: string;\n\n /\n Max height of options menu\n /\n maxHeight?: number;\n\n /\n Min width of the select\n /\n minWidth?: number;\n\n /\n Width of the selected value container\n /\n valueContainerWidth?: 'auto' \| '100%';\n\n /\n Render dropdown menu in a portal.\n /\n portal?: boolean;\n\n /\n Element the portalled menu renders into. Defaults to `document.body`. Pass a container inside\n * the current dialog so the menu escapes clipping ancestors without leaving the dialog's\n * dismiss scope, which would close it on click. Requires `portal`.\n /\n portalContainer?: HTMLElement \| null;\n\n /\n Props to apply to Radix Select.Trigger within\n /\n triggerProps?: SelectPrimitive.SelectTriggerProps;\n\n /\n Props to apply to Radix Select.Content within\n /\n contentProps?: SelectPrimitive.SelectContentProps;\n\n /\n Callback meant for use with `react-hook-form`'s `useForm` (or Persona's `useFormSecurely`)\n /\n onChange?: (event: { target: { value: string } }) => void;\n\n size?: InputSizes;\n\n value?: string \| null;\n\n width?: string;\n\n header?: ReactNode;\n\n footer?: ReactNode;\n\n /\n z-index of content. Please use sparingly.\n */\n zIndex?: Property.ZIndex;\n}\n\ninterface SelectButtonProps extends InputMixinProps {\n isSelectingPlaceholder: boolean;\n $width?: string;\n $minWidth?: number;\n}\n\nconst SelectButton = styled('button')<SelectButtonProps>`\n ${inputMixin};\n display: inline-flex;\n position: relative;\n align-items: center;\n outline: none;\n appearance: none;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n padding-right: ${Spacing[6]};\n width: ${({ $width }) => $width ?? '100%'};\n min-width: ${({ $minWidth }) => ($minWidth != null ? `${$minWidth}px` : 'auto')};\n\n &${isNotDisabled} {\n cursor: pointer;\n }\n\n ${({ theme, isSelectingPlaceholder, disabled }) =>\n isSelectingPlaceholder &&\n !disabled &&\n css`\n color: ${semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n `}\n`;\n\ninterface SelectValueContainerProps {\n width?: string;\n}\n\nconst SelectValueContainer = styled.span<SelectValueContainerProps>`\n text-overflow: ellipsis;\n min-width: 0px;\n overflow: hidden;\n text-align: start;\n\n ${({ width }) =>\n width &&\n css`\n width: ${width};\n `}\n`;\n\nconst OptionSubtitle = styled.div`\n color: ${({ theme }) => semanticColor(theme, 'FgSecondary', theme.color.text.secondary)};\n font-size: ${({ theme }) => theme.text.paragraph.sm.fontSize};\n margin-top: ${Spacing[1]};\n`;\n\ninterface OptionsMenuProps {\n maxHeight?: number;\n size?: InputSizes;\n}\n\nconst OptionsMenu = styled(Menu)<OptionsMenuProps>`\n width: var(--radix-select-trigger-width);\n max-height: ${({ maxHeight }) => maxHeight ?? '225px !important'};\n overflow-y: auto;\n ${semanticScrollbar}\n margin-bottom: 0;\n\n ${({ size }) => {\n switch (size) {\n case 'md': {\n return css`\n ${MenuList} {\n padding: ${Spacing[2]};\n }\n\n ${OptionItem} {\n ${paragraphMixins.md};\n padding: ${Spacing[2]};\n }\n\n ${MenuHeading} {\n padding: ${Spacing[2]};\n }\n `;\n }\n case 'sm': {\n return css`\n ${MenuList} {\n padding: ${Spacing[1]};\n }\n\n ${OptionItem} {\n ${paragraphMixins.sm};\n padding: ${Spacing[1]};\n }\n\n ${MenuHeading} {\n padding: ${Spacing[1]};\n }\n `;\n }\n }\n }}\n`;\n\nconst SelectContent = styled(SelectPrimitive.Content)<{ $zIndex?: number \| string }>`\n ${popoverMotion('--radix-select-content-transform-origin')}\n z-index: ${({ $zIndex }) => $zIndex \|\| Z_INDICES.dropdown};\n`;\n\nconst SelectHeaderContainer = styled(HStack)`\n display: flex;\n justify-content: space-between;\n padding: ${Spacing[1]} ${Spacing[1]} 0 ${Spacing[1]};\n margin-bottom: ${Spacing[1]};\n`;\n\nconst SelectFooter = styled.div`\n padding: ${Spacing[1]} 0;\n margin-top: ${Spacing[1]};\n border-top: 1px solid ${({ theme }) => semanticColor(theme, 'BorderSubtle', Color.BorderDivider)};\n`;\n\nconst SelectMenu = forwardRef<HTMLUListElement, MenuProps & OptionsMenuProps>(function SelectMenu(\n props: MenuProps,\n forwardedRef,\n) {\n return <OptionsMenu listRef={forwardedRef} {...props} />;\n});\n\nconst OptionItem = styled(MenuItem)`\n ${paragraphMixins.md};\n padding: ${Spacing[4]};\n`;\n\nconst SelectItem = forwardRef<HTMLDivElement, MenuItemProps>(function SelectItem(\n props: MenuItemProps,\n forwardedRef,\n) {\n return <OptionItem ref={forwardedRef} {...props} />;\n});\n\nconst StyledIconContainer = styled(SelectPrimitive.Icon)<{ disabled?: boolean }>`\n position: absolute;\n right: ${Spacing[2]};\n display: flex;\n justify-content: center;\n\n ${({ theme, disabled }) => css`\n color: ${\n disabled\n ? semanticColor(theme, 'FgDisabled', Color.BorderIconDisabled)\n : semanticColor(theme, 'FgPrimary', Color.BorderIconPrimary)\n };\n `}\n`;\n\ninterface SelectHeaderProps {\n title?: ReactNode;\n menuItems?: ReactNode;\n menuTriggerLabel?: string;\n}\n\nexport const SelectHeader = ({ title, menuItems, menuTriggerLabel }: SelectHeaderProps) => {\n const uniqueId = useId();\n\n return (\n <SelectHeaderContainer align='center'>\n {title && (\n <Paragraph color='primary' weight='bold' size='md'>\n {title}\n </Paragraph>\n )}\n {menuItems && (\n <DropdownMenu\n portal={true}\n trigger={\n <IconButton>\n <MoreIcon />\n </IconButton>\n }\n triggerProps={{\n 'aria-label': menuTriggerLabel,\n id: `select-header-menu-trigger-${uniqueId}`,\n }}\n side='right'\n align='start'\n zIndex={Z_INDICES.layeredDropdown}\n contentProps={{\n // Fix for Radix UI 2.1.15 upgrade breaking changes:\n // 1. Portal rendering causes pointer-events issues preventing dropdown interaction\n // 2. Portal timing causes onFocusOutside to fire immediately, closing dropdown\n style: {\n pointerEvents: 'auto', // Ensure dropdown items receive mouse events\n },\n onFocusOutside: (event) => event.preventDefault(), // Prevent immediate portal closing\n }}\n >\n {menuItems}\n </DropdownMenu>\n )}\n </SelectHeaderContainer>\n );\n};\n\nexport const Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n { portal = false, portalContainer, size = 'md', ...props }: SelectProps,\n forwardedRef,\n) {\n const {\n 'aria-label': ariaLabel,\n hasError,\n hasWarning,\n focused,\n active,\n hovered,\n disabled,\n placeholder,\n maxHeight,\n children,\n triggerProps,\n contentProps,\n id,\n className,\n onChange,\n onValueChange,\n value,\n width,\n header,\n footer,\n minWidth,\n valueContainerWidth,\n zIndex,\n } = props;\n\n const field = useFormField({ inputId: props.id, disabled, hasWarning, hasError });\n\n const content = (\n <SelectContent\n position='popper'\n side='bottom'\n sideOffset={8}\n $zIndex={zIndex}\n {...contentProps}\n >\n <SelectMenu maxHeight={maxHeight} size={size}>\n {header}\n <SelectPrimitive.Viewport>{children}</SelectPrimitive.Viewport>\n {footer && (\n <>\n <SelectFooter>{footer}</SelectFooter>\n </>\n )}\n </SelectMenu>\n </SelectContent>\n );\n\n return (\n <SelectPrimitive.Root\n {...props}\n onValueChange={(value) => {\n onChange?.({ target: { value } });\n onValueChange?.(value);\n }}\n // Custom behavior to consider null as empty value\n value={value === null ? '' : value}\n >\n <SelectPrimitive.Trigger\n ref={forwardedRef}\n asChild\n id={id}\n className={className}\n disabled={field.disabled}\n aria-describedby={field.helperTextId}\n aria-errormessage={field.hasError ? field.helperTextId : undefined}\n aria-invalid={field.hasError}\n aria-label={ariaLabel}\n {...triggerProps}\n >\n <SelectButton\n hasWarning={field.hasWarning}\n hasError={field.hasError}\n hovered={hovered}\n focused={focused}\n active={active}\n disabled={field.disabled}\n placeholder={placeholder}\n isSelectingPlaceholder={props.value === '' \|\| props.value == null}\n $minWidth={minWidth}\n $size={size}\n $width={width}\n >\n <SelectValueContainer width={valueContainerWidth}>\n <SelectPrimitive.Value placeholder={placeholder} />\n </SelectValueContainer>\n <StyledIconContainer disabled={field.disabled}>\n <CaretDownIcon />\n </StyledIconContainer>\n </SelectButton>\n </SelectPrimitive.Trigger>\n {portal ? (\n <SelectPrimitive.Portal container={portalContainer}>{content}</SelectPrimitive.Portal>\n ) : (\n content\n )}\n </SelectPrimitive.Root>\n );\n});\n\nexport default Select;\n\nexport const Option = forwardRef<HTMLDivElement, SelectPrimitive.SelectItemProps & MenuItemProps>(\n function Option({ children, subtitle, ...props }, forwardedRef) {\n return (\n <SelectPrimitive.Item {...props} ref={forwardedRef} asChild>\n <SelectItem {...props}>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n {subtitle && <OptionSubtitle>{subtitle}</OptionSubtitle>}\n </SelectItem>\n </SelectPrimitive.Item>\n );\n },\n);\n"],"mappings":"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"}

package/dist/{Select-boZ6XP8k.d.mts → Select-O4aTrBuF.d.mts} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { l as MenuItemProps } from "./Menu-DvzoR8e7.mjs";
+import { l as MenuItemProps } from "./Menu-DNJMfxfw.mjs";
 import { n as InputSizes, t as InputMixinProps } from "./input-JDU1Goyr.mjs";
 import * as _$react from "react";
 import { ReactNode } from "react";
@@ -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-boZ6XP8k.d.mts.map
+//# sourceMappingURL=Select-O4aTrBuF.d.mts.map

package/dist/Select.d.mts CHANGED Viewed

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

package/dist/SmartTextInput.d.mts CHANGED Viewed

@@ -2,7 +2,7 @@ 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 { n as useChain } from "./useChain-x9fd9Fyq.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 CHANGED Viewed

@@ -1,5 +1,5 @@
-import { o as ImplementsFormField } from "./inputFields-B7parF2l.mjs";
-import { n as TableBoxField } from "./TableBoxField-6qAOW8t9.mjs";
+import { o as ImplementsFormField } from "./inputFields-CxgQOm9E.mjs";
+import { n as TableBoxField } from "./TableBoxField-DPq_rueS.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 CHANGED Viewed

@@ -1,4 +1,4 @@
-import { i as StackProps } from "./Stack-CODxfzhl.mjs";
+import { i as StackProps } from "./Stack-B6MrjJeW.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";

package/dist/SmartTextInputPopover.d.mts CHANGED Viewed

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