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.2 kB
{"version":3,"sources":["../../../src/components/link/index.ts","../../../src/components/link/link.tsx","../../../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/link/components/link-icon.tsx","../../../src/utils/tv.ts","../../../src/components/link/link.styles.ts"],"sourcesContent":["export { Link } from './link'\nexport type { LinkProps } from './link.types'\n","import { type Scope, createContextScope } from '@radix-ui/react-context'\nimport { forwardRef } from 'react'\nimport { LinkIcon } from './components/link-icon'\nimport {\n iconLinkVariants,\n labelLinkVariants,\n linkVariants,\n} from './link.styles'\nimport type { LinkProps } from './link.types'\n\ntype LinkContext = Pick<LinkProps, 'size' | 'disabled'>\n\nconst DISPLAY_NAME = 'Link'\n\nconst LinkRoot = forwardRef<HTMLAnchorElement, LinkProps>(\n (props: LinkScopedProps<LinkProps>, ref) => {\n const {\n children,\n icon,\n size,\n disabled,\n full,\n __scopeLink,\n href,\n onClick,\n ...rest\n } = props\n\n const linkClassName = linkVariants({\n size,\n disabled,\n full,\n })\n\n const handleClick = (\n event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n ) => {\n if (disabled) {\n event.preventDefault()\n event.stopPropagation()\n return\n }\n if (onClick) {\n onClick(event)\n }\n }\n\n return (\n <LinkProvider scope={__scopeLink} size={size} disabled={disabled}>\n <a\n {...rest}\n ref={ref}\n href={disabled ? undefined : href}\n className={linkClassName}\n aria-disabled={disabled}\n role=\"link\"\n onClick={handleClick}\n >\n <div className={labelLinkVariants()}>{children}</div>\n {icon && <LinkIcon className={iconLinkVariants()} />}\n </a>\n </LinkProvider>\n )\n }\n)\n\nLinkRoot.displayName = DISPLAY_NAME\n\n/*\nScope Definition\n*/\n\nexport type LinkScopedProps<P> = P & {\n __scopeLink?: Scope\n}\n\nconst [createLinkContext] = createContextScope(DISPLAY_NAME)\n\nexport const [LinkProvider, useLinkContext]: readonly [\n ProviderType<LinkContext>,\n (consumerName: string, scope: Scope) => LinkContext,\n] = createLinkContext<LinkContext>(DISPLAY_NAME)\n\n/*\nComposition Export\n*/\n\nexport const Link = {\n Root: LinkRoot,\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 { Icon, type TIconProps } from '~/components/icon'\nimport { useLinkContext } from '../link'\nimport type { LinkIconProps, LinkScopedProps } from '../link.types'\n\nexport function LinkIcon({\n __scopeLink,\n color = 'colorTextNeutralDefault',\n className,\n ...props\n}: LinkScopedProps<LinkIconProps> & { className?: string }) {\n const { size, disabled } = useLinkContext('LinkIcon', __scopeLink)\n\n const iconSizeMapper: Record<string, TIconProps['size']> = {\n md: 'tiny',\n ml: 'tiny',\n } as const\n\n return (\n <div\n className={`flex items-center ${className && className}`}\n role=\"figure\"\n >\n <Icon\n {...props}\n symbol=\"rdicon-open\"\n color={disabled ? 'colorTextNeutralDisabled' : color}\n size={iconSizeMapper[size!]}\n />\n </div>\n )\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 linkVariants = tv({\n base: 'letter-spacing-default inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md rounded-pill border-action-border-neutral-tertiary-enabled bg-action-fill-neutral-tertiary-enabled px-fourpulse text-text-neutral hover:border-action-border-neutral-tertiary-hovered hover:bg-action-fill-neutral-tertiary-hovered focus:border-action-border-focused focus:border-halfpulse active:border-action-border-neutral-tertiary-pressed active:bg-action-fill-neutral-tertiary-pressed focus:active:border-action-border-focused',\n variants: {\n size: {\n md: 'h-medium min-w-medium font-semibold text-threepulse leading-medium',\n ml: 'h-mediumlarge min-w-mediumlarge font-semibold text-threeandhalfpulse leading-small',\n },\n disabled: {\n true: 'cursor-not-allowed border-action-border-neutral-tertiary-disabled bg-action-fill-neutral-tertiary-disabled text-text-neutral-disabled hover:bg-action-fill-neutral-tertiary-disabled active:bg-action-fill-neutral-tertiary-disabled',\n false: '',\n },\n full: {\n true: 'w-full',\n },\n withIcon: {\n true: 'pl-1',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n})\nexport const labelLinkVariants = tv({\n base: 'inline-flex h-small items-center justify-center underline decoration-solid',\n})\nexport const iconLinkVariants = tv({\n base: 'pl-onepulse no-underline',\n})\n"],"mappings":"s6BAAA,IAAAA,GAAA,GAAAC,EAAAD,GAAA,UAAAE,IAAA,eAAAC,EAAAH,ICAA,IAAAI,EAA+C,mCAC/CC,EAA2B,iBCD3B,IAAAC,EAOO,6CAEPC,EAA2B,iBCT3B,IAAAC,EAAyC,iBA2BrCC,EAAA,6BAdSC,KAAe,iBAAc,CAAC,CAAsB,EDA1D,SAASC,GAAW,CACzB,GAAM,CAAE,aAAAC,CAAa,KAAI,cAAWC,CAAY,EAUhD,OAAOC,IAAA,GARQ,CACb,gBAAiB,yBACjB,SAAU,kBACV,KAAM,cACN,aAAc,sBACd,MAAO,cACT,EAGYF,CAAY,GACnB,iBAEP,CExBO,SAASG,EAAaC,EAA0B,CACrD,IAAMC,EAAQC,EAAS,EAYvB,OAXkB,OAAO,KAAKD,CAAK,EAEL,OAAO,CAACE,EAAKC,IAAa,CACtD,GAAIA,EAAS,SAAS,OAAO,EAAG,CAC9B,IAAMC,EAAaD,EACnBD,EAAIE,CAAU,EAAIJ,EAAMI,CAAU,CACpC,CAEA,OAAOF,CACT,EAAG,CAAC,CAAgB,EAEDH,CAAK,CAC1B,CClBO,IAAMM,EAAc,CACzB,KAAM,qBACN,cAAe,2BACf,MAAO,sBACP,OAAQ,sBACV,ECSI,IAAAC,EAAA,6BATG,SAASC,EAAKC,EAKN,CALM,IAAAC,EAAAD,EACnB,QAAAE,EAAS,iBACT,KAAAC,EAAO,QACP,MAAAC,EAAQ,oCARV,EAKqBH,EAIhBI,EAAAC,EAJgBL,EAIhB,CAHH,SACA,OACA,UAGA,IAAMM,EAAaL,EAAO,QAAQ,SAAU,EAAE,EAAE,KAAK,EAErD,SACE,OAAC,IAAAM,EAAAC,EAAA,GACKJ,GADL,CAEC,MAAOE,EACP,UAAWL,EACX,MAAO,CACL,SAAUQ,EAAYP,CAAI,EAC1B,MAAOQ,EAAaP,CAAK,CAC3B,GACF,CAEJ,CCFM,IAAAQ,EAAA,6BAlBC,SAASC,EAASC,EAKmC,CALnC,IAAAC,EAAAD,EACvB,aAAAE,EACA,MAAAC,EAAQ,0BACR,UAAAC,CAPF,EAIyBH,EAIpBI,EAAAC,EAJoBL,EAIpB,CAHH,cACA,QACA,cAGA,GAAM,CAAE,KAAAM,EAAM,SAAAC,CAAS,EAAIC,EAAe,WAAYP,CAAW,EAE3DQ,EAAqD,CACzD,GAAI,OACJ,GAAI,MACN,EAEA,SACE,OAAC,OACC,UAAW,qBAAqBN,GAAaA,CAAS,GACtD,KAAK,SAEL,mBAACO,EAAAC,EAAAC,EAAA,GACKR,GADL,CAEC,OAAO,cACP,MAAOG,EAAW,2BAA6BL,EAC/C,KAAMO,EAAeH,CAAK,GAC5B,EACF,CAEJ,CC9BA,IAAAO,EAA4C,6BAE/BC,KAAK,YAAS,CACzB,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,ECtBM,IAAMC,EAAeC,EAAG,CAC7B,KAAM,ghBACN,SAAU,CACR,KAAM,CACJ,GAAI,qEACJ,GAAI,oFACN,EACA,SAAU,CACR,KAAM,uOACN,MAAO,EACT,EACA,KAAM,CACJ,KAAM,QACR,EACA,SAAU,CACR,KAAM,MACR,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EACYC,EAAoBD,EAAG,CAClC,KAAM,4EACR,CAAC,EACYE,EAAmBF,EAAG,CACjC,KAAM,0BACR,CAAC,ERoBO,IAAAG,EAAA,6BArCFC,EAAe,OAEfC,KAAW,cACf,CAACC,EAAmCC,IAAQ,CAC1C,IAUIC,EAAAF,EATF,UAAAG,EACA,KAAAC,EACA,KAAAC,EACA,SAAAC,EACA,KAAAC,EACA,YAAAC,EACA,KAAAC,EACA,QAAAC,CAxBN,EA0BQR,EADCS,EAAAC,EACDV,EADC,CARH,WACA,OACA,OACA,WACA,OACA,cACA,OACA,YAIIW,EAAgBC,EAAa,CACjC,KAAAT,EACA,SAAAC,EACA,KAAAC,CACF,CAAC,EAEKQ,EACJC,GACG,CACH,GAAIV,EAAU,CACZU,EAAM,eAAe,EACrBA,EAAM,gBAAgB,EACtB,MACF,CACIN,GACFA,EAAQM,CAAK,CAEjB,EAEA,SACE,OAACC,GAAA,CAAa,MAAOT,EAAa,KAAMH,EAAM,SAAUC,EACtD,oBAAC,IAAAY,EAAAC,EAAA,GACKR,GADL,CAEC,IAAKV,EACL,KAAMK,EAAW,OAAYG,EAC7B,UAAWI,EACX,gBAAeP,EACf,KAAK,OACL,QAASS,EAET,oBAAC,OAAI,UAAWK,EAAkB,EAAI,SAAAjB,EAAS,EAC9CC,MAAQ,OAACiB,EAAA,CAAS,UAAWC,EAAiB,EAAG,IACpD,EACF,CAEJ,CACF,EAEAvB,EAAS,YAAcD,EAUvB,GAAM,CAACyB,EAAiB,KAAI,sBAAmBzB,CAAY,EAE9C,CAACmB,GAAcO,CAAc,EAGtCD,GAA+BzB,CAAY,EAMlC2B,EAAO,CAClB,KAAM1B,CACR","names":["link_exports","__export","Link","__toCommonJS","import_react_context","import_react","import_pulso_design_tokens","import_react","import_react","import_jsx_runtime","ThemeContext","useTheme","currentTheme","ThemeContext","__spreadValues","getColorIcon","color","theme","useTheme","acc","tokenKey","colorToken","getIconSize","import_jsx_runtime","Icon","_a","_b","symbol","size","color","props","__objRest","symbolName","__spreadProps","__spreadValues","getIconSize","getColorIcon","import_jsx_runtime","LinkIcon","_a","_b","__scopeLink","color","className","props","__objRest","size","disabled","useLinkContext","iconSizeMapper","Icon","__spreadProps","__spreadValues","import_tailwind_variants","tv","linkVariants","tv","labelLinkVariants","iconLinkVariants","import_jsx_runtime","DISPLAY_NAME","LinkRoot","props","ref","_a","children","icon","size","disabled","full","__scopeLink","href","onClick","rest","__objRest","linkClassName","linkVariants","handleClick","event","LinkProvider","__spreadProps","__spreadValues","labelLinkVariants","LinkIcon","iconLinkVariants","createLinkContext","useLinkContext","Link"]}