UNPKG

@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 12 kB
{"version":3,"sources":["../../../src/components/toast/index.ts","../../../src/components/toast/toast.tsx","../../../src/utils/tv.ts","../../../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/icon/index.tsx","../../../src/hooks/use-theme.ts","../../../src/components/theme-provider/index.tsx","../../../src/components/toast/toast.styles.ts"],"sourcesContent":["export { Toast } from './toast'\nexport type { ToastProps } from './toast.types'\n","import { type Scope, createContextScope } from '@radix-ui/react-context'\n\nimport { forwardRef } from 'react'\nimport { ToastDescription } from './toast-description'\nimport { ToastIcon } from './toast-icon'\nimport { ToastRootVariants } from './toast.styles'\nimport type { ToastContext, ToastProps, ToastScopedProps } from './toast.types'\n\nexport const DISPLAY_NAME = 'Toast'\n\ntype ToastRootProps = ToastProps & {\n children: React.ReactNode\n}\n\nconst ToastRoot = forwardRef<HTMLDivElement, ToastRootProps>((props, ref) => {\n const { type, children, __scopeToast, ...rest } =\n props as ToastScopedProps<ToastRootProps>\n\n return (\n <ToastProvider type={type} scope={__scopeToast} {...rest}>\n <div\n data-testid=\"toast-root\"\n className={ToastRootVariants({ type })}\n ref={ref}\n >\n {children}\n </div>\n </ToastProvider>\n )\n})\n\nconst [createToastContext] = createContextScope(DISPLAY_NAME)\n\nexport const [ToastProvider, useToastContext]: readonly [\n ProviderType<ToastContext>,\n (consumerName: string, scope: Scope) => ToastContext,\n] = createToastContext<ToastContext>(DISPLAY_NAME)\n\n/*\n----------------------------------------------------------------\nComposition Export\n----------------------------------------------------------------\n*/\n\nexport const Toast = {\n Root: ToastRoot,\n Icon: ToastIcon,\n Description: ToastDescription,\n}\n","import { type VariantProps, createTV } from 'tailwind-variants'\n\nexport const tv = createTV({\n twMerge: true,\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 ToastDescriptionVariants = tv({\n base: `\n text-text-neutral !font-rdmodern font-regular text-threeandhalfpulse\n leading-small truncate\n `,\n variants: {},\n})\n","import { ToastDescriptionVariants } from './toast-description.styles'\n\ntype ToastDescriptionProps = {\n children: React.ReactNode\n}\nexport const ToastDescription = (props: ToastDescriptionProps) => {\n const { children } = props\n\n return (\n <span\n className={ToastDescriptionVariants()}\n data-testid=\"toast-description\"\n aria-label={`${children?.toString()}`}\n >\n {children}\n </span>\n )\n}\n","import { useCallback } from 'react'\nimport { Icon, type TIconProps } from '~/components/icon'\nimport { DISPLAY_NAME, useToastContext } from '../toast'\nimport type { ToastScopedProps } from '../toast.types'\n\ntype ToastIconProps = TIconProps & {\n testID?: string\n}\n\nexport const ToastIcon = (props: ToastIconProps) => {\n const { symbol, __scopeToast } = props as ToastScopedProps<ToastIconProps>\n\n const { type } = useToastContext(DISPLAY_NAME, __scopeToast)\n\n const mapper: Record<typeof type, TIconProps['color']> = {\n success: 'colorTextSuccessAlternative',\n informative: 'colorTextInformativeAlternative',\n warning: 'colorTextWarningAlternative',\n danger: 'colorTextDangerAlternative',\n neutral: 'colorTextNeutralDefault',\n }\n\n const mapVariantColor = useCallback((): TIconProps['color'] => {\n return mapper[type]\n }, [type])\n\n return (\n <Icon\n symbol={symbol}\n size=\"small\"\n color={mapVariantColor()}\n data-testid=\"toast-icon\"\n />\n )\n}\n","import * as React from 'react'\n\nimport type { RDSAUDESISTEMAS_TOKENS } from '@raiadrogasil/pulso-design-tokens'\nimport type { IconName } from '@raiadrogasil/pulso-icons'\n\nimport { useTheme } from '~/hooks/use-theme'\n\ntype IconVisualSize = 'tiny' | 'extra-small' | 'small' | 'medium'\ntype DesignTokens = typeof RDSAUDESISTEMAS_TOKENS\n\ntype TokenColorKeys = {\n [K in keyof DesignTokens as K extends `color${string}`\n ? K\n : never]: DesignTokens[K]\n}\n\n/**\n * Propriedades do componente Icon.\n */\nexport type IconProps = React.ComponentProps<'i'> & {\n /**\n * Define o ícone a ser exibido, com base na lista de nomes disponíveis em `@raiadrogasil/pulso-icons`.\n *\n * @default 'rdicon-default'\n */\n symbol?: IconName\n\n /**\n * Define o tamanho visual do ícone, controlando o `font-size` com base nos tokens de espaçamento.\n *\n * Valores possíveis: 'tiny', 'extra-small', 'small', 'medium'.\n *\n * @default 'small'\n */\n size?: IconVisualSize\n\n /**\n * Define a cor do ícone usando uma chave de token de cor do design system.\n * A cor é aplicada via `style.color`.\n *\n * @default 'colorActionFillBrandPrimaryEnabled'\n */\n color?: keyof TokenColorKeys\n}\n\nexport function Icon({\n symbol = 'rdicon-default',\n size = 'small',\n color = 'colorActionFillBrandPrimaryEnabled',\n ...props\n}: IconProps) {\n const theme = useTheme()\n\n const resolvedFontSizes = React.useMemo(() => {\n return {\n tiny: theme.sizingTiny,\n 'extra-small': theme.sizingExtrasmall,\n small: theme.sizingSmall,\n medium: theme.sizingMedium,\n }\n }, [])\n\n return (\n <i\n {...props}\n className={symbol}\n style={{\n fontSize: resolvedFontSizes[size],\n color: theme[color],\n display: 'inline-flex',\n }}\n />\n )\n}\n\nIcon.displayName = 'Icon'\n\nexport * from './deprecated'\n","import * as React from 'react'\n\nimport {\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 { ThemeContext } from '~/components/theme-provider'\n\ntype ThemeTokens = typeof RDSAUDESISTEMAS_TOKENS & typeof GLOBALS_TOKENS\n\nexport function useTheme(): ThemeTokens {\n const mappedTheme = React.useMemo(() => {\n return {\n rdsaudesistemas: RDSAUDESISTEMAS_TOKENS,\n drogasil: DROGASIL_TOKENS,\n raia: RAIA_TOKENS,\n subscription: SUBSCRIPTION_TOKENS,\n prime: PRIME_TOKENS,\n }\n }, [])\n\n const context = React.useContext(ThemeContext)\n\n if (!context) {\n throw new Error(\n '[Pulso] useTheme precisa estar dentro de um <ThemeProvider>. Verifique se o provedor está corretamente configurado na raiz da aplicação.'\n )\n }\n\n const { currentTheme } = context\n\n const result = {\n ...GLOBALS_TOKENS,\n ...mappedTheme[currentTheme],\n } as ThemeTokens\n\n return result\n}\n","import * as React from 'react'\n\nimport type { Themes } from '@raiadrogasil/pulso-design-tokens'\n\nexport const ThemeContext = React.createContext({\n currentTheme: 'rdsaudesistemas',\n} as {\n currentTheme: Themes\n})\n\ntype ThemeProviderProps = {\n children: React.ReactNode\n theme?: Themes\n}\n\nexport function ThemeProvider({\n children,\n theme = 'rdsaudesistemas',\n}: ThemeProviderProps) {\n if (typeof window !== 'undefined') {\n document.documentElement.setAttribute('class', theme)\n }\n\n return (\n <ThemeContext.Provider\n value={{\n currentTheme: theme,\n }}\n >\n {children}\n </ThemeContext.Provider>\n )\n}\n","import { tv } from '~/utils/tv'\n\nexport const ToastRootVariants = tv({\n base: `\n flex flex-row h-large min-w-[256px] max-w-[768px] items-center border-quarterpulse border-border-neutral rounded-pill\n px-fourpulse gap-twopulse\n `,\n variants: {\n type: {\n neutral: 'bg-fill-neutral-alternative ',\n informative: 'bg-fill-informative-alternative ',\n success: 'bg-fill-success-alternative ',\n warning: 'bg-fill-warning-alternative ',\n danger: 'bg-fill-danger-alternative ',\n },\n },\n})\n"],"mappings":"mjCAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,WAAAE,IAAA,eAAAC,EAAAH,GCAA,IAAAI,EAA+C,mCAE/CC,EAA2B,iBCF3B,IAAAC,EAA4C,6BAE/BC,KAAK,YAAS,CACzB,QAAS,GACT,cAAe,CACb,OAAQ,CACN,YAAa,CACX,YAAa,CACX,CACE,KAAM,CAAC,aAAc,mBAAmB,CAC1C,CACF,EACA,eAAgB,CACd,CACE,OAAQ,CAAC,eAAgB,WAAW,CACtC,CACF,EACA,kBAAmB,CACjB,CACE,KAAM,CAAC,OAAQ,eAAgB,WAAW,CAC5C,CACF,CACF,CACF,CACF,CACF,CAAC,ECvBM,IAAMC,EAA2BC,EAAG,CACzC,KAAM;AAAA;AAAA;AAAA,IAIN,SAAU,CAAC,CACb,CAAC,ECCG,IAAAC,EAAA,6BAJSC,EAAoBC,GAAiC,CAChE,GAAM,CAAE,SAAAC,CAAS,EAAID,EAErB,SACE,OAAC,QACC,UAAWE,EAAyB,EACpC,cAAY,oBACZ,aAAY,GAAGD,GAAA,YAAAA,EAAU,UAAU,GAElC,SAAAA,EACH,CAEJ,ECjBA,IAAAE,EAA4B,iBCA5B,IAAAC,EAAuB,sBCAvB,IAAAC,EAAuB,sBAEvBC,EAOO,6CCTP,IAAAC,EAAuB,sBAwBnBC,EAAA,6BApBSC,EAAqB,gBAAc,CAC9C,aAAc,iBAChB,CAEC,EDOM,SAASC,GAAwB,CACtC,IAAMC,EAAoB,UAAQ,KACzB,CACL,gBAAiB,yBACjB,SAAU,kBACV,KAAM,cACN,aAAc,sBACd,MAAO,cACT,GACC,CAAC,CAAC,EAECC,EAAgB,aAAWC,CAAY,EAE7C,GAAI,CAACD,EACH,MAAM,IAAI,MACR,mJACF,EAGF,GAAM,CAAE,aAAAE,CAAa,EAAIF,EAOzB,OALeG,IAAA,GACV,kBACAJ,EAAYG,CAAY,EAI/B,CDqBI,IAAAE,EAAA,6BAlBG,SAASC,EAAKC,EAKP,CALO,IAAAC,EAAAD,EACnB,QAAAE,EAAS,iBACT,KAAAC,EAAO,QACP,MAAAC,EAAQ,oCAhDV,EA6CqBH,EAIhBI,EAAAC,EAJgBL,EAIhB,CAHH,SACA,OACA,UAGA,IAAMM,EAAQC,EAAS,EAEjBC,EAA0B,UAAQ,KAC/B,CACL,KAAMF,EAAM,WACZ,cAAeA,EAAM,iBACrB,MAAOA,EAAM,YACb,OAAQA,EAAM,YAChB,GACC,CAAC,CAAC,EAEL,SACE,OAAC,IAAAG,EAAAC,EAAA,GACKN,GADL,CAEC,UAAWH,EACX,MAAO,CACL,SAAUO,EAAkBN,CAAI,EAChC,MAAOI,EAAMH,CAAK,EAClB,QAAS,aACX,GACF,CAEJ,CAEAL,EAAK,YAAc,ODhDf,IAAAa,EAAA,6BAlBSC,EAAaC,GAA0B,CAClD,GAAM,CAAE,OAAAC,EAAQ,aAAAC,CAAa,EAAIF,EAE3B,CAAE,KAAAG,CAAK,EAAIC,EAAgBC,EAAcH,CAAY,EAErDI,EAAmD,CACvD,QAAS,8BACT,YAAa,kCACb,QAAS,8BACT,OAAQ,6BACR,QAAS,yBACX,EAEMC,KAAkB,eAAY,IAC3BD,EAAOH,CAAI,EACjB,CAACA,CAAI,CAAC,EAET,SACE,OAACK,EAAA,CACC,OAAQP,EACR,KAAK,QACL,MAAOM,EAAgB,EACvB,cAAY,aACd,CAEJ,EIhCO,IAAME,EAAoBC,EAAG,CAClC,KAAM;AAAA;AAAA;AAAA,IAIN,SAAU,CACR,KAAM,CACJ,QAAS,+BACT,YAAa,mCACb,QAAS,+BACT,QAAS,+BACT,OAAQ,6BACV,CACF,CACF,CAAC,ERIK,IAAAC,EAAA,6BAZOC,EAAe,QAMtBC,KAAY,cAA2C,CAACC,EAAOC,IAAQ,CAC3E,IACEC,EAAAF,EADM,MAAAG,EAAM,SAAAC,EAAU,aAAAC,CAf1B,EAgBIH,EADuCI,EAAAC,EACvCL,EADuC,CAAjC,OAAM,WAAU,iBAGxB,SACE,OAACM,EAAAC,EAAAC,EAAA,CAAc,KAAMP,EAAM,MAAOE,GAAkBC,GAAnD,CACC,mBAAC,OACC,cAAY,aACZ,UAAWK,EAAkB,CAAE,KAAAR,CAAK,CAAC,EACrC,IAAKF,EAEJ,SAAAG,EACH,GACF,CAEJ,CAAC,EAEK,CAACQ,CAAkB,KAAI,sBAAmBd,CAAY,EAE/C,CAACU,EAAeK,CAAe,EAGxCD,EAAiCd,CAAY,EAQpCgB,EAAQ,CACnB,KAAMf,EACN,KAAMgB,EACN,YAAaC,CACf","names":["toast_exports","__export","Toast","__toCommonJS","import_react_context","import_react","import_tailwind_variants","tv","ToastDescriptionVariants","tv","import_jsx_runtime","ToastDescription","props","children","ToastDescriptionVariants","import_react","React","React","import_pulso_design_tokens","React","import_jsx_runtime","ThemeContext","useTheme","mappedTheme","context","ThemeContext","currentTheme","__spreadValues","import_jsx_runtime","Icon","_a","_b","symbol","size","color","props","__objRest","theme","useTheme","resolvedFontSizes","__spreadProps","__spreadValues","import_jsx_runtime","ToastIcon","props","symbol","__scopeToast","type","useToastContext","DISPLAY_NAME","mapper","mapVariantColor","Icon","ToastRootVariants","tv","import_jsx_runtime","DISPLAY_NAME","ToastRoot","props","ref","_a","type","children","__scopeToast","rest","__objRest","ToastProvider","__spreadProps","__spreadValues","ToastRootVariants","createToastContext","useToastContext","Toast","ToastIcon","ToastDescription"]}