@selectwin/kit 0.1.186 → 0.1.188

package/README.md

@@ -1,29 +1,45 @@
-# @selectwin/kit
-
-Design system da Selectwin — primitivos React, charts SVG (sem dependência de biblioteca de
-gráficos) e tokens CSS, theme-aware (light/dark).
-
-Uso interno da Selectwin. Publicado no npm para facilitar a distribuição entre os apps da casa;
-não há suporte, documentação pública nem garantia de estabilidade de API para terceiros.
-
-## Uso
-
-```bash
-npm i @selectwin/kit
-```
-
-```tsx
-import '@selectwin/kit/styles.css'; // tokens + estilos (uma vez, no root)
-import { SelectButton, SelectSection } from '@selectwin/kit';
-```
-
-Peer deps: **react**, **react-dom** (obrigatórios); **gsap** (opcional — só componentes animados),
-**react-router-dom** (opcional). Tematização = sobrescrever os tokens CSS `--select-*` / `--sw-*`.
-
-## Build
-
-```bash
-npm run build   # → dist/index.js (ESM) + dist/style.css + dist/index.d.ts
-```
-
-`npm publish` roda `prepublishOnly` (= build) e publica só `dist/` (sem sourcemaps).
+# @selectwin/kit
+
+Design system da Selectwin — primitivos React, charts SVG (sem dependência de biblioteca de
+gráficos) e tokens CSS, theme-aware (light/dark).
+
+Uso interno da Selectwin. Publicado no npm para facilitar a distribuição entre os apps da casa;
+não há suporte, documentação pública nem garantia de estabilidade de API para terceiros.
+
+## Uso
+
+```bash
+npm i @selectwin/kit
+```
+
+```tsx
+import '@selectwin/kit/styles.css'; // tokens + estilos (uma vez, no root)
+import { SelectButton, SelectSection } from '@selectwin/kit';
+```
+
+Idioma (0.1.187): os textos próprios do kit ("Página anterior", "Mais filtros", "Fechar"…) e os números que ele
+formata saem em português. Para inglês, envolva o app no `SelectLocaleProvider`:
+
+```tsx
+import { SelectLocaleProvider } from '@selectwin/kit';
+
+<SelectLocaleProvider locale="en">{app}</SelectLocaleProvider>; // 'pt-BR' | 'en'
+```
+
+A prop de texto do componente (`confirmLabel`, `noun`…) sempre ganha do dicionário.
+
+Tom corporativo (0.1.188): cantos mais retos, botão e segmentado em pílula (`--select-radius-button`), rótulos de KPI
+e cabeçalho de tabela em caixa-alta espaçada. Nos gráficos, cor é situação: verde `--select-chart-paid` = pago, dourado
+`--select-chart-pending` (+ `-edge`) = pendente, `--select-chart-compare` = o período anterior, e os cinzas
+`--select-chart-ramp-1..4` para categoria. O app que quer o visual antigo sobrescreve esses tokens.
+
+Peer deps: **react**, **react-dom** (obrigatórios); **gsap** (opcional — só componentes animados),
+**react-router-dom** (opcional). Tematização = sobrescrever os tokens CSS `--select-*` / `--sw-*`.
+
+## Build
+
+```bash
+npm run build   # → dist/index.js (ESM) + dist/style.css + dist/index.d.ts
+```
+
+`npm publish` roda `prepublishOnly` (= build) e publica só `dist/` (sem sourcemaps).

package/dist/SelectActionMenu.d.ts

@@ -1,5 +1,5 @@
 import { SelectAction } from './SelectActionList';
-export declare function SelectActionMenu({ items, label, disabled, }: {
+export declare function SelectActionMenu({ items, label: labelProp, disabled, }: {
     items: SelectAction[];
     label?: string;
     disabled?: boolean;

package/dist/SelectAssistant.d.ts

@@ -42,7 +42,7 @@ export interface SelectAssistantProps {
     inputLabel?: string;
     className?: string;
 }
-export declare function SelectAssistant({ open, onOpenChange, icon, title, subtitle, launcherLabel, badge, children, scrollKey, suggestions, onSuggestion, onSend, placeholder, disabled, typing, headerAction, anchor, closeLabel, sendLabel, inputLabel, className, }: SelectAssistantProps): import("react").JSX.Element;
+export declare function SelectAssistant({ open, onOpenChange, icon, title, subtitle, launcherLabel, badge, children, scrollKey, suggestions, onSuggestion, onSend, placeholder, disabled, typing, headerAction, anchor, closeLabel: closeLabelProp, sendLabel: sendLabelProp, inputLabel: inputLabelProp, className, }: SelectAssistantProps): import("react").JSX.Element;
 export interface SelectChatMessageProps {
     /** Quem fala: o assistente (à esquerda) ou a pessoa (à direita). */
     from: 'assistant' | 'user';

package/dist/SelectBackLink.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare function SelectBackLink({ children, onClick, href, }: {
+export declare function SelectBackLink({ children: childrenProp, onClick, href, }: {
     children?: ReactNode;
     onClick?: () => void;
     href?: string;

package/dist/SelectColumnChart.d.ts

@@ -27,7 +27,16 @@ type SelectColumnChartOwnProps = {
     /** Custom hover card for slot `index`; return null for no card there. Default: the slot's
      *  label as title and one row per series. */
     tooltip?: (index: number) => SelectColumnTooltip | null;
+    /** O período anterior: uma barra clara ao lado de cada barra ("Semana anterior"). Entra na escala e no tooltip. */
+    compare?: {
+        name: string;
+        data: number[];
+    };
+    /** A média tracejada — da soma de cada ponto (empilhado) ou da 1ª série (agrupado) —, com "Média R$ 32,5 mil". */
+    average?: boolean | {
+        label?: string;
+    };
 };
 export type SelectColumnChartProps = SelectColumnChartOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectColumnChartOwnProps>;
-export declare function SelectColumnChart({ series, labels, height, format, stacked, marker, tooltip, className, ...rest }: SelectColumnChartProps): import("react").JSX.Element;
+export declare function SelectColumnChart({ series, labels, height, format, stacked, marker, tooltip, compare, average, className, ...rest }: SelectColumnChartProps): import("react").JSX.Element;
 export {};

package/dist/SelectConfirmModal.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare function SelectConfirmModal({ open, onClose, onConfirm, title, children, confirmLabel, cancelLabel, destructive, loading, theme, }: {
+export declare function SelectConfirmModal({ open, onClose, onConfirm, title, children, confirmLabel: confirmLabelProp, cancelLabel: cancelLabelProp, destructive, loading, theme, }: {
     open: boolean;
     onClose: () => void;
     onConfirm: () => void;

package/dist/SelectDatePicker.d.ts

@@ -18,7 +18,7 @@ export interface SelectDatePickerProps {
     onCancel?: () => void;
     /** CSS custom property name to drive the accent (default --select-accent). */
     accentVar?: string;
-    /** Calendar/labels language + date order (default 'en-US'). */
+    /** Calendar/labels language + date order. Default: the `SelectLocaleProvider` locale when there is one, else 'en-US'. */
     locale?: SelectDateLocale;
     /** Show the From/To time pills (default true). Off for daily ranges. */
     showTime?: boolean;

package/dist/SelectFilterBar.d.ts

@@ -2,7 +2,7 @@ import { ReactNode, ComponentPropsWithoutRef } from 'react';
 export interface SelectFilterDef {
     key: string;
     label: string;
-    type: 'text' | 'select' | 'date';
+    type: 'text' | 'select' | 'multiselect' | 'date';
     placeholder?: string;
     options?: {
         label: string;
@@ -22,6 +22,12 @@ export interface SelectFilterDef {
      */
     error?: string;
 }
+/** Os valores de uma faceta `multiselect` (`"email,sms"` → `["email", "sms"]`); vazio → `[]`. */
+export declare function splitFilterValues(value: string | undefined): string[];
+/** O inverso: a lista vira o valor da faceta, na ordem das opções quando elas são dadas. */
+export declare function joinFilterValues(values: readonly string[], options?: ReadonlyArray<{
+    value: string;
+}>): string;
 type SelectFilterBarOwnProps = {
     filters: SelectFilterDef[];
     values: Record<string, string>;

package/dist/SelectFormModal.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare function SelectFormModal({ open, onClose, onSubmit, title, subtitle, children, submitLabel, cancelLabel, submitting, submitDisabled, submitVariant, error, size, theme, }: {
+export declare function SelectFormModal({ open, onClose, onSubmit, title, subtitle, children, submitLabel: submitLabelProp, cancelLabel: cancelLabelProp, submitting, submitDisabled, submitVariant, error, size, theme, }: {
     open: boolean;
     onClose: () => void;
     onSubmit: () => void;

package/dist/SelectKpiBand.d.ts

@@ -0,0 +1,7 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+type SelectKpiBandOwnProps = {
+    children: ReactNode;
+};
+export type SelectKpiBandProps = SelectKpiBandOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectKpiBandOwnProps>;
+export declare const SelectKpiBand: import('react').ForwardRefExoticComponent<SelectKpiBandOwnProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "children"> & import('react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist/SelectLocale.d.ts

@@ -0,0 +1,92 @@
+import { ReactNode } from 'react';
+export type SelectLocaleCode = 'pt-BR' | 'en';
+export interface SelectKitMessages {
+    common: {
+        close: string;
+        cancel: string;
+        confirm: string;
+        save: string;
+        copy: string;
+        copied: string;
+        open: string;
+        back: string;
+        actions: string;
+        moreInfo: string;
+        search: string;
+        searchPlaceholder: string;
+        selectPlaceholder: string;
+        loading: string;
+        nothingFound: string;
+        noResults: string;
+        remove: (what: string) => string;
+        showPassword: string;
+        hidePassword: string;
+        notifications: string;
+        needsAttention: string;
+    };
+    pagination: {
+        label: string;
+        previous: string;
+        next: string;
+        page: (n: string) => string;
+        pageOf: (n: string, count: string) => string;
+        range: (start: string, end: string, total: string, noun: string) => string;
+        count: (total: string, noun: string) => string;
+        noun: string;
+        perPage: (n: string) => string;
+    };
+    filterBar: {
+        moreFilters: string;
+        clear: string;
+        clearAll: string;
+        clearSearch: string;
+        searchOption: string;
+        removeFilter: (label: string) => string;
+    };
+    dataTable: {
+        columns: string;
+        resetWidths: string;
+    };
+    dns: {
+        label: string;
+        type: string;
+        name: string;
+        value: string;
+    };
+    copyable: {
+        copyCode: string;
+        copyId: string;
+    };
+    assistant: {
+        send: string;
+        input: string;
+        typing: string;
+    };
+    chipInput: {
+        limit: (max: string) => string;
+    };
+    factStrip: Record<'done' | 'todo' | 'wait' | 'critical', string>;
+    setupGuide: Record<'done' | 'todo' | 'next' | 'skipped' | 'waiting', string> & {
+        progressLabel: string;
+        progress: (done: string, total: string) => string;
+    };
+    sideNav: {
+        pending: (hint: string) => string;
+    };
+}
+/** Os dicionários do kit, para quem quer conferir ou montar um texto do mesmo jeito. */
+export declare const selectKitMessages: Readonly<Record<SelectLocaleCode, SelectKitMessages>>;
+export declare function SelectLocaleProvider({ locale, children }: {
+    locale: SelectLocaleCode;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** A língua em vigor (sem provider, português). */
+export declare function useSelectLocale(): SelectLocaleCode;
+/** A língua do provider, ou `null` sem provider — para o componente que tem padrão próprio (o `SelectDatePicker`). */
+export declare function useSelectLocaleIfSet(): SelectLocaleCode | null;
+/** O dicionário da língua em vigor. */
+export declare function useSelectMessages(): SelectKitMessages;
+/** A etiqueta BCP 47 do `Intl` para a língua do kit. */
+export declare function selectIntlLocale(locale: SelectLocaleCode): string;
+/** Um inteiro como a língua escreve ("2.127" / "2,127"). */
+export declare function formatSelectNumber(n: number, locale?: SelectLocaleCode): string;

package/dist/SelectModal.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare function SelectModal({ open, onClose, eyebrow, title, subtitle, badge, children, footer, aside, size, showClose, noise, dividedHeader, backdrop, theme, placement, headerAction, flush, }: {
+export declare function SelectModal({ open, onClose, eyebrow, title, subtitle, badge, children, footer, aside, size, showClose, noise, dividedHeader, backdrop, theme, placement, headerAction, flush, dismissible, }: {
     open: boolean;
     onClose: () => void;
     /** Uma linha de contexto acima do título ("Passo a passo · ponto 1 de 5"). */
@@ -34,4 +34,9 @@ export declare function SelectModal({ open, onClose, eyebrow, title, subtitle, b
      * `SelectFactStrip` já vem com o dela.
      */
     flush?: boolean;
+    /**
+     * 0.1.187: `false` = só os botões do próprio diálogo fecham — o Esc e o clique fora não fazem nada, e o ✕ some
+     * (o segredo que aparece uma vez: quem lê confirma que guardou).
+     */
+    dismissible?: boolean;
 }): import('react').ReactPortal | null;

package/dist/SelectPage.d.ts

@@ -10,6 +10,10 @@ export interface SelectPageAction {
 type SelectPageOwnProps = {
     title?: ReactNode;
     subtitle?: ReactNode;
+    /** Acima do título, em caixa-alta espaçada ("Produção · Segunda, 02 de novembro") — 0.1.188, o tom corporativo. */
+    eyebrow?: ReactNode;
+    /** Um filete separa o cabeçalho do conteúdo (as telas de painel, como o Início). */
+    divided?: boolean;
     primaryAction?: SelectPageAction;
     secondaryActions?: SelectPageAction[];
     /** Custom node in the header action area (e.g. an "Ações" overflow menu on detail

package/dist/SelectPagination.d.ts

@@ -17,7 +17,7 @@ export interface SelectPaginationProps {
     onNext?: () => void;
     /** Jump directly to a 1-based page. Required for numbered buttons. */
     onPage?: (page: number) => void;
-    /** Noun for the count label, e.g. "produtos". Defaults to "resultados". */
+    /** Noun for the count label, e.g. "produtos". Defaults to "resultados" ("results" in English, `SelectLocaleProvider`). */
     noun?: string;
 }
 export declare const SelectPagination: import('react').ForwardRefExoticComponent<SelectPaginationProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, keyof SelectPaginationProps> & import('react').RefAttributes<HTMLElement>>;

package/dist/SelectRowActions.d.ts

@@ -6,7 +6,7 @@ export interface SelectRowAction {
     destructive?: boolean;
     disabled?: boolean;
 }
-export declare function SelectRowActions({ actions, label }: {
+export declare function SelectRowActions({ actions, label: labelProp }: {
     actions: SelectRowAction[];
     label?: string;
 }): import("react").JSX.Element;

package/dist/SelectSearchMenu.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export declare function SelectSearchMenu({ search, onSearchChange, searchPlaceholder, status, footer, width, autoFocus, selectFirstOnEnter, listMaxHeight, children, }: {
+export declare function SelectSearchMenu({ search, onSearchChange, searchPlaceholder: searchPlaceholderProp, status, footer, width, autoFocus, selectFirstOnEnter, listMaxHeight, children, }: {
     search: string;
     onSearchChange: (value: string) => void;
     searchPlaceholder?: string;

package/dist/SelectTooltip.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { SelectPlacement } from './positioning';
-export declare function SelectTooltip({ content, children, placement, delay, openOnClick, }: {
+export declare function SelectTooltip({ content, children, placement, delay, openOnClick, disabled, }: {
     content: ReactNode;
     children: ReactNode;
     placement?: SelectPlacement;
@@ -9,4 +9,7 @@ export declare function SelectTooltip({ content, children, placement, delay, ope
      *  touch, where hover never happens. While pinned the tip accepts the pointer, so the
      *  text can be selected. */
     openOnClick?: boolean;
+    /** Não abre (0.1.188): o gatilho já mostra o mesmo conteúdo noutro lugar (ex.: o painel de páginas do trilho aberto
+     *  ao lado do ícone). O embrulho continua no lugar, então o gatilho não remonta nem perde o foco. */
+    disabled?: boolean;
 }): import("react").JSX.Element;

package/dist/chartUtils.d.ts

@@ -76,6 +76,9 @@ export interface SelectChartSeries {
      *  gradient — the second encoding for "not happened yet" (scheduled, projected), so the
      *  difference never rides on color alone. */
     pattern?: 'hatch';
+    /** SelectColumnChart: o contorno da barra — para a cor clara que sozinha não chega a 3:1 no fundo (o dourado do
+     *  pendente usa `var(--select-chart-pending-edge)`). */
+    edge?: string;
     /** SelectLineChart: linha tracejada e mais clara, sem área — a COMPARAÇÃO (o período anterior),
      *  que fica atrás da série principal sem disputar com ela. Pode ser mais curta que `labels`. */
     dashed?: boolean;

package/dist/icons.d.ts

@@ -202,6 +202,8 @@ export declare function GiftIcon(): import("react").JSX.Element;
 export declare function HeadsetIcon(): import("react").JSX.Element;
 /** WhatsApp no traço da casa (não a marca colorida) — o canal da mensagem, o selo de atendimento. */
 export declare function WhatsAppIcon(): import("react").JSX.Element;
+/** SMS (Iconsax message-text, 0.1.187) — o canal SMS, ao lado do `MailIcon` e do `WhatsAppIcon` (o selo do canal). */
+export declare function SmsIcon(): import("react").JSX.Element;
 /** Imagem (Iconsax gallery) — o bloco de imagem de um e-mail, a foto de um produto. */
 export declare function ImageIcon(): import("react").JSX.Element;
 /** Alça de arrastar (6 pontos) — a de toda lista e grade que se reordena. Preenchido: pontos não têm traço. */

package/dist/index.d.ts

@@ -123,7 +123,9 @@ export { SelectOfferPrice } from './SelectOfferPrice';
 export { SelectRatingQuote } from './SelectRatingQuote';
 export { SelectMarkStack } from './SelectMarkStack';
 export { SelectPagination } from './SelectPagination';
-export { SelectFilterBar } from './SelectFilterBar';
+export { SelectFilterBar, splitFilterValues, joinFilterValues } from './SelectFilterBar';
+export { SelectLocaleProvider, useSelectLocale, useSelectMessages, selectKitMessages, selectIntlLocale, formatSelectNumber, } from './SelectLocale';
+export type { SelectLocaleCode, SelectKitMessages } from './SelectLocale';
 export { SelectTagSelect } from './SelectTagSelect';
 export { SelectSurface } from './SelectSurface';
 export { SelectToastProvider, useSelectToast } from './SelectToast';
@@ -132,6 +134,8 @@ export { SelectMoney, SelectSensitiveValue, SelectMetricDelta, SelectHideMoneyTo
 export { SelectBalanceCard } from './SelectBalanceCard';
 export { SelectFeeBreakdown } from './SelectFeeBreakdown';
 export { SelectKpiCard } from './SelectKpiCard';
+export { SelectKpiBand } from './SelectKpiBand';
+export type { SelectKpiBandProps } from './SelectKpiBand';
 export { SelectInsight, SelectInsightList, SelectInsightRow, formatInsightImpact } from './SelectInsight';
 export { SelectAssistant, SelectChatMessage, SelectChatTurn, SelectChatTyping } from './SelectAssistant';
 export { SelectNumberedList, SelectNumberedItem } from './SelectNumberedList';