npm - @vector-business-services/cristal-ds-web - Versions diffs - 0.2.0 → 0.3.0 - Mend

@vector-business-services/cristal-ds-web 0.2.0 → 0.3.0

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

Files changed (9) hide show

package/dist/index.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Input/Input.css","../src/components/AutoComplete/AutoComplete.css","../src/components/Badge/Badge.css","../src/components/Button/Button.css","../src/components/Chip/Chip.css","../src/components/Divider/Divider.css","../src/components/IconButton/IconButton.css","../src/components/MultiSelect/MultiSelect.css","../src/components/Tag/Tag.css"],"sourcesContent":["/* Campo do Figma \"Cristal - Core Components \| Web\" (Input Text). As classes .cr-field são a base\n de todo campo do web (Input, AutoComplete, MultiSelect): rótulo, caixa, ícones e dica.\n Consome apenas tokens semânticos — nunca primitivos (--cr-color-blue-). /\n.cr-field {\n display: flex;\n flex-direction: column;\n gap: var(--cr-spacing-spacing-3);\n}\n\n/* Label (com * quando obrigatório) /\n.cr-field__label {\n display: inline-flex;\n gap: 2px; / entre o texto e o , no Figma (sem token) /\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-label-large-14-semibold-font-family);\n font-size: var(--cr-typography-label-large-14-semibold-font-size);\n font-weight: var(--cr-typography-label-large-14-semibold-font-weight);\n line-height: var(--cr-typography-label-large-14-semibold-line-height);\n letter-spacing: var(--cr-typography-label-large-14-semibold-letter-spacing);\n}\n\n/* Caixa do campo: mesmo padding, gap, raio e texto em todos os tamanhos; muda a altura. /\n.cr-field__control {\n box-sizing: border-box; / a altura do Figma já inclui padding e borda /\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-small);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-field--large .cr-field__control {\n height: 48px;\n}\n.cr-field--medium .cr-field__control {\n height: 42px;\n}\n.cr-field--small .cr-field__control {\n height: 36px;\n}\n.cr-field--xsmall .cr-field__control {\n height: 32px;\n}\n\n/ O <input> (ou o elemento de valor de outro campo) ocupa o espaço livre, sem estilo próprio. /\n.cr-field__input {\n flex: 1;\n min-width: 0;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n outline: none;\n}\n.cr-field__input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 20px. /\n.cr-field__icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 20px;\n}\n\n/ Outline /\n.cr-field--outline .cr-field__control {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n}\n.cr-field--outline:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-neutral-boldest);\n}\n\n/ Filled: sem borda; no foco e no erro, a caixa fica como no Outline. /\n.cr-field--filled .cr-field__control {\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-field--filled:not(.cr-field--disabled) .cr-field__control:hover {\n background-color: var(--cr-color-fill-neutral-subtler);\n}\n/ Mesma especificidade do hover e declarado depois dele: com o mouse sobre o campo em foco ou com\n erro, vale o foco/erro. /\n.cr-field--filled:not(.cr-field--disabled) .cr-field__control:focus-within,\n.cr-field--filled.cr-field--error:not(.cr-field--disabled) .cr-field__control {\n background-color: var(--cr-color-fill-neutral-container);\n}\n\n/ Focus /\n.cr-field:not(.cr-field--disabled) .cr-field__control:focus-within {\n border-color: var(--cr-color-stroke-brand-base);\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n/ Error /\n.cr-field--error .cr-field__control,\n.cr-field--error:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-danger-base);\n}\n\n/ Disabled /\n.cr-field--disabled .cr-field__label {\n color: var(--cr-color-text-disabled-base);\n}\n.cr-field--disabled.cr-field--outline .cr-field__control {\n border-color: var(--cr-color-stroke-neutral-base);\n}\n.cr-field--disabled.cr-field--filled .cr-field__control {\n background-color: var(--cr-color-fill-disabled-base);\n}\n.cr-field--disabled .cr-field__input {\n cursor: not-allowed;\n}\n\n/ Hint (componente Hint do Figma, tipos Info e Error): ícone de 16px a 4px do texto. /\n.cr-field__hint {\n display: flex;\n align-items: flex-start;\n gap: var(--cr-padding-padding-3);\n margin: 0;\n color: var(--cr-color-text-neutral-subtle);\n font-family: var(--cr-typography-label-medium-12-medium-font-family);\n font-size: var(--cr-typography-label-medium-12-medium-font-size);\n font-weight: var(--cr-typography-label-medium-12-medium-font-weight);\n line-height: var(--cr-typography-label-medium-12-medium-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-medium-letter-spacing);\n}\n.cr-field__hint-icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 16px;\n color: var(--cr-color-icon-neutral-subtle);\n}\n.cr-field__hint--error {\n color: var(--cr-color-text-danger-base);\n}\n.cr-field__hint--error .cr-field__hint-icon {\n color: var(--cr-color-icon-danger-base);\n}\n","/ Auto Complete do Figma \"Cristal - Core Components \| Web\". O rótulo, a dica e os estados do campo\n vêm das classes .cr-field do Input (Input.css); aqui ficam o <input> como caixa do campo e o\n painel de sugestões (Dropdown List + Dropdown Item do Figma, densidade Normal).\n Consome apenas tokens semânticos — nunca primitivos (--cr-color-blue-). /\n.cr-autocomplete__root {\n display: flex;\n}\n\n/* O <input> é a própria caixa (.cr-field__control): ocupa a largura do campo. /\n.cr-autocomplete__input {\n flex: 1;\n box-sizing: border-box;\n min-width: 0;\n outline: none;\n}\n.cr-autocomplete__input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n.cr-field--disabled .cr-autocomplete__input {\n cursor: not-allowed;\n}\n\n/ O Prime mostra um spinner próprio enquanto busca; o Figma não define esse estado no campo. /\n.cr-autocomplete__loader {\n display: none;\n}\n\n/ Painel (Dropdown List). O Prime o renderiza no <body>, alinhado pelo <input>, com a largura\n mínima do campo; a 4px do campo, abaixo ou acima (quando abre para cima, o Prime marca\n transform-origin: bottom). /\n.cr-autocomplete__panel {\n box-sizing: border-box;\n margin-top: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-medium);\n background-color: var(--cr-color-fill-neutral-container);\n / Borda interna, como no Figma (não soma na altura), e a elevação. /\n box-shadow:\n inset 0 0 0 var(--cr-stroke-x-small) var(--cr-color-stroke-neutral-base),\n var(--cr-elevation-gray-bottom-3);\n}\n.cr-autocomplete__panel[style='transform-origin: bottom'] {\n margin-top: calc(-1 * var(--cr-spacing-spacing-3));\n}\n\n/* Área com rolagem (o Prime limita a altura a 5 itens). Barra de rolagem do Figma: 8px, a 4px dos\n itens, trilho e polegar arredondados. /\n.cr-autocomplete__panel > :first-child {\n overflow: auto;\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar {\n width: 12px; / 4px de espaço (spacing-3) + 8px de barra, no Figma (sem token) /\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar-track {\n border-left: var(--cr-spacing-spacing-3) solid transparent;\n border-radius: var(--cr-radius-full);\n background-clip: padding-box;\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar-thumb {\n border-left: var(--cr-spacing-spacing-3) solid transparent;\n border-radius: var(--cr-radius-full);\n background-clip: padding-box;\n background-color: var(--cr-color-fill-neutral-subtle);\n}\n\n.cr-autocomplete__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n/ Item (Dropdown Item): estados Default, Hover, Selected e Focus (navegação pelo teclado, que o\n Prime marca com data-p-highlight). /\n.cr-autocomplete__item {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-4);\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n cursor: pointer;\n}\n.cr-autocomplete__item:hover {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-autocomplete__item[data-p-highlight='true'] {\n box-shadow: inset 0 0 0 var(--cr-stroke-x-small) var(--cr-color-stroke-brand-base);\n}\n.cr-autocomplete__item[aria-selected='true'] {\n background-color: var(--cr-color-fill-selected-subtlest);\n color: var(--cr-color-text-brand-base);\n}\n","/ Badge do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. /\n.cr-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n border-radius: var(--cr-radius-full);\n color: var(--cr-color-text-inverse-base);\n white-space: nowrap;\n}\n\n/ Tamanhos: o mínimo é um círculo; com mais dígitos o badge cresce na horizontal. /\n.cr-badge--large {\n min-width: 24px;\n height: 24px;\n padding: var(--cr-padding-padding-2);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n}\n\n.cr-badge--medium {\n min-width: 16px;\n height: 16px;\n padding: 0;\n font-family: var(--cr-typography-label-small-10-semibold-font-family);\n font-size: var(--cr-typography-label-small-10-semibold-font-size);\n font-weight: var(--cr-typography-label-small-10-semibold-font-weight);\n line-height: var(--cr-typography-label-small-10-semibold-line-height);\n letter-spacing: var(--cr-typography-label-small-10-semibold-letter-spacing);\n}\n\n.cr-badge--small {\n width: 8px;\n height: 8px;\n padding: 0;\n}\n\n/ Estados /\n.cr-badge--default {\n background-color: var(--cr-color-fill-brand-base);\n}\n.cr-badge--error {\n background-color: var(--cr-color-fill-danger-base);\n}\n.cr-badge--warning {\n background-color: var(--cr-color-fill-warning-base);\n}\n.cr-badge--success {\n background-color: var(--cr-color-fill-success-base);\n}\n.cr-badge--disabled {\n background-color: var(--cr-color-fill-neutral-subtlest);\n color: var(--cr-color-text-neutral-subtlest);\n}\n","/ Button do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos — nunca\n primitivos (--cr-color-blue-). Todos os tamanhos têm o mesmo padding, gap, raio e texto; muda\n a altura e o tamanho do ícone. /\n.cr-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 110px; /* largura mínima do Figma, em todos os tamanhos (sem token) /\n gap: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-3) var(--cr-padding-padding-6);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-small);\n font-family: var(--cr-typography-body-small-14-semibold-font-family);\n font-size: var(--cr-typography-body-small-14-semibold-font-size);\n font-weight: var(--cr-typography-body-small-14-semibold-font-weight);\n line-height: var(--cr-typography-body-small-14-semibold-line-height);\n letter-spacing: var(--cr-typography-body-small-14-semibold-letter-spacing);\n cursor: pointer;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-button:focus-visible {\n outline: none;\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n.cr-button:disabled {\n cursor: not-allowed;\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-text-disabled-on-fill);\n}\n\n/ Tamanhos /\n.cr-button--large {\n height: 48px;\n}\n.cr-button--medium {\n height: 42px;\n}\n.cr-button--small {\n height: 36px;\n}\n.cr-button--xsmall {\n height: 32px;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 20px, ou 16px no XSmall. Herdam a cor do texto. /\n.cr-button__icon {\n display: inline-flex;\n font-size: 20px;\n}\n.cr-button--xsmall .cr-button__icon {\n font-size: 16px;\n}\n\n/ Primary (Filled) /\n.cr-button--primary {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-text-inverse-base);\n}\n.cr-button--primary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-hover);\n}\n.cr-button--primary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-pressed);\n}\n\n/ Secondary (Tonal) /\n.cr-button--secondary {\n background-color: var(--cr-color-fill-brand-subtlest);\n color: var(--cr-color-text-brand-base);\n}\n.cr-button--secondary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-hover);\n}\n.cr-button--secondary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-pressed);\n}\n\n/ Tertiary (Outlined) /\n.cr-button--tertiary {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n color: var(--cr-color-text-neutral-base);\n}\n.cr-button--tertiary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-button--tertiary:active:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-pressed);\n}\n.cr-button--tertiary:disabled {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n","/ Chip do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. Todos os\n tamanhos têm o mesmo padding, gap, raio e texto; muda só a altura. Cada tipo define as cores\n por estado nas variáveis --cr-chip-. /\n.cr-chip {\n display: inline-flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n box-sizing: border-box;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid var(--cr-chip-stroke, transparent);\n border-radius: var(--cr-radius-full);\n background-color: var(--cr-chip-bg);\n color: var(--cr-chip-text);\n box-shadow: var(--cr-chip-shadow, none);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n white-space: nowrap;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n/* Tamanhos (alturas do Figma, sem token) /\n.cr-chip--small {\n height: 24px;\n}\n.cr-chip--medium {\n height: 28px;\n}\n.cr-chip--large {\n height: 32px;\n}\n.cr-chip--x-large {\n height: 36px;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 16px. /\n.cr-chip__icon {\n display: inline-flex;\n font-size: 16px;\n}\n.cr-chip__icon--leading {\n color: var(--cr-chip-icon-leading);\n}\n.cr-chip__icon--trailing {\n color: var(--cr-chip-icon-trailing, var(--cr-chip-icon-leading));\n}\n.cr-chip__remove {\n cursor: pointer;\n}\n.cr-chip__remove:focus-visible {\n outline: none;\n}\n\n/ Estados. Focused (Figma): o anel de foco aparece no chip quando ele ou o botão de remover\n recebe foco pelo teclado. /\n.cr-chip:not(.cr-chip--disabled):hover {\n background-color: var(--cr-chip-bg-hover);\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n}\n.cr-chip:not(.cr-chip--disabled):active {\n background-color: var(--cr-chip-bg-pressed);\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n color: var(--cr-chip-text-pressed, var(--cr-chip-text));\n --cr-chip-icon-leading: var(--cr-chip-icon-leading-pressed);\n --cr-chip-icon-trailing: var(--cr-chip-icon-trailing-pressed);\n}\n.cr-chip:focus-visible,\n.cr-chip:has(:focus-visible) {\n outline: none;\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n box-shadow: var(--cr-effects-focus-ring);\n}\n/ Duas classes para vencer as variáveis de ícone definidas pelos tipos, mais abaixo. /\n.cr-chip.cr-chip--disabled {\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-text-disabled-on-fill);\n --cr-chip-icon-leading: var(--cr-color-icon-disabled-on-fill);\n --cr-chip-icon-trailing: var(--cr-color-icon-disabled-on-fill);\n}\n\n/ Tipos /\n.cr-chip--default {\n --cr-chip-bg: var(--cr-color-fill-brand-base);\n --cr-chip-bg-hover: var(--cr-color-fill-brand-base-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-brand-base-pressed);\n --cr-chip-text: var(--cr-color-text-inverse-base);\n --cr-chip-icon-leading: var(--cr-color-icon-inverse-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-inverse-base);\n}\n.cr-chip--success {\n --cr-chip-bg: var(--cr-color-fill-success-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-success-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-success-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-success-base);\n --cr-chip-text-pressed: var(--cr-color-text-success-base-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-success-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-success-base-pressed);\n}\n.cr-chip--danger {\n --cr-chip-bg: var(--cr-color-fill-danger-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-danger-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-danger-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-danger-base);\n --cr-chip-icon-leading: var(--cr-color-icon-danger-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-danger-base);\n}\n.cr-chip--warning {\n --cr-chip-bg: var(--cr-color-fill-warning-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-warning-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-warning-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-warning-base);\n --cr-chip-text-pressed: var(--cr-color-text-warning-base-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-warning-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-warning-base-pressed);\n}\n/ No Figma, o ícone da direita do Info usa a cor de marca, e o da esquerda, a de informação. /\n.cr-chip--info {\n --cr-chip-bg: var(--cr-color-fill-information-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-information-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-information-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-information-base);\n --cr-chip-icon-leading: var(--cr-color-icon-information-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-information-base);\n --cr-chip-icon-trailing: var(--cr-color-icon-brand-base);\n --cr-chip-icon-trailing-pressed: var(--cr-color-icon-brand-base);\n}\n.cr-chip--highlight {\n --cr-chip-bg: var(--cr-color-fill-highlight-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-highlight-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-highlight-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-highlight-base);\n --cr-chip-icon-leading: var(--cr-color-icon-highlight-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-highlight-base);\n}\n.cr-chip--inverse {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-brand-base);\n --cr-chip-icon-leading: var(--cr-color-icon-brand-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-brand-base);\n}\n.cr-chip--outline {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-stroke: var(--cr-color-stroke-neutral-base);\n --cr-chip-stroke-active: var(--cr-color-stroke-neutral-bold);\n --cr-chip-text: var(--cr-color-text-neutral-base);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-base);\n}\n.cr-chip--outline.cr-chip--disabled {\n --cr-chip-stroke: var(--cr-color-stroke-disabled-base);\n}\n/ No Figma, no pressionado do Neutral o ícone da direita fica com a cor neutra base. /\n.cr-chip--neutral {\n --cr-chip-bg: var(--cr-color-fill-neutral-subtler);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-neutral-subtle);\n --cr-chip-text-pressed: var(--cr-color-text-neutral-subtle-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-subtle);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-subtle-pressed);\n --cr-chip-icon-trailing-pressed: var(--cr-color-icon-neutral-base);\n}\n.cr-chip--on-image {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-neutral-base);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-base);\n --cr-chip-shadow: var(--cr-elevation-gray-bottom-3);\n}\n","/ Divider do Figma \"Cristal - Core Components \| Web\" (Horizontal e Vertical Divider). Linha de\n 1px na cor stroke/neutral/base; o Dashed usa traço de 2px com 2px de intervalo. /\n.cr-divider {\n --cr-divider-color: var(--cr-color-stroke-neutral-base);\n\n flex-shrink: 0;\n}\n\n.cr-divider--horizontal {\n width: 100%;\n height: var(--cr-stroke-x-small);\n}\n\n.cr-divider--vertical {\n align-self: stretch;\n width: var(--cr-stroke-x-small);\n}\n\n.cr-divider--solid {\n background-color: var(--cr-divider-color);\n}\n\n/ Traço 2px / intervalo 2px (dashPattern [2, 2] no Figma); border dashed não controla o traço. /\n.cr-divider--dashed.cr-divider--horizontal {\n background-image: repeating-linear-gradient(\n to right,\n var(--cr-divider-color) 0 2px,\n transparent 2px 4px\n );\n}\n.cr-divider--dashed.cr-divider--vertical {\n background-image: repeating-linear-gradient(\n to bottom,\n var(--cr-divider-color) 0 2px,\n transparent 2px 4px\n );\n}\n\n/ O Prime sempre renderiza um contêiner de conteúdo; o Figma não tem conteúdo na linha. /\n.cr-divider__content {\n display: none;\n}\n","/ Icon Button do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos —\n nunca primitivos. Circular em todos os tamanhos; muda o diâmetro e o tamanho do ícone. /\n.cr-icon-button {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n padding: var(--cr-padding-padding-3);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-full);\n background-color: transparent;\n cursor: pointer;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-icon-button:focus-visible {\n outline: none;\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n.cr-icon-button:disabled {\n cursor: not-allowed;\n}\n\n/ Tamanhos (diâmetro, sem token) /\n.cr-icon-button--large {\n width: 48px;\n height: 48px;\n}\n.cr-icon-button--medium {\n width: 42px;\n height: 42px;\n}\n.cr-icon-button--small {\n width: 36px;\n height: 36px;\n}\n.cr-icon-button--xsmall {\n width: 32px;\n height: 32px;\n}\n\n/ Ícone: 20px, ou 16px no XSmall. Herda a cor definida em cada hierarquia. /\n.cr-icon-button__icon {\n display: inline-flex;\n font-size: 20px;\n}\n.cr-icon-button--xsmall .cr-icon-button__icon {\n font-size: 16px;\n}\n\n/ Primary (Filled) /\n.cr-icon-button--primary {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-icon-inverse-base);\n}\n.cr-icon-button--primary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-hover);\n}\n.cr-icon-button--primary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-pressed);\n}\n\n/ Secondary (Tonal) /\n.cr-icon-button--secondary {\n background-color: var(--cr-color-fill-brand-subtlest);\n color: var(--cr-color-icon-brand-base);\n}\n.cr-icon-button--secondary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-hover);\n}\n.cr-icon-button--secondary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-pressed);\n}\n\n/ Tertiary (Outlined) /\n.cr-icon-button--tertiary {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n color: var(--cr-color-icon-neutral-base);\n}\n.cr-icon-button--tertiary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-icon-button--tertiary:active:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-pressed);\n}\n\n/ Desabilitado (Primary, Secondary e Tertiary; o Figma não define o do Other/Icon) /\n.cr-icon-button--primary:disabled,\n.cr-icon-button--secondary:disabled,\n.cr-icon-button--tertiary:disabled {\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-icon-disabled-on-fill);\n}\n.cr-icon-button--tertiary:disabled {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n\n/ Ghost (Other / Icon): sem fundo; no Figma só tem Default e Hover. /\n.cr-icon-button--ghost {\n color: var(--cr-color-icon-brand-base);\n}\n.cr-icon-button--ghost:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest);\n}\n","/ Multiselect do Figma \"Cristal - Core Components \| Web\". O rótulo, a caixa, os tamanhos e a dica\n vêm do campo do Input (.cr-field); aqui ficam só o que o Multiselect define diferente e as\n partes próprias (chips, seta, lista). Consome apenas tokens semânticos. /\n\n/ Caixa do campo /\n.cr-multiselect .cr-multiselect__control {\n cursor: pointer;\n}\n.cr-multiselect.cr-field--disabled .cr-multiselect__control {\n cursor: not-allowed;\n}\n\n/ Hover: no Multiselect a borda vai para stroke/neutral/bold/hover (Outline e Filled) e o fundo\n do Filled não muda. /\n.cr-multiselect.cr-field--outline:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n.cr-multiselect.cr-field--filled .cr-field__control {\n border-color: var(--cr-color-stroke-neutral-base);\n}\n.cr-multiselect.cr-field--filled:not(.cr-field--disabled) .cr-field__control:hover {\n background-color: var(--cr-color-fill-neutral-subtlest);\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n\n/ Focus (também com a lista aberta) e Error repetem o do campo, que perderia para as regras\n acima. /\n.cr-multiselect .cr-field__control:focus-within,\n.cr-multiselect .cr-multiselect__control--open,\n.cr-multiselect:not(.cr-field--disabled) .cr-field__control:focus-within:hover,\n.cr-multiselect:not(.cr-field--disabled) .cr-multiselect__control--open:hover {\n border-color: var(--cr-color-stroke-brand-base);\n}\n.cr-multiselect .cr-multiselect__control--open {\n box-shadow: var(--cr-effects-focus-ring);\n}\n.cr-multiselect.cr-field--filled .cr-multiselect__control--open {\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect.cr-field--error .cr-field__control,\n.cr-multiselect.cr-field--error:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-danger-base);\n}\n\n/ Disabled: borda stroke/disabled/base nos dois tipos. /\n.cr-multiselect.cr-field--disabled .cr-field__control {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n\n/ O <input> combobox do Prime fica escondido visualmente; ele recebe o foco e o rótulo. /\n.cr-multiselect__hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n}\n.cr-multiselect__hidden input {\n margin: 0;\n padding: 0;\n border: 0;\n}\n\n/ Valor: chips ou o texto do campo vazio (Field Text no Figma) /\n.cr-multiselect__value {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n}\n.cr-multiselect__chips {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-horizontal-between-chips);\n overflow: hidden;\n white-space: nowrap;\n}\n.cr-multiselect__chip {\n flex-shrink: 0;\n}\n.cr-multiselect__placeholder {\n overflow: hidden;\n color: var(--cr-color-text-neutral-subtlest);\n text-overflow: ellipsis;\n}\n.cr-multiselect.cr-field--error .cr-multiselect__placeholder {\n color: var(--cr-color-text-danger-base);\n}\n\n/ Seta (CaretDown de 14px) /\n.cr-multiselect .cr-multiselect__trigger {\n font-size: 14px;\n color: var(--cr-color-icon-neutral-base);\n}\n\n/ Lista (.Multiselect / List no Figma): renderizada no body, posicionada pelo Prime. /\n.cr-multiselect__panel {\n position: absolute;\n box-sizing: border-box;\n padding: var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-base);\n border-radius: var(--cr-radius-medium);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n}\n.cr-multiselect__panel--normal {\n box-shadow: var(--cr-elevation-gray-bottom-4);\n}\n.cr-multiselect__panel--compact {\n box-shadow: var(--cr-elevation-gray-bottom-3);\n}\n\n/ Topo da lista (.Multiselect / Search Filter): \"selecionar todos\" + busca /\n.cr-multiselect__header {\n display: flex;\n align-items: center;\n gap: var(--cr-padding-padding-4);\n padding-left: var(--cr-padding-padding-4);\n}\n.cr-multiselect__close {\n display: none; / o Figma não tem botão de fechar /\n}\n.cr-multiselect__search {\n display: flex;\n flex: 1;\n align-items: center;\n gap: var(--cr-padding-padding-4);\n box-sizing: border-box;\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-bold);\n border-radius: var(--cr-radius-small);\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect__panel--normal .cr-multiselect__search {\n height: 36px;\n padding: var(--cr-padding-padding-4);\n}\n.cr-multiselect__panel--compact .cr-multiselect__search {\n height: 32px;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-4);\n}\n.cr-multiselect__search:hover {\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n.cr-multiselect__search:focus-within {\n border-color: var(--cr-color-stroke-brand-base);\n box-shadow: var(--cr-effects-focus-ring);\n}\n.cr-multiselect__search-input {\n flex: 1;\n min-width: 0;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n outline: none;\n}\n.cr-multiselect__search-input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n.cr-multiselect__search-icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 16px;\n}\n\n/ Itens (.Multiselect / List Item). A altura da rolagem (7 itens) vem do scrollHeight do Prime. /\n.cr-multiselect__wrapper {\n overflow: auto;\n}\n.cr-multiselect__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n.cr-multiselect__item,\n.cr-multiselect__empty {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-4);\n box-sizing: border-box;\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect__item {\n cursor: pointer;\n}\n.cr-multiselect__panel--normal .cr-multiselect__item,\n.cr-multiselect__panel--normal .cr-multiselect__empty {\n height: 40px;\n padding: var(--cr-padding-padding-4);\n}\n.cr-multiselect__panel--compact .cr-multiselect__item,\n.cr-multiselect__panel--compact .cr-multiselect__empty {\n height: 32px;\n padding: var(--cr-padding-padding-3) var(--cr-padding-padding-4);\n}\n/ Hover (e o item destacado pelo teclado): fundo neutral/subtlest com raio small. /\n.cr-multiselect__item:hover,\n.cr-multiselect__item--focused {\n border-radius: var(--cr-radius-small);\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n\n/ Checkbox (.Checkbox Box no Figma): 24px, borda de 2px; marcado em brand com check de 16px. /\n.cr-multiselect__checkbox {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n width: 24px;\n height: 24px;\n}\n.cr-multiselect__checkbox-input {\n position: absolute;\n inset: 0;\n z-index: 1;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.cr-multiselect__checkbox-box {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n border: var(--cr-stroke-small) solid var(--cr-color-stroke-neutral-bold);\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-icon-inverse-base);\n font-size: 16px;\n}\n.cr-multiselect__item:hover .cr-multiselect__checkbox-box:not([data-p-highlight='true']),\n.cr-multiselect__select-all:hover .cr-multiselect__checkbox-box:not([data-p-highlight='true']) {\n border-color: var(--cr-color-stroke-neutral-bolder);\n}\n.cr-multiselect__checkbox-box[data-p-highlight='true'] {\n border-color: var(--cr-color-fill-brand-base);\n background-color: var(--cr-color-fill-brand-base);\n}\n","/ Tag do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. Todos os\n tamanhos têm o mesmo padding, gap, raio e texto; muda só a altura. /\n.cr-tag {\n display: inline-flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n box-sizing: border-box;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-x-small);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n white-space: nowrap;\n}\n\n/ O Prime renderiza um <span> vazio para children depois do valor; fora do fluxo do gap. /\n.cr-tag > span:empty {\n display: none;\n}\n\n/ Tamanhos (alturas do Figma, sem token) /\n.cr-tag--small {\n height: 24px;\n}\n.cr-tag--medium {\n height: 28px;\n}\n.cr-tag--large {\n height: 32px;\n}\n.cr-tag--x-large {\n height: 36px;\n}\n\n/ Ícone (Leading Icon no Figma): 16px, com a cor de ícone de cada tipo. /\n.cr-tag__icon {\n display: inline-flex;\n font-size: 16px;\n color: var(--cr-tag-icon-color);\n}\n\n/ Tipos */\n.cr-tag--default {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-text-inverse-base);\n --cr-tag-icon-color: var(--cr-color-icon-inverse-base);\n}\n.cr-tag--success {\n background-color: var(--cr-color-fill-success-subtle);\n color: var(--cr-color-text-success-base);\n --cr-tag-icon-color: var(--cr-color-icon-success-base);\n}\n.cr-tag--warning {\n background-color: var(--cr-color-fill-warning-subtle);\n color: var(--cr-color-text-warning-base);\n --cr-tag-icon-color: var(--cr-color-icon-warning-base);\n}\n.cr-tag--danger {\n background-color: var(--cr-color-fill-danger-subtle);\n color: var(--cr-color-text-danger-base);\n --cr-tag-icon-color: var(--cr-color-icon-danger-base);\n}\n.cr-tag--info {\n background-color: var(--cr-color-fill-information-subtle);\n color: var(--cr-color-text-information-base);\n --cr-tag-icon-color: var(--cr-color-icon-information-base);\n}\n.cr-tag--purple {\n background-color: var(--cr-color-fill-highlight-subtle);\n color: var(--cr-color-text-highlight-base);\n --cr-tag-icon-color: var(--cr-color-icon-highlight-base);\n}\n.cr-tag--gray {\n background-color: var(--cr-color-fill-neutral-subtler);\n color: var(--cr-color-text-neutral-subtle);\n --cr-tag-icon-color: var(--cr-color-icon-neutral-subtle);\n}\n.cr-tag--inverse {\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-brand-base);\n --cr-tag-icon-color: var(--cr-color-icon-brand-base);\n}\n.cr-tag--outline {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-base);\n color: var(--cr-color-text-neutral-base);\n --cr-tag-icon-color: var(--cr-color-icon-neutral-base);\n}\n"],"mappings":"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","names":[]}
1	+ {"version":3,"sources":["../src/components/Input/Input.css","../src/components/AutoComplete/AutoComplete.css","../src/components/Badge/Badge.css","../src/components/Button/Button.css","../src/components/Chip/Chip.css","../src/components/Divider/Divider.css","../src/components/IconButton/IconButton.css","../src/components/Menu/Menu.css","../src/components/Tooltip/Tooltip.css","../src/components/Menubar/Menubar.css","../src/components/MultiSelect/MultiSelect.css","../src/components/Tag/Tag.css"],"sourcesContent":["/* Campo do Figma \"Cristal - Core Components \| Web\" (Input Text). As classes .cr-field são a base\n de todo campo do web (Input, AutoComplete, MultiSelect): rótulo, caixa, ícones e dica.\n Consome apenas tokens semânticos — nunca primitivos (--cr-color-blue-). /\n.cr-field {\n display: flex;\n flex-direction: column;\n gap: var(--cr-spacing-spacing-3);\n}\n\n/* Label (com * quando obrigatório) /\n.cr-field__label {\n display: inline-flex;\n gap: 2px; / entre o texto e o , no Figma (sem token) /\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-label-large-14-semibold-font-family);\n font-size: var(--cr-typography-label-large-14-semibold-font-size);\n font-weight: var(--cr-typography-label-large-14-semibold-font-weight);\n line-height: var(--cr-typography-label-large-14-semibold-line-height);\n letter-spacing: var(--cr-typography-label-large-14-semibold-letter-spacing);\n}\n\n/* Caixa do campo: mesmo padding, gap, raio e texto em todos os tamanhos; muda a altura. /\n.cr-field__control {\n box-sizing: border-box; / a altura do Figma já inclui padding e borda /\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-small);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-field--large .cr-field__control {\n height: 48px;\n}\n.cr-field--medium .cr-field__control {\n height: 42px;\n}\n.cr-field--small .cr-field__control {\n height: 36px;\n}\n.cr-field--xsmall .cr-field__control {\n height: 32px;\n}\n\n/ O <input> (ou o elemento de valor de outro campo) ocupa o espaço livre, sem estilo próprio. /\n.cr-field__input {\n flex: 1;\n min-width: 0;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n outline: none;\n}\n.cr-field__input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 20px. /\n.cr-field__icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 20px;\n}\n\n/ Outline /\n.cr-field--outline .cr-field__control {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n}\n.cr-field--outline:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-neutral-boldest);\n}\n\n/ Filled: sem borda; no foco e no erro, a caixa fica como no Outline. /\n.cr-field--filled .cr-field__control {\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-field--filled:not(.cr-field--disabled) .cr-field__control:hover {\n background-color: var(--cr-color-fill-neutral-subtler);\n}\n/ Mesma especificidade do hover e declarado depois dele: com o mouse sobre o campo em foco ou com\n erro, vale o foco/erro. /\n.cr-field--filled:not(.cr-field--disabled) .cr-field__control:focus-within,\n.cr-field--filled.cr-field--error:not(.cr-field--disabled) .cr-field__control {\n background-color: var(--cr-color-fill-neutral-container);\n}\n\n/ Focus /\n.cr-field:not(.cr-field--disabled) .cr-field__control:focus-within {\n border-color: var(--cr-color-stroke-brand-base);\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n/ Error /\n.cr-field--error .cr-field__control,\n.cr-field--error:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-danger-base);\n}\n\n/ Disabled /\n.cr-field--disabled .cr-field__label {\n color: var(--cr-color-text-disabled-base);\n}\n.cr-field--disabled.cr-field--outline .cr-field__control {\n border-color: var(--cr-color-stroke-neutral-base);\n}\n.cr-field--disabled.cr-field--filled .cr-field__control {\n background-color: var(--cr-color-fill-disabled-base);\n}\n.cr-field--disabled .cr-field__input {\n cursor: not-allowed;\n}\n\n/ Hint (componente Hint do Figma, tipos Info e Error): ícone de 16px a 4px do texto. /\n.cr-field__hint {\n display: flex;\n align-items: flex-start;\n gap: var(--cr-padding-padding-3);\n margin: 0;\n color: var(--cr-color-text-neutral-subtle);\n font-family: var(--cr-typography-label-medium-12-medium-font-family);\n font-size: var(--cr-typography-label-medium-12-medium-font-size);\n font-weight: var(--cr-typography-label-medium-12-medium-font-weight);\n line-height: var(--cr-typography-label-medium-12-medium-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-medium-letter-spacing);\n}\n.cr-field__hint-icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 16px;\n color: var(--cr-color-icon-neutral-subtle);\n}\n.cr-field__hint--error {\n color: var(--cr-color-text-danger-base);\n}\n.cr-field__hint--error .cr-field__hint-icon {\n color: var(--cr-color-icon-danger-base);\n}\n","/ Auto Complete do Figma \"Cristal - Core Components \| Web\". O rótulo, a dica e os estados do campo\n vêm das classes .cr-field do Input (Input.css); aqui ficam o <input> como caixa do campo e o\n painel de sugestões (Dropdown List + Dropdown Item do Figma, densidade Normal).\n Consome apenas tokens semânticos — nunca primitivos (--cr-color-blue-). /\n.cr-autocomplete__root {\n display: flex;\n}\n\n/* O <input> é a própria caixa (.cr-field__control): ocupa a largura do campo. /\n.cr-autocomplete__input {\n flex: 1;\n box-sizing: border-box;\n min-width: 0;\n outline: none;\n}\n.cr-autocomplete__input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n.cr-field--disabled .cr-autocomplete__input {\n cursor: not-allowed;\n}\n\n/ O Prime mostra um spinner próprio enquanto busca; o Figma não define esse estado no campo. /\n.cr-autocomplete__loader {\n display: none;\n}\n\n/ Painel (Dropdown List). O Prime o renderiza no <body>, alinhado pelo <input>, com a largura\n mínima do campo; a 4px do campo, abaixo ou acima (quando abre para cima, o Prime marca\n transform-origin: bottom). /\n.cr-autocomplete__panel {\n box-sizing: border-box;\n margin-top: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-medium);\n background-color: var(--cr-color-fill-neutral-container);\n / Borda interna, como no Figma (não soma na altura), e a elevação. /\n box-shadow:\n inset 0 0 0 var(--cr-stroke-x-small) var(--cr-color-stroke-neutral-base),\n var(--cr-elevation-gray-bottom-3);\n}\n.cr-autocomplete__panel[style='transform-origin: bottom'] {\n margin-top: calc(-1 * var(--cr-spacing-spacing-3));\n}\n\n/* Área com rolagem (o Prime limita a altura a 5 itens). Barra de rolagem do Figma: 8px, a 4px dos\n itens, trilho e polegar arredondados. /\n.cr-autocomplete__panel > :first-child {\n overflow: auto;\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar {\n width: 12px; / 4px de espaço (spacing-3) + 8px de barra, no Figma (sem token) /\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar-track {\n border-left: var(--cr-spacing-spacing-3) solid transparent;\n border-radius: var(--cr-radius-full);\n background-clip: padding-box;\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-autocomplete__panel > :first-child::-webkit-scrollbar-thumb {\n border-left: var(--cr-spacing-spacing-3) solid transparent;\n border-radius: var(--cr-radius-full);\n background-clip: padding-box;\n background-color: var(--cr-color-fill-neutral-subtle);\n}\n\n.cr-autocomplete__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n/ Item (Dropdown Item): estados Default, Hover, Selected e Focus (navegação pelo teclado, que o\n Prime marca com data-p-highlight). /\n.cr-autocomplete__item {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-4);\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n cursor: pointer;\n}\n.cr-autocomplete__item:hover {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-autocomplete__item[data-p-highlight='true'] {\n box-shadow: inset 0 0 0 var(--cr-stroke-x-small) var(--cr-color-stroke-brand-base);\n}\n.cr-autocomplete__item[aria-selected='true'] {\n background-color: var(--cr-color-fill-selected-subtlest);\n color: var(--cr-color-text-brand-base);\n}\n","/ Badge do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. /\n.cr-badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n border-radius: var(--cr-radius-full);\n color: var(--cr-color-text-inverse-base);\n white-space: nowrap;\n}\n\n/ Tamanhos: o mínimo é um círculo; com mais dígitos o badge cresce na horizontal. /\n.cr-badge--large {\n min-width: 24px;\n height: 24px;\n padding: var(--cr-padding-padding-2);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n}\n\n.cr-badge--medium {\n min-width: 16px;\n height: 16px;\n padding: 0;\n font-family: var(--cr-typography-label-small-10-semibold-font-family);\n font-size: var(--cr-typography-label-small-10-semibold-font-size);\n font-weight: var(--cr-typography-label-small-10-semibold-font-weight);\n line-height: var(--cr-typography-label-small-10-semibold-line-height);\n letter-spacing: var(--cr-typography-label-small-10-semibold-letter-spacing);\n}\n\n.cr-badge--small {\n width: 8px;\n height: 8px;\n padding: 0;\n}\n\n/ Estados /\n.cr-badge--default {\n background-color: var(--cr-color-fill-brand-base);\n}\n.cr-badge--error {\n background-color: var(--cr-color-fill-danger-base);\n}\n.cr-badge--warning {\n background-color: var(--cr-color-fill-warning-base);\n}\n.cr-badge--success {\n background-color: var(--cr-color-fill-success-base);\n}\n.cr-badge--disabled {\n background-color: var(--cr-color-fill-neutral-subtlest);\n color: var(--cr-color-text-neutral-subtlest);\n}\n","/ Button do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos — nunca\n primitivos (--cr-color-blue-). Todos os tamanhos têm o mesmo padding, gap, raio e texto; muda\n a altura e o tamanho do ícone. /\n.cr-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 110px; /* largura mínima do Figma, em todos os tamanhos (sem token) /\n gap: var(--cr-spacing-spacing-3);\n padding: var(--cr-padding-padding-3) var(--cr-padding-padding-6);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-small);\n font-family: var(--cr-typography-body-small-14-semibold-font-family);\n font-size: var(--cr-typography-body-small-14-semibold-font-size);\n font-weight: var(--cr-typography-body-small-14-semibold-font-weight);\n line-height: var(--cr-typography-body-small-14-semibold-line-height);\n letter-spacing: var(--cr-typography-body-small-14-semibold-letter-spacing);\n cursor: pointer;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-button:focus-visible {\n outline: none;\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n.cr-button:disabled {\n cursor: not-allowed;\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-text-disabled-on-fill);\n}\n\n/ Tamanhos /\n.cr-button--large {\n height: 48px;\n}\n.cr-button--medium {\n height: 42px;\n}\n.cr-button--small {\n height: 36px;\n}\n.cr-button--xsmall {\n height: 32px;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 20px, ou 16px no XSmall. Herdam a cor do texto. /\n.cr-button__icon {\n display: inline-flex;\n font-size: 20px;\n}\n.cr-button--xsmall .cr-button__icon {\n font-size: 16px;\n}\n\n/ Primary (Filled) /\n.cr-button--primary {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-text-inverse-base);\n}\n.cr-button--primary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-hover);\n}\n.cr-button--primary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-pressed);\n}\n\n/ Secondary (Tonal) /\n.cr-button--secondary {\n background-color: var(--cr-color-fill-brand-subtlest);\n color: var(--cr-color-text-brand-base);\n}\n.cr-button--secondary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-hover);\n}\n.cr-button--secondary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-pressed);\n}\n\n/ Tertiary (Outlined) /\n.cr-button--tertiary {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n color: var(--cr-color-text-neutral-base);\n}\n.cr-button--tertiary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-button--tertiary:active:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-pressed);\n}\n.cr-button--tertiary:disabled {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n","/ Chip do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. Todos os\n tamanhos têm o mesmo padding, gap, raio e texto; muda só a altura. Cada tipo define as cores\n por estado nas variáveis --cr-chip-. /\n.cr-chip {\n display: inline-flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n box-sizing: border-box;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid var(--cr-chip-stroke, transparent);\n border-radius: var(--cr-radius-full);\n background-color: var(--cr-chip-bg);\n color: var(--cr-chip-text);\n box-shadow: var(--cr-chip-shadow, none);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n white-space: nowrap;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n/* Tamanhos (alturas do Figma, sem token) /\n.cr-chip--small {\n height: 24px;\n}\n.cr-chip--medium {\n height: 28px;\n}\n.cr-chip--large {\n height: 32px;\n}\n.cr-chip--x-large {\n height: 36px;\n}\n\n/ Ícones (Leading/Trailing Icon no Figma): 16px. /\n.cr-chip__icon {\n display: inline-flex;\n font-size: 16px;\n}\n.cr-chip__icon--leading {\n color: var(--cr-chip-icon-leading);\n}\n.cr-chip__icon--trailing {\n color: var(--cr-chip-icon-trailing, var(--cr-chip-icon-leading));\n}\n.cr-chip__remove {\n cursor: pointer;\n}\n.cr-chip__remove:focus-visible {\n outline: none;\n}\n\n/ Estados. Focused (Figma): o anel de foco aparece no chip quando ele ou o botão de remover\n recebe foco pelo teclado. /\n.cr-chip:not(.cr-chip--disabled):hover {\n background-color: var(--cr-chip-bg-hover);\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n}\n.cr-chip:not(.cr-chip--disabled):active {\n background-color: var(--cr-chip-bg-pressed);\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n color: var(--cr-chip-text-pressed, var(--cr-chip-text));\n --cr-chip-icon-leading: var(--cr-chip-icon-leading-pressed);\n --cr-chip-icon-trailing: var(--cr-chip-icon-trailing-pressed);\n}\n.cr-chip:focus-visible,\n.cr-chip:has(:focus-visible) {\n outline: none;\n border-color: var(--cr-chip-stroke-active, var(--cr-chip-stroke, transparent));\n box-shadow: var(--cr-effects-focus-ring);\n}\n/ Duas classes para vencer as variáveis de ícone definidas pelos tipos, mais abaixo. /\n.cr-chip.cr-chip--disabled {\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-text-disabled-on-fill);\n --cr-chip-icon-leading: var(--cr-color-icon-disabled-on-fill);\n --cr-chip-icon-trailing: var(--cr-color-icon-disabled-on-fill);\n}\n\n/ Tipos /\n.cr-chip--default {\n --cr-chip-bg: var(--cr-color-fill-brand-base);\n --cr-chip-bg-hover: var(--cr-color-fill-brand-base-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-brand-base-pressed);\n --cr-chip-text: var(--cr-color-text-inverse-base);\n --cr-chip-icon-leading: var(--cr-color-icon-inverse-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-inverse-base);\n}\n.cr-chip--success {\n --cr-chip-bg: var(--cr-color-fill-success-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-success-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-success-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-success-base);\n --cr-chip-text-pressed: var(--cr-color-text-success-base-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-success-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-success-base-pressed);\n}\n.cr-chip--danger {\n --cr-chip-bg: var(--cr-color-fill-danger-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-danger-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-danger-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-danger-base);\n --cr-chip-icon-leading: var(--cr-color-icon-danger-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-danger-base);\n}\n.cr-chip--warning {\n --cr-chip-bg: var(--cr-color-fill-warning-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-warning-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-warning-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-warning-base);\n --cr-chip-text-pressed: var(--cr-color-text-warning-base-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-warning-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-warning-base-pressed);\n}\n/ No Figma, o ícone da direita do Info usa a cor de marca, e o da esquerda, a de informação. /\n.cr-chip--info {\n --cr-chip-bg: var(--cr-color-fill-information-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-information-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-information-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-information-base);\n --cr-chip-icon-leading: var(--cr-color-icon-information-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-information-base);\n --cr-chip-icon-trailing: var(--cr-color-icon-brand-base);\n --cr-chip-icon-trailing-pressed: var(--cr-color-icon-brand-base);\n}\n.cr-chip--highlight {\n --cr-chip-bg: var(--cr-color-fill-highlight-subtle);\n --cr-chip-bg-hover: var(--cr-color-fill-highlight-subtle-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-highlight-subtle-pressed);\n --cr-chip-text: var(--cr-color-text-highlight-base);\n --cr-chip-icon-leading: var(--cr-color-icon-highlight-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-highlight-base);\n}\n.cr-chip--inverse {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-brand-base);\n --cr-chip-icon-leading: var(--cr-color-icon-brand-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-brand-base);\n}\n.cr-chip--outline {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-stroke: var(--cr-color-stroke-neutral-base);\n --cr-chip-stroke-active: var(--cr-color-stroke-neutral-bold);\n --cr-chip-text: var(--cr-color-text-neutral-base);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-base);\n}\n.cr-chip--outline.cr-chip--disabled {\n --cr-chip-stroke: var(--cr-color-stroke-disabled-base);\n}\n/ No Figma, no pressionado do Neutral o ícone da direita fica com a cor neutra base. /\n.cr-chip--neutral {\n --cr-chip-bg: var(--cr-color-fill-neutral-subtler);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-neutral-subtle);\n --cr-chip-text-pressed: var(--cr-color-text-neutral-subtle-pressed);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-subtle);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-subtle-pressed);\n --cr-chip-icon-trailing-pressed: var(--cr-color-icon-neutral-base);\n}\n.cr-chip--on-image {\n --cr-chip-bg: var(--cr-color-fill-neutral-container);\n --cr-chip-bg-hover: var(--cr-color-fill-neutral-container-hover);\n --cr-chip-bg-pressed: var(--cr-color-fill-neutral-container-pressed);\n --cr-chip-text: var(--cr-color-text-neutral-base);\n --cr-chip-icon-leading: var(--cr-color-icon-neutral-base);\n --cr-chip-icon-leading-pressed: var(--cr-color-icon-neutral-base);\n --cr-chip-shadow: var(--cr-elevation-gray-bottom-3);\n}\n","/ Divider do Figma \"Cristal - Core Components \| Web\" (Horizontal e Vertical Divider). Linha de\n 1px na cor stroke/neutral/base; o Dashed usa traço de 2px com 2px de intervalo. /\n.cr-divider {\n --cr-divider-color: var(--cr-color-stroke-neutral-base);\n\n flex-shrink: 0;\n}\n\n.cr-divider--horizontal {\n width: 100%;\n height: var(--cr-stroke-x-small);\n}\n\n.cr-divider--vertical {\n align-self: stretch;\n width: var(--cr-stroke-x-small);\n}\n\n.cr-divider--solid {\n background-color: var(--cr-divider-color);\n}\n\n/ Traço 2px / intervalo 2px (dashPattern [2, 2] no Figma); border dashed não controla o traço. /\n.cr-divider--dashed.cr-divider--horizontal {\n background-image: repeating-linear-gradient(\n to right,\n var(--cr-divider-color) 0 2px,\n transparent 2px 4px\n );\n}\n.cr-divider--dashed.cr-divider--vertical {\n background-image: repeating-linear-gradient(\n to bottom,\n var(--cr-divider-color) 0 2px,\n transparent 2px 4px\n );\n}\n\n/ O Prime sempre renderiza um contêiner de conteúdo; o Figma não tem conteúdo na linha. /\n.cr-divider__content {\n display: none;\n}\n","/ Icon Button do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos —\n nunca primitivos. Circular em todos os tamanhos; muda o diâmetro e o tamanho do ícone. /\n.cr-icon-button {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n padding: var(--cr-padding-padding-3);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-full);\n background-color: transparent;\n cursor: pointer;\n transition:\n background-color 120ms ease,\n border-color 120ms ease;\n}\n\n.cr-icon-button:focus-visible {\n outline: none;\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n.cr-icon-button:disabled {\n cursor: not-allowed;\n}\n\n/ Tamanhos (diâmetro, sem token) /\n.cr-icon-button--large {\n width: 48px;\n height: 48px;\n}\n.cr-icon-button--medium {\n width: 42px;\n height: 42px;\n}\n.cr-icon-button--small {\n width: 36px;\n height: 36px;\n}\n.cr-icon-button--xsmall {\n width: 32px;\n height: 32px;\n}\n\n/ Ícone: 20px, ou 16px no XSmall. Herda a cor definida em cada hierarquia. /\n.cr-icon-button__icon {\n display: inline-flex;\n font-size: 20px;\n}\n.cr-icon-button--xsmall .cr-icon-button__icon {\n font-size: 16px;\n}\n\n/ Primary (Filled) /\n.cr-icon-button--primary {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-icon-inverse-base);\n}\n.cr-icon-button--primary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-hover);\n}\n.cr-icon-button--primary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-base-pressed);\n}\n\n/ Secondary (Tonal) /\n.cr-icon-button--secondary {\n background-color: var(--cr-color-fill-brand-subtlest);\n color: var(--cr-color-icon-brand-base);\n}\n.cr-icon-button--secondary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-hover);\n}\n.cr-icon-button--secondary:active:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest-pressed);\n}\n\n/ Tertiary (Outlined) /\n.cr-icon-button--tertiary {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-bold);\n color: var(--cr-color-icon-neutral-base);\n}\n.cr-icon-button--tertiary:hover:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n.cr-icon-button--tertiary:active:not(:disabled) {\n background-color: var(--cr-color-fill-neutral-container-pressed);\n}\n\n/ Desabilitado (Primary, Secondary e Tertiary; o Figma não define o do Other/Icon) /\n.cr-icon-button--primary:disabled,\n.cr-icon-button--secondary:disabled,\n.cr-icon-button--tertiary:disabled {\n background-color: var(--cr-color-fill-disabled-base);\n color: var(--cr-color-icon-disabled-on-fill);\n}\n.cr-icon-button--tertiary:disabled {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n\n/ Ghost (Other / Icon): sem fundo; no Figma só tem Default e Hover. /\n.cr-icon-button--ghost {\n color: var(--cr-color-icon-brand-base);\n}\n.cr-icon-button--ghost:hover:not(:disabled) {\n background-color: var(--cr-color-fill-brand-subtlest);\n}\n","/ Dropdown List do Figma \"Cristal - Core Components \| Web\", sobre o Menu do Prime. Consome\n apenas tokens semânticos. /\n.cr-menu {\n box-sizing: border-box;\n width: 320px;\n padding: var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-base);\n border-radius: var(--cr-radius-medium);\n background-color: var(--cr-color-fill-neutral-container);\n box-shadow: var(--cr-elevation-gray-bottom-3);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n}\n\n/ Popup: renderizado no body e posicionado pelo Prime, colado no elemento que o abriu. O Prime\n marca o lado com transform-origin (o navegador grava \"center top\" quando abre embaixo e\n \"center bottom\" quando abre em cima); a margem afasta 4px para esse lado, inclusive quando\n ele reposiciona. /\n.cr-menu--popup {\n position: absolute;\n}\n.cr-menu--popup[style='transform-origin: center top'] {\n margin-top: var(--cr-spacing-spacing-3);\n}\n.cr-menu--popup[style='transform-origin: center bottom'] {\n margin-top: calc(var(--cr-spacing-spacing-3) -1);\n}\n\n/* Lista: 5 itens visíveis antes da rolagem, como no Figma (37px no normal, 29px no compact).\n O padding/margin de 3px deixa o anel de foco do item aparecer sem ser cortado pela rolagem. /\n.cr-menu__list {\n --cr-menu-item-height: 37px;\n max-height: calc(var(--cr-menu-item-height) 5);\n margin: -3px;\n padding: 3px;\n overflow-y: auto;\n list-style: none;\n outline: none;\n}\n.cr-menu--compact .cr-menu__list {\n --cr-menu-item-height: 29px;\n}\n\n/* Barra de rolagem (Scrollbar no Figma): 8px, trilho neutral/subtlest e polegar neutral/subtle. /\n.cr-menu__list::-webkit-scrollbar {\n width: 8px;\n}\n.cr-menu__list::-webkit-scrollbar-track {\n border-radius: var(--cr-radius-full);\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-menu__list::-webkit-scrollbar-thumb {\n border-radius: var(--cr-radius-full);\n background-color: var(--cr-color-fill-neutral-subtle);\n}\n@supports not selector(::-webkit-scrollbar) {\n .cr-menu__list {\n scrollbar-width: thin;\n scrollbar-color: var(--cr-color-fill-neutral-subtle) var(--cr-color-fill-neutral-subtlest);\n }\n}\n\n/ Item (.Dropdown Item no Figma) /\n.cr-menu__action {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-4);\n box-sizing: border-box;\n height: var(--cr-menu-item-height);\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n}\n.cr-menu--compact .cr-menu__action {\n padding: var(--cr-padding-padding-3) var(--cr-padding-padding-5);\n}\n.cr-menu__label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.cr-menu__icon {\n display: inline-flex;\n flex-shrink: 0;\n color: var(--cr-color-icon-neutral-base);\n font-size: 20px;\n}\n\n/ Hover /\n.cr-menu__item:hover .cr-menu__action {\n background-color: var(--cr-color-fill-neutral-container-hover);\n}\n\n/ Focus: só na navegação pelo teclado (o Prime também marca o item sob o mouse). /\n.cr-menu__list:focus-visible .cr-menu__item[data-p-focused='true'] .cr-menu__action {\n background-color: var(--cr-color-fill-neutral-container);\n box-shadow:\n inset 0 0 0 var(--cr-stroke-x-small) var(--cr-color-stroke-brand-base),\n var(--cr-effects-focus-ring);\n}\n\n/ Selected /\n.cr-menu__item--selected .cr-menu__action,\n.cr-menu__item--selected:hover .cr-menu__action {\n background-color: var(--cr-color-fill-selected-subtlest);\n color: var(--cr-color-text-brand-base);\n}\n.cr-menu__item--selected .cr-menu__icon {\n color: var(--cr-color-icon-brand-base);\n}\n\n/ Desabilitado (o Figma não define: segue o texto desabilitado dos campos). /\n.cr-menu__item[data-p-disabled='true'] .cr-menu__action {\n color: var(--cr-color-text-disabled-base);\n cursor: not-allowed;\n}\n.cr-menu__item[data-p-disabled='true']:hover .cr-menu__action {\n background-color: var(--cr-color-fill-neutral-container);\n}\n\n/ Loading: indicador de 24px centralizado (.Loading animated no Figma). /\n.cr-menu__loading {\n display: flex;\n align-items: center;\n justify-content: center;\n height: var(--cr-menu-item-height);\n color: var(--cr-color-icon-neutral-subtle);\n font-size: 24px;\n}\n.cr-menu__spinner {\n animation: cr-menu-spin 1s linear infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n .cr-menu__spinner {\n animation-duration: 3s;\n }\n}\n@keyframes cr-menu-spin {\n to {\n transform: rotate(360deg);\n }\n}\n","/ Tooltip do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos.\n Renderizado no body e posicionado pelo Prime; a raiz é transparente e o balão é o texto. /\n.cr-tooltip {\n position: absolute;\n / Fora da tela até o Prime calcular a posição (evita piscar a barra de rolagem). /\n top: -9999px;\n left: -9999px;\n pointer-events: none;\n}\n\n/ Distância de 4px até o alvo (no Figma, o tooltip do Menubar fica 4px abaixo do botão). O Prime\n desconta esse padding ao posicionar em cima e à esquerda, por isso ele vai nos dois lados. /\n.cr-tooltip--top,\n.cr-tooltip--bottom {\n padding: var(--cr-padding-padding-3) 0;\n}\n.cr-tooltip--left,\n.cr-tooltip--right {\n padding: 0 var(--cr-padding-padding-3);\n}\n\n.cr-tooltip__arrow {\n display: none; / o Figma não tem seta /\n}\n\n.cr-tooltip__text {\n box-sizing: border-box;\n padding: var(--cr-padding-padding-4) var(--cr-padding-padding-5);\n border-radius: var(--cr-radius-small);\n background-color: var(--cr-color-fill-neutral-boldest);\n color: var(--cr-color-text-inverse-base);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n}\n\n/ Plain: uma linha só. /\n.cr-tooltip--plain .cr-tooltip__text {\n white-space: nowrap;\n}\n\n/ Rich: até 300px (texto de 276px + padding), quebrando linha. /\n.cr-tooltip--rich .cr-tooltip__text {\n max-width: 300px;\n white-space: pre-line;\n overflow-wrap: break-word;\n}\n","/ Menubar do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos.\n Fluido (ocupa a largura toda) e responsivo pela largura do próprio Menubar (container\n queries). As larguras das variantes do Figma são os breakpoints: desktop a partir de 1360px,\n tablet de 768 a 1359px e mobile abaixo de 768px (variante de 360px). /\n.cr-menubar {\n container-type: inline-size;\n}\n\n/ Barra fluida: grid de 3 colunas (início, busca centralizada e ferramentas). A busca acompanha\n a largura do Menubar entre 300 e 500px, como no Figma (400px em 1360px). Ela fica no centro\n enquanto os lados cabem; se faltar espaço, o lado mais largo empurra a busca, sem sobrepor. /\n.cr-menubar__bar {\n display: grid;\n grid-template-columns: 1fr clamp(300px, calc(100cqw 400 / 1360), 500px) 1fr;\n column-gap: var(--cr-spacing-spacing-6);\n align-items: center;\n box-sizing: border-box;\n height: 64px;\n padding: 0 var(--cr-padding-padding-8);\n border-bottom: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-base);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n}\n.cr-menubar--no-search .cr-menubar__bar {\n grid-template-columns: 1fr auto;\n}\n.cr-menubar__start {\n display: contents;\n}\n\n/* Início (Nav Init): botão de menu + logo, 16px entre eles. /\n.cr-menubar__init {\n display: flex;\n gap: var(--cr-spacing-spacing-6);\n align-items: center;\n justify-self: start;\n}\n\n/ Logo (.Nav Logo): 120×40, com as duas partes do SVG nas posições do Figma. /\n.cr-menubar__logo {\n position: relative;\n display: block;\n flex-shrink: 0;\n width: 120px;\n height: 40px;\n overflow: hidden;\n}\n.cr-menubar__logo-texto {\n position: absolute;\n top: 14.09px;\n left: 1px;\n width: 67.293px;\n height: 11.618px;\n}\n.cr-menubar__logo-simbolo {\n position: absolute;\n top: 10px;\n left: 76.41px;\n width: 42.706px;\n height: 20px;\n}\n\n/ Botões redondos de 40px: menu (.Menubar Button) e ferramentas (.Menubar Tools Button). /\n.cr-menubar__menu-button,\n.cr-menubar__tool {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n padding: 0;\n border: 0;\n border-radius: var(--cr-radius-full);\n background-color: transparent;\n color: var(--cr-color-icon-neutral-subtle);\n cursor: pointer;\n transition:\n background-color 120ms ease,\n color 120ms ease;\n}\n.cr-menubar__menu-icon,\n.cr-menubar__tool-icon,\n.cr-menubar__search-icon {\n display: inline-flex;\n font-size: 20px;\n}\n.cr-menubar__menu-button:focus-visible,\n.cr-menubar__tool:focus-visible,\n.cr-menubar__search-button:focus-visible,\n.cr-menubar__profile--button:focus-visible {\n outline: none;\n box-shadow: var(--cr-effects-focus-ring);\n}\n\n/ Menu: Hover em neutral/subtlest; Active (Menu Principal aberto) em brand. /\n.cr-menubar__menu-button:hover {\n background-color: var(--cr-color-fill-neutral-subtlest);\n color: var(--cr-color-icon-neutral-base);\n}\n.cr-menubar__menu-button--active,\n.cr-menubar__menu-button--active:hover {\n background-color: var(--cr-color-fill-brand-subtlest);\n color: var(--cr-color-icon-brand-base);\n}\n\n/ Ferramentas (.Nav Tools): 2px entre os botões. Hover e Active (menu aberto) iguais. O Figma\n usa color/icon/primary, que tem o mesmo valor de icon/neutral/base. /\n.cr-menubar__tools {\n display: flex;\n gap: var(--cr-spacing-spacing-2);\n align-items: center;\n}\n.cr-menubar__tool {\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-menubar__tool:hover,\n.cr-menubar__tool--active {\n background-color: var(--cr-color-fill-neutral-subtlest);\n color: var(--cr-color-icon-neutral-base);\n}\n\n/ Badge (Show Badge): 24px, no canto de cima do ícone. /\n.cr-menubar__badge {\n position: absolute;\n top: -4px;\n left: 20px;\n}\n\n/ Busca (.Menubar Search): pílula de 40px, 300 a 500px de largura (400px no desktop). /\n.cr-menubar__search {\n display: flex;\n gap: var(--cr-spacing-spacing-6);\n align-items: center;\n justify-self: center;\n box-sizing: border-box;\n width: 100%;\n height: 40px;\n padding: 0 var(--cr-padding-padding-2) 0 var(--cr-padding-padding-7);\n border-radius: var(--cr-radius-full);\n background-color: var(--cr-color-fill-neutral-subtler);\n transition: background-color 120ms ease;\n}\n.cr-menubar__search:hover {\n background-color: var(--cr-color-fill-neutral-subtle);\n}\n/ O Figma não define o foco: o anel de foco do Cristal na pílula toda. /\n.cr-menubar__search:focus-within {\n box-shadow: var(--cr-effects-focus-ring);\n}\n.cr-menubar__search-input {\n flex: 1;\n min-width: 0;\n padding: 0;\n border: 0;\n background: none;\n color: var(--cr-color-text-neutral-base);\n font: inherit;\n letter-spacing: inherit;\n outline: none;\n}\n.cr-menubar__search-input::placeholder {\n color: var(--cr-color-text-neutral-subtle);\n opacity: 1;\n}\n\n/ Lupa (.Menubar Search Button): 36px; no hover, fundo branco e ícone brand. /\n.cr-menubar__search-button {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n padding: 0;\n border: 0;\n border-radius: var(--cr-radius-full);\n background-color: transparent;\n color: var(--cr-color-icon-neutral-subtle);\n cursor: pointer;\n}\n.cr-menubar__search-button:hover {\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-icon-brand-base);\n}\n\n/ Fim (Nav Settings): ferramentas + perfil, 4px entre eles. /\n.cr-menubar__end {\n display: flex;\n gap: var(--cr-spacing-spacing-3);\n align-items: center;\n justify-self: end;\n}\n\n/ Perfil (.Menubar Profile): nome e perfil alinhados à direita, avatar de 40px. /\n.cr-menubar__profile {\n display: flex;\n gap: var(--cr-padding-padding-6);\n align-items: center;\n justify-content: flex-end;\n box-sizing: border-box;\n min-width: 124px;\n max-width: 220px;\n padding: var(--cr-padding-padding-3);\n border: 0;\n border-radius: var(--cr-radius-small);\n background-color: transparent;\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n text-align: right;\n}\n.cr-menubar__profile--button {\n cursor: pointer;\n transition: background-color 120ms ease;\n}\n.cr-menubar__profile--button:hover {\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n.cr-menubar__profile-text {\n display: flex;\n flex: 1;\n flex-direction: column;\n align-items: flex-end;\n min-width: 0;\n white-space: nowrap;\n}\n.cr-menubar__profile-name,\n.cr-menubar__profile-role {\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.cr-menubar__profile-name {\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-semibold-font-family);\n font-size: var(--cr-typography-body-small-14-semibold-font-size);\n font-weight: var(--cr-typography-body-small-14-semibold-font-weight);\n line-height: var(--cr-typography-body-small-14-semibold-line-height);\n}\n/ O Figma usa color/text/tertiary (#9ca3af), que não é token semântico do Cristal; o semântico\n de mesmo valor é text/neutral/subtlest. Sobre branco ele não passa no contraste mínimo\n (2,5:1): problema de design, marcado nas stories (a11y 'todo') até o Figma ser corrigido. /\n.cr-menubar__profile-role {\n color: var(--cr-color-text-neutral-subtlest);\n}\n\n/ Avatar (.Menubar Profile Avatar): 40px, borda de 1px; sem foto, a inicial em brand. /\n.cr-menubar__avatar {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 40px;\n height: 40px;\n overflow: hidden;\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-base);\n border-radius: var(--cr-radius-full);\n}\n.cr-menubar__avatar-image {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.cr-menubar__avatar--initial {\n background-color: var(--cr-color-fill-brand-subtle);\n color: var(--cr-color-text-brand-base);\n font-family: var(--cr-typography-body-large-18-semibold-font-family);\n font-size: var(--cr-typography-body-large-18-semibold-font-size);\n font-weight: var(--cr-typography-body-large-18-semibold-font-weight);\n line-height: var(--cr-typography-body-large-18-semibold-line-height);\n}\n\n/ Tablet (variante 768 do Figma, de 768 a 1359px): padding de 16px, sem busca e só as\n ferramentas marcadas. /\n@container (max-width: 1359px) {\n .cr-menubar .cr-menubar__bar {\n grid-template-columns: 1fr auto;\n padding: 0 var(--cr-padding-padding-6);\n }\n .cr-menubar__search,\n .cr-menubar__tool:not(.cr-menubar__tool--tablet) {\n display: none;\n }\n}\n\n/ Mobile (variante 360 do Figma, abaixo de 768px): só menu e logo. Busca, ferramentas e perfil vão para o Menu\n Principal. /\n@container (max-width: 767px) {\n .cr-menubar__end {\n display: none;\n }\n}\n","/ Multiselect do Figma \"Cristal - Core Components \| Web\". O rótulo, a caixa, os tamanhos e a dica\n vêm do campo do Input (.cr-field); aqui ficam só o que o Multiselect define diferente e as\n partes próprias (chips, seta, lista). Consome apenas tokens semânticos. /\n\n/ Caixa do campo /\n.cr-multiselect .cr-multiselect__control {\n cursor: pointer;\n}\n.cr-multiselect.cr-field--disabled .cr-multiselect__control {\n cursor: not-allowed;\n}\n\n/ Hover: no Multiselect a borda vai para stroke/neutral/bold/hover (Outline e Filled) e o fundo\n do Filled não muda. /\n.cr-multiselect.cr-field--outline:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n.cr-multiselect.cr-field--filled .cr-field__control {\n border-color: var(--cr-color-stroke-neutral-base);\n}\n.cr-multiselect.cr-field--filled:not(.cr-field--disabled) .cr-field__control:hover {\n background-color: var(--cr-color-fill-neutral-subtlest);\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n\n/ Focus (também com a lista aberta) e Error repetem o do campo, que perderia para as regras\n acima. /\n.cr-multiselect .cr-field__control:focus-within,\n.cr-multiselect .cr-multiselect__control--open,\n.cr-multiselect:not(.cr-field--disabled) .cr-field__control:focus-within:hover,\n.cr-multiselect:not(.cr-field--disabled) .cr-multiselect__control--open:hover {\n border-color: var(--cr-color-stroke-brand-base);\n}\n.cr-multiselect .cr-multiselect__control--open {\n box-shadow: var(--cr-effects-focus-ring);\n}\n.cr-multiselect.cr-field--filled .cr-multiselect__control--open {\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect.cr-field--error .cr-field__control,\n.cr-multiselect.cr-field--error:not(.cr-field--disabled) .cr-field__control:hover {\n border-color: var(--cr-color-stroke-danger-base);\n}\n\n/ Disabled: borda stroke/disabled/base nos dois tipos. /\n.cr-multiselect.cr-field--disabled .cr-field__control {\n border-color: var(--cr-color-stroke-disabled-base);\n}\n\n/ O <input> combobox do Prime fica escondido visualmente; ele recebe o foco e o rótulo. /\n.cr-multiselect__hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n}\n.cr-multiselect__hidden input {\n margin: 0;\n padding: 0;\n border: 0;\n}\n\n/ Valor: chips ou o texto do campo vazio (Field Text no Figma) /\n.cr-multiselect__value {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n}\n.cr-multiselect__chips {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-horizontal-between-chips);\n overflow: hidden;\n white-space: nowrap;\n}\n.cr-multiselect__chip {\n flex-shrink: 0;\n}\n.cr-multiselect__placeholder {\n overflow: hidden;\n color: var(--cr-color-text-neutral-subtlest);\n text-overflow: ellipsis;\n}\n.cr-multiselect.cr-field--error .cr-multiselect__placeholder {\n color: var(--cr-color-text-danger-base);\n}\n\n/ Seta (CaretDown de 14px) /\n.cr-multiselect .cr-multiselect__trigger {\n font-size: 14px;\n color: var(--cr-color-icon-neutral-base);\n}\n\n/ Lista (.Multiselect / List no Figma): renderizada no body, posicionada pelo Prime. /\n.cr-multiselect__panel {\n position: absolute;\n box-sizing: border-box;\n padding: var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-base);\n border-radius: var(--cr-radius-medium);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-neutral-base);\n font-family: var(--cr-typography-body-small-14-regular-font-family);\n font-size: var(--cr-typography-body-small-14-regular-font-size);\n font-weight: var(--cr-typography-body-small-14-regular-font-weight);\n line-height: var(--cr-typography-body-small-14-regular-line-height);\n letter-spacing: var(--cr-typography-body-small-14-regular-letter-spacing);\n}\n.cr-multiselect__panel--normal {\n box-shadow: var(--cr-elevation-gray-bottom-4);\n}\n.cr-multiselect__panel--compact {\n box-shadow: var(--cr-elevation-gray-bottom-3);\n}\n\n/ Topo da lista (.Multiselect / Search Filter): \"selecionar todos\" + busca /\n.cr-multiselect__header {\n display: flex;\n align-items: center;\n gap: var(--cr-padding-padding-4);\n padding-left: var(--cr-padding-padding-4);\n}\n.cr-multiselect__close {\n display: none; / o Figma não tem botão de fechar /\n}\n.cr-multiselect__search {\n display: flex;\n flex: 1;\n align-items: center;\n gap: var(--cr-padding-padding-4);\n box-sizing: border-box;\n border: var(--cr-stroke-x-small) solid var(--cr-color-stroke-neutral-bold);\n border-radius: var(--cr-radius-small);\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect__panel--normal .cr-multiselect__search {\n height: 36px;\n padding: var(--cr-padding-padding-4);\n}\n.cr-multiselect__panel--compact .cr-multiselect__search {\n height: 32px;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-4);\n}\n.cr-multiselect__search:hover {\n border-color: var(--cr-color-stroke-neutral-bold-hover);\n}\n.cr-multiselect__search:focus-within {\n border-color: var(--cr-color-stroke-brand-base);\n box-shadow: var(--cr-effects-focus-ring);\n}\n.cr-multiselect__search-input {\n flex: 1;\n min-width: 0;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n outline: none;\n}\n.cr-multiselect__search-input::placeholder {\n color: var(--cr-color-text-neutral-subtlest);\n opacity: 1;\n}\n.cr-multiselect__search-icon {\n display: inline-flex;\n flex-shrink: 0;\n font-size: 16px;\n}\n\n/ Itens (.Multiselect / List Item). A altura da rolagem (7 itens) vem do scrollHeight do Prime. /\n.cr-multiselect__wrapper {\n overflow: auto;\n}\n.cr-multiselect__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n.cr-multiselect__item,\n.cr-multiselect__empty {\n display: flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-4);\n box-sizing: border-box;\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n}\n.cr-multiselect__item {\n cursor: pointer;\n}\n.cr-multiselect__panel--normal .cr-multiselect__item,\n.cr-multiselect__panel--normal .cr-multiselect__empty {\n height: 40px;\n padding: var(--cr-padding-padding-4);\n}\n.cr-multiselect__panel--compact .cr-multiselect__item,\n.cr-multiselect__panel--compact .cr-multiselect__empty {\n height: 32px;\n padding: var(--cr-padding-padding-3) var(--cr-padding-padding-4);\n}\n/ Hover (e o item destacado pelo teclado): fundo neutral/subtlest com raio small. /\n.cr-multiselect__item:hover,\n.cr-multiselect__item--focused {\n border-radius: var(--cr-radius-small);\n background-color: var(--cr-color-fill-neutral-subtlest);\n}\n\n/ Checkbox (.Checkbox Box no Figma): 24px, borda de 2px; marcado em brand com check de 16px. /\n.cr-multiselect__checkbox {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n width: 24px;\n height: 24px;\n}\n.cr-multiselect__checkbox-input {\n position: absolute;\n inset: 0;\n z-index: 1;\n margin: 0;\n opacity: 0;\n cursor: pointer;\n}\n.cr-multiselect__checkbox-box {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n border: var(--cr-stroke-small) solid var(--cr-color-stroke-neutral-bold);\n border-radius: var(--cr-radius-x-small);\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-icon-inverse-base);\n font-size: 16px;\n}\n.cr-multiselect__item:hover .cr-multiselect__checkbox-box:not([data-p-highlight='true']),\n.cr-multiselect__select-all:hover .cr-multiselect__checkbox-box:not([data-p-highlight='true']) {\n border-color: var(--cr-color-stroke-neutral-bolder);\n}\n.cr-multiselect__checkbox-box[data-p-highlight='true'] {\n border-color: var(--cr-color-fill-brand-base);\n background-color: var(--cr-color-fill-brand-base);\n}\n","/ Tag do Figma \"Cristal - Core Components \| Web\". Consome apenas tokens semânticos. Todos os\n tamanhos têm o mesmo padding, gap, raio e texto; muda só a altura. /\n.cr-tag {\n display: inline-flex;\n align-items: center;\n gap: var(--cr-spacing-spacing-3);\n box-sizing: border-box;\n padding: var(--cr-padding-padding-2) var(--cr-padding-padding-5);\n border: var(--cr-stroke-x-small) solid transparent;\n border-radius: var(--cr-radius-x-small);\n font-family: var(--cr-typography-label-medium-12-semibold-font-family);\n font-size: var(--cr-typography-label-medium-12-semibold-font-size);\n font-weight: var(--cr-typography-label-medium-12-semibold-font-weight);\n line-height: var(--cr-typography-label-medium-12-semibold-line-height);\n letter-spacing: var(--cr-typography-label-medium-12-semibold-letter-spacing);\n white-space: nowrap;\n}\n\n/ O Prime renderiza um <span> vazio para children depois do valor; fora do fluxo do gap. /\n.cr-tag > span:empty {\n display: none;\n}\n\n/ Tamanhos (alturas do Figma, sem token) /\n.cr-tag--small {\n height: 24px;\n}\n.cr-tag--medium {\n height: 28px;\n}\n.cr-tag--large {\n height: 32px;\n}\n.cr-tag--x-large {\n height: 36px;\n}\n\n/ Ícone (Leading Icon no Figma): 16px, com a cor de ícone de cada tipo. /\n.cr-tag__icon {\n display: inline-flex;\n font-size: 16px;\n color: var(--cr-tag-icon-color);\n}\n\n/ Tipos */\n.cr-tag--default {\n background-color: var(--cr-color-fill-brand-base);\n color: var(--cr-color-text-inverse-base);\n --cr-tag-icon-color: var(--cr-color-icon-inverse-base);\n}\n.cr-tag--success {\n background-color: var(--cr-color-fill-success-subtle);\n color: var(--cr-color-text-success-base);\n --cr-tag-icon-color: var(--cr-color-icon-success-base);\n}\n.cr-tag--warning {\n background-color: var(--cr-color-fill-warning-subtle);\n color: var(--cr-color-text-warning-base);\n --cr-tag-icon-color: var(--cr-color-icon-warning-base);\n}\n.cr-tag--danger {\n background-color: var(--cr-color-fill-danger-subtle);\n color: var(--cr-color-text-danger-base);\n --cr-tag-icon-color: var(--cr-color-icon-danger-base);\n}\n.cr-tag--info {\n background-color: var(--cr-color-fill-information-subtle);\n color: var(--cr-color-text-information-base);\n --cr-tag-icon-color: var(--cr-color-icon-information-base);\n}\n.cr-tag--purple {\n background-color: var(--cr-color-fill-highlight-subtle);\n color: var(--cr-color-text-highlight-base);\n --cr-tag-icon-color: var(--cr-color-icon-highlight-base);\n}\n.cr-tag--gray {\n background-color: var(--cr-color-fill-neutral-subtler);\n color: var(--cr-color-text-neutral-subtle);\n --cr-tag-icon-color: var(--cr-color-icon-neutral-subtle);\n}\n.cr-tag--inverse {\n background-color: var(--cr-color-fill-neutral-container);\n color: var(--cr-color-text-brand-base);\n --cr-tag-icon-color: var(--cr-color-icon-brand-base);\n}\n.cr-tag--outline {\n background-color: var(--cr-color-fill-neutral-container);\n border-color: var(--cr-color-stroke-neutral-base);\n color: var(--cr-color-text-neutral-base);\n --cr-tag-icon-color: var(--cr-color-icon-neutral-base);\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.cts CHANGED Viewed

@@ -1,7 +1,8 @@
 import * as react from 'react';
-import { InputHTMLAttributes, ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+import { InputHTMLAttributes, ReactNode, HTMLAttributes, ButtonHTMLAttributes, SyntheticEvent, MouseEvent, RefObject } from 'react';
 import { AutoCompleteProps as AutoCompleteProps$1 } from 'primereact/autocomplete';
 import { ChipRemoveEvent } from 'primereact/chip';
+import { MenuItemCommandEvent } from 'primereact/menuitem';
 /** Type no Figma: Outline (com borda) e Filled (com fundo). */
 type InputVariant = 'outline' | 'filled';
@@ -118,6 +119,105 @@ interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
 }
 declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
+/** Density no Figma: Normal (itens de 37px) e Compacted (29px). */
+type MenuDensity = 'normal' | 'compact';
+/** Um item da lista (.Dropdown Item no Figma). */
+interface MenuItem {
+    label: string;
+    /** Ícone à esquerda (Leading Icon no Figma). Use um ícone de `@vector-business-services/cristal-ds-web/icons`. */
+    icon?: ReactNode;
+    /** Estado Selected do Figma: texto e ícone em brand, fundo selected/subtlest. */
+    selected?: boolean;
+    disabled?: boolean;
+    /** Ação do item; o menu popup fecha depois dela. */
+    command?: (event: MenuItemCommandEvent) => void;
+    /** Link do item; sem ele o clique não navega. */
+    url?: string;
+    target?: string;
+    id?: string;
+    className?: string;
+}
+interface MenuProps {
+    model: MenuItem[];
+    density?: MenuDensity;
+    /** Abre sobre a tela, posicionado no elemento que chamou `toggle`/`show` pela ref. */
+    popup?: boolean;
+    /** Alinhamento do popup com o elemento que o abriu. */
+    popupAlignment?: 'left' | 'right';
+    /** Estado Loading do Figma: troca os itens pelo indicador de carregamento. */
+    loading?: boolean;
+    /** O que o leitor de tela anuncia no carregamento. */
+    loadingLabel?: string;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    onShow?: (event: SyntheticEvent) => void;
+    onHide?: (event: SyntheticEvent) => void;
+    id?: string;
+    className?: string;
+}
+/** Controle do menu popup, pela ref. */
+interface MenuHandle {
+    toggle: (event: SyntheticEvent) => void;
+    show: (event: SyntheticEvent) => void;
+    hide: (event: SyntheticEvent) => void;
+    /** O <div> raiz do menu (só existe com o popup aberto). */
+    getElement: () => HTMLDivElement | null;
+}
+declare const Menu: react.ForwardRefExoticComponent<MenuProps & react.RefAttributes<MenuHandle>>;
+/** Um botão de ferramenta (.Menubar Tools Button no Figma). */
+interface MenubarTool {
+    /** Nome do botão: vira o aria-label e o texto do tooltip. */
+    label: string;
+    /** Use um ícone de `@vector-business-services/cristal-ds-web/icons`. */
+    icon: ReactNode;
+    /** Contador sobre o ícone (Show Badge no Figma). */
+    badge?: ReactNode;
+    /** Como o leitor de tela lê o contador (padrão: o próprio valor). */
+    badgeLabel?: string;
+    /** Itens do menu que o botão abre (Dropdown List no Figma). */
+    menu?: MenuItem[];
+    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /** Continua visível no tablet (768px), como o sino no Figma. */
+    showOnTablet?: boolean;
+}
+/** Usuário logado (.Menubar Profile no Figma). */
+interface MenubarUser {
+    name: string;
+    /** Perfil de acesso, abaixo do nome. */
+    role?: string;
+    /** URL da foto. Sem foto, o avatar mostra a inicial do nome (Type=No Image). */
+    avatar?: string;
+}
+interface MenubarProps {
+    /** Logo à esquerda (.Nav Logo no Figma); o padrão é o logo da Vector. */
+    logo?: ReactNode;
+    /** Menu principal aberto: deixa o botão de menu no estado Active. */
+    menuOpen?: boolean;
+    /** Clique no botão de menu (abre o Menu Principal). */
+    onMenuToggle?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /** Nome acessível do botão de menu. */
+    menuLabel?: string;
+    /** Mostra a busca no centro (só no desktop). */
+    showSearch?: boolean;
+    searchPlaceholder?: string;
+    /** Valor da busca (controlado). Sem ele, a busca guarda o próprio valor. */
+    searchValue?: string;
+    onSearchChange?: (value: string) => void;
+    /** Envio da busca (Enter ou lupa). */
+    onSearch?: (value: string) => void;
+    /** Nome acessível da lupa. */
+    searchButtonLabel?: string;
+    /** Botões de ferramenta à direita (.Nav Tools no Figma). */
+    tools?: MenubarTool[];
+    user?: MenubarUser;
+    /** Itens do menu do perfil. Sem eles, o perfil não é clicável. */
+    userMenu?: MenuItem[];
+    id?: string;
+    className?: string;
+}
+declare const Menubar: react.ForwardRefExoticComponent<MenubarProps & react.RefAttributes<HTMLDivElement>>;
 /** Type no Figma: Outline (com borda) e Filled (com fundo). */
 type MultiSelectVariant = 'outline' | 'filled';
 /** Size no Figma: 32, 36, 42 e 48px de altura do campo. */
@@ -184,5 +284,26 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
 }
 declare const Tag: react.ForwardRefExoticComponent<TagProps & react.RefAttributes<HTMLSpanElement>>;
-export { AutoComplete, Badge, Button, Chip, Divider, IconButton, Input, MultiSelect, Tag };
-export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, TagProps, TagSize, TagVariant };
+/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
+type TooltipType = 'plain' | 'rich';
+type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+interface TooltipProps {
+    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
+    target: RefObject<HTMLElement | null> | HTMLElement | string;
+    /** Texto do tooltip (Label no Plain, Text no Rich). */
+    content: ReactNode;
+    type?: TooltipType;
+    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
+    position?: TooltipPosition;
+    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
+    event?: 'hover' | 'focus' | 'both';
+    showDelay?: number;
+    hideDelay?: number;
+    disabled?: boolean;
+    id?: string;
+    className?: string;
+}
+declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
+export { AutoComplete, Badge, Button, Chip, Divider, IconButton, Input, Menu, Menubar, MultiSelect, Tag, Tooltip };
+export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuProps, MenubarProps, MenubarTool, MenubarUser, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };

package/dist/index.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
 import * as react from 'react';
-import { InputHTMLAttributes, ReactNode, HTMLAttributes, ButtonHTMLAttributes } from 'react';
+import { InputHTMLAttributes, ReactNode, HTMLAttributes, ButtonHTMLAttributes, SyntheticEvent, MouseEvent, RefObject } from 'react';
 import { AutoCompleteProps as AutoCompleteProps$1 } from 'primereact/autocomplete';
 import { ChipRemoveEvent } from 'primereact/chip';
+import { MenuItemCommandEvent } from 'primereact/menuitem';
 /** Type no Figma: Outline (com borda) e Filled (com fundo). */
 type InputVariant = 'outline' | 'filled';
@@ -118,6 +119,105 @@ interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>,
 }
 declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
+/** Density no Figma: Normal (itens de 37px) e Compacted (29px). */
+type MenuDensity = 'normal' | 'compact';
+/** Um item da lista (.Dropdown Item no Figma). */
+interface MenuItem {
+    label: string;
+    /** Ícone à esquerda (Leading Icon no Figma). Use um ícone de `@vector-business-services/cristal-ds-web/icons`. */
+    icon?: ReactNode;
+    /** Estado Selected do Figma: texto e ícone em brand, fundo selected/subtlest. */
+    selected?: boolean;
+    disabled?: boolean;
+    /** Ação do item; o menu popup fecha depois dela. */
+    command?: (event: MenuItemCommandEvent) => void;
+    /** Link do item; sem ele o clique não navega. */
+    url?: string;
+    target?: string;
+    id?: string;
+    className?: string;
+}
+interface MenuProps {
+    model: MenuItem[];
+    density?: MenuDensity;
+    /** Abre sobre a tela, posicionado no elemento que chamou `toggle`/`show` pela ref. */
+    popup?: boolean;
+    /** Alinhamento do popup com o elemento que o abriu. */
+    popupAlignment?: 'left' | 'right';
+    /** Estado Loading do Figma: troca os itens pelo indicador de carregamento. */
+    loading?: boolean;
+    /** O que o leitor de tela anuncia no carregamento. */
+    loadingLabel?: string;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    onShow?: (event: SyntheticEvent) => void;
+    onHide?: (event: SyntheticEvent) => void;
+    id?: string;
+    className?: string;
+}
+/** Controle do menu popup, pela ref. */
+interface MenuHandle {
+    toggle: (event: SyntheticEvent) => void;
+    show: (event: SyntheticEvent) => void;
+    hide: (event: SyntheticEvent) => void;
+    /** O <div> raiz do menu (só existe com o popup aberto). */
+    getElement: () => HTMLDivElement | null;
+}
+declare const Menu: react.ForwardRefExoticComponent<MenuProps & react.RefAttributes<MenuHandle>>;
+/** Um botão de ferramenta (.Menubar Tools Button no Figma). */
+interface MenubarTool {
+    /** Nome do botão: vira o aria-label e o texto do tooltip. */
+    label: string;
+    /** Use um ícone de `@vector-business-services/cristal-ds-web/icons`. */
+    icon: ReactNode;
+    /** Contador sobre o ícone (Show Badge no Figma). */
+    badge?: ReactNode;
+    /** Como o leitor de tela lê o contador (padrão: o próprio valor). */
+    badgeLabel?: string;
+    /** Itens do menu que o botão abre (Dropdown List no Figma). */
+    menu?: MenuItem[];
+    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /** Continua visível no tablet (768px), como o sino no Figma. */
+    showOnTablet?: boolean;
+}
+/** Usuário logado (.Menubar Profile no Figma). */
+interface MenubarUser {
+    name: string;
+    /** Perfil de acesso, abaixo do nome. */
+    role?: string;
+    /** URL da foto. Sem foto, o avatar mostra a inicial do nome (Type=No Image). */
+    avatar?: string;
+}
+interface MenubarProps {
+    /** Logo à esquerda (.Nav Logo no Figma); o padrão é o logo da Vector. */
+    logo?: ReactNode;
+    /** Menu principal aberto: deixa o botão de menu no estado Active. */
+    menuOpen?: boolean;
+    /** Clique no botão de menu (abre o Menu Principal). */
+    onMenuToggle?: (event: MouseEvent<HTMLButtonElement>) => void;
+    /** Nome acessível do botão de menu. */
+    menuLabel?: string;
+    /** Mostra a busca no centro (só no desktop). */
+    showSearch?: boolean;
+    searchPlaceholder?: string;
+    /** Valor da busca (controlado). Sem ele, a busca guarda o próprio valor. */
+    searchValue?: string;
+    onSearchChange?: (value: string) => void;
+    /** Envio da busca (Enter ou lupa). */
+    onSearch?: (value: string) => void;
+    /** Nome acessível da lupa. */
+    searchButtonLabel?: string;
+    /** Botões de ferramenta à direita (.Nav Tools no Figma). */
+    tools?: MenubarTool[];
+    user?: MenubarUser;
+    /** Itens do menu do perfil. Sem eles, o perfil não é clicável. */
+    userMenu?: MenuItem[];
+    id?: string;
+    className?: string;
+}
+declare const Menubar: react.ForwardRefExoticComponent<MenubarProps & react.RefAttributes<HTMLDivElement>>;
 /** Type no Figma: Outline (com borda) e Filled (com fundo). */
 type MultiSelectVariant = 'outline' | 'filled';
 /** Size no Figma: 32, 36, 42 e 48px de altura do campo. */
@@ -184,5 +284,26 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
 }
 declare const Tag: react.ForwardRefExoticComponent<TagProps & react.RefAttributes<HTMLSpanElement>>;
-export { AutoComplete, Badge, Button, Chip, Divider, IconButton, Input, MultiSelect, Tag };
-export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, TagProps, TagSize, TagVariant };
+/** Type no Figma: Plain (rótulo curto, uma linha) e Rich (texto de até 300px, quebra linha). */
+type TooltipType = 'plain' | 'rich';
+type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+interface TooltipProps {
+    /** Elemento que mostra o tooltip: ref, elemento ou seletor CSS. */
+    target: RefObject<HTMLElement | null> | HTMLElement | string;
+    /** Texto do tooltip (Label no Plain, Text no Rich). */
+    content: ReactNode;
+    type?: TooltipType;
+    /** Lado do alvo. O Prime inverte o lado se faltar espaço na tela. */
+    position?: TooltipPosition;
+    /** O que abre o tooltip; o padrão abre no hover e no foco do teclado. */
+    event?: 'hover' | 'focus' | 'both';
+    showDelay?: number;
+    hideDelay?: number;
+    disabled?: boolean;
+    id?: string;
+    className?: string;
+}
+declare function Tooltip({ target, content, type, position, event, showDelay, hideDelay, disabled, id, className, }: TooltipProps): react.JSX.Element;
+export { AutoComplete, Badge, Button, Chip, Divider, IconButton, Input, Menu, Menubar, MultiSelect, Tag, Tooltip };
+export type { AutoCompleteProps, AutoCompleteSize, AutoCompleteVariant, BadgeProps, BadgeSize, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, ChipProps, ChipSize, ChipVariant, DividerOrientation, DividerProps, DividerVariant, IconButtonProps, IconButtonSize, IconButtonVariant, InputProps, InputSize, InputVariant, MenuDensity, MenuHandle, MenuItem, MenuProps, MenubarProps, MenubarTool, MenubarUser, MultiSelectDensity, MultiSelectProps, MultiSelectSize, MultiSelectVariant, TagProps, TagSize, TagVariant, TooltipPosition, TooltipProps, TooltipType };