@bi-digital/react 0.11.2 → 0.11.4
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.
- package/dist/{alert-footer-CIn6xe4F.d.mts → alert-footer-D3W7nNsf.d.mts} +6 -3
- package/dist/components/alert/alert-footer.d.mts +1 -1
- package/dist/components/alert/alert-footer.mjs.map +1 -1
- package/dist/components/alert/alert.d.mts +1 -1
- package/dist/components/alert/alert.mjs.map +1 -1
- package/dist/components/alert/index.d.mts +1 -1
- package/dist/components/avatar/avatar.d.mts +1 -1
- package/dist/components/avatar/avatar.mjs.map +1 -1
- package/dist/components/avatar/index.d.mts +1 -1
- package/dist/components/badge/badge.d.mts +1 -1
- package/dist/components/badge/badge.mjs.map +1 -1
- package/dist/components/badge/index.d.mts +1 -1
- package/dist/components/button/button.d.mts +1 -1
- package/dist/components/button/button.mjs +2 -1
- package/dist/components/button/button.mjs.map +1 -1
- package/dist/components/button/index.d.mts +1 -1
- package/dist/components/card/card-action.d.mts +1 -1
- package/dist/components/card/card-action.mjs.map +1 -1
- package/dist/components/card/card-actions.d.mts +1 -1
- package/dist/components/card/card-actions.mjs.map +1 -1
- package/dist/components/card/card-content.d.mts +1 -1
- package/dist/components/card/card-content.mjs.map +1 -1
- package/dist/components/card/card-date.d.mts +1 -1
- package/dist/components/card/card-date.mjs.map +1 -1
- package/dist/components/card/card-header.d.mts +1 -1
- package/dist/components/card/card-header.mjs.map +1 -1
- package/dist/components/card/card-media.d.mts +1 -1
- package/dist/components/card/card-media.mjs.map +1 -1
- package/dist/components/card/card.d.mts +1 -1
- package/dist/components/card/card.mjs.map +1 -1
- package/dist/components/card/index.d.mts +1 -1
- package/dist/components/checkbox/checkbox-subsection.d.mts +1 -1
- package/dist/components/checkbox/checkbox-subsection.mjs.map +1 -1
- package/dist/components/checkbox/checkbox.d.mts +1 -1
- package/dist/components/checkbox/checkbox.mjs.map +1 -1
- package/dist/components/checkbox/index.d.mts +1 -1
- package/dist/components/chip/chip.d.mts +1 -1
- package/dist/components/chip/chip.mjs.map +1 -1
- package/dist/components/chip/index.d.mts +1 -1
- package/dist/components/details/details-content.d.mts +1 -1
- package/dist/components/details/details-content.mjs.map +1 -1
- package/dist/components/details/details-summary.d.mts +1 -1
- package/dist/components/details/details-summary.mjs.map +1 -1
- package/dist/components/details/details.d.mts +1 -1
- package/dist/components/details/details.mjs.map +1 -1
- package/dist/components/details/index.d.mts +1 -1
- package/dist/components/dialog/dialog-close-button.d.mts +1 -1
- package/dist/components/dialog/dialog-close-button.mjs +5 -5
- package/dist/components/dialog/dialog-close-button.mjs.map +1 -1
- package/dist/components/dialog/dialog-content.d.mts +1 -1
- package/dist/components/dialog/dialog-content.mjs.map +1 -1
- package/dist/components/dialog/dialog-footer.d.mts +1 -1
- package/dist/components/dialog/dialog-footer.mjs.map +1 -1
- package/dist/components/dialog/dialog-header.d.mts +1 -1
- package/dist/components/dialog/dialog-header.mjs.map +1 -1
- package/dist/components/dialog/dialog-trigger-context.mjs.map +1 -1
- package/dist/components/dialog/dialog-trigger.d.mts +1 -1
- package/dist/components/dialog/dialog-trigger.mjs +1 -1
- package/dist/components/dialog/dialog-trigger.mjs.map +1 -1
- package/dist/components/dialog/dialog.d.mts +1 -1
- package/dist/components/dialog/dialog.mjs.map +1 -1
- package/dist/components/dialog/index.d.mts +1 -1
- package/dist/components/dropdown/dropdown-button.d.mts +1 -1
- package/dist/components/dropdown/dropdown-button.mjs.map +1 -1
- package/dist/components/dropdown/dropdown-trigger-context.d.mts +1 -1
- package/dist/components/dropdown/dropdown-trigger.d.mts +1 -1
- package/dist/components/dropdown/dropdown.d.mts +1 -1
- package/dist/components/dropdown/dropdown.mjs.map +1 -1
- package/dist/components/dropdown/index.d.mts +1 -1
- package/dist/components/field/field-affix.d.mts +1 -1
- package/dist/components/field/field-affix.mjs.map +1 -1
- package/dist/components/field/field-description.d.mts +1 -1
- package/dist/components/field/field-description.mjs.map +1 -1
- package/dist/components/field/field.d.mts +1 -1
- package/dist/components/field/field.mjs.map +1 -1
- package/dist/components/field/index.d.mts +1 -1
- package/dist/components/fieldset/fieldset-description.d.mts +1 -1
- package/dist/components/fieldset/fieldset-description.mjs.map +1 -1
- package/dist/components/fieldset/fieldset-legend.d.mts +1 -1
- package/dist/components/fieldset/fieldset-legend.mjs.map +1 -1
- package/dist/components/fieldset/fieldset.d.mts +1 -1
- package/dist/components/fieldset/fieldset.mjs.map +1 -1
- package/dist/components/fieldset/index.d.mts +1 -1
- package/dist/components/filter-group/filter-group.d.mts +1 -1
- package/dist/components/filter-group/filter-group.mjs.map +1 -1
- package/dist/components/filter-group/index.d.mts +1 -1
- package/dist/components/footer/footer-links.mjs.map +1 -1
- package/dist/components/footer/footer.d.mts +1 -1
- package/dist/components/footer/footer.mjs.map +1 -1
- package/dist/components/footer/index.d.mts +1 -1
- package/dist/components/index.d.mts +1 -1
- package/dist/components/input/index.d.mts +1 -1
- package/dist/components/input/input.d.mts +1 -1
- package/dist/components/input/input.mjs.map +1 -1
- package/dist/components/label/index.d.mts +1 -1
- package/dist/components/label/label.d.mts +1 -1
- package/dist/components/label/label.mjs.map +1 -1
- package/dist/components/link/index.d.mts +1 -1
- package/dist/components/link/link.d.mts +1 -1
- package/dist/components/link/link.mjs.map +1 -1
- package/dist/components/logo/index.d.mts +1 -1
- package/dist/components/logo/logo.d.mts +1 -1
- package/dist/components/logo/logo.mjs.map +1 -1
- package/dist/components/navbar/index.d.mts +1 -1
- package/dist/components/navbar/navbar.d.mts +1 -1
- package/dist/components/navbar/navbar.mjs.map +1 -1
- package/dist/components/navbar/sub-navbar.d.mts +1 -1
- package/dist/components/navbar/sub-navbar.mjs.map +1 -1
- package/dist/components/pagination/index.d.mts +1 -1
- package/dist/components/pagination/pagination-button.d.mts +1 -1
- package/dist/components/pagination/pagination-item.mjs.map +1 -1
- package/dist/components/pagination/pagination.d.mts +1 -1
- package/dist/components/pagination/pagination.mjs.map +1 -1
- package/dist/components/popover/index.d.mts +1 -1
- package/dist/components/popover/popover-trigger-context.mjs.map +1 -1
- package/dist/components/popover/popover-trigger.d.mts +1 -1
- package/dist/components/popover/popover-trigger.mjs.map +1 -1
- package/dist/components/popover/popover.d.mts +1 -1
- package/dist/components/popover/popover.mjs.map +1 -1
- package/dist/components/radio/index.d.mts +1 -1
- package/dist/components/radio/radio.d.mts +1 -1
- package/dist/components/radio/radio.mjs.map +1 -1
- package/dist/components/search/index.d.mts +1 -1
- package/dist/components/search/search.d.mts +1 -1
- package/dist/components/search/search.mjs.map +1 -1
- package/dist/components/select/index.d.mts +1 -1
- package/dist/components/select/select-optgroup.d.mts +1 -1
- package/dist/components/select/select-optgroup.mjs.map +1 -1
- package/dist/components/select/select-option.d.mts +1 -1
- package/dist/components/select/select-option.mjs.map +1 -1
- package/dist/components/select/select.d.mts +1 -1
- package/dist/components/select/select.mjs.map +1 -1
- package/dist/components/selectfield/index.d.mts +1 -1
- package/dist/components/selectfield/selectfield.d.mts +1 -1
- package/dist/components/selectfield/selectfield.mjs.map +1 -1
- package/dist/components/skip-link/index.d.mts +1 -1
- package/dist/components/skip-link/skip-link.d.mts +1 -1
- package/dist/components/skip-link/skip-link.mjs.map +1 -1
- package/dist/components/spinner/index.d.mts +1 -1
- package/dist/components/spinner/spinner.d.mts +1 -1
- package/dist/components/spinner/spinner.mjs.map +1 -1
- package/dist/components/sticky-header/sticky-header.mjs.map +1 -1
- package/dist/components/switch/index.d.mts +1 -1
- package/dist/components/switch/switch.d.mts +1 -1
- package/dist/components/switch/switch.mjs.map +1 -1
- package/dist/components/tabs/index.d.mts +1 -1
- package/dist/components/tabs/tab.d.mts +1 -1
- package/dist/components/tabs/tab.mjs.map +1 -1
- package/dist/components/tabs/tabs-list.d.mts +1 -1
- package/dist/components/tabs/tabs-list.mjs.map +1 -1
- package/dist/components/tabs/tabs-panel.d.mts +1 -1
- package/dist/components/tabs/tabs-panel.mjs.map +1 -1
- package/dist/components/tabs/tabs.d.mts +1 -1
- package/dist/components/tabs/tabs.mjs.map +1 -1
- package/dist/components/textarea/index.d.mts +1 -1
- package/dist/components/textarea/textarea.d.mts +1 -1
- package/dist/components/textarea/textarea.mjs.map +1 -1
- package/dist/components/textfield/index.d.mts +1 -1
- package/dist/components/textfield/textfield.d.mts +1 -1
- package/dist/components/textfield/textfield.mjs.map +1 -1
- package/dist/components/validation-message/index.d.mts +1 -1
- package/dist/components/validation-message/validation-message.d.mts +1 -1
- package/dist/components/validation-message/validation-message.mjs.map +1 -1
- package/dist/main.d.mts +2 -2
- package/dist/useIsomorphicLayoutEffect-B2JpCiYW.d.mts +7 -0
- package/dist/utilities/hooks/index.d.mts +2 -2
- package/dist/utilities/hooks/useCheckboxGroup/useCheckboxGroup.mjs.map +1 -1
- package/dist/utilities/hooks/useIsElementAboveViewport/useIsElementAboveViewport.mjs.map +1 -1
- package/dist/utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.mts +1 -1
- package/dist/utilities/hooks/useMediaQuery/useMediaQuery.mjs.map +1 -1
- package/dist/utilities/hooks/useMergeRefs/useMergeRefs.mjs.map +1 -1
- package/dist/utilities/hooks/usePagination/usePagination.d.mts +1 -1
- package/dist/utilities/hooks/usePagination/usePagination.mjs +8 -0
- package/dist/utilities/hooks/usePagination/usePagination.mjs.map +1 -1
- package/dist/utilities/hooks/useScrollDirection/useScrollDirection.mjs.map +1 -1
- package/dist/utilities/index.d.mts +2 -2
- package/dist/vanilla/popover/index.mjs.map +1 -1
- package/dist/vanilla/sub-navbar/index.mjs +1 -0
- package/dist/vanilla/sub-navbar/index.mjs.map +1 -1
- package/package.json +6 -6
- package/dist/useIsomorphicLayoutEffect-DXCY5AxR.d.mts +0 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.mjs","names":["cl"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["// Thanks to Designsystemet:\n// https://github.com/digdir/designsystemet/blob/8aa6dc274e5b0338d15572f44b5dd3fab6fa4eb1/packages/react/src/components/Popover/Popover.tsx\n\nimport { autoUpdate, computePosition, flip, offset, shift, hide, size } from '@floating-ui/dom';\nimport type { Middleware, Placement } from '@floating-ui/dom';\nimport { Slot } from '@radix-ui/react-slot';\nimport cl from 'clsx/lite';\nimport { use, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useEffect } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\nimport { Context } from './popover-trigger-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { arrowPseudoElement } from '../../vanilla/popover';\n\nexport type PopoverProps = MergeRight<\n DefaultProps & HTMLAttributes<HTMLDivElement>,\n {\n /**\n * `id` to connect the trigger with the popover - required when not using PopoverContext.\n */\n id?: string;\n /**\n * Placement of the popover on the trigger.\n * @default 'top'\n */\n placement?: Placement;\n /**\n * When a boolean is provided, the popover will be controlled.\n * @default undefined\n */\n open?: boolean;\n /**\n * Callback when the open state changes.\n * @param open - The new open state of the popover.\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Whether to disable auto placement.\n * @default false\n */\n disableAutoPlacement?: boolean;\n /**\n * Additional middleware to use for positioning the popover.\n *\n * @example\n * Prevent the popover from overflowing the navbar by using the `size` middleware:\n * ```ts\n * positionMiddleware={[\n * size({\n * apply: ({ availableHeight, elements, ...state }) => {\n * const available = `${Math.max(0, availableHeight)}px`;\n * const maxHeight = state.placement.includes('top')\n * ? `calc(${available} - var(--bi-layout-navbar-height, 0))`\n * : available;\n * elements.floating.style.maxHeight = maxHeight;\n * },\n * padding,\n * })\n * ]}\n * ```\n */\n positionMiddleware?: Middleware[];\n /**\n * The padding used by the `offset` middleware.\n * @default '20'\n */\n padding?: number;\n /**\n * Show an arrow on the popover, pointing toward the center of the reference element.\n * @default false\n */\n arrow?: boolean;\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n * @default false\n */\n asChild?: boolean;\n ref?: Ref<HTMLDivElement>;\n }\n>;\n\n/**\n * Popover component, used to display content in a popover over an element.\n *\n * @example with TriggerContext\n * <PopoverTriggerContext>\n * <PopoverTrigger>Open Popover</PopoverTrigger>\n * <Popover>\n * Content\n * </Popover>\n * </PopoverTriggerContext>\n *\n * @example without TriggerContext\n * <Button aria-controls=\"my-popover\" aria-expanded={open}>Open Popover</Button>\n * <Popover open={open} onOpenChange={onOpenChange} id=\"my-popover\">\n * Content\n * </Popover>\n */\nexport const Popover = ({\n id,\n className,\n onOpenChange,\n open,\n placement = 'top',\n disableAutoPlacement = false,\n positionMiddleware = [],\n padding = 20,\n dark = false,\n arrow = false,\n asChild = false,\n ref,\n ...rest\n}: PopoverProps) => {\n const Component = asChild ? Slot : 'div';\n\n const popoverRef = useRef<HTMLDivElement>(null);\n const isControlled = useRef(open !== undefined);\n const mergedRefs = useMergeRefs([popoverRef, ref]);\n const { popoverId, setPopoverId, popoverOpen, setPopoverOpen } = use(Context);\n\n const [isOpen, setIsOpen] = useControllableState({\n // False positive: isControlled will never change, but is just used to store the initial controlled state\n prop: isControlled.current ? open : popoverOpen,\n onChange: (val) => {\n onOpenChange?.(val);\n setPopoverOpen?.(val);\n },\n defaultProp: false,\n caller: 'Popover',\n });\n\n useEffect(() => {\n const popover = popoverRef.current;\n const handleClick = (event: MouseEvent) => {\n const el = event.target as Element | null;\n const isTrigger = el?.closest?.(`[aria-controls=\"${popover?.id}\"]`);\n const isOutside = !isTrigger && !popover?.contains(el as Node);\n\n if (isOutside) {\n setIsOpen(false);\n }\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key !== 'Escape' || !isOpen) return;\n event.preventDefault(); // Prevent closing fullscreen in Safari\n setIsOpen(false);\n };\n\n document.addEventListener('click', handleClick, true); // Use capture to execute before React event API\n document.addEventListener('keydown', handleKeydown);\n return () => {\n document.removeEventListener('click', handleClick, true);\n document.removeEventListener('keydown', handleKeydown);\n };\n }, [isOpen, setIsOpen]);\n\n useEffect(() => {\n const popover = popoverRef.current;\n const trigger = document.querySelector(`[aria-controls=\"${popover?.id}\"]`);\n\n if (popover && trigger && isOpen)\n return autoUpdate(trigger, popover, () => {\n computePosition(trigger, popover, {\n middleware: [\n offset(padding),\n ...(disableAutoPlacement ? [] : [flip({ padding }), shift({ padding })]),\n ...positionMiddleware,\n hide({ padding, strategy: 'escaped' }),\n ...(arrow ? [arrowPseudoElement] : []),\n size({\n apply({ rects, elements }) {\n elements.floating.style.setProperty('--bic-popover-trigger-width', `${rects.reference.width}px`);\n },\n }),\n ],\n strategy: 'fixed',\n placement,\n }).then(({ x, y, middlewareData }) => {\n popover.style.translate = `${x}px ${y}px`;\n popover.style.visibility = middlewareData.hide?.referenceHidden ? 'hidden' : 'visible';\n });\n });\n }, [isOpen, placement, id, disableAutoPlacement, positionMiddleware, padding, arrow]);\n\n // Update context with id\n useEffect(() => {\n if (id) setPopoverId?.(id);\n }, [id, setPopoverId]);\n\n return (\n <Component\n className={cl('bi-popover', className)}\n id={id || popoverId}\n aria-hidden={!isOpen}\n data-arrow={arrow || undefined}\n data-dark={dark}\n ref={mergedRefs}\n {...rest}\n />\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAa,WAAW,EACtB,IACA,WACA,cACA,MACA,YAAY,OACZ,uBAAuB,OACvB,qBAAqB,EAAE,EACvB,UAAU,IACV,OAAO,OACP,QAAQ,OACR,UAAU,OACV,KACA,GAAG,WACe;CAClB,MAAM,YAAY,UAAU,OAAO;CAEnC,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,eAAe,OAAO,SAAS,KAAA,EAAU;CAC/C,MAAM,aAAa,aAAa,CAAC,YAAY,IAAI,CAAC;CAClD,MAAM,EAAE,WAAW,cAAc,aAAa,mBAAmB,IAAI,QAAQ;CAE7E,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAE/C,MAAM,aAAa,UAAU,OAAO;EACpC,WAAW,QAAQ;
|
|
1
|
+
{"version":3,"file":"popover.mjs","names":["cl"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["// Thanks to Designsystemet:\n// https://github.com/digdir/designsystemet/blob/8aa6dc274e5b0338d15572f44b5dd3fab6fa4eb1/packages/react/src/components/Popover/Popover.tsx\n\nimport { autoUpdate, computePosition, flip, offset, shift, hide, size } from '@floating-ui/dom';\nimport type { Middleware, Placement } from '@floating-ui/dom';\nimport { Slot } from '@radix-ui/react-slot';\nimport cl from 'clsx/lite';\nimport { use, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useEffect } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\nimport { Context } from './popover-trigger-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { arrowPseudoElement } from '../../vanilla/popover';\n\nexport type PopoverProps = MergeRight<\n DefaultProps & HTMLAttributes<HTMLDivElement>,\n {\n /**\n * `id` to connect the trigger with the popover - required when not using PopoverContext.\n */\n id?: string;\n /**\n * Placement of the popover on the trigger.\n * @default 'top'\n */\n placement?: Placement;\n /**\n * When a boolean is provided, the popover will be controlled.\n * @default undefined\n */\n open?: boolean;\n /**\n * Callback when the open state changes.\n * @param open - The new open state of the popover.\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Whether to disable auto placement.\n * @default false\n */\n disableAutoPlacement?: boolean;\n /**\n * Additional middleware to use for positioning the popover.\n *\n * @example\n * Prevent the popover from overflowing the navbar by using the `size` middleware:\n * ```ts\n * positionMiddleware={[\n * size({\n * apply: ({ availableHeight, elements, ...state }) => {\n * const available = `${Math.max(0, availableHeight)}px`;\n * const maxHeight = state.placement.includes('top')\n * ? `calc(${available} - var(--bi-layout-navbar-height, 0))`\n * : available;\n * elements.floating.style.maxHeight = maxHeight;\n * },\n * padding,\n * })\n * ]}\n * ```\n */\n positionMiddleware?: Middleware[];\n /**\n * The padding used by the `offset` middleware.\n * @default '20'\n */\n padding?: number;\n /**\n * Show an arrow on the popover, pointing toward the center of the reference element.\n * @default false\n */\n arrow?: boolean;\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n * @default false\n */\n asChild?: boolean;\n ref?: Ref<HTMLDivElement>;\n }\n>;\n\n/**\n * Popover component, used to display content in a popover over an element.\n *\n * @example with TriggerContext\n * <PopoverTriggerContext>\n * <PopoverTrigger>Open Popover</PopoverTrigger>\n * <Popover>\n * Content\n * </Popover>\n * </PopoverTriggerContext>\n *\n * @example without TriggerContext\n * <Button aria-controls=\"my-popover\" aria-expanded={open}>Open Popover</Button>\n * <Popover open={open} onOpenChange={onOpenChange} id=\"my-popover\">\n * Content\n * </Popover>\n */\nexport const Popover = ({\n id,\n className,\n onOpenChange,\n open,\n placement = 'top',\n disableAutoPlacement = false,\n positionMiddleware = [],\n padding = 20,\n dark = false,\n arrow = false,\n asChild = false,\n ref,\n ...rest\n}: PopoverProps) => {\n const Component = asChild ? Slot : 'div';\n\n const popoverRef = useRef<HTMLDivElement>(null);\n const isControlled = useRef(open !== undefined);\n const mergedRefs = useMergeRefs([popoverRef, ref]);\n const { popoverId, setPopoverId, popoverOpen, setPopoverOpen } = use(Context);\n\n const [isOpen, setIsOpen] = useControllableState({\n // False positive: isControlled will never change, but is just used to store the initial controlled state\n prop: isControlled.current ? open : popoverOpen,\n onChange: (val) => {\n onOpenChange?.(val);\n setPopoverOpen?.(val);\n },\n defaultProp: false,\n caller: 'Popover',\n });\n\n useEffect(() => {\n const popover = popoverRef.current;\n const handleClick = (event: MouseEvent) => {\n const el = event.target as Element | null;\n const isTrigger = el?.closest?.(`[aria-controls=\"${popover?.id}\"]`);\n const isOutside = !isTrigger && !popover?.contains(el as Node);\n\n if (isOutside) {\n setIsOpen(false);\n }\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n if (event.key !== 'Escape' || !isOpen) return;\n event.preventDefault(); // Prevent closing fullscreen in Safari\n setIsOpen(false);\n };\n\n document.addEventListener('click', handleClick, true); // Use capture to execute before React event API\n document.addEventListener('keydown', handleKeydown);\n return () => {\n document.removeEventListener('click', handleClick, true);\n document.removeEventListener('keydown', handleKeydown);\n };\n }, [isOpen, setIsOpen]);\n\n useEffect(() => {\n const popover = popoverRef.current;\n const trigger = document.querySelector(`[aria-controls=\"${popover?.id}\"]`);\n\n if (popover && trigger && isOpen)\n return autoUpdate(trigger, popover, () => {\n computePosition(trigger, popover, {\n middleware: [\n offset(padding),\n ...(disableAutoPlacement ? [] : [flip({ padding }), shift({ padding })]),\n ...positionMiddleware,\n hide({ padding, strategy: 'escaped' }),\n ...(arrow ? [arrowPseudoElement] : []),\n size({\n apply({ rects, elements }) {\n elements.floating.style.setProperty('--bic-popover-trigger-width', `${rects.reference.width}px`);\n },\n }),\n ],\n strategy: 'fixed',\n placement,\n }).then(({ x, y, middlewareData }) => {\n popover.style.translate = `${x}px ${y}px`;\n popover.style.visibility = middlewareData.hide?.referenceHidden ? 'hidden' : 'visible';\n });\n });\n }, [isOpen, placement, id, disableAutoPlacement, positionMiddleware, padding, arrow]);\n\n // Update context with id\n useEffect(() => {\n if (id) setPopoverId?.(id);\n }, [id, setPopoverId]);\n\n return (\n <Component\n className={cl('bi-popover', className)}\n id={id || popoverId}\n aria-hidden={!isOpen}\n data-arrow={arrow || undefined}\n data-dark={dark}\n ref={mergedRefs}\n {...rest}\n />\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAa,WAAW,EACtB,IACA,WACA,cACA,MACA,YAAY,OACZ,uBAAuB,OACvB,qBAAqB,EAAE,EACvB,UAAU,IACV,OAAO,OACP,QAAQ,OACR,UAAU,OACV,KACA,GAAG,WACe;CAClB,MAAM,YAAY,UAAU,OAAO;CAEnC,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,eAAe,OAAO,SAAS,KAAA,EAAU;CAC/C,MAAM,aAAa,aAAa,CAAC,YAAY,IAAI,CAAC;CAClD,MAAM,EAAE,WAAW,cAAc,aAAa,mBAAmB,IAAI,QAAQ;CAE7E,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAE/C,MAAM,aAAa,UAAU,OAAO;EACpC,WAAW,QAAQ;GACjB,eAAe,IAAI;GACnB,iBAAiB,IAAI;;EAEvB,aAAa;EACb,QAAQ;EACT,CAAC;CAEF,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,eAAe,UAAsB;GACzC,MAAM,KAAK,MAAM;GAIjB,IAFkB,CADA,IAAI,UAAU,mBAAmB,SAAS,GAAG,IAAI,IACnC,CAAC,SAAS,SAAS,GAAW,EAG5D,UAAU,MAAM;;EAIpB,MAAM,iBAAiB,UAAyB;GAC9C,IAAI,MAAM,QAAQ,YAAY,CAAC,QAAQ;GACvC,MAAM,gBAAgB;GACtB,UAAU,MAAM;;EAGlB,SAAS,iBAAiB,SAAS,aAAa,KAAK;EACrD,SAAS,iBAAiB,WAAW,cAAc;EACnD,aAAa;GACX,SAAS,oBAAoB,SAAS,aAAa,KAAK;GACxD,SAAS,oBAAoB,WAAW,cAAc;;IAEvD,CAAC,QAAQ,UAAU,CAAC;CAEvB,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,UAAU,SAAS,cAAc,mBAAmB,SAAS,GAAG,IAAI;EAE1E,IAAI,WAAW,WAAW,QACxB,OAAO,WAAW,SAAS,eAAe;GACxC,gBAAgB,SAAS,SAAS;IAChC,YAAY;KACV,OAAO,QAAQ;KACf,GAAI,uBAAuB,EAAE,GAAG,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC;KACvE,GAAG;KACH,KAAK;MAAE;MAAS,UAAU;MAAW,CAAC;KACtC,GAAI,QAAQ,CAAC,mBAAmB,GAAG,EAAE;KACrC,KAAK,EACH,MAAM,EAAE,OAAO,YAAY;MACzB,SAAS,SAAS,MAAM,YAAY,+BAA+B,GAAG,MAAM,UAAU,MAAM,IAAI;QAEnG,CAAC;KACH;IACD,UAAU;IACV;IACD,CAAC,CAAC,MAAM,EAAE,GAAG,GAAG,qBAAqB;IACpC,QAAQ,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE;IACtC,QAAQ,MAAM,aAAa,eAAe,MAAM,kBAAkB,WAAW;KAC7E;IACF;IACH;EAAC;EAAQ;EAAW;EAAI;EAAsB;EAAoB;EAAS;EAAM,CAAC;CAGrF,gBAAgB;EACd,IAAI,IAAI,eAAe,GAAG;IACzB,CAAC,IAAI,aAAa,CAAC;CAEtB,OACE,oBAAC,WAAD;EACE,WAAWA,KAAG,cAAc,UAAU;EACtC,IAAI,MAAM;EACV,eAAa,CAAC;EACd,cAAY,SAAS,KAAA;EACrB,aAAW;EACX,KAAK;EACL,GAAI;EACJ,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { L as Radio, R as RadioProps } from "../../alert-footer-
|
|
1
|
+
import { L as Radio, R as RadioProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Radio, RadioProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { L as Radio, R as RadioProps } from "../../alert-footer-
|
|
1
|
+
import { L as Radio, R as RadioProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Radio, RadioProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.mjs","names":[],"sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type RadioProps = MergeRight<\n LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n {\n /** Label */\n label?: ReactNode;\n /** Description */\n description?: ReactNode;\n /** Add error indication to the radio. */\n error?: boolean;\n /** If true, the radio will take up the full width of the container, and not just \"fit-content\" which is default */\n fullwidth?: boolean;\n ref?: Ref<HTMLInputElement>;\n }\n>;\n\nexport const Radio = ({\n dark,\n label,\n description,\n error,\n fullwidth,\n style,\n className,\n ref,\n id,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: RadioProps) => {\n const descriptionId = useId();\n\n const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n <label>\n <Input\n type='radio'\n id={id}\n ref={ref}\n aria-invalid={error || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...props}\n />\n {label && (\n <Label weight='medium' htmlFor={id} asChild>\n <span>{label}</span>\n </Label>\n )}\n {description && (\n // Aria-hidden is used to prevent screen readers from reading the description twice:\n // once as part of the label and once from being connected through aria-describedby.\n <FieldDescription aria-hidden='true' id={descriptionId}>\n {description}\n </FieldDescription>\n )}\n </label>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;AAuBA,MAAa,SAAS,EACpB,MACA,OACA,aACA,OACA,WACA,OACA,WACA,KACA,IACA,oBAAoB,qBACpB,GAAG,YACa;CAChB,MAAM,gBAAgB,OAAO;CAE7B,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,oBAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;
|
|
1
|
+
{"version":3,"file":"radio.mjs","names":[],"sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type RadioProps = MergeRight<\n LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n {\n /** Label */\n label?: ReactNode;\n /** Description */\n description?: ReactNode;\n /** Add error indication to the radio. */\n error?: boolean;\n /** If true, the radio will take up the full width of the container, and not just \"fit-content\" which is default */\n fullwidth?: boolean;\n ref?: Ref<HTMLInputElement>;\n }\n>;\n\nexport const Radio = ({\n dark,\n label,\n description,\n error,\n fullwidth,\n style,\n className,\n ref,\n id,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: RadioProps) => {\n const descriptionId = useId();\n\n const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n <label>\n <Input\n type='radio'\n id={id}\n ref={ref}\n aria-invalid={error || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...props}\n />\n {label && (\n <Label weight='medium' htmlFor={id} asChild>\n <span>{label}</span>\n </Label>\n )}\n {description && (\n // Aria-hidden is used to prevent screen readers from reading the description twice:\n // once as part of the label and once from being connected through aria-describedby.\n <FieldDescription aria-hidden='true' id={descriptionId}>\n {description}\n </FieldDescription>\n )}\n </label>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;AAuBA,MAAa,SAAS,EACpB,MACA,OACA,aACA,OACA,WACA,OACA,WACA,KACA,IACA,oBAAoB,qBACpB,GAAG,YACa;CAChB,MAAM,gBAAgB,OAAO;CAE7B,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,oBAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CAEpG,OACE,oBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;EAAW,SAAA;YAChF,qBAAC,SAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACD;IACC;IACL,gBAAc,SAAS,KAAA;IACvB,oBAAkB;IACZ;IACN,GAAI;IACJ,CAAA;GACD,SACC,oBAAC,OAAD;IAAO,QAAO;IAAS,SAAS;IAAI,SAAA;cAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;IACd,CAAA;GAET,eAGC,oBAAC,kBAAD;IAAkB,eAAY;IAAO,IAAI;cACtC;IACgB,CAAA;GAEf,EAAA,CAAA;EACF,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { F as Search, I as SearchProps } from "../../alert-footer-
|
|
1
|
+
import { F as Search, I as SearchProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Search, SearchProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { F as Search, I as SearchProps } from "../../alert-footer-
|
|
1
|
+
import { F as Search, I as SearchProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Search, SearchProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search.mjs","names":[],"sources":["../../../src/components/search/search.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Field, FieldAffixes, FieldAffix } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { CrossSmallIcon, MagnifyingGlassIcon } from '@bi-digital/icons';\nimport type { MergeRight } from '../../utilities';\nimport { Button } from '../button';\n\nexport type SearchProps = MergeRight<\n Omit<InputProps, 'type' | 'size'>,\n {\n /**\n * Size of the search.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n /** Called when the user presses enter. You can use this to for example navigate on submit. */\n onSubmit?: (value: string) => void;\n /** Called when the user resets the search input. */\n onReset?: (value: string) => void;\n /**\n * Aria-label for the clear button.\n * @default 'Clear'\n */\n clearAriaLabel?: string;\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n }\n>;\n\nexport const Search = ({\n className,\n onSubmit,\n onReset,\n clearAriaLabel = 'Clear',\n size = 'medium',\n ref,\n dark,\n style,\n fullwidth,\n ...props\n}: SearchProps) => {\n const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n e.preventDefault();\n if (onSubmit) {\n const input = e.currentTarget.querySelector('input');\n onSubmit(input?.value || '');\n }\n };\n const handleReset = () => {\n if (onReset) {\n onReset('');\n }\n };\n return (\n <Field className={clsx('bi-search', className)} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n <form onSubmit={handleSubmit} onReset={handleReset}>\n <FieldAffixes>\n <FieldAffix>\n <MagnifyingGlassIcon size={size} />\n </FieldAffix>\n <Input type='text' ref={ref} size={size} dark={dark} {...props} />\n <FieldAffix aria-hidden='false'>\n <Button aria-label={clearAriaLabel} icon size={size} dark={dark} variant='text' type='reset'>\n <CrossSmallIcon size={size} aria-hidden='true' />\n </Button>\n </FieldAffix>\n </FieldAffixes>\n </form>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;AA6BA,MAAa,UAAU,EACrB,WACA,UACA,SACA,iBAAiB,SACjB,OAAO,UACP,KACA,MACA,OACA,WACA,GAAG,YACc;CACjB,MAAM,gBAAgB,MAAwC;
|
|
1
|
+
{"version":3,"file":"search.mjs","names":[],"sources":["../../../src/components/search/search.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Field, FieldAffixes, FieldAffix } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { CrossSmallIcon, MagnifyingGlassIcon } from '@bi-digital/icons';\nimport type { MergeRight } from '../../utilities';\nimport { Button } from '../button';\n\nexport type SearchProps = MergeRight<\n Omit<InputProps, 'type' | 'size'>,\n {\n /**\n * Size of the search.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n /** Called when the user presses enter. You can use this to for example navigate on submit. */\n onSubmit?: (value: string) => void;\n /** Called when the user resets the search input. */\n onReset?: (value: string) => void;\n /**\n * Aria-label for the clear button.\n * @default 'Clear'\n */\n clearAriaLabel?: string;\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n }\n>;\n\nexport const Search = ({\n className,\n onSubmit,\n onReset,\n clearAriaLabel = 'Clear',\n size = 'medium',\n ref,\n dark,\n style,\n fullwidth,\n ...props\n}: SearchProps) => {\n const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n e.preventDefault();\n if (onSubmit) {\n const input = e.currentTarget.querySelector('input');\n onSubmit(input?.value || '');\n }\n };\n const handleReset = () => {\n if (onReset) {\n onReset('');\n }\n };\n return (\n <Field className={clsx('bi-search', className)} data-dark={dark} style={style} fullwidth={fullwidth} asChild>\n <form onSubmit={handleSubmit} onReset={handleReset}>\n <FieldAffixes>\n <FieldAffix>\n <MagnifyingGlassIcon size={size} />\n </FieldAffix>\n <Input type='text' ref={ref} size={size} dark={dark} {...props} />\n <FieldAffix aria-hidden='false'>\n <Button aria-label={clearAriaLabel} icon size={size} dark={dark} variant='text' type='reset'>\n <CrossSmallIcon size={size} aria-hidden='true' />\n </Button>\n </FieldAffix>\n </FieldAffixes>\n </form>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;AA6BA,MAAa,UAAU,EACrB,WACA,UACA,SACA,iBAAiB,SACjB,OAAO,UACP,KACA,MACA,OACA,WACA,GAAG,YACc;CACjB,MAAM,gBAAgB,MAAwC;EAC5D,EAAE,gBAAgB;EAClB,IAAI,UAEF,SADc,EAAE,cAAc,cAAc,QAC9B,EAAE,SAAS,GAAG;;CAGhC,MAAM,oBAAoB;EACxB,IAAI,SACF,QAAQ,GAAG;;CAGf,OACE,oBAAC,OAAD;EAAO,WAAW,KAAK,aAAa,UAAU;EAAE,aAAW;EAAa;EAAkB;EAAW,SAAA;YACnG,oBAAC,QAAD;GAAM,UAAU;GAAc,SAAS;aACrC,qBAAC,cAAD,EAAA,UAAA;IACE,oBAAC,YAAD,EAAA,UACE,oBAAC,qBAAD,EAA2B,MAAQ,CAAA,EACxB,CAAA;IACb,oBAAC,OAAD;KAAO,MAAK;KAAY;KAAW;KAAY;KAAM,GAAI;KAAS,CAAA;IAClE,oBAAC,YAAD;KAAY,eAAY;eACtB,oBAAC,QAAD;MAAQ,cAAY;MAAgB,MAAA;MAAW;MAAY;MAAM,SAAQ;MAAO,MAAK;gBACnF,oBAAC,gBAAD;OAAsB;OAAM,eAAY;OAAS,CAAA;MAC1C,CAAA;KACE,CAAA;IACA,EAAA,CAAA;GACV,CAAA;EACD,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { A as SelectOptgroupProps, M as SelectOptionProps, N as Select, P as SelectProps, j as SelectOption, k as SelectOptgroup } from "../../alert-footer-
|
|
1
|
+
import { A as SelectOptgroupProps, M as SelectOptionProps, N as Select, P as SelectProps, j as SelectOption, k as SelectOptgroup } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Select, SelectOptgroup, SelectOptgroupProps, SelectOption, SelectOptionProps, SelectProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { A as SelectOptgroupProps, k as SelectOptgroup } from "../../alert-footer-
|
|
1
|
+
import { A as SelectOptgroupProps, k as SelectOptgroup } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { SelectOptgroup, SelectOptgroupProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-optgroup.mjs","names":[],"sources":["../../../src/components/select/select-optgroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptgroupHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptgroupProps = MergeRight<\n AsChildProps & OptgroupHTMLAttributes<HTMLOptGroupElement>,\n {\n ref?: Ref<HTMLOptGroupElement>;\n }\n>;\n\nexport const SelectOptgroup = ({ asChild, ref, ...props }: SelectOptgroupProps) => {\n const Component = asChild ? Slot : 'optgroup';\n return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,kBAAkB,EAAE,SAAS,KAAK,GAAG,YAAiC;
|
|
1
|
+
{"version":3,"file":"select-optgroup.mjs","names":[],"sources":["../../../src/components/select/select-optgroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptgroupHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptgroupProps = MergeRight<\n AsChildProps & OptgroupHTMLAttributes<HTMLOptGroupElement>,\n {\n ref?: Ref<HTMLOptGroupElement>;\n }\n>;\n\nexport const SelectOptgroup = ({ asChild, ref, ...props }: SelectOptgroupProps) => {\n const Component = asChild ? Slot : 'optgroup';\n return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,kBAAkB,EAAE,SAAS,KAAK,GAAG,YAAiC;CAEjF,OAAO,oBADW,UAAU,OAAO,YAC5B;EAAW,GAAI;EAAY;EAAO,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { M as SelectOptionProps, j as SelectOption } from "../../alert-footer-
|
|
1
|
+
import { M as SelectOptionProps, j as SelectOption } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { SelectOption, SelectOptionProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-option.mjs","names":[],"sources":["../../../src/components/select/select-option.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptionHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptionProps = MergeRight<\n AsChildProps & OptionHTMLAttributes<HTMLOptionElement>,\n {\n ref?: Ref<HTMLOptionElement>;\n }\n>;\n\nexport const SelectOption = ({ asChild, ref, ...props }: SelectOptionProps) => {\n const Component = asChild ? Slot : 'option';\n return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,gBAAgB,EAAE,SAAS,KAAK,GAAG,YAA+B;
|
|
1
|
+
{"version":3,"file":"select-option.mjs","names":[],"sources":["../../../src/components/select/select-option.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptionHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptionProps = MergeRight<\n AsChildProps & OptionHTMLAttributes<HTMLOptionElement>,\n {\n ref?: Ref<HTMLOptionElement>;\n }\n>;\n\nexport const SelectOption = ({ asChild, ref, ...props }: SelectOptionProps) => {\n const Component = asChild ? Slot : 'option';\n return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,gBAAgB,EAAE,SAAS,KAAK,GAAG,YAA+B;CAE7E,OAAO,oBADW,UAAU,OAAO,UAC5B;EAAW,GAAI;EAAY;EAAO,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { N as Select, P as SelectProps } from "../../alert-footer-
|
|
1
|
+
import { N as Select, P as SelectProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Select, SelectProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.mjs","names":[],"sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, SelectHTMLAttributes } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SelectProps = MergeRight<\n DefaultProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, 'multiple' | 'size'>,\n {\n /**\n * Size of the select.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n /** Mark the select as readOnly */\n readOnly?: boolean;\n ref?: Ref<HTMLSelectElement>;\n }\n>;\n\nexport const Select = ({ className, dark, onKeyDown, onMouseDown, size, ref, ...props }: SelectProps) => {\n return (\n <select\n className={clsx('bi-input', className)}\n data-dark={dark}\n data-size={size}\n ref={ref}\n onKeyDown={(event) => {\n if (event.key === 'Tab') return;\n if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n onKeyDown?.(event);\n }}\n onMouseDown={(event) => {\n if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n onMouseDown?.(event);\n }}\n {...props}\n />\n );\n};\n"],"mappings":";;;AAmBA,MAAa,UAAU,EAAE,WAAW,MAAM,WAAW,aAAa,MAAM,KAAK,GAAG,YAAyB;
|
|
1
|
+
{"version":3,"file":"select.mjs","names":[],"sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, SelectHTMLAttributes } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SelectProps = MergeRight<\n DefaultProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, 'multiple' | 'size'>,\n {\n /**\n * Size of the select.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n /** Mark the select as readOnly */\n readOnly?: boolean;\n ref?: Ref<HTMLSelectElement>;\n }\n>;\n\nexport const Select = ({ className, dark, onKeyDown, onMouseDown, size, ref, ...props }: SelectProps) => {\n return (\n <select\n className={clsx('bi-input', className)}\n data-dark={dark}\n data-size={size}\n ref={ref}\n onKeyDown={(event) => {\n if (event.key === 'Tab') return;\n if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n onKeyDown?.(event);\n }}\n onMouseDown={(event) => {\n if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n onMouseDown?.(event);\n }}\n {...props}\n />\n );\n};\n"],"mappings":";;;AAmBA,MAAa,UAAU,EAAE,WAAW,MAAM,WAAW,aAAa,MAAM,KAAK,GAAG,YAAyB;CACvG,OACE,oBAAC,UAAD;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,aAAW;EACX,aAAW;EACN;EACL,YAAY,UAAU;GACpB,IAAI,MAAM,QAAQ,OAAO;GACzB,IAAI,MAAM,UAAU,MAAM,gBAAgB;GAC1C,YAAY,MAAM;;EAEpB,cAAc,UAAU;GACtB,IAAI,MAAM,UAAU,MAAM,gBAAgB;GAC1C,cAAc,MAAM;;EAEtB,GAAI;EACJ,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { D as Selectfield, O as SelectfieldProps } from "../../alert-footer-
|
|
1
|
+
import { D as Selectfield, O as SelectfieldProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Selectfield, SelectfieldProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { D as Selectfield, O as SelectfieldProps } from "../../alert-footer-
|
|
1
|
+
import { D as Selectfield, O as SelectfieldProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Selectfield, SelectfieldProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selectfield.mjs","names":[],"sources":["../../../src/components/selectfield/selectfield.tsx"],"sourcesContent":["import { useId, type ReactNode } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport { Field, FieldDescription } from '../field';\nimport { Label } from '../label';\nimport { Select, type SelectProps } from '../select';\nimport { ValidationMessage } from '../validation-message';\nimport { MergeRight } from '../../utilities';\n\nexport type SelectfieldProps = MergeRight<\n LabelRequiredProps & SelectProps,\n {\n /** Description */\n description?: ReactNode;\n /** Error message for field */\n error?: ReactNode;\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n }\n>;\n\nexport const Selectfield = ({\n children,\n dark,\n label,\n description,\n error,\n style,\n className,\n fullwidth,\n ref,\n id: idProp,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: SelectfieldProps) => {\n const generatedId = useId();\n const descriptionId = useId();\n const validationId = useId();\n const id = idProp || generatedId;\n\n const ariaDescribedBy =\n [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth}>\n {label && <Label htmlFor={id}>{label}</Label>}\n {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n <Select\n id={id}\n ref={ref}\n dark={dark}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n {...props}\n >\n {children}\n </Select>\n {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,eAAe,EAC1B,UACA,MACA,OACA,aACA,OACA,OACA,WACA,WACA,KACA,IAAI,QACJ,oBAAoB,qBACpB,GAAG,YACmB;CACtB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;
|
|
1
|
+
{"version":3,"file":"selectfield.mjs","names":[],"sources":["../../../src/components/selectfield/selectfield.tsx"],"sourcesContent":["import { useId, type ReactNode } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport { Field, FieldDescription } from '../field';\nimport { Label } from '../label';\nimport { Select, type SelectProps } from '../select';\nimport { ValidationMessage } from '../validation-message';\nimport { MergeRight } from '../../utilities';\n\nexport type SelectfieldProps = MergeRight<\n LabelRequiredProps & SelectProps,\n {\n /** Description */\n description?: ReactNode;\n /** Error message for field */\n error?: ReactNode;\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n }\n>;\n\nexport const Selectfield = ({\n children,\n dark,\n label,\n description,\n error,\n style,\n className,\n fullwidth,\n ref,\n id: idProp,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: SelectfieldProps) => {\n const generatedId = useId();\n const descriptionId = useId();\n const validationId = useId();\n const id = idProp || generatedId;\n\n const ariaDescribedBy =\n [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth}>\n {label && <Label htmlFor={id}>{label}</Label>}\n {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n <Select\n id={id}\n ref={ref}\n dark={dark}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n {...props}\n >\n {children}\n </Select>\n {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,eAAe,EAC1B,UACA,MACA,OACA,aACA,OACA,OACA,WACA,WACA,KACA,IAAI,QACJ,oBAAoB,qBACpB,GAAG,YACmB;CACtB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;YAAvE;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;cAAK;IAAc,CAAA;GAC5C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;cAAgB;IAA+B,CAAA;GACrF,oBAAC,QAAD;IACM;IACC;IACC;IACN,gBAAc,QAAQ,MAAM,IAAI,KAAA;IAChC,oBAAkB;IAClB,GAAI;IAEH;IACM,CAAA;GACR,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;cAAe;IAA0B,CAAA;GACtE"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { E as SkipLinkProps, T as SkipLink } from "../../alert-footer-
|
|
1
|
+
import { E as SkipLinkProps, T as SkipLink } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { SkipLink, SkipLinkProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { E as SkipLinkProps, T as SkipLink } from "../../alert-footer-
|
|
1
|
+
import { E as SkipLinkProps, T as SkipLink } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { SkipLink, SkipLinkProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skip-link.mjs","names":[],"sources":["../../../src/components/skip-link/skip-link.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps, DefaultProps } from '../../types';\nimport type { AnchorHTMLAttributes, Ref } from 'react';\n\nexport type SkipLinkProps = MergeRight<\n DefaultProps & AsChildProps & AnchorHTMLAttributes<HTMLAnchorElement>,\n {\n ref?: Ref<HTMLAnchorElement>;\n }\n>;\n\nexport const SkipLink = ({ asChild, children, className, dark, ...props }: SkipLinkProps) => {\n const Component = asChild ? Slot : 'a';\n return (\n <Component className={clsx('bi-skip-link', className)} data-dark={dark} {...props}>\n {children}\n </Component>\n );\n};\n"],"mappings":";;;;AAaA,MAAa,YAAY,EAAE,SAAS,UAAU,WAAW,MAAM,GAAG,YAA2B;
|
|
1
|
+
{"version":3,"file":"skip-link.mjs","names":[],"sources":["../../../src/components/skip-link/skip-link.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps, DefaultProps } from '../../types';\nimport type { AnchorHTMLAttributes, Ref } from 'react';\n\nexport type SkipLinkProps = MergeRight<\n DefaultProps & AsChildProps & AnchorHTMLAttributes<HTMLAnchorElement>,\n {\n ref?: Ref<HTMLAnchorElement>;\n }\n>;\n\nexport const SkipLink = ({ asChild, children, className, dark, ...props }: SkipLinkProps) => {\n const Component = asChild ? Slot : 'a';\n return (\n <Component className={clsx('bi-skip-link', className)} data-dark={dark} {...props}>\n {children}\n </Component>\n );\n};\n"],"mappings":";;;;AAaA,MAAa,YAAY,EAAE,SAAS,UAAU,WAAW,MAAM,GAAG,YAA2B;CAE3F,OACE,oBAFgB,UAAU,OAAO,KAEjC;EAAW,WAAW,KAAK,gBAAgB,UAAU;EAAE,aAAW;EAAM,GAAI;EACzE;EACS,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { C as Spinner, w as SpinnerProps } from "../../alert-footer-
|
|
1
|
+
import { C as Spinner, w as SpinnerProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Spinner, SpinnerProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { C as Spinner, w as SpinnerProps } from "../../alert-footer-
|
|
1
|
+
import { C as Spinner, w as SpinnerProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Spinner, SpinnerProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.mjs","names":[],"sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SpinnerProps = MergeRight<\n DefaultProps & HTMLAttributes<HTMLSpanElement>,\n {\n /**\n * The color of the spinner.\n * @default 'inherit'\n */\n color?: 'inherit' | 'black';\n /**\n * The size of the spinner.\n * It sets the font-size as the width and height is `1em`. If not set, the spinner will inherit the font size of its parent.\n */\n size?: 'small' | 'medium' | 'large' | 'xl' | '2xl';\n ref?: Ref<HTMLSpanElement>;\n }\n>;\n\nexport const Spinner = ({ color = 'inherit', size, className, ref, ...props }: SpinnerProps) => {\n return <span className={clsx('bi-spinner', className)} data-size={size} data-color={color} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAsBA,MAAa,WAAW,EAAE,QAAQ,WAAW,MAAM,WAAW,KAAK,GAAG,YAA0B;
|
|
1
|
+
{"version":3,"file":"spinner.mjs","names":[],"sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SpinnerProps = MergeRight<\n DefaultProps & HTMLAttributes<HTMLSpanElement>,\n {\n /**\n * The color of the spinner.\n * @default 'inherit'\n */\n color?: 'inherit' | 'black';\n /**\n * The size of the spinner.\n * It sets the font-size as the width and height is `1em`. If not set, the spinner will inherit the font size of its parent.\n */\n size?: 'small' | 'medium' | 'large' | 'xl' | '2xl';\n ref?: Ref<HTMLSpanElement>;\n }\n>;\n\nexport const Spinner = ({ color = 'inherit', size, className, ref, ...props }: SpinnerProps) => {\n return <span className={clsx('bi-spinner', className)} data-size={size} data-color={color} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAsBA,MAAa,WAAW,EAAE,QAAQ,WAAW,MAAM,WAAW,KAAK,GAAG,YAA0B;CAC9F,OAAO,oBAAC,QAAD;EAAM,WAAW,KAAK,cAAc,UAAU;EAAE,aAAW;EAAM,cAAY;EAAY;EAAK,GAAI;EAAS,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sticky-header.mjs","names":[],"sources":["../../../src/components/sticky-header/sticky-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { ReactNode } from 'react';\n\nexport type StickyHeaderProps = {\n children: ReactNode;\n};\n\n/**\n * Make a sticky header that will stay at the top of the viewport when scrolling.\n * It handles different distance to the top based on sub-navbar, navbar and other factors.\n * This element is a Slot which simply adds the correct CSS styles to the children.\n * Make sure that the children passed to this component appends className and not overrides it.\n */\nexport const StickyHeader = ({ children }: StickyHeaderProps) => {\n const Component = Slot;\n return <Component className='bi-sticky-header'>{children}</Component>;\n};\n"],"mappings":";;;;;;;;;AAaA,MAAa,gBAAgB,EAAE,eAAkC;
|
|
1
|
+
{"version":3,"file":"sticky-header.mjs","names":["Component"],"sources":["../../../src/components/sticky-header/sticky-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { ReactNode } from 'react';\n\nexport type StickyHeaderProps = {\n children: ReactNode;\n};\n\n/**\n * Make a sticky header that will stay at the top of the viewport when scrolling.\n * It handles different distance to the top based on sub-navbar, navbar and other factors.\n * This element is a Slot which simply adds the correct CSS styles to the children.\n * Make sure that the children passed to this component appends className and not overrides it.\n */\nexport const StickyHeader = ({ children }: StickyHeaderProps) => {\n const Component = Slot;\n return <Component className='bi-sticky-header'>{children}</Component>;\n};\n"],"mappings":";;;;;;;;;AAaA,MAAa,gBAAgB,EAAE,eAAkC;CAE/D,OAAO,oBAACA,MAAD;EAAW,WAAU;EAAoB;EAAqB,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { S as SwitchProps, x as Switch } from "../../alert-footer-
|
|
1
|
+
import { S as SwitchProps, x as Switch } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Switch, SwitchProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { S as SwitchProps, x as Switch } from "../../alert-footer-
|
|
1
|
+
import { S as SwitchProps, x as Switch } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Switch, SwitchProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.mjs","names":[],"sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, type FieldProps } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type SwitchProps = MergeRight<\n LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'> & Pick<FieldProps, 'position'>,\n {\n /** Label */\n label?: ReactNode;\n /** Add error indication to the switch. */\n error?: boolean;\n /** If true, the switch will take up the full width of the container, and not just \"fit-content\" which is default */\n fullwidth?: boolean;\n ref?: Ref<HTMLInputElement>;\n }\n>;\n\nexport const Switch = ({\n dark,\n label,\n error,\n fullwidth,\n style,\n className,\n ref,\n id,\n position = 'end',\n ...props\n}: SwitchProps) => {\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} position={position} asChild>\n <label>\n <Input\n role='switch'\n type='checkbox'\n id={id}\n ref={ref}\n aria-invalid={error || undefined}\n dark={dark}\n {...props}\n />\n {label && (\n <Label weight='medium' htmlFor={id} asChild>\n <span>{label}</span>\n </Label>\n )}\n </label>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;AAqBA,MAAa,UAAU,EACrB,MACA,OACA,OACA,WACA,OACA,WACA,KACA,IACA,WAAW,OACX,GAAG,YACc;
|
|
1
|
+
{"version":3,"file":"switch.mjs","names":[],"sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, type FieldProps } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type SwitchProps = MergeRight<\n LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'> & Pick<FieldProps, 'position'>,\n {\n /** Label */\n label?: ReactNode;\n /** Add error indication to the switch. */\n error?: boolean;\n /** If true, the switch will take up the full width of the container, and not just \"fit-content\" which is default */\n fullwidth?: boolean;\n ref?: Ref<HTMLInputElement>;\n }\n>;\n\nexport const Switch = ({\n dark,\n label,\n error,\n fullwidth,\n style,\n className,\n ref,\n id,\n position = 'end',\n ...props\n}: SwitchProps) => {\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth} position={position} asChild>\n <label>\n <Input\n role='switch'\n type='checkbox'\n id={id}\n ref={ref}\n aria-invalid={error || undefined}\n dark={dark}\n {...props}\n />\n {label && (\n <Label weight='medium' htmlFor={id} asChild>\n <span>{label}</span>\n </Label>\n )}\n </label>\n </Field>\n );\n};\n"],"mappings":";;;;;;;;AAqBA,MAAa,UAAU,EACrB,MACA,OACA,OACA,WACA,OACA,WACA,KACA,IACA,WAAW,OACX,GAAG,YACc;CACjB,OACE,oBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;EAAqB;EAAU,SAAA;YACpG,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,OAAD;GACE,MAAK;GACL,MAAK;GACD;GACC;GACL,gBAAc,SAAS,KAAA;GACjB;GACN,GAAI;GACJ,CAAA,EACD,SACC,oBAAC,OAAD;GAAO,QAAO;GAAS,SAAS;GAAI,SAAA;aAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;GACd,CAAA,CAEJ,EAAA,CAAA;EACF,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { b as TabsProps, d as TabsPanel, f as TabsPanelProps, g as TabProps, h as Tab, m as TabsListProps, p as TabsList, v as Tabs, y as TabsContext } from "../../alert-footer-
|
|
1
|
+
import { b as TabsProps, d as TabsPanel, f as TabsPanelProps, g as TabProps, h as Tab, m as TabsListProps, p as TabsList, v as Tabs, y as TabsContext } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Tab, TabProps, Tabs, TabsContext, TabsList, TabsListProps, TabsPanel, TabsPanelProps, TabsProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { g as TabProps, h as Tab } from "../../alert-footer-
|
|
1
|
+
import { g as TabProps, h as Tab } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Tab, TabProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab.mjs","names":[],"sources":["../../../src/components/tabs/tab.tsx"],"sourcesContent":["import type { DSTabElement } from '@digdir/designsystemet-web';\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport '@digdir/designsystemet-web'; // Import ds-tab custom element\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabProps = MergeRight<\n HTMLAttributes<DSTabElement>,\n {\n /** A unique value that associates the trigger with a content. */\n value: string;\n ref?: Ref<DSTabElement>;\n }\n>;\n\nexport const Tab = ({ value, children, onClick, onClickCapture, ref, ...props }: TabProps) => {\n const { onChange, getPrefixedValue, isControlled, currentValue } = use(Context);\n return (\n <ds-tab\n aria-controls={props['aria-controls'] ?? getPrefixedValue?.(value)}\n data-value={value}\n ref={ref}\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n onClickCapture={(e: React.MouseEvent<DSTabElement>) => {\n onClickCapture?.(e);\n if (isControlled && currentValue !== value) {\n e.preventDefault();\n }\n }}\n onClick={(e: React.MouseEvent<DSTabElement>) => {\n if (e.isTrusted || !isControlled || currentValue !== value) {\n onChange?.(value); // Only call onChange for user interactions, not programmatic clicks used to sync controlled state\n }\n onClick?.(e);\n }}\n {...props}\n >\n {children}\n </ds-tab>\n );\n};\n"],"mappings":";;;;;AAeA,MAAa,OAAO,EAAE,OAAO,UAAU,SAAS,gBAAgB,KAAK,GAAG,YAAsB;CAC5F,MAAM,EAAE,UAAU,kBAAkB,cAAc,iBAAiB,IAAI,QAAQ;
|
|
1
|
+
{"version":3,"file":"tab.mjs","names":[],"sources":["../../../src/components/tabs/tab.tsx"],"sourcesContent":["import type { DSTabElement } from '@digdir/designsystemet-web';\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport '@digdir/designsystemet-web'; // Import ds-tab custom element\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabProps = MergeRight<\n HTMLAttributes<DSTabElement>,\n {\n /** A unique value that associates the trigger with a content. */\n value: string;\n ref?: Ref<DSTabElement>;\n }\n>;\n\nexport const Tab = ({ value, children, onClick, onClickCapture, ref, ...props }: TabProps) => {\n const { onChange, getPrefixedValue, isControlled, currentValue } = use(Context);\n return (\n <ds-tab\n aria-controls={props['aria-controls'] ?? getPrefixedValue?.(value)}\n data-value={value}\n ref={ref}\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n onClickCapture={(e: React.MouseEvent<DSTabElement>) => {\n onClickCapture?.(e);\n if (isControlled && currentValue !== value) {\n e.preventDefault();\n }\n }}\n onClick={(e: React.MouseEvent<DSTabElement>) => {\n if (e.isTrusted || !isControlled || currentValue !== value) {\n onChange?.(value); // Only call onChange for user interactions, not programmatic clicks used to sync controlled state\n }\n onClick?.(e);\n }}\n {...props}\n >\n {children}\n </ds-tab>\n );\n};\n"],"mappings":";;;;;AAeA,MAAa,OAAO,EAAE,OAAO,UAAU,SAAS,gBAAgB,KAAK,GAAG,YAAsB;CAC5F,MAAM,EAAE,UAAU,kBAAkB,cAAc,iBAAiB,IAAI,QAAQ;CAC/E,OACE,oBAAC,UAAD;EACE,iBAAe,MAAM,oBAAoB,mBAAmB,MAAM;EAClE,cAAY;EACP;EACL,0BAAA;EACA,iBAAiB,MAAsC;GACrD,iBAAiB,EAAE;GACnB,IAAI,gBAAgB,iBAAiB,OACnC,EAAE,gBAAgB;;EAGtB,UAAU,MAAsC;GAC9C,IAAI,EAAE,aAAa,CAAC,gBAAgB,iBAAiB,OACnD,WAAW,MAAM;GAEnB,UAAU,EAAE;;EAEd,GAAI;EAEH;EACM,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { m as TabsListProps, p as TabsList } from "../../alert-footer-
|
|
1
|
+
import { m as TabsListProps, p as TabsList } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { TabsList, TabsListProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs-list.mjs","names":[],"sources":["../../../src/components/tabs/tabs-list.tsx"],"sourcesContent":["import type { DSTabListElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tablist custom element\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type TabsListProps = MergeRight<\n HTMLAttributes<DSTabListElement>,\n {\n ref?: Ref<DSTabListElement>;\n }\n>;\n\nexport const TabsList = ({ children, ref, ...props }: TabsListProps) => {\n return (\n <ds-tablist\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={ref}\n {...props}\n >\n {children}\n </ds-tablist>\n );\n};\n"],"mappings":";;;AAYA,MAAa,YAAY,EAAE,UAAU,KAAK,GAAG,YAA2B;
|
|
1
|
+
{"version":3,"file":"tabs-list.mjs","names":[],"sources":["../../../src/components/tabs/tabs-list.tsx"],"sourcesContent":["import type { DSTabListElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tablist custom element\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type TabsListProps = MergeRight<\n HTMLAttributes<DSTabListElement>,\n {\n ref?: Ref<DSTabListElement>;\n }\n>;\n\nexport const TabsList = ({ children, ref, ...props }: TabsListProps) => {\n return (\n <ds-tablist\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={ref}\n {...props}\n >\n {children}\n </ds-tablist>\n );\n};\n"],"mappings":";;;AAYA,MAAa,YAAY,EAAE,UAAU,KAAK,GAAG,YAA2B;CACtE,OACE,oBAAC,cAAD;EACE,0BAAA;EACK;EACL,GAAI;EAEH;EACU,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { d as TabsPanel, f as TabsPanelProps } from "../../alert-footer-
|
|
1
|
+
import { d as TabsPanel, f as TabsPanelProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { TabsPanel, TabsPanelProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs-panel.mjs","names":[],"sources":["../../../src/components/tabs/tabs-panel.tsx"],"sourcesContent":["import type { DSTabPanelElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabpanel custom element\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabsPanelProps = MergeRight<\n HTMLAttributes<DSTabPanelElement>,\n {\n /** A unique value that associates the content with a trigger. */\n value: string;\n ref?: Ref<DSTabPanelElement>;\n }\n>;\n\nexport const TabsPanel = ({ value, id, children, ref, ...props }: TabsPanelProps) => {\n const { getPrefixedValue } = use(Context);\n\n return (\n <ds-tabpanel\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={ref}\n id={id ?? getPrefixedValue?.(value)}\n {...props}\n >\n {children}\n </ds-tabpanel>\n );\n};\n"],"mappings":";;;;;AAeA,MAAa,aAAa,EAAE,OAAO,IAAI,UAAU,KAAK,GAAG,YAA4B;CACnF,MAAM,EAAE,qBAAqB,IAAI,QAAQ;
|
|
1
|
+
{"version":3,"file":"tabs-panel.mjs","names":[],"sources":["../../../src/components/tabs/tabs-panel.tsx"],"sourcesContent":["import type { DSTabPanelElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabpanel custom element\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabsPanelProps = MergeRight<\n HTMLAttributes<DSTabPanelElement>,\n {\n /** A unique value that associates the content with a trigger. */\n value: string;\n ref?: Ref<DSTabPanelElement>;\n }\n>;\n\nexport const TabsPanel = ({ value, id, children, ref, ...props }: TabsPanelProps) => {\n const { getPrefixedValue } = use(Context);\n\n return (\n <ds-tabpanel\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={ref}\n id={id ?? getPrefixedValue?.(value)}\n {...props}\n >\n {children}\n </ds-tabpanel>\n );\n};\n"],"mappings":";;;;;AAeA,MAAa,aAAa,EAAE,OAAO,IAAI,UAAU,KAAK,GAAG,YAA4B;CACnF,MAAM,EAAE,qBAAqB,IAAI,QAAQ;CAEzC,OACE,oBAAC,eAAD;EACE,0BAAA;EACK;EACL,IAAI,MAAM,mBAAmB,MAAM;EACnC,GAAI;EAEH;EACW,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { _ as Context, b as TabsProps, v as Tabs, y as TabsContext } from "../../alert-footer-
|
|
1
|
+
import { _ as Context, b as TabsProps, v as Tabs, y as TabsContext } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Context, Tabs, TabsContext, TabsProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.mjs","names":[],"sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import { createContext, useEffect, useId, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport type { DSTabsElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabs custom element\nimport clsx from 'clsx/lite';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type TabsProps = MergeRight<\n DefaultProps & HTMLAttributes<DSTabsElement>,\n {\n /** The value of the tab that should be active when initially rendered. Use when you do not need to control the state of the tabs. */\n defaultValue?: string;\n /** The controlled value of the tab to activate. Should be used together with `onChange`. */\n value?: string;\n /** Event handler called when the value changes. */\n onChange?: (value: string) => void;\n ref?: Ref<DSTabsElement>;\n }\n>;\n\nexport type TabsContext = {\n isControlled?: boolean;\n currentValue?: string;\n onChange?: (value: string) => void;\n getPrefixedValue?: (value?: string) => string | undefined;\n};\n\nexport const Context = createContext<TabsContext>({});\n\nexport const Tabs = ({\n defaultValue,\n value: valueProp,\n onChange,\n children,\n className,\n dark,\n ref,\n ...props\n}: TabsProps) => {\n const isControlled = valueProp !== undefined;\n const tabsRef = useRef<DSTabsElement>(null);\n const isProgrammaticClick = useRef(false);\n const valuePrefix = useId(); // Used for generation of unique value-based ids for tabs and panels\n const mergedRefs = useMergeRefs([ref, tabsRef]);\n const [value, setValue] = useControllableState({\n prop: valueProp,\n onChange,\n defaultProp: defaultValue || '',\n caller: 'Tabs',\n });\n\n useEffect(() => {\n if (!tabsRef.current || valueProp === undefined) return;\n tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n if (tab.getAttribute('data-value') === valueProp) {\n isProgrammaticClick.current = true;\n tab.click();\n isProgrammaticClick.current = false;\n }\n });\n }, [valueProp]);\n\n useEffect(() => {\n if (!isControlled && defaultValue && tabsRef.current) {\n tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n const isSelected = tab.getAttribute('data-value') === defaultValue;\n tab.setAttribute('aria-selected', isSelected ? 'true' : 'false');\n });\n }\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, []);\n\n return (\n <Context\n value={{\n isControlled,\n currentValue: value,\n onChange: setValue,\n getPrefixedValue: (value?: string) => value && `${valuePrefix}-${value}`,\n }}\n >\n <ds-tabs\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={mergedRefs}\n className={clsx('bi-tabs', className)}\n data-dark={dark ? 'true' : 'false'}\n {...props}\n >\n {children}\n </ds-tabs>\n </Context>\n );\n};\n"],"mappings":";;;;;;;AA8BA,MAAa,UAAU,cAA2B,EAAE,CAAC;AAErD,MAAa,QAAQ,EACnB,cACA,OAAO,WACP,UACA,UACA,WACA,MACA,KACA,GAAG,YACY;CACf,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,UAAU,OAAsB,KAAK;CAC3C,MAAM,sBAAsB,OAAO,MAAM;CACzC,MAAM,cAAc,OAAO;CAC3B,MAAM,aAAa,aAAa,CAAC,KAAK,QAAQ,CAAC;CAC/C,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,MAAM;EACN;EACA,aAAa,gBAAgB;EAC7B,QAAQ;EACT,CAAC;
|
|
1
|
+
{"version":3,"file":"tabs.mjs","names":[],"sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import { createContext, useEffect, useId, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport type { DSTabsElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabs custom element\nimport clsx from 'clsx/lite';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type TabsProps = MergeRight<\n DefaultProps & HTMLAttributes<DSTabsElement>,\n {\n /** The value of the tab that should be active when initially rendered. Use when you do not need to control the state of the tabs. */\n defaultValue?: string;\n /** The controlled value of the tab to activate. Should be used together with `onChange`. */\n value?: string;\n /** Event handler called when the value changes. */\n onChange?: (value: string) => void;\n ref?: Ref<DSTabsElement>;\n }\n>;\n\nexport type TabsContext = {\n isControlled?: boolean;\n currentValue?: string;\n onChange?: (value: string) => void;\n getPrefixedValue?: (value?: string) => string | undefined;\n};\n\nexport const Context = createContext<TabsContext>({});\n\nexport const Tabs = ({\n defaultValue,\n value: valueProp,\n onChange,\n children,\n className,\n dark,\n ref,\n ...props\n}: TabsProps) => {\n const isControlled = valueProp !== undefined;\n const tabsRef = useRef<DSTabsElement>(null);\n const isProgrammaticClick = useRef(false);\n const valuePrefix = useId(); // Used for generation of unique value-based ids for tabs and panels\n const mergedRefs = useMergeRefs([ref, tabsRef]);\n const [value, setValue] = useControllableState({\n prop: valueProp,\n onChange,\n defaultProp: defaultValue || '',\n caller: 'Tabs',\n });\n\n useEffect(() => {\n if (!tabsRef.current || valueProp === undefined) return;\n tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n if (tab.getAttribute('data-value') === valueProp) {\n isProgrammaticClick.current = true;\n tab.click();\n isProgrammaticClick.current = false;\n }\n });\n }, [valueProp]);\n\n useEffect(() => {\n if (!isControlled && defaultValue && tabsRef.current) {\n tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n const isSelected = tab.getAttribute('data-value') === defaultValue;\n tab.setAttribute('aria-selected', isSelected ? 'true' : 'false');\n });\n }\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, []);\n\n return (\n <Context\n value={{\n isControlled,\n currentValue: value,\n onChange: setValue,\n getPrefixedValue: (value?: string) => value && `${valuePrefix}-${value}`,\n }}\n >\n <ds-tabs\n suppressHydrationWarning // Since <ds-tablist> adds attributes\n ref={mergedRefs}\n className={clsx('bi-tabs', className)}\n data-dark={dark ? 'true' : 'false'}\n {...props}\n >\n {children}\n </ds-tabs>\n </Context>\n );\n};\n"],"mappings":";;;;;;;AA8BA,MAAa,UAAU,cAA2B,EAAE,CAAC;AAErD,MAAa,QAAQ,EACnB,cACA,OAAO,WACP,UACA,UACA,WACA,MACA,KACA,GAAG,YACY;CACf,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,UAAU,OAAsB,KAAK;CAC3C,MAAM,sBAAsB,OAAO,MAAM;CACzC,MAAM,cAAc,OAAO;CAC3B,MAAM,aAAa,aAAa,CAAC,KAAK,QAAQ,CAAC;CAC/C,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,MAAM;EACN;EACA,aAAa,gBAAgB;EAC7B,QAAQ;EACT,CAAC;CAEF,gBAAgB;EACd,IAAI,CAAC,QAAQ,WAAW,cAAc,KAAA,GAAW;EACjD,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,IAAI,IAAI,aAAa,aAAa,KAAK,WAAW;IAChD,oBAAoB,UAAU;IAC9B,IAAI,OAAO;IACX,oBAAoB,UAAU;;IAEhC;IACD,CAAC,UAAU,CAAC;CAEf,gBAAgB;EACd,IAAI,CAAC,gBAAgB,gBAAgB,QAAQ,SAC3C,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,MAAM,aAAa,IAAI,aAAa,aAAa,KAAK;GACtD,IAAI,aAAa,iBAAiB,aAAa,SAAS,QAAQ;IAChE;IAGH,EAAE,CAAC;CAEN,OACE,oBAAC,SAAD;EACE,OAAO;GACL;GACA,cAAc;GACd,UAAU;GACV,mBAAmB,UAAmB,SAAS,GAAG,YAAY,GAAG;GAClE;YAED,oBAAC,WAAD;GACE,0BAAA;GACA,KAAK;GACL,WAAW,KAAK,WAAW,UAAU;GACrC,aAAW,OAAO,SAAS;GAC3B,GAAI;GAEH;GACO,CAAA;EACF,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { l as Textarea, u as TextareaProps } from "../../alert-footer-
|
|
1
|
+
import { l as Textarea, u as TextareaProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Textarea, TextareaProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { l as Textarea, u as TextareaProps } from "../../alert-footer-
|
|
1
|
+
import { l as Textarea, u as TextareaProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Textarea, TextareaProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.mjs","names":[],"sources":["../../../src/components/textarea/textarea.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, TextareaHTMLAttributes } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type TextareaProps = MergeRight<\n DefaultProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'prefix'>,\n {\n /**\n * Size of the textarea.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n ref?: Ref<HTMLTextAreaElement>;\n }\n>;\n\nexport const Textarea = ({ className, dark, size, ref, ...props }: TextareaProps) => {\n return <textarea className={clsx('bi-input', className)} data-dark={dark} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,YAAY,EAAE,WAAW,MAAM,MAAM,KAAK,GAAG,YAA2B;
|
|
1
|
+
{"version":3,"file":"textarea.mjs","names":[],"sources":["../../../src/components/textarea/textarea.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, TextareaHTMLAttributes } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type TextareaProps = MergeRight<\n DefaultProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'prefix'>,\n {\n /**\n * Size of the textarea.\n * @default 'medium'\n */\n size?: 'medium' | 'large';\n ref?: Ref<HTMLTextAreaElement>;\n }\n>;\n\nexport const Textarea = ({ className, dark, size, ref, ...props }: TextareaProps) => {\n return <textarea className={clsx('bi-input', className)} data-dark={dark} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,YAAY,EAAE,WAAW,MAAM,MAAM,KAAK,GAAG,YAA2B;CACnF,OAAO,oBAAC,YAAD;EAAU,WAAW,KAAK,YAAY,UAAU;EAAE,aAAW;EAAM,aAAW;EAAW;EAAK,GAAI;EAAS,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { c as TextfieldProps, s as Textfield } from "../../alert-footer-
|
|
1
|
+
import { c as TextfieldProps, s as Textfield } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Textfield, TextfieldProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { c as TextfieldProps, s as Textfield } from "../../alert-footer-
|
|
1
|
+
import { c as TextfieldProps, s as Textfield } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { Textfield, TextfieldProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textfield.mjs","names":[],"sources":["../../../src/components/textfield/textfield.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { DefaultProps, LabelRequiredProps } from '../../types';\nimport { Field, FieldAffix, FieldAffixes, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { Textarea, type TextareaProps } from '../textarea';\nimport { ValidationMessage } from '../validation-message';\n\ntype InputPropsFiltered = Omit<InputProps, 'prefix' | 'className' | 'style'>;\ntype TextareaPropsFiltered = Omit<TextareaProps, 'prefix' | 'className' | 'style'>;\n\ntype BaseTextfieldProps = LabelRequiredProps &\n DefaultProps & {\n /** Label */\n label?: ReactNode;\n /** Description */\n description?: ReactNode;\n /** Prefix */\n prefix?: string;\n /** Suffix */\n suffix?: string;\n /** Error message for field */\n error?: ReactNode;\n /** `className` for the `Field` element */\n className?: InputProps['className'];\n /** `style` for the `Field` element */\n style?: InputProps['style'];\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n };\n\ntype TextfieldTextareaProps = {\n /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n multiline: true;\n} & TextareaPropsFiltered;\n\ntype TextfieldInputProps = {\n /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n multiline?: never | false;\n} & InputPropsFiltered;\n\nexport type TextfieldProps = BaseTextfieldProps & // We use either Textarea or Input props, depending on the `multiline` prop.\n (TextfieldTextareaProps | TextfieldInputProps) & {\n ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;\n };\n\nexport const Textfield = ({\n dark,\n label,\n description,\n error,\n multiline,\n prefix,\n suffix,\n style,\n className,\n fullwidth,\n ref,\n id: idProp,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: TextfieldProps) => {\n const generatedId = useId();\n const descriptionId = useId();\n const validationId = useId();\n const id = idProp || generatedId;\n\n const ariaDescribedBy =\n [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth}>\n {label && <Label htmlFor={id}>{label}</Label>}\n {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n <FieldAffixes>\n {prefix && <FieldAffix>{prefix}</FieldAffix>}\n {multiline ? (\n <Textarea\n id={id}\n ref={ref as Ref<HTMLTextAreaElement>}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...(props as TextareaPropsFiltered)}\n />\n ) : (\n <Input\n id={id}\n ref={ref as Ref<HTMLInputElement>}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...(props as InputPropsFiltered)}\n />\n )}\n {suffix && <FieldAffix>{suffix}</FieldAffix>}\n </FieldAffixes>\n {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AA+CA,MAAa,aAAa,EACxB,MACA,OACA,aACA,OACA,WACA,QACA,QACA,OACA,WACA,WACA,KACA,IAAI,QACJ,oBAAoB,qBACpB,GAAG,YACiB;CACpB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;
|
|
1
|
+
{"version":3,"file":"textfield.mjs","names":[],"sources":["../../../src/components/textfield/textfield.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { DefaultProps, LabelRequiredProps } from '../../types';\nimport { Field, FieldAffix, FieldAffixes, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { Textarea, type TextareaProps } from '../textarea';\nimport { ValidationMessage } from '../validation-message';\n\ntype InputPropsFiltered = Omit<InputProps, 'prefix' | 'className' | 'style'>;\ntype TextareaPropsFiltered = Omit<TextareaProps, 'prefix' | 'className' | 'style'>;\n\ntype BaseTextfieldProps = LabelRequiredProps &\n DefaultProps & {\n /** Label */\n label?: ReactNode;\n /** Description */\n description?: ReactNode;\n /** Prefix */\n prefix?: string;\n /** Suffix */\n suffix?: string;\n /** Error message for field */\n error?: ReactNode;\n /** `className` for the `Field` element */\n className?: InputProps['className'];\n /** `style` for the `Field` element */\n style?: InputProps['style'];\n /** If true, the selectfield will take up the full available width */\n fullwidth?: boolean;\n };\n\ntype TextfieldTextareaProps = {\n /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n multiline: true;\n} & TextareaPropsFiltered;\n\ntype TextfieldInputProps = {\n /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n multiline?: never | false;\n} & InputPropsFiltered;\n\nexport type TextfieldProps = BaseTextfieldProps & // We use either Textarea or Input props, depending on the `multiline` prop.\n (TextfieldTextareaProps | TextfieldInputProps) & {\n ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;\n };\n\nexport const Textfield = ({\n dark,\n label,\n description,\n error,\n multiline,\n prefix,\n suffix,\n style,\n className,\n fullwidth,\n ref,\n id: idProp,\n 'aria-describedby': ariaDescribedByProp,\n ...props\n}: TextfieldProps) => {\n const generatedId = useId();\n const descriptionId = useId();\n const validationId = useId();\n const id = idProp || generatedId;\n\n const ariaDescribedBy =\n [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n return (\n <Field className={className} data-dark={dark} style={style} fullwidth={fullwidth}>\n {label && <Label htmlFor={id}>{label}</Label>}\n {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n <FieldAffixes>\n {prefix && <FieldAffix>{prefix}</FieldAffix>}\n {multiline ? (\n <Textarea\n id={id}\n ref={ref as Ref<HTMLTextAreaElement>}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...(props as TextareaPropsFiltered)}\n />\n ) : (\n <Input\n id={id}\n ref={ref as Ref<HTMLInputElement>}\n aria-invalid={Boolean(error) || undefined}\n aria-describedby={ariaDescribedBy}\n dark={dark}\n {...(props as InputPropsFiltered)}\n />\n )}\n {suffix && <FieldAffix>{suffix}</FieldAffix>}\n </FieldAffixes>\n {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n </Field>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AA+CA,MAAa,aAAa,EACxB,MACA,OACA,aACA,OACA,WACA,QACA,QACA,OACA,WACA,WACA,KACA,IAAI,QACJ,oBAAoB,qBACpB,GAAG,YACiB;CACpB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,aAAW;EAAa;EAAkB;YAAvE;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;cAAK;IAAc,CAAA;GAC5C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;cAAgB;IAA+B,CAAA;GACrF,qBAAC,cAAD,EAAA,UAAA;IACG,UAAU,oBAAC,YAAD,EAAA,UAAa,QAAoB,CAAA;IAC3C,YACC,oBAAC,UAAD;KACM;KACC;KACL,gBAAc,QAAQ,MAAM,IAAI,KAAA;KAChC,oBAAkB;KACZ;KACN,GAAK;KACL,CAAA,GAEF,oBAAC,OAAD;KACM;KACC;KACL,gBAAc,QAAQ,MAAM,IAAI,KAAA;KAChC,oBAAkB;KACZ;KACN,GAAK;KACL,CAAA;IAEH,UAAU,oBAAC,YAAD,EAAA,UAAa,QAAoB,CAAA;IAC/B,EAAA,CAAA;GACd,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;cAAe;IAA0B,CAAA;GACtE"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-
|
|
1
|
+
import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { ValidationMessage, ValidationMessageProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-
|
|
1
|
+
import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { ValidationMessage, ValidationMessageProps };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"validation-message.mjs","names":[],"sources":["../../../src/components/validation-message/validation-message.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx/lite';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { AsChildProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { ErrorIcon } from '@bi-digital/icons';\n\nexport type ValidationMessageProps = MergeRight<\n AsChildProps & HTMLAttributes<HTMLParagraphElement>,\n {\n /** Override the default warning icon. Must be a BiIcon to work correctly. */\n icon?: ReactNode;\n ref?: Ref<HTMLParagraphElement>;\n }\n>;\n\nexport const ValidationMessage = ({ children, className, icon, asChild, ref, ...props }: ValidationMessageProps) => {\n const Component = asChild ? Slot : 'p';\n\n return (\n <Component className={clsx('bi-validation-message', className)} ref={ref} {...props}>\n {icon || <ErrorIcon />}\n {children}\n </Component>\n );\n};\n"],"mappings":";;;;;AAgBA,MAAa,qBAAqB,EAAE,UAAU,WAAW,MAAM,SAAS,KAAK,GAAG,YAAoC;
|
|
1
|
+
{"version":3,"file":"validation-message.mjs","names":[],"sources":["../../../src/components/validation-message/validation-message.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx/lite';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { AsChildProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { ErrorIcon } from '@bi-digital/icons';\n\nexport type ValidationMessageProps = MergeRight<\n AsChildProps & HTMLAttributes<HTMLParagraphElement>,\n {\n /** Override the default warning icon. Must be a BiIcon to work correctly. */\n icon?: ReactNode;\n ref?: Ref<HTMLParagraphElement>;\n }\n>;\n\nexport const ValidationMessage = ({ children, className, icon, asChild, ref, ...props }: ValidationMessageProps) => {\n const Component = asChild ? Slot : 'p';\n\n return (\n <Component className={clsx('bi-validation-message', className)} ref={ref} {...props}>\n {icon || <ErrorIcon />}\n {children}\n </Component>\n );\n};\n"],"mappings":";;;;;AAgBA,MAAa,qBAAqB,EAAE,UAAU,WAAW,MAAM,SAAS,KAAK,GAAG,YAAoC;CAGlH,OACE,qBAHgB,UAAU,OAAO,KAGjC;EAAW,WAAW,KAAK,yBAAyB,UAAU;EAAO;EAAK,GAAI;YAA9E,CACG,QAAQ,oBAAC,WAAD,EAAa,CAAA,EACrB,SACS"}
|
package/dist/main.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as useCheckboxGroup, t as UseCheckboxGroupOptions } from "./useCheckboxGroup-Boc_tLJ3.mjs";
|
|
2
|
-
import { t as useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect-
|
|
3
|
-
import { $ as FilterGroup, $t as Input, A as SelectOptgroupProps, At as DialogCloseButtonProps, B as PaginationButtonProps, Bt as DialogProps, C as Spinner, Ct as Dropdown, D as Selectfield, Dt as Popover, E as SkipLinkProps, Et as PopoverTriggerProps, F as Search, Ft as DialogHeader, G as Navbar, Gt as Details, H as PaginationProps, Ht as DetailsSummaryProps, I as SearchProps, It as DialogHeaderProps, J as LogoProps, Jt as ChipProps, K as NavbarProps, Kt as DetailsProps, L as Radio, Lt as DialogContent, M as SelectOptionProps, Mt as DialogTriggerProps, N as Select, Nt as DialogFooter, O as SelectfieldProps, Ot as PopoverProps, P as SelectProps, Pt as DialogFooterProps, Q as FooterProps, Qt as CheckboxProps, R as RadioProps, Rt as DialogContentProps, S as SwitchProps, Sn as AlertProps, St as DropdownButtonProps, T as SkipLink, Tt as PopoverTrigger, U as SubNavbar, Ut as DetailsContent, V as Pagination, Vt as DetailsSummary, W as SubNavbarProps, Wt as DetailsContentProps, X as LinkProps, Xt as CheckboxSubsectionProps, Y as Link, Yt as CheckboxSubsection, Z as Footer, Zt as Checkbox, _n as Badge, _t as DropdownTriggerContext, a as ValidationMessage, an as CardHeader, at as FieldsetDescription, b as TabsProps, bn as AvatarProps, bt as DropdownTriggerProps, c as TextfieldProps, cn as CardContentProps, ct as FieldsetProps, d as TabsPanel, dn as CardActions, dt as FieldAffixes, en as InputProps, et as FilterGroupProps, f as TabsPanelProps, fn as CardActionsProps, ft as FieldAffixesProps, g as TabProps, gn as ButtonProps, gt as FieldProps, h as Tab, hn as Button, ht as Field, i as usePagination, in as CardMediaProps, it as LabelProps, j as SelectOption, jt as DialogTrigger, k as SelectOptgroup, kt as DialogCloseButton, l as Textarea, ln as CardAction, lt as FieldAffix, m as TabsListProps, mn as CardProps, mt as FieldDescriptionProps, n as AlertFooterProps, nn as CardDateProps, nt as FieldsetLegendProps, o as ValidationMessageProps, on as CardHeaderProps, ot as FieldsetDescriptionProps, p as TabsList, pn as Card, pt as FieldDescription, q as Logo, qt as Chip, r as UsePaginationProps, rn as CardMedia, rt as Label, s as Textfield, sn as CardContent, st as Fieldset, t as AlertFooter, tn as CardDate, tt as FieldsetLegend, u as TextareaProps, un as CardActionProps, ut as FieldAffixProps, v as Tabs, vn as BadgeProps, vt as DropdownTriggerContextProps, w as SpinnerProps, wt as DropdownProps, x as Switch, xn as Alert, xt as DropdownButton, y as TabsContext, yn as Avatar, yt as DropdownTrigger, z as PaginationButton, zt as Dialog } from "./alert-footer-
|
|
2
|
+
import { t as useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect-B2JpCiYW.mjs";
|
|
3
|
+
import { $ as FilterGroup, $t as Input, A as SelectOptgroupProps, At as DialogCloseButtonProps, B as PaginationButtonProps, Bt as DialogProps, C as Spinner, Ct as Dropdown, D as Selectfield, Dt as Popover, E as SkipLinkProps, Et as PopoverTriggerProps, F as Search, Ft as DialogHeader, G as Navbar, Gt as Details, H as PaginationProps, Ht as DetailsSummaryProps, I as SearchProps, It as DialogHeaderProps, J as LogoProps, Jt as ChipProps, K as NavbarProps, Kt as DetailsProps, L as Radio, Lt as DialogContent, M as SelectOptionProps, Mt as DialogTriggerProps, N as Select, Nt as DialogFooter, O as SelectfieldProps, Ot as PopoverProps, P as SelectProps, Pt as DialogFooterProps, Q as FooterProps, Qt as CheckboxProps, R as RadioProps, Rt as DialogContentProps, S as SwitchProps, Sn as AlertProps, St as DropdownButtonProps, T as SkipLink, Tt as PopoverTrigger, U as SubNavbar, Ut as DetailsContent, V as Pagination, Vt as DetailsSummary, W as SubNavbarProps, Wt as DetailsContentProps, X as LinkProps, Xt as CheckboxSubsectionProps, Y as Link, Yt as CheckboxSubsection, Z as Footer, Zt as Checkbox, _n as Badge, _t as DropdownTriggerContext, a as ValidationMessage, an as CardHeader, at as FieldsetDescription, b as TabsProps, bn as AvatarProps, bt as DropdownTriggerProps, c as TextfieldProps, cn as CardContentProps, ct as FieldsetProps, d as TabsPanel, dn as CardActions, dt as FieldAffixes, en as InputProps, et as FilterGroupProps, f as TabsPanelProps, fn as CardActionsProps, ft as FieldAffixesProps, g as TabProps, gn as ButtonProps, gt as FieldProps, h as Tab, hn as Button, ht as Field, i as usePagination, in as CardMediaProps, it as LabelProps, j as SelectOption, jt as DialogTrigger, k as SelectOptgroup, kt as DialogCloseButton, l as Textarea, ln as CardAction, lt as FieldAffix, m as TabsListProps, mn as CardProps, mt as FieldDescriptionProps, n as AlertFooterProps, nn as CardDateProps, nt as FieldsetLegendProps, o as ValidationMessageProps, on as CardHeaderProps, ot as FieldsetDescriptionProps, p as TabsList, pn as Card, pt as FieldDescription, q as Logo, qt as Chip, r as UsePaginationProps, rn as CardMedia, rt as Label, s as Textfield, sn as CardContent, st as Fieldset, t as AlertFooter, tn as CardDate, tt as FieldsetLegend, u as TextareaProps, un as CardActionProps, ut as FieldAffixProps, v as Tabs, vn as BadgeProps, vt as DropdownTriggerContextProps, w as SpinnerProps, wt as DropdownProps, x as Switch, xn as Alert, xt as DropdownButton, y as TabsContext, yn as Avatar, yt as DropdownTrigger, z as PaginationButton, zt as Dialog } from "./alert-footer-D3W7nNsf.mjs";
|
|
4
4
|
import { n as DialogTriggerContext, r as DialogTriggerContextProps, t as Context } from "./dialog-trigger-context-DbUhxoNL.mjs";
|
|
5
5
|
import { n as PopoverTriggerContext, r as PopoverTriggerContextProps } from "./popover-trigger-context-BLjAozBn.mjs";
|
|
6
6
|
import { n as DropdownItemProps, t as DropdownItem } from "./dropdown-item-bA64wFOZ.mjs";
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { useLayoutEffect } from "react";
|
|
2
|
+
|
|
3
|
+
//#region src/utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.ts
|
|
4
|
+
declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
|
|
5
|
+
//#endregion
|
|
6
|
+
export { useIsomorphicLayoutEffect as t };
|
|
7
|
+
//# sourceMappingURL=useIsomorphicLayoutEffect-B2JpCiYW.d.mts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as useCheckboxGroup, t as UseCheckboxGroupOptions } from "../../useCheckboxGroup-Boc_tLJ3.mjs";
|
|
2
|
-
import { t as useIsomorphicLayoutEffect } from "../../useIsomorphicLayoutEffect-
|
|
3
|
-
import { i as usePagination, r as UsePaginationProps } from "../../alert-footer-
|
|
2
|
+
import { t as useIsomorphicLayoutEffect } from "../../useIsomorphicLayoutEffect-B2JpCiYW.mjs";
|
|
3
|
+
import { i as usePagination, r as UsePaginationProps } from "../../alert-footer-D3W7nNsf.mjs";
|
|
4
4
|
import { t as useIsElementAboveViewport } from "../../useIsElementAboveViewport-DmYCeDwm.mjs";
|
|
5
5
|
import { t as useScrollDirection } from "../../useScrollDirection-CepdY5lA.mjs";
|
|
6
6
|
import { n as useMediaQuery, t as UseMediaQueryOptions } from "../../useMediaQuery-Cz0DvE8S.mjs";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCheckboxGroup.mjs","names":[],"sources":["../../../../src/utilities/hooks/useCheckboxGroup/useCheckboxGroup.tsx"],"sourcesContent":["import type { ChangeEvent } from 'react';\n\nexport type UseCheckboxGroupOptions = {\n options: boolean[];\n updateOptions: (checked: boolean) => void;\n};\n\nexport type UseCheckboxGroupReturn = {\n /** Spread this on the \"parent\" checkbox */\n checkboxGroupProps: {\n checked: boolean;\n indeterminate: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n };\n};\n\nexport const useCheckboxGroup = ({ options, updateOptions }: UseCheckboxGroupOptions): UseCheckboxGroupReturn => {\n const checked = options.every((option) => option);\n const indeterminate = options.some((option) => option) && !checked;\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newChecked = e.target.indeterminate ? true : e.target.checked;\n updateOptions(newChecked);\n };\n\n return {\n checkboxGroupProps: {\n checked,\n indeterminate,\n onChange,\n },\n };\n};\n"],"mappings":";AAgBA,MAAa,oBAAoB,EAAE,SAAS,oBAAqE;CAC/G,MAAM,UAAU,QAAQ,OAAO,WAAW,OAAO;CACjD,MAAM,gBAAgB,QAAQ,MAAM,WAAW,OAAO,IAAI,CAAC;CAE3D,MAAM,YAAY,MAAqC;
|
|
1
|
+
{"version":3,"file":"useCheckboxGroup.mjs","names":[],"sources":["../../../../src/utilities/hooks/useCheckboxGroup/useCheckboxGroup.tsx"],"sourcesContent":["import type { ChangeEvent } from 'react';\n\nexport type UseCheckboxGroupOptions = {\n options: boolean[];\n updateOptions: (checked: boolean) => void;\n};\n\nexport type UseCheckboxGroupReturn = {\n /** Spread this on the \"parent\" checkbox */\n checkboxGroupProps: {\n checked: boolean;\n indeterminate: boolean;\n onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n };\n};\n\nexport const useCheckboxGroup = ({ options, updateOptions }: UseCheckboxGroupOptions): UseCheckboxGroupReturn => {\n const checked = options.every((option) => option);\n const indeterminate = options.some((option) => option) && !checked;\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newChecked = e.target.indeterminate ? true : e.target.checked;\n updateOptions(newChecked);\n };\n\n return {\n checkboxGroupProps: {\n checked,\n indeterminate,\n onChange,\n },\n };\n};\n"],"mappings":";AAgBA,MAAa,oBAAoB,EAAE,SAAS,oBAAqE;CAC/G,MAAM,UAAU,QAAQ,OAAO,WAAW,OAAO;CACjD,MAAM,gBAAgB,QAAQ,MAAM,WAAW,OAAO,IAAI,CAAC;CAE3D,MAAM,YAAY,MAAqC;EAErD,cADmB,EAAE,OAAO,gBAAgB,OAAO,EAAE,OAAO,QACnC;;CAG3B,OAAO,EACL,oBAAoB;EAClB;EACA;EACA;EACD,EACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIsElementAboveViewport.mjs","names":[],"sources":["../../../../src/utilities/hooks/useIsElementAboveViewport/useIsElementAboveViewport.tsx"],"sourcesContent":["import { useEffect, useState, type RefObject } from 'react';\n\n/** Detects when an element's is scrolled past and is no longer in the viewport. */\nexport const useIsElementAboveViewport = (elementRef: RefObject<HTMLElement | null>): boolean => {\n const [isAboveViewport, setIsPast] = useState(false);\n\n useEffect(() => {\n const observer = new IntersectionObserver(([entry]) => setIsPast(entry.boundingClientRect.y < 0), {\n threshold: [0],\n });\n const currentRef = elementRef.current;\n if (currentRef) observer.observe(currentRef);\n return () => {\n if (currentRef) observer.unobserve(currentRef);\n };\n }, [elementRef]);\n return isAboveViewport;\n};\n"],"mappings":";;;AAGA,MAAa,6BAA6B,eAAuD;CAC/F,MAAM,CAAC,iBAAiB,aAAa,SAAS,MAAM;
|
|
1
|
+
{"version":3,"file":"useIsElementAboveViewport.mjs","names":[],"sources":["../../../../src/utilities/hooks/useIsElementAboveViewport/useIsElementAboveViewport.tsx"],"sourcesContent":["import { useEffect, useState, type RefObject } from 'react';\n\n/** Detects when an element's is scrolled past and is no longer in the viewport. */\nexport const useIsElementAboveViewport = (elementRef: RefObject<HTMLElement | null>): boolean => {\n const [isAboveViewport, setIsPast] = useState(false);\n\n useEffect(() => {\n const observer = new IntersectionObserver(([entry]) => setIsPast(entry.boundingClientRect.y < 0), {\n threshold: [0],\n });\n const currentRef = elementRef.current;\n if (currentRef) observer.observe(currentRef);\n return () => {\n if (currentRef) observer.unobserve(currentRef);\n };\n }, [elementRef]);\n return isAboveViewport;\n};\n"],"mappings":";;;AAGA,MAAa,6BAA6B,eAAuD;CAC/F,MAAM,CAAC,iBAAiB,aAAa,SAAS,MAAM;CAEpD,gBAAgB;EACd,MAAM,WAAW,IAAI,sBAAsB,CAAC,WAAW,UAAU,MAAM,mBAAmB,IAAI,EAAE,EAAE,EAChG,WAAW,CAAC,EAAE,EACf,CAAC;EACF,MAAM,aAAa,WAAW;EAC9B,IAAI,YAAY,SAAS,QAAQ,WAAW;EAC5C,aAAa;GACX,IAAI,YAAY,SAAS,UAAU,WAAW;;IAE/C,CAAC,WAAW,CAAC;CAChB,OAAO"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as useIsomorphicLayoutEffect } from "../../../useIsomorphicLayoutEffect-
|
|
1
|
+
import { t as useIsomorphicLayoutEffect } from "../../../useIsomorphicLayoutEffect-B2JpCiYW.mjs";
|
|
2
2
|
export { useIsomorphicLayoutEffect };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMediaQuery.mjs","names":[],"sources":["../../../../src/utilities/hooks/useMediaQuery/useMediaQuery.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect';\n\n/** Hook options. */\nexport type UseMediaQueryOptions = {\n /**\n * The default value to return if the hook is being run on the server.\n * @default false\n */\n defaultValue?: boolean;\n /**\n * If `true` (default), the hook will initialize reading the media query. In SSR, you should set it to `false`, returning `options.defaultValue` or `false` initially.\n * @default true\n */\n initializeWithValue?: boolean;\n};\n\nconst IS_SERVER = typeof window === 'undefined';\n\n/**\n * Custom hook that tracks the state of a media query using the [`Match Media API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia).\n * @param {string} query - The media query to track.\n * @param {?UseMediaQueryOptions} [options] - The options for customizing the behavior of the hook (optional).\n * @returns {boolean} The current state of the media query (true if the query matches, false otherwise).\n * @example\n * ```tsx\n * const isSmallScreen = useMediaQuery('(max-width: 600px)');\n * // Use `isSmallScreen` to conditionally apply styles or logic based on the screen size.\n * ```\n */\nexport function useMediaQuery(\n query: string,\n { defaultValue = false, initializeWithValue = true }: UseMediaQueryOptions = {},\n): boolean {\n const getMatches = (query: string): boolean => {\n if (IS_SERVER) {\n return defaultValue;\n }\n return window.matchMedia(query).matches;\n };\n\n const [matches, setMatches] = useState<boolean>(() => {\n if (initializeWithValue) {\n return getMatches(query);\n }\n return defaultValue;\n });\n\n // Handles the change event of the media query.\n function handleChange() {\n setMatches(getMatches(query));\n }\n\n useIsomorphicLayoutEffect(() => {\n const matchMedia = window.matchMedia(query);\n\n // Triggered at the first client-side load and if query changes\n handleChange();\n\n // Use deprecated `addListener` and `removeListener` to support Safari < 14\n if (matchMedia.addListener) {\n matchMedia.addListener(handleChange);\n } else {\n matchMedia.addEventListener('change', handleChange);\n }\n\n return () => {\n if (matchMedia.removeListener) {\n matchMedia.removeListener(handleChange);\n } else {\n matchMedia.removeEventListener('change', handleChange);\n }\n };\n }, [query]);\n\n return matches;\n}\n"],"mappings":";;;AAkBA,MAAM,YAAY,OAAO,WAAW;;;;;;;;;;;;AAapC,SAAgB,cACd,OACA,EAAE,eAAe,OAAO,sBAAsB,SAA+B,EAAE,EACtE;CACT,MAAM,cAAc,UAA2B;
|
|
1
|
+
{"version":3,"file":"useMediaQuery.mjs","names":[],"sources":["../../../../src/utilities/hooks/useMediaQuery/useMediaQuery.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect';\n\n/** Hook options. */\nexport type UseMediaQueryOptions = {\n /**\n * The default value to return if the hook is being run on the server.\n * @default false\n */\n defaultValue?: boolean;\n /**\n * If `true` (default), the hook will initialize reading the media query. In SSR, you should set it to `false`, returning `options.defaultValue` or `false` initially.\n * @default true\n */\n initializeWithValue?: boolean;\n};\n\nconst IS_SERVER = typeof window === 'undefined';\n\n/**\n * Custom hook that tracks the state of a media query using the [`Match Media API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia).\n * @param {string} query - The media query to track.\n * @param {?UseMediaQueryOptions} [options] - The options for customizing the behavior of the hook (optional).\n * @returns {boolean} The current state of the media query (true if the query matches, false otherwise).\n * @example\n * ```tsx\n * const isSmallScreen = useMediaQuery('(max-width: 600px)');\n * // Use `isSmallScreen` to conditionally apply styles or logic based on the screen size.\n * ```\n */\nexport function useMediaQuery(\n query: string,\n { defaultValue = false, initializeWithValue = true }: UseMediaQueryOptions = {},\n): boolean {\n const getMatches = (query: string): boolean => {\n if (IS_SERVER) {\n return defaultValue;\n }\n return window.matchMedia(query).matches;\n };\n\n const [matches, setMatches] = useState<boolean>(() => {\n if (initializeWithValue) {\n return getMatches(query);\n }\n return defaultValue;\n });\n\n // Handles the change event of the media query.\n function handleChange() {\n setMatches(getMatches(query));\n }\n\n useIsomorphicLayoutEffect(() => {\n const matchMedia = window.matchMedia(query);\n\n // Triggered at the first client-side load and if query changes\n handleChange();\n\n // Use deprecated `addListener` and `removeListener` to support Safari < 14\n if (matchMedia.addListener) {\n matchMedia.addListener(handleChange);\n } else {\n matchMedia.addEventListener('change', handleChange);\n }\n\n return () => {\n if (matchMedia.removeListener) {\n matchMedia.removeListener(handleChange);\n } else {\n matchMedia.removeEventListener('change', handleChange);\n }\n };\n }, [query]);\n\n return matches;\n}\n"],"mappings":";;;AAkBA,MAAM,YAAY,OAAO,WAAW;;;;;;;;;;;;AAapC,SAAgB,cACd,OACA,EAAE,eAAe,OAAO,sBAAsB,SAA+B,EAAE,EACtE;CACT,MAAM,cAAc,UAA2B;EAC7C,IAAI,WACF,OAAO;EAET,OAAO,OAAO,WAAW,MAAM,CAAC;;CAGlC,MAAM,CAAC,SAAS,cAAc,eAAwB;EACpD,IAAI,qBACF,OAAO,WAAW,MAAM;EAE1B,OAAO;GACP;CAGF,SAAS,eAAe;EACtB,WAAW,WAAW,MAAM,CAAC;;CAG/B,gCAAgC;EAC9B,MAAM,aAAa,OAAO,WAAW,MAAM;EAG3C,cAAc;EAGd,IAAI,WAAW,aACb,WAAW,YAAY,aAAa;OAEpC,WAAW,iBAAiB,UAAU,aAAa;EAGrD,aAAa;GACX,IAAI,WAAW,gBACb,WAAW,eAAe,aAAa;QAEvC,WAAW,oBAAoB,UAAU,aAAa;;IAGzD,CAAC,MAAM,CAAC;CAEX,OAAO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergeRefs.mjs","names":[],"sources":["../../../../src/utilities/hooks/useMergeRefs/useMergeRefs.ts"],"sourcesContent":["// https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/hooks/useMergeRefs.ts\nimport { useCallback, useMemo, useRef } from 'react';\nimport type { Ref, RefCallback, RefObject } from 'react';\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n */\nexport function useMergeRefs<Instance>(refs: Array<Ref<Instance> | undefined>): null | RefCallback<Instance> {\n const cleanupRef = useRef<undefined | (() => void)>(undefined);\n\n const refEffect = useCallback((instance: Instance | null) => {\n const cleanups = refs.map((ref) => {\n if (ref == null) {\n return;\n }\n\n if (typeof ref === 'function') {\n const refCallback = ref;\n // biome-ignore lint/suspicious/noConfusingVoidType: @types-react wants `void` here\n const refCleanup: void | (() => void) = refCallback(instance);\n return typeof refCleanup === 'function'\n ? refCleanup\n : () => {\n refCallback(null);\n };\n }\n\n (ref as RefObject<Instance | null>).current = instance;\n return () => {\n (ref as RefObject<Instance | null>).current = null;\n };\n });\n\n return () => {\n for (const refCleanup of cleanups) {\n refCleanup?.();\n }\n };\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, refs);\n\n return useMemo(() => {\n if (refs.every((ref) => ref == null)) {\n return null;\n }\n\n return (value) => {\n if (cleanupRef.current) {\n cleanupRef.current();\n (cleanupRef as RefObject<undefined | (() => void)>).current = undefined;\n }\n\n if (value != null) {\n (cleanupRef as RefObject<undefined | (() => void)>).current = refEffect(value);\n }\n };\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, refs);\n}\n"],"mappings":";;;;;AAOA,SAAgB,aAAuB,MAAsE;CAC3G,MAAM,aAAa,OAAiC,KAAA,EAAU;CAE9D,MAAM,YAAY,aAAa,aAA8B;EAC3D,MAAM,WAAW,KAAK,KAAK,QAAQ;
|
|
1
|
+
{"version":3,"file":"useMergeRefs.mjs","names":[],"sources":["../../../../src/utilities/hooks/useMergeRefs/useMergeRefs.ts"],"sourcesContent":["// https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/hooks/useMergeRefs.ts\nimport { useCallback, useMemo, useRef } from 'react';\nimport type { Ref, RefCallback, RefObject } from 'react';\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n */\nexport function useMergeRefs<Instance>(refs: Array<Ref<Instance> | undefined>): null | RefCallback<Instance> {\n const cleanupRef = useRef<undefined | (() => void)>(undefined);\n\n const refEffect = useCallback((instance: Instance | null) => {\n const cleanups = refs.map((ref) => {\n if (ref == null) {\n return;\n }\n\n if (typeof ref === 'function') {\n const refCallback = ref;\n // biome-ignore lint/suspicious/noConfusingVoidType: @types-react wants `void` here\n const refCleanup: void | (() => void) = refCallback(instance);\n return typeof refCleanup === 'function'\n ? refCleanup\n : () => {\n refCallback(null);\n };\n }\n\n (ref as RefObject<Instance | null>).current = instance;\n return () => {\n (ref as RefObject<Instance | null>).current = null;\n };\n });\n\n return () => {\n for (const refCleanup of cleanups) {\n refCleanup?.();\n }\n };\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, refs);\n\n return useMemo(() => {\n if (refs.every((ref) => ref == null)) {\n return null;\n }\n\n return (value) => {\n if (cleanupRef.current) {\n cleanupRef.current();\n (cleanupRef as RefObject<undefined | (() => void)>).current = undefined;\n }\n\n if (value != null) {\n (cleanupRef as RefObject<undefined | (() => void)>).current = refEffect(value);\n }\n };\n // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n }, refs);\n}\n"],"mappings":";;;;;AAOA,SAAgB,aAAuB,MAAsE;CAC3G,MAAM,aAAa,OAAiC,KAAA,EAAU;CAE9D,MAAM,YAAY,aAAa,aAA8B;EAC3D,MAAM,WAAW,KAAK,KAAK,QAAQ;GACjC,IAAI,OAAO,MACT;GAGF,IAAI,OAAO,QAAQ,YAAY;IAC7B,MAAM,cAAc;IAEpB,MAAM,aAAkC,YAAY,SAAS;IAC7D,OAAO,OAAO,eAAe,aACzB,mBACM;KACJ,YAAY,KAAK;;;GAIzB,IAAoC,UAAU;GAC9C,aAAa;IACX,IAAoC,UAAU;;IAEhD;EAEF,aAAa;GACX,KAAK,MAAM,cAAc,UACvB,cAAc;;IAIjB,KAAK;CAER,OAAO,cAAc;EACnB,IAAI,KAAK,OAAO,QAAQ,OAAO,KAAK,EAClC,OAAO;EAGT,QAAQ,UAAU;GAChB,IAAI,WAAW,SAAS;IACtB,WAAW,SAAS;IACpB,WAAoD,UAAU,KAAA;;GAGhE,IAAI,SAAS,MACX,WAAoD,UAAU,UAAU,MAAM;;IAIjF,KAAK"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { i as usePagination, r as UsePaginationProps } from "../../../alert-footer-
|
|
1
|
+
import { i as usePagination, r as UsePaginationProps } from "../../../alert-footer-D3W7nNsf.mjs";
|
|
2
2
|
export { UsePaginationProps, usePagination };
|