@rdsaude/pulso-react-components
Version:
Biblioteca de componentes React do Pulso Design System da RD Saúde oferece componentes consistentes e de alto desempenho, alinhados com os padrões da RDSaúde. Ideal para desenvolver aplicações modernas e acessíveis.
1 lines • 751 kB
Source Map (JSON)
{"version":3,"sources":["../../../src/components/select/index.ts","../../../src/components/select/select.tsx","../../../src/components/select/components/select-actions/index.tsx","../../../src/components/select/components/select-field/index.tsx","../../../src/components/button/button.tsx","../../../src/utils/tv.ts","../../../src/components/button/button.styles.ts","../../../src/hooks/use-theme.ts","../../../src/components/theme-provider/theme-provider.tsx","../../../src/components/icon/utils/get-icon-color.ts","../../../src/components/icon/utils/get-icon-size.ts","../../../src/components/icon/icon.tsx","../../../src/components/button/components/button-icon.tsx","../../../src/components/refresh/utils/get-refresh-color.ts","../../../src/components/refresh/refresh.tsx","../../../src/components/button/components/button-refresh.tsx","../../../src/components/button/utils/is-icon-only.ts","../../../src/components/checkbox/checkbox.tsx","../../../src/components/checkbox/checkbox.styles.ts","../../../src/components/checkbox/components/checkbox-label/checkbox.label.styles.ts","../../../src/components/checkbox/components/checkbox-label/index.tsx","../../../src/components/checkbox/components/helper-text/helper-text.styles.ts","../../../src/components/checkbox/components/helper-text/index.tsx","../../../../../node_modules/@babel/runtime/helpers/esm/extends.js","../../../../../node_modules/@radix-ui/number/dist/packages/core/number/src/index.ts","../../../../../node_modules/@radix-ui/number/dist/packages/core/number/src/number.ts","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/primitive/dist/packages/core/primitive/src/index.ts","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/primitive/dist/packages/core/primitive/src/primitive.tsx","../../../../../node_modules/@radix-ui/react-compose-refs/dist/packages/react/compose-refs/src/index.ts","../../../../../node_modules/@radix-ui/react-compose-refs/dist/packages/react/compose-refs/src/composeRefs.tsx","../../../../../node_modules/@radix-ui/react-collection/dist/packages/react/collection/src/index.ts","../../../../../node_modules/@radix-ui/react-collection/dist/packages/react/collection/src/Collection.tsx","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/react-direction/dist/packages/react/direction/src/index.ts","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/react-direction/dist/packages/react/direction/src/Direction.tsx","../../../../../node_modules/@radix-ui/react-dismissable-layer/node_modules/@radix-ui/primitive/dist/packages/core/primitive/src/index.ts","../../../../../node_modules/@radix-ui/react-dismissable-layer/node_modules/@radix-ui/primitive/dist/packages/core/primitive/src/primitive.tsx","../../../../../node_modules/@radix-ui/react-primitive/dist/packages/react/primitive/src/index.ts","../../../../../node_modules/@radix-ui/react-primitive/dist/packages/react/primitive/src/Primitive.tsx","../../../../../node_modules/@radix-ui/react-use-callback-ref/dist/packages/react/use-callback-ref/src/index.ts","../../../../../node_modules/@radix-ui/react-use-callback-ref/dist/packages/react/use-callback-ref/src/useCallbackRef.tsx","../../../../../node_modules/@radix-ui/react-use-escape-keydown/dist/packages/react/use-escape-keydown/src/index.ts","../../../../../node_modules/@radix-ui/react-use-escape-keydown/dist/packages/react/use-escape-keydown/src/useEscapeKeydown.tsx","../../../../../node_modules/@radix-ui/react-dismissable-layer/dist/packages/react/dismissable-layer/src/index.ts","../../../../../node_modules/@radix-ui/react-dismissable-layer/dist/packages/react/dismissable-layer/src/DismissableLayer.tsx","../../../../../node_modules/@radix-ui/react-focus-guards/dist/packages/react/focus-guards/src/index.ts","../../../../../node_modules/@radix-ui/react-focus-guards/dist/packages/react/focus-guards/src/FocusGuards.tsx","../../../../../node_modules/@radix-ui/react-focus-scope/dist/packages/react/focus-scope/src/index.ts","../../../../../node_modules/@radix-ui/react-focus-scope/dist/packages/react/focus-scope/src/FocusScope.tsx","../../../../../node_modules/@radix-ui/react-use-layout-effect/dist/packages/react/use-layout-effect/src/index.ts","../../../../../node_modules/@radix-ui/react-use-layout-effect/dist/packages/react/use-layout-effect/src/useLayoutEffect.tsx","../../../../../node_modules/@radix-ui/react-id/dist/packages/react/id/src/index.ts","../../../../../node_modules/@radix-ui/react-id/dist/packages/react/id/src/id.tsx","../../../../../node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs","../../../../../node_modules/@floating-ui/core/dist/floating-ui.core.mjs","../../../../../node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs","../../../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs","../../../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs","../../../../../node_modules/@radix-ui/react-use-size/dist/packages/react/use-size/src/index.ts","../../../../../node_modules/@radix-ui/react-use-size/dist/packages/react/use-size/src/useSize.tsx","../../../../../node_modules/@radix-ui/react-popper/dist/packages/react/popper/src/index.ts","../../../../../node_modules/@radix-ui/react-popper/dist/packages/react/popper/src/Popper.tsx","../../../../../node_modules/@radix-ui/react-portal/dist/packages/react/portal/src/index.ts","../../../../../node_modules/@radix-ui/react-portal/dist/packages/react/portal/src/Portal.tsx","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/react-use-controllable-state/dist/packages/react/use-controllable-state/src/index.ts","../../../../../node_modules/@radix-ui/react-select/node_modules/@radix-ui/react-use-controllable-state/dist/packages/react/use-controllable-state/src/useControllableState.tsx","../../../../../node_modules/@radix-ui/react-use-previous/dist/packages/react/use-previous/src/index.ts","../../../../../node_modules/@radix-ui/react-use-previous/dist/packages/react/use-previous/src/usePrevious.tsx","../../../../../node_modules/@radix-ui/react-visually-hidden/dist/packages/react/visually-hidden/src/index.ts","../../../../../node_modules/@radix-ui/react-visually-hidden/dist/packages/react/visually-hidden/src/VisuallyHidden.tsx","../../../../../node_modules/aria-hidden/dist/es2015/index.js","../../../../../node_modules/tslib/tslib.es6.mjs","../../../../../node_modules/react-remove-scroll/dist/es2015/Combination.js","../../../../../node_modules/react-remove-scroll/dist/es2015/UI.js","../../../../../node_modules/react-remove-scroll-bar/dist/es2015/constants.js","../../../../../node_modules/use-callback-ref/dist/es2015/assignRef.js","../../../../../node_modules/use-callback-ref/dist/es2015/useRef.js","../../../../../node_modules/use-callback-ref/dist/es2015/useMergeRef.js","../../../../../node_modules/use-sidecar/dist/es2015/medium.js","../../../../../node_modules/use-sidecar/dist/es2015/exports.js","../../../../../node_modules/react-remove-scroll/dist/es2015/medium.js","../../../../../node_modules/react-remove-scroll/dist/es2015/SideEffect.js","../../../../../node_modules/react-remove-scroll-bar/dist/es2015/component.js","../../../../../node_modules/react-style-singleton/dist/es2015/hook.js","../../../../../node_modules/get-nonce/dist/es2015/index.js","../../../../../node_modules/react-style-singleton/dist/es2015/singleton.js","../../../../../node_modules/react-style-singleton/dist/es2015/component.js","../../../../../node_modules/react-remove-scroll-bar/dist/es2015/utils.js","../../../../../node_modules/react-remove-scroll/dist/es2015/aggresiveCapture.js","../../../../../node_modules/react-remove-scroll/dist/es2015/handleScroll.js","../../../../../node_modules/react-remove-scroll/dist/es2015/sidecar.js","../../../../../node_modules/@radix-ui/react-select/dist/packages/react/select/src/index.ts","../../../../../node_modules/@radix-ui/react-select/dist/packages/react/select/src/Select.tsx","../../../src/components/input-select/input-select.tsx","../../../src/components/input-select/components/clear-button/clear-button-styles.ts","../../../src/components/input-select/components/clear-button/index.tsx","../../../src/components/input-select/components/helper-text/helper-text.styles.ts","../../../src/components/input-select/components/helper-text/index.tsx","../../../src/components/input-select/components/icon/index.tsx","../../../src/components/input-select/components/label/label.styles.ts","../../../src/components/input-select/components/label/index.tsx","../../../src/components/input-select/components/left-icon/index.tsx","../../../src/components/input-select/input-select.styles.ts","../../../src/components/input-text/utils/render-composition-children.tsx","../../../src/components/input-text/components/input-text-actions/index.styles.ts","../../../src/components/input-text/components/input-text-actions/index.tsx","../../../src/components/input-text/components/input-text-clear-button/index.styles.ts","../../../src/components/input-text/components/input-text-clear-button/index.tsx","../../../src/components/input-text/components/input-text-field/index.tsx","../../../src/components/input-text/components/input-text-field/index.styles.ts","../../../src/components/input-text/components/input-text-helpertext/index.tsx","../../../src/components/input-text/components/input-text-helpertext/index.styles.ts","../../../src/components/input-text/components/input-text-icon/index.tsx","../../../src/components/input-text/components/input-text-label/index.styles.ts","../../../src/components/input-text/components/input-text-label/index.tsx","../../../src/components/input-text/input-text.tsx","../../../src/components/link/link.tsx","../../../src/components/link/components/link-icon.tsx","../../../src/components/link/link.styles.ts","../../../src/components/option-menu/components/divider/index.tsx","../../../src/components/option-menu/components/footer/index.tsx","../../../src/components/option-menu/option-menu.tsx","../../../src/components/option-menu/components/group/index.tsx","../../../src/components/option-menu/components/item/index.tsx","../../../src/components/option-menu/components/item/index.styles.ts","../../../src/components/option-menu/components/list/index.tsx","../../../src/components/option-menu/utils/is-item-element.ts","../../../src/components/pagination/pagination.tsx","../../../src/components/pagination/components/pagination-control/index.tsx","../../../src/components/pagination/components/pagination-ellipse/index.styles.ts","../../../src/components/pagination/components/pagination-ellipse/index.tsx","../../../src/components/pagination/components/pagination-item/index.styles.ts","../../../src/components/pagination/components/pagination-item/index.tsx","../../../src/components/radio/radio.tsx","../../../src/components/radio/components/radio-button.tsx","../../../src/components/radio/hooks/use-radio.ts","../../../src/components/radio/radio.styles.ts","../../../src/components/radio/components/radio-helpertext/index.styles.ts","../../../src/components/radio/components/radio-helpertext/index.tsx","../../../src/components/radio/components/radio-label.tsx","../../../src/components/card-shape/card-shape.styles.ts","../../../src/components/card-shape/card-shape.tsx","../../../src/components/switch/switch.tsx","../../../src/components/switch/components/switch-label/switch-label.styles.ts","../../../src/components/switch/components/switch-label/index.tsx","../../../src/components/switch/components/switch-refresh/index.tsx","../../../src/components/switch/components/switch-thumb/index.tsx","../../../src/components/switch/components/switch-thumb/switch-thumb.styles.ts","../../../src/components/switch/components/switch-toggle/index.tsx","../../../src/components/switch/components/switch-toggle/switch-toggle.styles.ts","../../../src/components/switch/switch.styles.ts","../../../src/components/chips/chips.tsx","../../../src/components/chips/components/chipsInput/index.tsx","../../../src/components/chips/chips.styles.ts","../../../src/components/chips/components/chipsLabel/index.tsx","../../../src/components/chips/components/chipsMultiple/index.tsx","../../../src/components/chips/hooks/use-chips.ts","../../../src/components/chips/components/chipsSingle/index.tsx","../../../src/components/search-bar/search-bar.tsx","../../../src/components/search-bar/search-bar.styles.ts","../../../src/utils/cn.ts","../../../src/components/modal/modal.tsx","../../../src/components/modal/components/modal-body/index.tsx","../../../src/components/modal/components/modal-closable-button/index.tsx","../../../src/components/modal/components/modal-description/modal-description.styles.ts","../../../src/components/modal/components/modal-description/index.tsx","../../../src/components/modal/components/modal-footer/index.tsx","../../../src/components/modal/components/modal-header/modal-header.styles.ts","../../../src/components/modal/components/modal-header/index.tsx","../../../src/components/modal/components/modal-icon/index.tsx","../../../src/components/modal/components/modal-title/index.tsx","../../../src/components/modal/modal.styles.ts","../../../src/components/progress-indicator/progress-indicator.tsx","../../../src/components/progress-indicator/hooks/use-handler-progress.ts","../../../src/components/toast/toast.tsx","../../../src/components/toast/toast-description/toast-description.styles.ts","../../../src/components/toast/toast-description/index.tsx","../../../src/components/toast/toast-icon/index.tsx","../../../src/components/toast/toast.styles.ts","../../../src/components/snackbar/snackbar.tsx","../../../src/components/snackbar/components/snackbar-action-button/index.tsx","../../../src/components/snackbar/components/snackbar-description/snackbar-description.styles.ts","../../../src/components/snackbar/components/snackbar-description/index.tsx","../../../src/components/snackbar/components/snackbar-icon/index.tsx","../../../src/components/snackbar/components/snackbar-title/snackbar-title.styles.ts","../../../src/components/snackbar/components/snackbar-title/index.tsx","../../../src/components/snackbar/components/snackbar-content/snackbar-content.styles.ts","../../../src/components/snackbar/components/snackbar-content/index.tsx","../../../src/components/snackbar/components/snackbar-footer/snackbar-footer.styles.ts","../../../src/components/snackbar/components/snackbar-footer/index.tsx","../../../src/components/snackbar/components/snackbar-timebar/index.tsx","../../../src/components/snackbar/components/snackbar-timebar/snackbar-timebar.styles.ts","../../../src/components/snackbar/snackbar.styles.ts","../../../src/components/tag/tag.tsx","../../../src/components/tag/components/tag-icon/index.tsx","../../../src/components/tag/components/tag-label/tag-label.styles.ts","../../../src/components/tag/components/tag-label/index.tsx","../../../src/components/tag/tag.styles.ts","../../../src/components/card-informative/card-informative.tsx","../../../src/components/card-informative/card-informative.styles.ts","../../../src/components/card-informative/components/card-informative-content/index.tsx","../../../src/components/card-informative/components/card-informative-title/card-informative-title.styles.ts","../../../src/components/card-informative/components/card-informative-title/index.tsx","../../../src/components/card-informative/components/card-informative-content/card-informative-content.styles.ts","../../../src/components/card-informative/components/card-informative-description/card-informative-description.styles.ts","../../../src/components/card-informative/components/card-informative-description/index.tsx","../../../src/components/card-informative/components/card-informative-icon/index.tsx","../../../src/components/card-informative/components/card-informative-icon/card-informative-icon.styles.ts","../../../src/components/stepper/stepper.tsx","../../../src/components/content/content.tsx","../../../src/components/content/components/content-actions/content-actions.styles.ts","../../../src/components/content/components/content-actions/index.tsx","../../../src/components/content/components/content-actions-text/content-actions-text-styles.ts","../../../src/components/content/components/content-actions-text/index.tsx","../../../src/components/content/components/content-icon/index.tsx","../../../src/components/content/components/content-link/index.tsx","../../../src/components/content/components/content-subtitle/content-subtitlte.styles.ts","../../../src/components/content/components/content-subtitle/index.tsx","../../../src/components/content/components/content-title/content-titlte.styles.ts","../../../src/components/content/components/content-title/index.tsx","../../../src/components/content/content.styles.ts","../../../src/components/card-category/card-category.tsx","../../../src/components/card-category/card-category.styles.ts","../../../src/components/card-category/components/icon/index.tsx","../../../src/components/card-category/components/label/index.tsx","../../../src/components/input-multi-select/utils/render-composition-children.tsx","../../../src/components/input-multi-select/components/input-multi-select-actions/index.styles.ts","../../../src/components/input-multi-select/components/input-multi-select-actions/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-clear-button/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-clear-button/index.styles.ts","../../../src/components/input-multi-select/components/input-multi-select-field/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-field/index.styles.ts","../../../src/components/input-multi-select/components/input-multi-select-helpertext/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-helpertext/index.styles.ts","../../../src/components/input-multi-select/components/input-multi-select-icon/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-label/index.styles.ts","../../../src/components/input-multi-select/components/input-multi-select-label/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-quantity/index.tsx","../../../src/components/input-multi-select/components/input-multi-select-quantity/index.styles.ts","../../../src/components/input-multi-select/input-multi-select.tsx","../../../src/components/input-multi-select/components/input-multi-select-dropdown/index.tsx","../../../src/components/input-multi-select/input-multi-select.styles.tsx","../../../src/components/select/hook/use-select.ts","../../../src/components/select/components/select-field/index.styles.ts","../../../src/components/select/components/select-field-container/index.styles.ts","../../../src/components/select/components/select-field-container/index.tsx","../../../src/components/select/components/select-helper-text/index.tsx","../../../src/components/select/components/select-helper-text/index.styles.ts","../../../src/components/select/components/select-icon/index.tsx","../../../src/components/select/components/select-label/index.styles.ts","../../../src/components/select/components/select-label/index.tsx"],"sourcesContent":["export { Select } from './select'\nexport type { SelectProps } from './select.types'\n","import { type Scope, createContextScope } from '@radix-ui/react-context'\nimport { SelectActions } from './components/select-actions'\nimport { SelectField } from './components/select-field'\nimport { SelectFieldContainer } from './components/select-field-container'\nimport { SelectHelperText } from './components/select-helper-text'\nimport { SelectIcon } from './components/select-icon'\nimport { SelectLabel } from './components/select-label'\nimport { useSelect } from './hook/use-select'\nimport type {\n SelectContext,\n SelectProps,\n SelectScopedProps,\n} from './select.types'\n\nconst DISPLAY_NAME = 'Select'\n\nconst SelectRoot = (props: SelectScopedProps<SelectProps>) => {\n const {\n size = 'md',\n hasError = false,\n disabled = false,\n __scopeInputSelect,\n options,\n children,\n placeholder,\n } = props\n\n const { selectedOption } = useSelect()\n\n return (\n <SelectProvider\n {...props}\n size={size}\n scope={__scopeInputSelect}\n hasError={hasError}\n disabled={disabled}\n options={options}\n value={selectedOption?.value}\n placeholder={placeholder}\n >\n <div className=\"size-${size} min-w-[5rem] flex-1 flex-shrink-0 flex-col items-start gap-halfpulse rounded-none border-none bg-transparent p-none font-rdmodern text-align-center opacity-opaque\">\n {children}\n </div>\n </SelectProvider>\n )\n}\n\nSelectRoot.displayName = DISPLAY_NAME\n\n/*\n----------------------------------------------------------------\nScope Definition\n----------------------------------------------------------------\n*/\n\nconst [createInputSelectContext] = createContextScope(DISPLAY_NAME)\n\nexport const [SelectProvider, useSelectContext]: readonly [\n ProviderType<SelectContext>,\n (consumerName: string, scope: Scope) => SelectContext,\n] = createInputSelectContext<SelectContext>(DISPLAY_NAME)\n\n/*\n----------------------------------------------------------------\nComposition Export\n----------------------------------------------------------------\n*/\n\nexport const Select = {\n Root: SelectRoot,\n Label: SelectLabel,\n FieldContainer: SelectFieldContainer,\n Icon: SelectIcon,\n Field: SelectField,\n Actions: SelectActions,\n HelperText: SelectHelperText,\n}\n","import type React from 'react'\nimport type { SelectActionsProps } from '../../select.types'\n\nexport const SelectActions: React.FC<SelectActionsProps> = ({ children }) => {\n return (\n <div className=\"input-select-actions\" data-testid=\"input-name-actions\">\n {children}\n </div>\n )\n}\n","import { forwardRef, useEffect, useRef, useState } from 'react'\nimport type { ContentProps } from '~/components/option-menu/components/item'\nimport { OptionMenu } from '~/index'\nimport { useSelect } from '../../hook/use-select'\nimport { Select, useSelectContext } from '../../select'\nimport type { SelectFieldProps, SelectScopedProps } from '../../select.types'\nimport { selectFieldVariants } from './index.styles'\n\nexport const SelectField = forwardRef<HTMLDivElement, SelectFieldProps>(\n ({\n children,\n __scopeInputSelect,\n onChangeSelectionValue,\n value,\n optionMaxHeight,\n ...props\n }: SelectScopedProps<SelectFieldProps>) => {\n const {\n size,\n hasError,\n disabled,\n readOnly,\n placeholder,\n options = [],\n } = useSelectContext('InputSelectField', __scopeInputSelect)\n const [isOpen, setIsOpen] = useState(false)\n const { setSelectedOption, selectedOption } = useSelect()\n const wrapperRef = useRef<HTMLDivElement>(null)\n\n const initOption: ContentProps = {\n label: placeholder ?? 'Selecione...',\n value: '',\n }\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: <explanation>\n useEffect(() => {\n if (value) {\n const selected = options.find(option => option.value === value)\n return setSelectedOption(selected)\n }\n\n return setSelectedOption(initOption)\n }, [value])\n\n useEffect(() => {\n function handleClickOutside(event: MouseEvent) {\n if (\n wrapperRef.current &&\n !wrapperRef.current.contains(event.target as Node)\n ) {\n setIsOpen(false)\n }\n }\n document.addEventListener('mousedown', handleClickOutside)\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n }\n }, [])\n\n const useSelectedOption = (option: ContentProps) => {\n setSelectedOption(option)\n setIsOpen(false)\n onChangeSelectionValue?.(option.value)\n }\n\n const useOpenMenu = () => {\n if (!disabled && !readOnly) {\n setIsOpen(!isOpen)\n }\n }\n\n const dataAttributes = () => {\n const data = Object.keys(props).reduce(\n (acc, key) => {\n if (key.startsWith('data-')) {\n acc[key] = (props as Record<string, string>)[key]\n }\n return acc\n },\n {} as Record<string, string>\n )\n return data\n }\n\n return (\n <div ref={wrapperRef} className=\"relative flex w-full flex-col\">\n <div\n {...dataAttributes()}\n className={selectFieldVariants({\n size,\n hasError,\n readOnly,\n disabled,\n ...props,\n })}\n onClick={() => useOpenMenu()}\n onKeyUp={() => useOpenMenu()}\n data-testid=\"select-field\"\n >\n {selectedOption ? selectedOption.label : initOption.label}\n\n <Select.Icon\n symbol={isOpen ? 'rdicon-chevron-up' : 'rdicon-chevron-down'}\n color={\n disabled\n ? 'colorTextNeutralDisabled'\n : readOnly\n ? 'colorTextNeutralReadonly'\n : 'colorTextNeutralDefault'\n }\n />\n </div>\n {isOpen && (\n <div\n className=\"x-full absolute top-full left-0 z-10 w-full py-fivepulse\"\n data-testid=\"select-option-menu\"\n >\n <OptionMenu.Root type=\"single\" {...props}>\n <OptionMenu.List maxHeight={optionMaxHeight}>\n {options?.map((content, index) => (\n <OptionMenu.Item\n key={`${content.label}-${index}`}\n content={content}\n onPress={() => useSelectedOption(content)}\n disabled={disabled}\n data-testid=\"select-item\"\n />\n ))}\n </OptionMenu.List>\n </OptionMenu.Root>\n </div>\n )}\n </div>\n )\n }\n)\n\nSelectField.displayName = 'InputSelectField'\n","import { forwardRef } from 'react'\n\nimport { type Scope, createContextScope } from '@radix-ui/react-context'\n\nimport type { ButtonProps } from './button.types'\n\nimport { buttonVariants } from './button.styles'\n\nimport { ButtonIcon } from './components/button-icon'\nimport { ButtonRefresh } from './components/button-refresh'\n\nimport { isIconOnly } from './utils/is-icon-only'\n\ntype ButtonContext = Pick<ButtonProps, 'variant' | 'size' | 'disabled'>\n\nconst DISPLAY_NAME = 'Button'\n\nconst ButtonRoot = forwardRef<HTMLButtonElement, ButtonProps>(\n (props: ScopedProps<ButtonProps>, ref) => {\n const {\n children,\n variant = 'brand-primary',\n size = 'ml',\n loading = false,\n disabled = false,\n full,\n className,\n __scopeButton,\n } = props\n\n const isDisabled = loading || disabled\n\n return (\n <ButtonProvider\n scope={__scopeButton}\n variant={variant}\n size={size}\n disabled={disabled}\n >\n <button\n {...props}\n ref={ref}\n className={buttonVariants({\n variant,\n size,\n disabled,\n full,\n className,\n asIconOnly: isIconOnly(children),\n })}\n disabled={isDisabled}\n aria-disabled={disabled}\n >\n {loading ? <ButtonRefresh /> : children}\n </button>\n </ButtonProvider>\n )\n }\n)\n\nButtonRoot.displayName = DISPLAY_NAME\n\n/*\n----------------------------------------------------------------\nScope Definition\n----------------------------------------------------------------\n*/\n\nexport type ScopedProps<P> = P & {\n __scopeButton?: Scope\n}\n\nconst [createButtonContext] = createContextScope(DISPLAY_NAME)\n\nexport const [ButtonProvider, useButtonContext]: readonly [\n ProviderType<ButtonContext>,\n (consumerName: string, scope: Scope) => ButtonContext,\n] = createButtonContext<ButtonContext>(DISPLAY_NAME)\n\n/*\n----------------------------------------------------------------\nComposition Export\n----------------------------------------------------------------\n*/\n\nexport const Button = {\n Root: ButtonRoot,\n Icon: ButtonIcon,\n}\n","import { type VariantProps, createTV } from 'tailwind-variants'\n\nexport const tv = createTV({\n twMergeConfig: {\n extend: {\n classGroups: {\n 'font-size': [\n {\n text: ['threepulse', 'threeandhalfpulse'],\n },\n ],\n 'border-width': [\n {\n border: ['quarterpulse', 'halfpulse'],\n },\n ],\n '--tw-ring-inset': [\n {\n ring: ['none', 'quarterpulse', 'halfpulse'],\n },\n ],\n },\n },\n },\n})\n\nexport type { VariantProps }\n","import { tv } from '~/utils/tv'\n\nexport const buttonVariants = tv({\n base: `\n tracking inline-flex items-center justify-center gap-twopulse rounded-pill\n border-quarterpulse border-[transparent] font-bold font-rdmodern text-threeandhalfpulse truncate`,\n variants: {\n variant: {\n 'brand-primary': `bg-action-fill-brand-primary-enabled text-text-neutral-inverse\n enabled:active:bg-action-fill-brand-primary-pressed enabled:hover:bg-action-fill-brand-primary-hovered`,\n 'neutral-secondary': `border-action-border-neutral-secondary-enabled bg-action-fill-neutral-secondary-enabled text-text-neutral\n enabled:active:border-action-border-neutral-secondary-pressed enabled:active:bg-action-fill-neutral-secondary-pressed enabled:hover:bg-action-fill-neutral-secondary-hovered`,\n 'neutral-tertiary': `border-action-border-neutral-tertiary-enabled bg-action-fill-neutral-tertiary-enabled text-text-neutral\n enabled:active:bg-action-fill-neutral-tertiary-pressed enabled:hover:bg-action-fill-neutral-tertiary-hovered`,\n },\n size: {\n md: 'h-medium min-w-medium px-fourpulse text-threepulse leading-medium',\n ml: 'h-mediumlarge min-w-mediumlarge px-fourpulse leading-small',\n lg: 'h-large min-w-large px-fivepulse leading-small',\n xl: 'h-extralarge min-w-extralarge px-sixpulse leading-small',\n },\n disabled: {\n true: 'cursor-not-allowed text-text-neutral-disabled outline-none',\n false:\n 'outline-action-border-focused outline-offset-4 focus-visible:outline-1',\n },\n full: {\n true: 'w-full',\n },\n asIconOnly: {\n true: 'aspect-square px-none',\n },\n },\n compoundVariants: [\n {\n variant: 'brand-primary',\n disabled: true,\n class:\n 'border-action-border-brand-primary-disabled bg-action-fill-brand-primary-disabled',\n },\n {\n variant: 'neutral-secondary',\n disabled: true,\n class:\n 'border-action-border-neutral-secondary-disabled bg-action-fill-neutral-secondary-disabled',\n },\n {\n variant: 'neutral-tertiary',\n disabled: true,\n class:\n 'border-action-fill-neutral-tertiary-disabled bg-action-fill-neutral-tertiary-enabled',\n },\n ],\n\n defaultVariants: {\n variant: 'brand-primary',\n size: 'ml',\n },\n})\n","import {\n DROGASIL_TOKENS,\n GLOBALS_TOKENS,\n PRIME_TOKENS,\n RAIA_TOKENS,\n RDSAUDESISTEMAS_TOKENS,\n SUBSCRIPTION_TOKENS,\n} from '@raiadrogasil/pulso-design-tokens'\n\nimport { useContext } from 'react'\n\nimport { ThemeContext } from '~/components/theme-provider/theme-provider'\n\nexport function useTheme() {\n const { currentTheme } = useContext(ThemeContext)\n\n const themes = {\n rdsaudesistemas: RDSAUDESISTEMAS_TOKENS,\n drogasil: DROGASIL_TOKENS,\n raia: RAIA_TOKENS,\n subscription: SUBSCRIPTION_TOKENS,\n prime: PRIME_TOKENS,\n }\n\n return {\n ...themes[currentTheme],\n ...GLOBALS_TOKENS,\n }\n}\n","import { createContext, useEffect } from 'react'\n\nimport type { Themes } from '@raiadrogasil/pulso-design-tokens'\n\ntype TThemeContextData = {\n currentTheme: Themes\n}\n\ninterface IThemeProviderProps {\n children: React.ReactNode\n theme: Themes\n}\n\nexport const ThemeContext = createContext({} as TThemeContextData)\n\nexport function ThemeProvider({ children, theme }: IThemeProviderProps) {\n useEffect(() => {\n if (theme && document) {\n document?.documentElement?.classList?.add(theme)\n }\n\n return () => {\n document?.documentElement?.classList?.remove(theme)\n }\n }, [theme])\n\n return (\n <ThemeContext.Provider\n value={{\n currentTheme: theme,\n }}\n >\n {children}\n </ThemeContext.Provider>\n )\n}\n","import type { TIconColors } from '../icon.types'\n\nimport { useTheme } from '~/hooks/use-theme'\n\nexport function getColorIcon(color: keyof TIconColors) {\n const theme = useTheme()\n const allTokens = Object.keys(theme)\n\n const colorTokens = allTokens.reduce((acc, tokenKey) => {\n if (tokenKey.includes('color')) {\n const colorToken = tokenKey as keyof TIconColors\n acc[colorToken] = theme[colorToken]\n }\n\n return acc\n }, {} as TIconColors)\n\n return colorTokens[color]\n}\n","export const getIconSize = {\n tiny: 'var(--sizing-tiny)',\n 'extra-small': 'var(--sizing-extrasmall)',\n small: 'var(--sizing-small)',\n medium: 'var(--sizing-medium)',\n}\n","import type { TIconProps } from './icon.types'\n\nimport { getColorIcon } from './utils/get-icon-color'\nimport { getIconSize } from './utils/get-icon-size'\n\nexport function Icon({\n symbol = 'rdicon-default',\n size = 'small',\n color = 'colorActionFillBrandPrimaryEnabled',\n ...props\n}: TIconProps) {\n const symbolName = symbol.replace('rdicon', '').trim()\n\n return (\n <i\n {...props}\n title={symbolName}\n className={symbol}\n style={{\n fontSize: getIconSize[size],\n color: getColorIcon(color),\n }}\n />\n )\n}\n\nexport type { TIconProps }\n","import { type ScopedProps, useButtonContext } from '../button'\nimport type { ButtonSizes, ButtonVariants } from '../button.types'\n\nimport { Icon, type TIconProps } from '~/components/icon'\n\ntype ButtonIconProps = Pick<TIconProps, 'symbol'>\n\nexport function ButtonIcon(props: ButtonIconProps) {\n const { __scopeButton, ...rest } = props as ScopedProps<ButtonIconProps>\n\n const { variant, size, disabled } = useButtonContext(\n 'ButtonIcon',\n __scopeButton\n )\n\n const iconColorMapper: Record<ButtonVariants, TIconProps['color']> = {\n 'brand-primary': 'colorTextNeutralInverse',\n 'neutral-secondary': 'colorTextNeutralDefault',\n 'neutral-tertiary': 'colorTextNeutralDefault',\n } as const\n\n const iconSizeMapper: Record<ButtonSizes, TIconProps['size']> = {\n md: 'extra-small',\n ml: 'small',\n lg: 'small',\n xl: 'small',\n } as const\n\n return (\n <Icon\n {...rest}\n color={disabled ? 'colorTextNeutralDisabled' : iconColorMapper[variant!]}\n size={iconSizeMapper[size!]}\n />\n )\n}\n","import { useTheme } from '~/hooks/use-theme'\n\nimport type { TRefreshColor } from '../refresh.types'\n\nexport function getRefreshColor(color: TRefreshColor) {\n const theme = useTheme()\n\n const colors = {\n brand: theme.colorActionFillBrandPrimaryEnabled,\n neutral: theme.colorTextNeutralReadonly,\n black: theme.colorTextNeutralDefault,\n white: theme.colorTextNeutralInverse,\n } as Record<TRefreshColor, string>\n\n return colors[color]\n}\n","import type { TRefreshProps } from './refresh.types'\n\nimport { getRefreshColor } from './utils/get-refresh-color'\n\nexport function Refresh({ color = 'brand', srText }: TRefreshProps) {\n return (\n <div\n role=\"status\"\n className=\"grid size-eightpulse place-items-center\"\n aria-label={srText}\n >\n <svg className=\"size-sixpulse animate-spin fill-none\" viewBox=\"0 0 24 24\">\n <path\n fillRule=\"evenodd\"\n d=\"M0 12c0 6.627 5.373 12 12 12s12-5.373 12-12S18.627 0 12 0v2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12H0z\"\n clipRule=\"evenodd\"\n fill={getRefreshColor(color)}\n />\n\n <title>{srText}</title>\n </svg>\n </div>\n )\n}\n\nexport type { TRefreshProps }\n","import { type ScopedProps, useButtonContext } from '../button'\n\nimport { Refresh, type TRefreshProps } from '~/components/refresh'\nimport type { ButtonVariants } from '../button.types'\n\ntype ButtonRefreshProps = Pick<TRefreshProps, 'srText'>\n\nexport function ButtonRefresh(props: ButtonRefreshProps) {\n const { __scopeButton, ...rest } = props as ScopedProps<ButtonRefreshProps>\n\n const { variant } = useButtonContext('ButtonRefresh', __scopeButton)\n\n const refreshColorMapper = {\n 'brand-primary': 'white',\n 'neutral-secondary': 'neutral',\n 'neutral-tertiary': 'black',\n } as Record<ButtonVariants, TRefreshProps['color']>\n\n return <Refresh {...rest} color={refreshColorMapper[variant!]} />\n}\n","import React from 'react'\n\nimport { ButtonIcon } from '../components/button-icon'\n\nexport function isIconOnly(children: React.ReactNode) {\n if (React.Children.count(children) === 1 && React.isValidElement(children)) {\n return children.type === ButtonIcon\n }\n\n return false\n}\n","import type { IconName } from '@raiadrogasil/pulso-icons'\nimport { Children, cloneElement, forwardRef, isValidElement } from 'react'\nimport { Icon } from '~/components/icon'\nimport {\n actionsContainerVariants,\n actionsVariants,\n checkboxIconNoChildrenVariants,\n checkboxIconVariants,\n checkboxVariants,\n helperTextNoChildrenVariants,\n helperTextVariants,\n noChildrenVariants,\n parentVariants,\n} from './checkbox.styles'\nimport { CheckboxLabel } from './components/checkbox-label'\nimport { CheckboxHelperText } from './components/helper-text'\nimport type { TCheckboxProps, TCheckboxSizes } from './types'\n\nconst DISPLAY_NAME = 'Checkbox'\n\nconst mapSizeToIconSize = (size: TCheckboxSizes) => {\n const sizeMap: Record<\n TCheckboxSizes,\n 'tiny' | 'extra-small' | 'small' | 'medium'\n > = {\n md: 'tiny',\n ml: 'small',\n lg: 'medium',\n xl: 'medium',\n }\n\n return sizeMap[size] || 'medium'\n}\n\nconst CheckboxIconCheck = ({\n symbol,\n size = 'md',\n disabled,\n readonly,\n hasLabelText,\n}: {\n symbol: IconName\n size?: TCheckboxProps['size']\n disabled?: boolean\n readonly?: boolean\n hasLabelText?: boolean\n}) => {\n const iconSize = mapSizeToIconSize(size)\n\n const iconClasses = hasLabelText\n ? checkboxIconVariants({ size })\n : checkboxIconNoChildrenVariants({ size })\n\n const iconColor = disabled\n ? 'colorTextNeutralDisabled'\n : readonly\n ? 'colorTextNeutralReadonly'\n : 'colorTextNeutralDefault'\n\n return (\n <div className={iconClasses}>\n <Icon symbol={symbol} size={iconSize} color={iconColor} />\n </div>\n )\n}\n\nconst CheckboxActions = ({\n children,\n size,\n disabled,\n readonly,\n error,\n}: {\n children: React.ReactNode\n size?: TCheckboxProps['size']\n disabled?: boolean\n readonly?: boolean\n error?: boolean\n}) => {\n const hasChildren = Boolean(\n Children.toArray(children).find(\n child =>\n isValidElement(child) &&\n child.type === CheckboxLabel &&\n child.props.children\n )\n )\n\n const containerClassName = hasChildren\n ? actionsContainerVariants({\n size,\n hasDisabled: disabled,\n hasReadonly: readonly,\n hasError: !!error,\n })\n : noChildrenVariants({\n size,\n hasDisabled: disabled,\n hasReadonly: readonly,\n hasError: !!error,\n })\n\n return (\n <div\n className={actionsVariants({\n size,\n hasError: !!error,\n })}\n >\n <div className={containerClassName}>{children}</div>\n </div>\n )\n}\n\nconst CheckboxRoot = forwardRef<HTMLDivElement, TCheckboxProps>(\n (props, ref) => {\n const {\n size = 'md',\n checked = false,\n indeterminate = false,\n onClick,\n error,\n disabled,\n readonly,\n children,\n feedbackMessage,\n hasFeedbackMessage = true,\n icon,\n ...rest\n } = props\n\n const currentStateSymbol: IconName = indeterminate\n ? 'rdicon-checkbox-indeterminate'\n : checked\n ? 'rdicon-checkbox-checked'\n : 'rdicon-checkbox-unchecked'\n\n const handleClick = (e: React.MouseEvent) => {\n e.stopPropagation()\n\n if (!(disabled || readonly) && typeof onClick === 'function') {\n onClick(!checked)\n }\n }\n\n const renderInternalLabel = Children.toArray(children).find(\n child => isValidElement(child) && child.type === CheckboxLabel\n ) as React.ReactElement | undefined\n\n const renderInternalHelperText = Children.toArray(children).find(\n child => isValidElement(child) && child.type === CheckboxHelperText\n ) as React.ReactElement | undefined\n\n const renderParent = Children.toArray(children).find(\n child => isValidElement(child) && child.type === CheckboxParent\n ) as React.ReactElement | undefined\n\n const filteredProps = rest as TCheckboxProps\n const { feedbackMessage: _, ...propsForDom } = filteredProps\n\n const shouldDisplayFeedback =\n error || (hasFeedbackMessage && feedbackMessage)\n\n return (\n <div\n ref={ref}\n {...propsForDom}\n role=\"checkbox\"\n aria-checked={checked || indeterminate}\n aria-disabled={disabled || readonly}\n onClick={handleClick}\n className={checkboxVariants({\n size,\n hasError: !!error,\n hasDisabled: !!disabled,\n hasReadonly: !!readonly,\n })}\n >\n <CheckboxActions\n size={size}\n disabled={disabled}\n readonly={readonly}\n error={error}\n >\n <CheckboxIconCheck\n symbol={currentStateSymbol}\n size={size}\n disabled={disabled}\n readonly={readonly}\n hasLabelText={!!renderInternalLabel?.props.children}\n />\n {renderInternalLabel &&\n cloneElement(renderInternalLabel, {\n size,\n disabled: disabled,\n readonly: readonly,\n error,\n })}\n </CheckboxActions>\n {(renderInternalHelperText || shouldDisplayFeedback) && (\n <div\n className={\n renderInternalHelperText?.props.children || shouldDisplayFeedback\n ? helperTextVariants({ size, hasError: !!error })\n : helperTextNoChildrenVariants({ size, hasError: !!error })\n }\n >\n {cloneElement(\n renderInternalHelperText || (\n <CheckboxHelperText\n icon={error ? 'rdicon-warning-circle' : icon}\n isError={error}\n >\n {feedbackMessage}\n </CheckboxHelperText>\n ),\n { size }\n )}\n </div>\n )}\n {renderParent &&\n cloneElement(renderParent, {\n size,\n disabled: disabled || readonly,\n error,\n })}\n </div>\n )\n }\n)\n\nconst CheckboxParent = ({\n children,\n size = 'md',\n}: {\n children: React.ReactNode\n size?: TCheckboxProps['size']\n}) => <div className={parentVariants({ size })}>{children}</div>\n\nCheckboxRoot.displayName = DISPLAY_NAME\n\nexport const Checkbox = {\n Root: CheckboxRoot,\n Label: CheckboxLabel,\n HelperText: CheckboxHelperText,\n Parent: CheckboxParent,\n Actions: CheckboxActions,\n IconCheck: CheckboxIconCheck,\n}\n","import { tv } from '~/utils/tv'\n\nexport const checkboxVariants = tv({\n base: 'flex flex-col items-start justify-center gap-none rounded-pill font-rdmodern',\n variants: {\n size: {\n md: '',\n ml: '',\n lg: '',\n xl: '',\n },\n hasError: {\n true: 'h-full',\n false: '',\n },\n hasReadonly: {\n true: 'border-action-border-neutral-tertiary-readonly border-none bg-action-fill-neutral-tertiary-readonly',\n false: '',\n },\n hasDisabled: {\n true: 'border-none bg-action-fill-neutral-tertiary-disabled',\n false: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const checkboxIconVariants = tv({\n base: 'flex items-center justify-center',\n variants: {\n size: {\n md: 'pr-onepulse',\n ml: 'pr-twopulse',\n lg: 'pr-twopulse',\n xl: 'pr-twopulse',\n },\n },\n defaultVariants: {\n size: 'md',\n hasLabelText: true,\n },\n})\n\nexport const checkboxIconNoChildrenVariants = tv({\n base: 'flex items-center justify-center',\n variants: {\n size: {\n md: 'h-tiny w-tiny pr-none',\n ml: 'h-small w-small pr-none',\n lg: 'h-medium w-medium pr-none',\n xl: 'h-medium w-medium pr-none',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const actionsVariants = tv({\n base: `mb-twopulse flex cursor-pointer items-center justify-center rounded-pill \n p-halfpulse text-text-neutral focus:border-halfpulse focus:bg-action-fill-neutral-tertiary-enabled`,\n variants: {\n size: {\n md: '',\n ml: '',\n lg: '',\n xl: '',\n },\n hasError: {\n true: 'border-forms-border-error border-halfpulse focus:border-forms-border-error',\n false: `hover:border-action-border-neutral-tertiary-hovered focus:border-action-border-focused\n active:bg-action-fill-neutral-tertiary-pressed active:border-action-border-neutral-tertiary-pressed`,\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const actionsContainerVariants = tv({\n base: `flex bg-action-fill-neutral-tertiary-enabled rounded-pill min-w-[128px] border-action-border-neutral-tertiary-enabled\n hover:bg-action-fill-neutral-tertiary-hovered hover:border-action-fill-neutral-tertiary-hovered\n active:outline-none active:border-action-border-neutral-tertiary-pressed\n `,\n variants: {\n size: {\n md: 'min-h-medium px-fourpulse py-onepulse',\n ml: 'min-h-mediumlarge px-fourpulse py-twopulse',\n lg: 'min-h-large px-fivepulse py-twopulse',\n xl: 'min-h-extralarge px-sixpulse py-threepulse',\n },\n hasReadonly: {\n true: `border-action-border-neutral-tertiary-readonly border-none bg-action-fill-neutral-tertiary-readonly text-text-neutral-readonly\n hover:bg-action-fill-neutral-tertiary-readonly active:bg-action-fill-neutral-tertiary-readonly`,\n },\n hasDisabled: {\n true: `border-action-border-neutral-tertiary-disabled border-none bg-action-fill-neutral-tertiary-disabled text-text-neutral-disabled\n hover:bg-action-fill-neutral-tertiary-disabled active:bg-action-fill-neutral-tertiary-disabled`,\n },\n hasError: {\n true: 'h-full',\n false: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const noChildrenVariants = tv({\n base: `w-full flex bg-action-fill-neutral-tertiary-enabled rounded-pill\n focus:border-action-border-neutral-focused focus:border-halfpulse\n hover:bg-action-fill-neutral-tertiary-hovered\n active:bg-action-fill-neutral-tertiary-pressed active:border-action-border-neutral-tertiary-pressed`,\n variants: {\n size: {\n md: 'p-twopulse',\n ml: 'p-twopulse',\n lg: 'p-twopulse',\n xl: 'p-threepulse',\n },\n hasReadonly: {\n true: `border-action-border-neutral-tertiary-readonly border-none bg-action-fill-neutral-tertiary-readonly text-text-neutral-readonly\n hover:bg-action-fill-neutral-tertiary-readonly active:bg-action-fill-neutral-tertiary-readonly`,\n },\n hasDisabled: {\n true: `border-action-border-neutral-tertiary-disabled border-none bg-action-fill-neutral-tertiary-disabled text-text-neutral-disabled\n hover:bg-action-fill-neutral-tertiary-disabled active:bg-action-fill-neutral-tertiary-disabled`,\n },\n hasError: {\n true: 'h-full',\n false: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const helperTextVariants = tv({\n base: 'ml-halfpulse flex items-center bg-transparent',\n variants: {\n size: {\n md: 'px-fourpulse',\n ml: 'px-fourpulse',\n lg: 'px-fivepulse',\n xl: 'px-sixpulse',\n },\n hasError: {\n true: 'font-semibold text-threepulse leading-medium tracking-tiny',\n false: 'font-semibold text-threepulse leading-medium tracking-tiny',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const helperTextNoChildrenVariants = tv({\n base: 'flex items-center bg-transparent',\n variants: {\n size: {\n md: 'px-threepulse',\n ml: 'px-fourpulse',\n lg: 'px-fivepulse',\n xl: 'px-sixpulse',\n },\n hasError: {\n true: 'font-semibold text-text-danger-alternative text-threepulse leading-medium tracking-tiny',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n\nexport const parentVariants = tv({\n base: 'flex flex-col pl-eightpulse',\n variants: {\n size: {\n md: '',\n ml: '',\n lg: '',\n xl: '',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\n","import { tv } from '~/utils/tv'\n\nexport const checkboxLabelVariants = tv({\n base: 'line-clamp-4 min-h-small overflow-hidden text-left font-family-modern font-regular text-neutral-default',\n variants: {\n size: {\n md: 'pt-halfpulse text-threepulse leading-medium',\n ml: 'pt-halfpulse text-threeandhalfpulse leading-small',\n