tempest-react-sdk 0.38.2 → 0.38.3

package/dist/components/Chat/Chat.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chat.js","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Chat.js","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — message grouping needs\n * more context than a list does: currentUserId to decide sides, groupWindowMs and\n * now to decide where a bubble group breaks, typing for the indicator. The remaining\n * props are the composer's (placeholder, composerActions, composerDisabled, onSend,\n * onSendError) and the slots (renderAvatar, header, emptyState).\n */\nimport { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/ChipInput/ChipInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChipInput.cjs","names":[],"sources":["../../../src/components/ChipInput/ChipInput.tsx"],"sourcesContent":["import { useId, useRef, useState } from \"react\";\nimport type { KeyboardEvent } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ChipInput.module.css\";\n\nexport interface ChipInputProps {\n    value: string[];\n    onChange: (next: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    /** Id for the inner input. Generated when omitted. */\n    id?: string;\n    /**\n     * Accessible name for the inner input when there is no visible `label`.\n     * Without either, screen readers announce an unnamed text field.\n     */\n    \"aria-label\"?: string;\n    /** Keys that commit the current draft as a chip. Default: Enter, comma, Tab. */\n    commitKeys?: string[];\n    /** Lowercase + trim each chip + dedupe. Default: true. */\n    normalize?: boolean;\n    className?: string;\n}\n\n/**\n * Multi-value input. Type a value and press Enter (or comma / Tab) to push a\n * chip. Backspace on empty input removes the last chip.\n *\n * Name the field with `label` (associated through `htmlFor`) or, when the label\n * lives elsewhere in the layout, with `aria-label`. The placeholder is not an\n * accessible name — it disappears as soon as the first chip is added.\n */\nexport function ChipInput({\n    value,\n    onChange,\n    label,\n    placeholder = \"Adicionar e pressionar Enter…\",\n    helperText,\n    error,\n    commitKeys = [\"Enter\", \",\", \"Tab\"],\n    normalize = true,\n    className,\n    id,\n    \"aria-label\": ariaLabel,\n}: ChipInputProps) {\n    const [draft, setDraft] = useState<string>(\"\");\n    const inputRef = useRef<HTMLInputElement>(null);\n    const generatedId = useId();\n    const inputId = id ?? generatedId;\n    const describedById = error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined;\n\n    function commit(): void {\n        const next = normalize ? draft.trim().toLowerCase() : draft.trim();\n        if (!next) return;\n        if (value.includes(next)) {\n            setDraft(\"\");\n            return;\n        }\n        onChange([...value, next]);\n        setDraft(\"\");\n    }\n\n    function handleKeyDown(event: KeyboardEvent<HTMLInputElement>): void {\n        if (commitKeys.includes(event.key)) {\n            event.preventDefault();\n            commit();\n            return;\n        }\n        if (event.key === \"Backspace\" && !draft && value.length > 0) {\n            onChange(value.slice(0, -1));\n        }\n    }\n\n    function remove(index: number): void {\n        const next = value.slice();\n        next.splice(index, 1);\n        onChange(next);\n    }\n\n    return (\n        <div className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={inputId} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field} onClick={() => inputRef.current?.focus()}>\n                {value.map((chip, index) => (\n                    <span key={`${chip}-${index}`} className={styles.chip}>\n                        {chip}\n                        <button\n                            type=\"button\"\n                            className={styles.remove}\n                            aria-label={`Remover ${chip}`}\n                            onClick={() => remove(index)}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    ref={inputRef}\n                    id={inputId}\n                    className={styles.input}\n                    value={draft}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    aria-label={label ? undefined : ariaLabel}\n                    aria-invalid={!!error}\n                    aria-describedby={describedById}\n                    onChange={(event) => setDraft(event.target.value)}\n                    onKeyDown={handleKeyDown}\n                    onBlur={commit}\n                />\n            </div>\n            {error ? (\n                <span id={`${inputId}-error`} className={styles.errorText}>\n                    {error}\n                </span>\n            ) : helperText ? (\n                <span id={`${inputId}-helper`} className={styles.helper}>\n                    {helperText}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"gIAkCA,SAAgB,EAAU,CACtB,QACA,WACA,QACA,cAAc,gCACd,aACA,QACA,aAAa,CAAC,QAAS,IAAK,KAAK,EACjC,YAAY,GACZ,YACA,KACA,aAAc,GACC,CACf,GAAM,CAAC,EAAO,IAAA,EAAA,EAAA,SAAA,CAA6B,EAAE,EACvC,GAAA,EAAA,EAAA,OAAA,CAAoC,IAAI,EACxC,GAAA,EAAA,EAAA,MAAA,CAAoB,EACpB,EAAU,GAAM,EAChB,EAAgB,EAAQ,GAAG,EAAQ,QAAU,EAAa,GAAG,EAAQ,SAAW,IAAA,GAEtF,SAAS,GAAe,CACpB,IAAM,EAAO,EAAY,EAAM,KAAK,CAAC,CAAC,YAAY,EAAI,EAAM,KAAK,EAC5D,KACL,IAAI,EAAM,SAAS,CAAI,EAAG,CACtB,EAAS,EAAE,EACX,MACJ,CACA,EAAS,CAAC,GAAG,EAAO,CAAI,CAAC,EACzB,EAAS,EAAE,CAFX,CAGJ,CAEA,SAAS,EAAc,EAA8C,CACjE,GAAI,EAAW,SAAS,EAAM,GAAG,EAAG,CAChC,EAAM,eAAe,EACrB,EAAO,EACP,MACJ,CACI,EAAM,MAAQ,aAAe,CAAC,GAAS,EAAM,OAAS,GACtD,EAAS,EAAM,MAAM,EAAG,EAAE,CAAC,CAEnC,CAEA,SAAS,EAAO,EAAqB,CACjC,IAAM,EAAO,EAAM,MAAM,EACzB,EAAK,OAAO,EAAO,CAAC,EACpB,EAAS,CAAI,CACjB,CAEA,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,QAAS,GAAS,EAAA,QAAO,MAAO,CAAS,WAAnE,CACK,IACG,EAAA,EAAA,IAAA,CAAC,QAAD,CAAO,QAAS,EAAS,UAAW,EAAA,QAAO,eACtC,CACE,CAAA,GAEX,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,MAAO,YAAe,EAAS,SAAS,MAAM,WAArE,CACK,EAAM,KAAK,EAAM,KACd,EAAA,EAAA,KAAA,CAAC,OAAD,CAA+B,UAAW,EAAA,QAAO,cAAjD,CACK,GACD,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,OAClB,aAAY,WAAW,IACvB,YAAe,EAAO,CAAK,WAC9B,GAEO,CAAA,CACN,GAVK,GAAG,EAAK,GAAG,GAUhB,CACT,GACD,EAAA,EAAA,IAAA,CAAC,QAAD,CACI,IAAK,EACL,GAAI,EACJ,UAAW,EAAA,QAAO,MAClB,MAAO,EACP,YAAa,EAAM,SAAW,EAAI,EAAc,GAChD,aAAY,EAAQ,IAAA,GAAY,EAChC,eAAc,CAAC,CAAC,EAChB,mBAAkB,EAClB,SAAW,GAAU,EAAS,EAAM,OAAO,KAAK,EAChD,UAAW,EACX,OAAQ,CACX,CAAA,CACA,IACJ,GACG,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAG,EAAQ,QAAS,UAAW,EAAA,QAAO,mBAC3C,CACC,CAAA,EACN,GACA,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAG,EAAQ,SAAU,UAAW,EAAA,QAAO,gBAC5C,CACC,CAAA,EACN,IACH,GAEb"}
+{"version":3,"file":"ChipInput.cjs","names":[],"sources":["../../../src/components/ChipInput/ChipInput.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — the eight or so props that repeat across every input\n * in the SDK are one contract, not a bag: label, helperText and error are the three\n * states of the same message slot, and dropping any of them pushes the app back to\n * building the label/help/error scaffolding by hand around a bare control. Beyond\n * those, ChipInput adds only commitKeys and normalize, which are what make it a chip\n * input rather than a text field.\n */\nimport { useId, useRef, useState } from \"react\";\nimport type { KeyboardEvent } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ChipInput.module.css\";\n\nexport interface ChipInputProps {\n    value: string[];\n    onChange: (next: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    /** Id for the inner input. Generated when omitted. */\n    id?: string;\n    /**\n     * Accessible name for the inner input when there is no visible `label`.\n     * Without either, screen readers announce an unnamed text field.\n     */\n    \"aria-label\"?: string;\n    /** Keys that commit the current draft as a chip. Default: Enter, comma, Tab. */\n    commitKeys?: string[];\n    /** Lowercase + trim each chip + dedupe. Default: true. */\n    normalize?: boolean;\n    className?: string;\n}\n\n/**\n * Multi-value input. Type a value and press Enter (or comma / Tab) to push a\n * chip. Backspace on empty input removes the last chip.\n *\n * Name the field with `label` (associated through `htmlFor`) or, when the label\n * lives elsewhere in the layout, with `aria-label`. The placeholder is not an\n * accessible name — it disappears as soon as the first chip is added.\n */\nexport function ChipInput({\n    value,\n    onChange,\n    label,\n    placeholder = \"Adicionar e pressionar Enter…\",\n    helperText,\n    error,\n    commitKeys = [\"Enter\", \",\", \"Tab\"],\n    normalize = true,\n    className,\n    id,\n    \"aria-label\": ariaLabel,\n}: ChipInputProps) {\n    const [draft, setDraft] = useState<string>(\"\");\n    const inputRef = useRef<HTMLInputElement>(null);\n    const generatedId = useId();\n    const inputId = id ?? generatedId;\n    const describedById = error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined;\n\n    function commit(): void {\n        const next = normalize ? draft.trim().toLowerCase() : draft.trim();\n        if (!next) return;\n        if (value.includes(next)) {\n            setDraft(\"\");\n            return;\n        }\n        onChange([...value, next]);\n        setDraft(\"\");\n    }\n\n    function handleKeyDown(event: KeyboardEvent<HTMLInputElement>): void {\n        if (commitKeys.includes(event.key)) {\n            event.preventDefault();\n            commit();\n            return;\n        }\n        if (event.key === \"Backspace\" && !draft && value.length > 0) {\n            onChange(value.slice(0, -1));\n        }\n    }\n\n    function remove(index: number): void {\n        const next = value.slice();\n        next.splice(index, 1);\n        onChange(next);\n    }\n\n    return (\n        <div className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={inputId} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field} onClick={() => inputRef.current?.focus()}>\n                {value.map((chip, index) => (\n                    <span key={`${chip}-${index}`} className={styles.chip}>\n                        {chip}\n                        <button\n                            type=\"button\"\n                            className={styles.remove}\n                            aria-label={`Remover ${chip}`}\n                            onClick={() => remove(index)}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    ref={inputRef}\n                    id={inputId}\n                    className={styles.input}\n                    value={draft}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    aria-label={label ? undefined : ariaLabel}\n                    aria-invalid={!!error}\n                    aria-describedby={describedById}\n                    onChange={(event) => setDraft(event.target.value)}\n                    onKeyDown={handleKeyDown}\n                    onBlur={commit}\n                />\n            </div>\n            {error ? (\n                <span id={`${inputId}-error`} className={styles.errorText}>\n                    {error}\n                </span>\n            ) : helperText ? (\n                <span id={`${inputId}-helper`} className={styles.helper}>\n                    {helperText}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"gIA0CA,SAAgB,EAAU,CACtB,QACA,WACA,QACA,cAAc,gCACd,aACA,QACA,aAAa,CAAC,QAAS,IAAK,KAAK,EACjC,YAAY,GACZ,YACA,KACA,aAAc,GACC,CACf,GAAM,CAAC,EAAO,IAAA,EAAA,EAAA,SAAA,CAA6B,EAAE,EACvC,GAAA,EAAA,EAAA,OAAA,CAAoC,IAAI,EACxC,GAAA,EAAA,EAAA,MAAA,CAAoB,EACpB,EAAU,GAAM,EAChB,EAAgB,EAAQ,GAAG,EAAQ,QAAU,EAAa,GAAG,EAAQ,SAAW,IAAA,GAEtF,SAAS,GAAe,CACpB,IAAM,EAAO,EAAY,EAAM,KAAK,CAAC,CAAC,YAAY,EAAI,EAAM,KAAK,EAC5D,KACL,IAAI,EAAM,SAAS,CAAI,EAAG,CACtB,EAAS,EAAE,EACX,MACJ,CACA,EAAS,CAAC,GAAG,EAAO,CAAI,CAAC,EACzB,EAAS,EAAE,CAFX,CAGJ,CAEA,SAAS,EAAc,EAA8C,CACjE,GAAI,EAAW,SAAS,EAAM,GAAG,EAAG,CAChC,EAAM,eAAe,EACrB,EAAO,EACP,MACJ,CACI,EAAM,MAAQ,aAAe,CAAC,GAAS,EAAM,OAAS,GACtD,EAAS,EAAM,MAAM,EAAG,EAAE,CAAC,CAEnC,CAEA,SAAS,EAAO,EAAqB,CACjC,IAAM,EAAO,EAAM,MAAM,EACzB,EAAK,OAAO,EAAO,CAAC,EACpB,EAAS,CAAI,CACjB,CAEA,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,QAAS,GAAS,EAAA,QAAO,MAAO,CAAS,WAAnE,CACK,IACG,EAAA,EAAA,IAAA,CAAC,QAAD,CAAO,QAAS,EAAS,UAAW,EAAA,QAAO,eACtC,CACE,CAAA,GAEX,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,MAAO,YAAe,EAAS,SAAS,MAAM,WAArE,CACK,EAAM,KAAK,EAAM,KACd,EAAA,EAAA,KAAA,CAAC,OAAD,CAA+B,UAAW,EAAA,QAAO,cAAjD,CACK,GACD,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,OAClB,aAAY,WAAW,IACvB,YAAe,EAAO,CAAK,WAC9B,GAEO,CAAA,CACN,GAVK,GAAG,EAAK,GAAG,GAUhB,CACT,GACD,EAAA,EAAA,IAAA,CAAC,QAAD,CACI,IAAK,EACL,GAAI,EACJ,UAAW,EAAA,QAAO,MAClB,MAAO,EACP,YAAa,EAAM,SAAW,EAAI,EAAc,GAChD,aAAY,EAAQ,IAAA,GAAY,EAChC,eAAc,CAAC,CAAC,EAChB,mBAAkB,EAClB,SAAW,GAAU,EAAS,EAAM,OAAO,KAAK,EAChD,UAAW,EACX,OAAQ,CACX,CAAA,CACA,IACJ,GACG,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAG,EAAQ,QAAS,UAAW,EAAA,QAAO,mBAC3C,CACC,CAAA,EACN,GACA,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,GAAI,GAAG,EAAQ,SAAU,UAAW,EAAA,QAAO,gBAC5C,CACC,CAAA,EACN,IACH,GAEb"}

package/dist/components/ChipInput/ChipInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipInput.js","names":[],"sources":["../../../src/components/ChipInput/ChipInput.tsx"],"sourcesContent":["import { useId, useRef, useState } from \"react\";\nimport type { KeyboardEvent } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ChipInput.module.css\";\n\nexport interface ChipInputProps {\n    value: string[];\n    onChange: (next: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    /** Id for the inner input. Generated when omitted. */\n    id?: string;\n    /**\n     * Accessible name for the inner input when there is no visible `label`.\n     * Without either, screen readers announce an unnamed text field.\n     */\n    \"aria-label\"?: string;\n    /** Keys that commit the current draft as a chip. Default: Enter, comma, Tab. */\n    commitKeys?: string[];\n    /** Lowercase + trim each chip + dedupe. Default: true. */\n    normalize?: boolean;\n    className?: string;\n}\n\n/**\n * Multi-value input. Type a value and press Enter (or comma / Tab) to push a\n * chip. Backspace on empty input removes the last chip.\n *\n * Name the field with `label` (associated through `htmlFor`) or, when the label\n * lives elsewhere in the layout, with `aria-label`. The placeholder is not an\n * accessible name — it disappears as soon as the first chip is added.\n */\nexport function ChipInput({\n    value,\n    onChange,\n    label,\n    placeholder = \"Adicionar e pressionar Enter…\",\n    helperText,\n    error,\n    commitKeys = [\"Enter\", \",\", \"Tab\"],\n    normalize = true,\n    className,\n    id,\n    \"aria-label\": ariaLabel,\n}: ChipInputProps) {\n    const [draft, setDraft] = useState<string>(\"\");\n    const inputRef = useRef<HTMLInputElement>(null);\n    const generatedId = useId();\n    const inputId = id ?? generatedId;\n    const describedById = error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined;\n\n    function commit(): void {\n        const next = normalize ? draft.trim().toLowerCase() : draft.trim();\n        if (!next) return;\n        if (value.includes(next)) {\n            setDraft(\"\");\n            return;\n        }\n        onChange([...value, next]);\n        setDraft(\"\");\n    }\n\n    function handleKeyDown(event: KeyboardEvent<HTMLInputElement>): void {\n        if (commitKeys.includes(event.key)) {\n            event.preventDefault();\n            commit();\n            return;\n        }\n        if (event.key === \"Backspace\" && !draft && value.length > 0) {\n            onChange(value.slice(0, -1));\n        }\n    }\n\n    function remove(index: number): void {\n        const next = value.slice();\n        next.splice(index, 1);\n        onChange(next);\n    }\n\n    return (\n        <div className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={inputId} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field} onClick={() => inputRef.current?.focus()}>\n                {value.map((chip, index) => (\n                    <span key={`${chip}-${index}`} className={styles.chip}>\n                        {chip}\n                        <button\n                            type=\"button\"\n                            className={styles.remove}\n                            aria-label={`Remover ${chip}`}\n                            onClick={() => remove(index)}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    ref={inputRef}\n                    id={inputId}\n                    className={styles.input}\n                    value={draft}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    aria-label={label ? undefined : ariaLabel}\n                    aria-invalid={!!error}\n                    aria-describedby={describedById}\n                    onChange={(event) => setDraft(event.target.value)}\n                    onKeyDown={handleKeyDown}\n                    onBlur={commit}\n                />\n            </div>\n            {error ? (\n                <span id={`${inputId}-error`} className={styles.errorText}>\n                    {error}\n                </span>\n            ) : helperText ? (\n                <span id={`${inputId}-helper`} className={styles.helper}>\n                    {helperText}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAkCA,SAAgB,EAAU,EACtB,UACA,aACA,UACA,iBAAc,iCACd,eACA,UACA,gBAAa;CAAC;CAAS;CAAK;AAAK,GACjC,eAAY,IACZ,cACA,OACA,cAAc,KACC;CACf,IAAM,CAAC,GAAO,KAAY,EAAiB,EAAE,GACvC,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAChB,IAAgB,IAAQ,GAAG,EAAQ,UAAU,IAAa,GAAG,EAAQ,WAAW,KAAA;CAEtF,SAAS,IAAe;EACpB,IAAM,IAAO,IAAY,EAAM,KAAK,CAAC,CAAC,YAAY,IAAI,EAAM,KAAK;EAC5D,OACL;OAAI,EAAM,SAAS,CAAI,GAAG;IACtB,EAAS,EAAE;IACX;GACJ;GAEA,AADA,EAAS,CAAC,GAAG,GAAO,CAAI,CAAC,GACzB,EAAS,EAAE;EAFX;CAGJ;CAEA,SAAS,EAAc,GAA8C;EACjE,IAAI,EAAW,SAAS,EAAM,GAAG,GAAG;GAEhC,AADA,EAAM,eAAe,GACrB,EAAO;GACP;EACJ;EACA,AAAI,EAAM,QAAQ,eAAe,CAAC,KAAS,EAAM,SAAS,KACtD,EAAS,EAAM,MAAM,GAAG,EAAE,CAAC;CAEnC;CAEA,SAAS,EAAO,GAAqB;EACjC,IAAM,IAAO,EAAM,MAAM;EAEzB,AADA,EAAK,OAAO,GAAO,CAAC,GACpB,EAAS,CAAI;CACjB;CAEA,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,SAAS,KAAS,EAAO,OAAO,CAAS;YAAnE;GACK,KACG,kBAAC,SAAD;IAAO,SAAS;IAAS,WAAW,EAAO;cACtC;GACE,CAAA;GAEX,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,eAAe,EAAS,SAAS,MAAM;cAArE,CACK,EAAM,KAAK,GAAM,MACd,kBAAC,QAAD;KAA+B,WAAW,EAAO;eAAjD,CACK,GACD,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,cAAY,WAAW;MACvB,eAAe,EAAO,CAAK;gBAC9B;KAEO,CAAA,CACN;OAVK,GAAG,EAAK,GAAG,GAUhB,CACT,GACD,kBAAC,SAAD;KACI,KAAK;KACL,IAAI;KACJ,WAAW,EAAO;KAClB,OAAO;KACP,aAAa,EAAM,WAAW,IAAI,IAAc;KAChD,cAAY,IAAQ,KAAA,IAAY;KAChC,gBAAc,CAAC,CAAC;KAChB,oBAAkB;KAClB,WAAW,MAAU,EAAS,EAAM,OAAO,KAAK;KAChD,WAAW;KACX,QAAQ;IACX,CAAA,CACA;;GACJ,IACG,kBAAC,QAAD;IAAM,IAAI,GAAG,EAAQ;IAAS,WAAW,EAAO;cAC3C;GACC,CAAA,IACN,IACA,kBAAC,QAAD;IAAM,IAAI,GAAG,EAAQ;IAAU,WAAW,EAAO;cAC5C;GACC,CAAA,IACN;EACH;;AAEb"}
+{"version":3,"file":"ChipInput.js","names":[],"sources":["../../../src/components/ChipInput/ChipInput.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — the eight or so props that repeat across every input\n * in the SDK are one contract, not a bag: label, helperText and error are the three\n * states of the same message slot, and dropping any of them pushes the app back to\n * building the label/help/error scaffolding by hand around a bare control. Beyond\n * those, ChipInput adds only commitKeys and normalize, which are what make it a chip\n * input rather than a text field.\n */\nimport { useId, useRef, useState } from \"react\";\nimport type { KeyboardEvent } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ChipInput.module.css\";\n\nexport interface ChipInputProps {\n    value: string[];\n    onChange: (next: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    /** Id for the inner input. Generated when omitted. */\n    id?: string;\n    /**\n     * Accessible name for the inner input when there is no visible `label`.\n     * Without either, screen readers announce an unnamed text field.\n     */\n    \"aria-label\"?: string;\n    /** Keys that commit the current draft as a chip. Default: Enter, comma, Tab. */\n    commitKeys?: string[];\n    /** Lowercase + trim each chip + dedupe. Default: true. */\n    normalize?: boolean;\n    className?: string;\n}\n\n/**\n * Multi-value input. Type a value and press Enter (or comma / Tab) to push a\n * chip. Backspace on empty input removes the last chip.\n *\n * Name the field with `label` (associated through `htmlFor`) or, when the label\n * lives elsewhere in the layout, with `aria-label`. The placeholder is not an\n * accessible name — it disappears as soon as the first chip is added.\n */\nexport function ChipInput({\n    value,\n    onChange,\n    label,\n    placeholder = \"Adicionar e pressionar Enter…\",\n    helperText,\n    error,\n    commitKeys = [\"Enter\", \",\", \"Tab\"],\n    normalize = true,\n    className,\n    id,\n    \"aria-label\": ariaLabel,\n}: ChipInputProps) {\n    const [draft, setDraft] = useState<string>(\"\");\n    const inputRef = useRef<HTMLInputElement>(null);\n    const generatedId = useId();\n    const inputId = id ?? generatedId;\n    const describedById = error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined;\n\n    function commit(): void {\n        const next = normalize ? draft.trim().toLowerCase() : draft.trim();\n        if (!next) return;\n        if (value.includes(next)) {\n            setDraft(\"\");\n            return;\n        }\n        onChange([...value, next]);\n        setDraft(\"\");\n    }\n\n    function handleKeyDown(event: KeyboardEvent<HTMLInputElement>): void {\n        if (commitKeys.includes(event.key)) {\n            event.preventDefault();\n            commit();\n            return;\n        }\n        if (event.key === \"Backspace\" && !draft && value.length > 0) {\n            onChange(value.slice(0, -1));\n        }\n    }\n\n    function remove(index: number): void {\n        const next = value.slice();\n        next.splice(index, 1);\n        onChange(next);\n    }\n\n    return (\n        <div className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={inputId} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field} onClick={() => inputRef.current?.focus()}>\n                {value.map((chip, index) => (\n                    <span key={`${chip}-${index}`} className={styles.chip}>\n                        {chip}\n                        <button\n                            type=\"button\"\n                            className={styles.remove}\n                            aria-label={`Remover ${chip}`}\n                            onClick={() => remove(index)}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    ref={inputRef}\n                    id={inputId}\n                    className={styles.input}\n                    value={draft}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    aria-label={label ? undefined : ariaLabel}\n                    aria-invalid={!!error}\n                    aria-describedby={describedById}\n                    onChange={(event) => setDraft(event.target.value)}\n                    onKeyDown={handleKeyDown}\n                    onBlur={commit}\n                />\n            </div>\n            {error ? (\n                <span id={`${inputId}-error`} className={styles.errorText}>\n                    {error}\n                </span>\n            ) : helperText ? (\n                <span id={`${inputId}-helper`} className={styles.helper}>\n                    {helperText}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":";;;;;AA0CA,SAAgB,EAAU,EACtB,UACA,aACA,UACA,iBAAc,iCACd,eACA,UACA,gBAAa;CAAC;CAAS;CAAK;AAAK,GACjC,eAAY,IACZ,cACA,OACA,cAAc,KACC;CACf,IAAM,CAAC,GAAO,KAAY,EAAiB,EAAE,GACvC,IAAW,EAAyB,IAAI,GACxC,IAAc,EAAM,GACpB,IAAU,KAAM,GAChB,IAAgB,IAAQ,GAAG,EAAQ,UAAU,IAAa,GAAG,EAAQ,WAAW,KAAA;CAEtF,SAAS,IAAe;EACpB,IAAM,IAAO,IAAY,EAAM,KAAK,CAAC,CAAC,YAAY,IAAI,EAAM,KAAK;EAC5D,OACL;OAAI,EAAM,SAAS,CAAI,GAAG;IACtB,EAAS,EAAE;IACX;GACJ;GAEA,AADA,EAAS,CAAC,GAAG,GAAO,CAAI,CAAC,GACzB,EAAS,EAAE;EAFX;CAGJ;CAEA,SAAS,EAAc,GAA8C;EACjE,IAAI,EAAW,SAAS,EAAM,GAAG,GAAG;GAEhC,AADA,EAAM,eAAe,GACrB,EAAO;GACP;EACJ;EACA,AAAI,EAAM,QAAQ,eAAe,CAAC,KAAS,EAAM,SAAS,KACtD,EAAS,EAAM,MAAM,GAAG,EAAE,CAAC;CAEnC;CAEA,SAAS,EAAO,GAAqB;EACjC,IAAM,IAAO,EAAM,MAAM;EAEzB,AADA,EAAK,OAAO,GAAO,CAAC,GACpB,EAAS,CAAI;CACjB;CAEA,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,SAAS,KAAS,EAAO,OAAO,CAAS;YAAnE;GACK,KACG,kBAAC,SAAD;IAAO,SAAS;IAAS,WAAW,EAAO;cACtC;GACE,CAAA;GAEX,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,eAAe,EAAS,SAAS,MAAM;cAArE,CACK,EAAM,KAAK,GAAM,MACd,kBAAC,QAAD;KAA+B,WAAW,EAAO;eAAjD,CACK,GACD,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,cAAY,WAAW;MACvB,eAAe,EAAO,CAAK;gBAC9B;KAEO,CAAA,CACN;OAVK,GAAG,EAAK,GAAG,GAUhB,CACT,GACD,kBAAC,SAAD;KACI,KAAK;KACL,IAAI;KACJ,WAAW,EAAO;KAClB,OAAO;KACP,aAAa,EAAM,WAAW,IAAI,IAAc;KAChD,cAAY,IAAQ,KAAA,IAAY;KAChC,gBAAc,CAAC,CAAC;KAChB,oBAAkB;KAClB,WAAW,MAAU,EAAS,EAAM,OAAO,KAAK;KAChD,WAAW;KACX,QAAQ;IACX,CAAA,CACA;;GACJ,IACG,kBAAC,QAAD;IAAM,IAAI,GAAG,EAAQ;IAAS,WAAW,EAAO;cAC3C;GACC,CAAA,IACN,IACA,kBAAC,QAAD;IAAM,IAAI,GAAG,EAAQ;IAAU,WAAW,EAAO;cAC5C;GACC,CAAA,IACN;EACH;;AAEb"}

package/dist/components/CodeBlock/CodeBlock.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.cjs","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { Fragment, useMemo } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { CopyButton } from \"../CopyButton\";\nimport { resolveLanguage, tokenizeLines } from \"./tokenize\";\nimport styles from \"./CodeBlock.module.css\";\n\nexport interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** The source to display. Leading and trailing blank lines are trimmed. */\n    code: string;\n    /** Grammar name or alias (`ts`, `bash`, `json`…). Unknown values render plain. */\n    language?: string;\n    /** Shown in the header, usually a file path. */\n    filename?: ReactNode;\n    /** Number the lines. Default `false`. */\n    showLineNumbers?: boolean;\n    /** 1-based line numbers to mark as the point of the snippet. */\n    highlightLines?: readonly number[];\n    /** Offer a copy button. Default `true`. */\n    copyable?: boolean;\n    /** Cap the height in px or any CSS length; the body scrolls past it. */\n    maxHeight?: number | string;\n    /** Wrap long lines instead of scrolling sideways. Default `false`. */\n    wrap?: boolean;\n    /**\n     * Accessible name for the code region. Defaults to naming the language, and\n     * to the filename when there is one.\n     */\n    label?: string;\n}\n\n/**\n * A read-only code sample: syntax colours, optional line numbers, copy button.\n *\n * The `<pre>` is always focusable. A code block is scrollable and holds nothing\n * focusable inside, so without a tab stop a keyboard user can see there is more\n * code past the edge and has no way to reach it. It is the one scroll container\n * where the stop is unconditional rather than measured — a code sample is\n * expected to be reachable, read and selected on its own.\n *\n * Colours come from an approximate scanner, not a parser — see {@link tokenize}.\n *\n * @example\n * <CodeBlock code={snippet} language=\"ts\" filename=\"src/main.ts\" showLineNumbers />\n * <CodeBlock code={log} language=\"bash\" maxHeight={280} />\n */\nexport function CodeBlock({\n    code,\n    language,\n    filename,\n    showLineNumbers = false,\n    highlightLines,\n    copyable = true,\n    maxHeight,\n    wrap = false,\n    label,\n    className,\n    ...rest\n}: CodeBlockProps) {\n    const trimmed = useMemo(() => code.replace(/^\\n+/, \"\").replace(/\\s+$/, \"\"), [code]);\n    const lines = useMemo(() => tokenizeLines(trimmed, language), [trimmed, language]);\n    const resolved = resolveLanguage(language);\n    const marked = useMemo(() => new Set(highlightLines ?? []), [highlightLines]);\n\n    const name =\n        label ??\n        (filename && typeof filename === \"string\"\n            ? `Código: ${filename}`\n            : `Bloco de código${resolved === \"plain\" ? \"\" : ` em ${resolved}`}`);\n\n    const hasHeader = Boolean(filename) || copyable;\n\n    return (\n        <div className={cn(styles.wrapper, className)} {...rest}>\n            {hasHeader && (\n                <div className={styles.header}>\n                    <span className={styles.filename}>\n                        {filename ?? (resolved === \"plain\" ? \"\" : resolved)}\n                    </span>\n                    {copyable && <CopyButton value={trimmed} className={styles.copy} />}\n                </div>\n            )}\n\n            <pre\n                className={cn(styles.pre, wrap && styles.wrap)}\n                style={{ maxHeight }}\n                tabIndex={0}\n                role=\"group\"\n                aria-label={name}\n            >\n                <code className={styles.code} data-language={resolved}>\n                    {lines.map((tokens, index) => (\n                        <Fragment key={index}>\n                            <span\n                                className={cn(styles.line, marked.has(index + 1) && styles.marked)}\n                            >\n                                {showLineNumbers && (\n                                    /*\n                                     * The number is decoration: it must not land in the\n                                     * clipboard when the reader selects the snippet, and a\n                                     * screen reader announcing \"one const two import\" adds\n                                     * nothing. `user-select: none` in CSS plus this.\n                                     */\n                                    <span className={styles.lineNumber} aria-hidden=\"true\">\n                                        {index + 1}\n                                    </span>\n                                )}\n                                <span className={styles.lineContent}>\n                                    {tokens.map((token, tokenIndex) => (\n                                        <span\n                                            key={tokenIndex}\n                                            className={styles[token.kind]}\n                                            data-token={token.kind}\n                                        >\n                                            {token.value}\n                                        </span>\n                                    ))}\n                                </span>\n                            </span>\n                            {/*\n                             * A real newline character, and outside the line box.\n                             * It has to be real so that selecting the snippet by\n                             * hand and copying yields the source instead of one\n                             * run-together line. It has to be outside because the\n                             * line is an inline-block: a newline within one is\n                             * consumed inside that box, and every line ends up\n                             * side by side on a single row. The last one is\n                             * dropped so the block does not end in blank space.\n                             */}\n                            {index < lines.length - 1 ? \"\\n\" : null}\n                        </Fragment>\n                    ))}\n                </code>\n            </pre>\n        </div>\n    );\n}\n"],"mappings":"sMAgDA,SAAgB,EAAU,CACtB,OACA,WACA,WACA,kBAAkB,GAClB,iBACA,WAAW,GACX,YACA,OAAO,GACP,QACA,YACA,GAAG,GACY,CACf,IAAM,GAAA,EAAA,EAAA,QAAA,KAAwB,EAAK,QAAQ,OAAQ,EAAE,CAAC,CAAC,QAAQ,OAAQ,EAAE,EAAG,CAAC,CAAI,CAAC,EAC5E,GAAA,EAAA,EAAA,QAAA,KAAsB,EAAA,cAAc,EAAS,CAAQ,EAAG,CAAC,EAAS,CAAQ,CAAC,EAC3E,EAAW,EAAA,gBAAgB,CAAQ,EACnC,GAAA,EAAA,EAAA,QAAA,KAAuB,IAAI,IAAI,GAAkB,CAAC,CAAC,EAAG,CAAC,CAAc,CAAC,EAEtE,EACF,IACC,GAAY,OAAO,GAAa,SAC3B,WAAW,IACX,kBAAkB,IAAa,QAAU,GAAK,OAAO,OAEzD,EAAY,EAAQ,GAAa,EAEvC,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,QAAS,CAAS,EAAG,GAAI,WAAnD,CACK,IACG,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAvB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBACnB,IAAa,IAAa,QAAU,GAAK,EACxC,CAAA,EACL,IAAY,EAAA,EAAA,IAAA,CAAC,EAAA,WAAD,CAAY,MAAO,EAAS,UAAW,EAAA,QAAO,IAAO,CAAA,CACjE,KAGT,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,IAAK,GAAQ,EAAA,QAAO,IAAI,EAC7C,MAAO,CAAE,WAAU,EACnB,SAAU,EACV,KAAK,QACL,aAAY,YAEZ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAM,gBAAe,WACxC,EAAM,KAAK,EAAQ,KAChB,EAAA,EAAA,KAAA,CAAC,EAAA,SAAD,CAAA,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,OAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,EAAO,IAAI,EAAQ,CAAC,GAAK,EAAA,QAAO,MAAM,WADrE,CAGK,IAOG,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,WAAY,cAAY,gBAC3C,EAAQ,CACP,CAAA,GAEV,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,qBACnB,EAAO,KAAK,EAAO,KAChB,EAAA,EAAA,IAAA,CAAC,OAAD,CAEI,UAAW,EAAA,QAAO,EAAM,MACxB,aAAY,EAAM,cAEjB,EAAM,KACL,EALG,CAKH,CACT,CACC,CAAA,CACJ,IAWL,EAAQ,EAAM,OAAS,EAAI;EAAO,IAC7B,CAAA,EAtCK,CAsCL,CACb,CACC,CAAA,CACL,CAAA,CACJ,GAEb"}
+{"version":3,"file":"CodeBlock.cjs","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — code and language drive the scanner; filename,\n * showLineNumbers, highlightLines, maxHeight and wrap are the presentation a docs\n * page picks per block, and copyable plus label are the affordance and its\n * accessible name. All independent, all used in the SDK's own docs gallery.\n */\nimport { Fragment, useMemo } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { CopyButton } from \"../CopyButton\";\nimport { resolveLanguage, tokenizeLines } from \"./tokenize\";\nimport styles from \"./CodeBlock.module.css\";\n\nexport interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** The source to display. Leading and trailing blank lines are trimmed. */\n    code: string;\n    /** Grammar name or alias (`ts`, `bash`, `json`…). Unknown values render plain. */\n    language?: string;\n    /** Shown in the header, usually a file path. */\n    filename?: ReactNode;\n    /** Number the lines. Default `false`. */\n    showLineNumbers?: boolean;\n    /** 1-based line numbers to mark as the point of the snippet. */\n    highlightLines?: readonly number[];\n    /** Offer a copy button. Default `true`. */\n    copyable?: boolean;\n    /** Cap the height in px or any CSS length; the body scrolls past it. */\n    maxHeight?: number | string;\n    /** Wrap long lines instead of scrolling sideways. Default `false`. */\n    wrap?: boolean;\n    /**\n     * Accessible name for the code region. Defaults to naming the language, and\n     * to the filename when there is one.\n     */\n    label?: string;\n}\n\n/**\n * A read-only code sample: syntax colours, optional line numbers, copy button.\n *\n * The `<pre>` is always focusable. A code block is scrollable and holds nothing\n * focusable inside, so without a tab stop a keyboard user can see there is more\n * code past the edge and has no way to reach it. It is the one scroll container\n * where the stop is unconditional rather than measured — a code sample is\n * expected to be reachable, read and selected on its own.\n *\n * Colours come from an approximate scanner, not a parser — see {@link tokenize}.\n *\n * @example\n * <CodeBlock code={snippet} language=\"ts\" filename=\"src/main.ts\" showLineNumbers />\n * <CodeBlock code={log} language=\"bash\" maxHeight={280} />\n */\nexport function CodeBlock({\n    code,\n    language,\n    filename,\n    showLineNumbers = false,\n    highlightLines,\n    copyable = true,\n    maxHeight,\n    wrap = false,\n    label,\n    className,\n    ...rest\n}: CodeBlockProps) {\n    const trimmed = useMemo(() => code.replace(/^\\n+/, \"\").replace(/\\s+$/, \"\"), [code]);\n    const lines = useMemo(() => tokenizeLines(trimmed, language), [trimmed, language]);\n    const resolved = resolveLanguage(language);\n    const marked = useMemo(() => new Set(highlightLines ?? []), [highlightLines]);\n\n    const name =\n        label ??\n        (filename && typeof filename === \"string\"\n            ? `Código: ${filename}`\n            : `Bloco de código${resolved === \"plain\" ? \"\" : ` em ${resolved}`}`);\n\n    const hasHeader = Boolean(filename) || copyable;\n\n    return (\n        <div className={cn(styles.wrapper, className)} {...rest}>\n            {hasHeader && (\n                <div className={styles.header}>\n                    <span className={styles.filename}>\n                        {filename ?? (resolved === \"plain\" ? \"\" : resolved)}\n                    </span>\n                    {copyable && <CopyButton value={trimmed} className={styles.copy} />}\n                </div>\n            )}\n\n            <pre\n                className={cn(styles.pre, wrap && styles.wrap)}\n                style={{ maxHeight }}\n                tabIndex={0}\n                role=\"group\"\n                aria-label={name}\n            >\n                <code className={styles.code} data-language={resolved}>\n                    {lines.map((tokens, index) => (\n                        <Fragment key={index}>\n                            <span\n                                className={cn(styles.line, marked.has(index + 1) && styles.marked)}\n                            >\n                                {showLineNumbers && (\n                                    /*\n                                     * The number is decoration: it must not land in the\n                                     * clipboard when the reader selects the snippet, and a\n                                     * screen reader announcing \"one const two import\" adds\n                                     * nothing. `user-select: none` in CSS plus this.\n                                     */\n                                    <span className={styles.lineNumber} aria-hidden=\"true\">\n                                        {index + 1}\n                                    </span>\n                                )}\n                                <span className={styles.lineContent}>\n                                    {tokens.map((token, tokenIndex) => (\n                                        <span\n                                            key={tokenIndex}\n                                            className={styles[token.kind]}\n                                            data-token={token.kind}\n                                        >\n                                            {token.value}\n                                        </span>\n                                    ))}\n                                </span>\n                            </span>\n                            {/*\n                             * A real newline character, and outside the line box.\n                             * It has to be real so that selecting the snippet by\n                             * hand and copying yields the source instead of one\n                             * run-together line. It has to be outside because the\n                             * line is an inline-block: a newline within one is\n                             * consumed inside that box, and every line ends up\n                             * side by side on a single row. The last one is\n                             * dropped so the block does not end in blank space.\n                             */}\n                            {index < lines.length - 1 ? \"\\n\" : null}\n                        </Fragment>\n                    ))}\n                </code>\n            </pre>\n        </div>\n    );\n}\n"],"mappings":"sMAsDA,SAAgB,EAAU,CACtB,OACA,WACA,WACA,kBAAkB,GAClB,iBACA,WAAW,GACX,YACA,OAAO,GACP,QACA,YACA,GAAG,GACY,CACf,IAAM,GAAA,EAAA,EAAA,QAAA,KAAwB,EAAK,QAAQ,OAAQ,EAAE,CAAC,CAAC,QAAQ,OAAQ,EAAE,EAAG,CAAC,CAAI,CAAC,EAC5E,GAAA,EAAA,EAAA,QAAA,KAAsB,EAAA,cAAc,EAAS,CAAQ,EAAG,CAAC,EAAS,CAAQ,CAAC,EAC3E,EAAW,EAAA,gBAAgB,CAAQ,EACnC,GAAA,EAAA,EAAA,QAAA,KAAuB,IAAI,IAAI,GAAkB,CAAC,CAAC,EAAG,CAAC,CAAc,CAAC,EAEtE,EACF,IACC,GAAY,OAAO,GAAa,SAC3B,WAAW,IACX,kBAAkB,IAAa,QAAU,GAAK,OAAO,OAEzD,EAAY,EAAQ,GAAa,EAEvC,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,QAAS,CAAS,EAAG,GAAI,WAAnD,CACK,IACG,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAvB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBACnB,IAAa,IAAa,QAAU,GAAK,EACxC,CAAA,EACL,IAAY,EAAA,EAAA,IAAA,CAAC,EAAA,WAAD,CAAY,MAAO,EAAS,UAAW,EAAA,QAAO,IAAO,CAAA,CACjE,KAGT,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,IAAK,GAAQ,EAAA,QAAO,IAAI,EAC7C,MAAO,CAAE,WAAU,EACnB,SAAU,EACV,KAAK,QACL,aAAY,YAEZ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAM,gBAAe,WACxC,EAAM,KAAK,EAAQ,KAChB,EAAA,EAAA,KAAA,CAAC,EAAA,SAAD,CAAA,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,OAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,EAAO,IAAI,EAAQ,CAAC,GAAK,EAAA,QAAO,MAAM,WADrE,CAGK,IAOG,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,WAAY,cAAY,gBAC3C,EAAQ,CACP,CAAA,GAEV,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,qBACnB,EAAO,KAAK,EAAO,KAChB,EAAA,EAAA,IAAA,CAAC,OAAD,CAEI,UAAW,EAAA,QAAO,EAAM,MACxB,aAAY,EAAM,cAEjB,EAAM,KACL,EALG,CAKH,CACT,CACC,CAAA,CACJ,IAWL,EAAQ,EAAM,OAAS,EAAI;EAAO,IAC7B,CAAA,EAtCK,CAsCL,CACb,CACC,CAAA,CACL,CAAA,CACJ,GAEb"}

package/dist/components/CodeBlock/CodeBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.js","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["import { Fragment, useMemo } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { CopyButton } from \"../CopyButton\";\nimport { resolveLanguage, tokenizeLines } from \"./tokenize\";\nimport styles from \"./CodeBlock.module.css\";\n\nexport interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** The source to display. Leading and trailing blank lines are trimmed. */\n    code: string;\n    /** Grammar name or alias (`ts`, `bash`, `json`…). Unknown values render plain. */\n    language?: string;\n    /** Shown in the header, usually a file path. */\n    filename?: ReactNode;\n    /** Number the lines. Default `false`. */\n    showLineNumbers?: boolean;\n    /** 1-based line numbers to mark as the point of the snippet. */\n    highlightLines?: readonly number[];\n    /** Offer a copy button. Default `true`. */\n    copyable?: boolean;\n    /** Cap the height in px or any CSS length; the body scrolls past it. */\n    maxHeight?: number | string;\n    /** Wrap long lines instead of scrolling sideways. Default `false`. */\n    wrap?: boolean;\n    /**\n     * Accessible name for the code region. Defaults to naming the language, and\n     * to the filename when there is one.\n     */\n    label?: string;\n}\n\n/**\n * A read-only code sample: syntax colours, optional line numbers, copy button.\n *\n * The `<pre>` is always focusable. A code block is scrollable and holds nothing\n * focusable inside, so without a tab stop a keyboard user can see there is more\n * code past the edge and has no way to reach it. It is the one scroll container\n * where the stop is unconditional rather than measured — a code sample is\n * expected to be reachable, read and selected on its own.\n *\n * Colours come from an approximate scanner, not a parser — see {@link tokenize}.\n *\n * @example\n * <CodeBlock code={snippet} language=\"ts\" filename=\"src/main.ts\" showLineNumbers />\n * <CodeBlock code={log} language=\"bash\" maxHeight={280} />\n */\nexport function CodeBlock({\n    code,\n    language,\n    filename,\n    showLineNumbers = false,\n    highlightLines,\n    copyable = true,\n    maxHeight,\n    wrap = false,\n    label,\n    className,\n    ...rest\n}: CodeBlockProps) {\n    const trimmed = useMemo(() => code.replace(/^\\n+/, \"\").replace(/\\s+$/, \"\"), [code]);\n    const lines = useMemo(() => tokenizeLines(trimmed, language), [trimmed, language]);\n    const resolved = resolveLanguage(language);\n    const marked = useMemo(() => new Set(highlightLines ?? []), [highlightLines]);\n\n    const name =\n        label ??\n        (filename && typeof filename === \"string\"\n            ? `Código: ${filename}`\n            : `Bloco de código${resolved === \"plain\" ? \"\" : ` em ${resolved}`}`);\n\n    const hasHeader = Boolean(filename) || copyable;\n\n    return (\n        <div className={cn(styles.wrapper, className)} {...rest}>\n            {hasHeader && (\n                <div className={styles.header}>\n                    <span className={styles.filename}>\n                        {filename ?? (resolved === \"plain\" ? \"\" : resolved)}\n                    </span>\n                    {copyable && <CopyButton value={trimmed} className={styles.copy} />}\n                </div>\n            )}\n\n            <pre\n                className={cn(styles.pre, wrap && styles.wrap)}\n                style={{ maxHeight }}\n                tabIndex={0}\n                role=\"group\"\n                aria-label={name}\n            >\n                <code className={styles.code} data-language={resolved}>\n                    {lines.map((tokens, index) => (\n                        <Fragment key={index}>\n                            <span\n                                className={cn(styles.line, marked.has(index + 1) && styles.marked)}\n                            >\n                                {showLineNumbers && (\n                                    /*\n                                     * The number is decoration: it must not land in the\n                                     * clipboard when the reader selects the snippet, and a\n                                     * screen reader announcing \"one const two import\" adds\n                                     * nothing. `user-select: none` in CSS plus this.\n                                     */\n                                    <span className={styles.lineNumber} aria-hidden=\"true\">\n                                        {index + 1}\n                                    </span>\n                                )}\n                                <span className={styles.lineContent}>\n                                    {tokens.map((token, tokenIndex) => (\n                                        <span\n                                            key={tokenIndex}\n                                            className={styles[token.kind]}\n                                            data-token={token.kind}\n                                        >\n                                            {token.value}\n                                        </span>\n                                    ))}\n                                </span>\n                            </span>\n                            {/*\n                             * A real newline character, and outside the line box.\n                             * It has to be real so that selecting the snippet by\n                             * hand and copying yields the source instead of one\n                             * run-together line. It has to be outside because the\n                             * line is an inline-block: a newline within one is\n                             * consumed inside that box, and every line ends up\n                             * side by side on a single row. The last one is\n                             * dropped so the block does not end in blank space.\n                             */}\n                            {index < lines.length - 1 ? \"\\n\" : null}\n                        </Fragment>\n                    ))}\n                </code>\n            </pre>\n        </div>\n    );\n}\n"],"mappings":";;;;;;;AAgDA,SAAgB,EAAU,EACtB,SACA,aACA,aACA,qBAAkB,IAClB,mBACA,cAAW,IACX,cACA,UAAO,IACP,UACA,cACA,GAAG,KACY;CACf,IAAM,IAAU,QAAc,EAAK,QAAQ,QAAQ,EAAE,CAAC,CAAC,QAAQ,QAAQ,EAAE,GAAG,CAAC,CAAI,CAAC,GAC5E,IAAQ,QAAc,EAAc,GAAS,CAAQ,GAAG,CAAC,GAAS,CAAQ,CAAC,GAC3E,IAAW,EAAgB,CAAQ,GACnC,IAAS,QAAc,IAAI,IAAI,KAAkB,CAAC,CAAC,GAAG,CAAC,CAAc,CAAC,GAEtE,IACF,MACC,KAAY,OAAO,KAAa,WAC3B,WAAW,MACX,kBAAkB,MAAa,UAAU,KAAK,OAAO,QAEzD,IAAY,EAAQ,KAAa;CAEvC,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,SAAS,CAAS;EAAG,GAAI;YAAnD,CACK,KACG,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB,CACI,kBAAC,QAAD;IAAM,WAAW,EAAO;cACnB,MAAa,MAAa,UAAU,KAAK;GACxC,CAAA,GACL,KAAY,kBAAC,GAAD;IAAY,OAAO;IAAS,WAAW,EAAO;GAAO,CAAA,CACjE;MAGT,kBAAC,OAAD;GACI,WAAW,EAAG,EAAO,KAAK,KAAQ,EAAO,IAAI;GAC7C,OAAO,EAAE,aAAU;GACnB,UAAU;GACV,MAAK;GACL,cAAY;aAEZ,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAM,iBAAe;cACxC,EAAM,KAAK,GAAQ,MAChB,kBAAC,GAAD,EAAA,UAAA,CACI,kBAAC,QAAD;KACI,WAAW,EAAG,EAAO,MAAM,EAAO,IAAI,IAAQ,CAAC,KAAK,EAAO,MAAM;eADrE,CAGK,KAOG,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAY,eAAY;gBAC3C,IAAQ;KACP,CAAA,GAEV,kBAAC,QAAD;MAAM,WAAW,EAAO;gBACnB,EAAO,KAAK,GAAO,MAChB,kBAAC,QAAD;OAEI,WAAW,EAAO,EAAM;OACxB,cAAY,EAAM;iBAEjB,EAAM;MACL,GALG,CAKH,CACT;KACC,CAAA,CACJ;QAWL,IAAQ,EAAM,SAAS,IAAI,OAAO,IAC7B,EAAA,GAtCK,CAsCL,CACb;GACC,CAAA;EACL,CAAA,CACJ;;AAEb"}
+{"version":3,"file":"CodeBlock.js","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — code and language drive the scanner; filename,\n * showLineNumbers, highlightLines, maxHeight and wrap are the presentation a docs\n * page picks per block, and copyable plus label are the affordance and its\n * accessible name. All independent, all used in the SDK's own docs gallery.\n */\nimport { Fragment, useMemo } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { CopyButton } from \"../CopyButton\";\nimport { resolveLanguage, tokenizeLines } from \"./tokenize\";\nimport styles from \"./CodeBlock.module.css\";\n\nexport interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n    /** The source to display. Leading and trailing blank lines are trimmed. */\n    code: string;\n    /** Grammar name or alias (`ts`, `bash`, `json`…). Unknown values render plain. */\n    language?: string;\n    /** Shown in the header, usually a file path. */\n    filename?: ReactNode;\n    /** Number the lines. Default `false`. */\n    showLineNumbers?: boolean;\n    /** 1-based line numbers to mark as the point of the snippet. */\n    highlightLines?: readonly number[];\n    /** Offer a copy button. Default `true`. */\n    copyable?: boolean;\n    /** Cap the height in px or any CSS length; the body scrolls past it. */\n    maxHeight?: number | string;\n    /** Wrap long lines instead of scrolling sideways. Default `false`. */\n    wrap?: boolean;\n    /**\n     * Accessible name for the code region. Defaults to naming the language, and\n     * to the filename when there is one.\n     */\n    label?: string;\n}\n\n/**\n * A read-only code sample: syntax colours, optional line numbers, copy button.\n *\n * The `<pre>` is always focusable. A code block is scrollable and holds nothing\n * focusable inside, so without a tab stop a keyboard user can see there is more\n * code past the edge and has no way to reach it. It is the one scroll container\n * where the stop is unconditional rather than measured — a code sample is\n * expected to be reachable, read and selected on its own.\n *\n * Colours come from an approximate scanner, not a parser — see {@link tokenize}.\n *\n * @example\n * <CodeBlock code={snippet} language=\"ts\" filename=\"src/main.ts\" showLineNumbers />\n * <CodeBlock code={log} language=\"bash\" maxHeight={280} />\n */\nexport function CodeBlock({\n    code,\n    language,\n    filename,\n    showLineNumbers = false,\n    highlightLines,\n    copyable = true,\n    maxHeight,\n    wrap = false,\n    label,\n    className,\n    ...rest\n}: CodeBlockProps) {\n    const trimmed = useMemo(() => code.replace(/^\\n+/, \"\").replace(/\\s+$/, \"\"), [code]);\n    const lines = useMemo(() => tokenizeLines(trimmed, language), [trimmed, language]);\n    const resolved = resolveLanguage(language);\n    const marked = useMemo(() => new Set(highlightLines ?? []), [highlightLines]);\n\n    const name =\n        label ??\n        (filename && typeof filename === \"string\"\n            ? `Código: ${filename}`\n            : `Bloco de código${resolved === \"plain\" ? \"\" : ` em ${resolved}`}`);\n\n    const hasHeader = Boolean(filename) || copyable;\n\n    return (\n        <div className={cn(styles.wrapper, className)} {...rest}>\n            {hasHeader && (\n                <div className={styles.header}>\n                    <span className={styles.filename}>\n                        {filename ?? (resolved === \"plain\" ? \"\" : resolved)}\n                    </span>\n                    {copyable && <CopyButton value={trimmed} className={styles.copy} />}\n                </div>\n            )}\n\n            <pre\n                className={cn(styles.pre, wrap && styles.wrap)}\n                style={{ maxHeight }}\n                tabIndex={0}\n                role=\"group\"\n                aria-label={name}\n            >\n                <code className={styles.code} data-language={resolved}>\n                    {lines.map((tokens, index) => (\n                        <Fragment key={index}>\n                            <span\n                                className={cn(styles.line, marked.has(index + 1) && styles.marked)}\n                            >\n                                {showLineNumbers && (\n                                    /*\n                                     * The number is decoration: it must not land in the\n                                     * clipboard when the reader selects the snippet, and a\n                                     * screen reader announcing \"one const two import\" adds\n                                     * nothing. `user-select: none` in CSS plus this.\n                                     */\n                                    <span className={styles.lineNumber} aria-hidden=\"true\">\n                                        {index + 1}\n                                    </span>\n                                )}\n                                <span className={styles.lineContent}>\n                                    {tokens.map((token, tokenIndex) => (\n                                        <span\n                                            key={tokenIndex}\n                                            className={styles[token.kind]}\n                                            data-token={token.kind}\n                                        >\n                                            {token.value}\n                                        </span>\n                                    ))}\n                                </span>\n                            </span>\n                            {/*\n                             * A real newline character, and outside the line box.\n                             * It has to be real so that selecting the snippet by\n                             * hand and copying yields the source instead of one\n                             * run-together line. It has to be outside because the\n                             * line is an inline-block: a newline within one is\n                             * consumed inside that box, and every line ends up\n                             * side by side on a single row. The last one is\n                             * dropped so the block does not end in blank space.\n                             */}\n                            {index < lines.length - 1 ? \"\\n\" : null}\n                        </Fragment>\n                    ))}\n                </code>\n            </pre>\n        </div>\n    );\n}\n"],"mappings":";;;;;;;AAsDA,SAAgB,EAAU,EACtB,SACA,aACA,aACA,qBAAkB,IAClB,mBACA,cAAW,IACX,cACA,UAAO,IACP,UACA,cACA,GAAG,KACY;CACf,IAAM,IAAU,QAAc,EAAK,QAAQ,QAAQ,EAAE,CAAC,CAAC,QAAQ,QAAQ,EAAE,GAAG,CAAC,CAAI,CAAC,GAC5E,IAAQ,QAAc,EAAc,GAAS,CAAQ,GAAG,CAAC,GAAS,CAAQ,CAAC,GAC3E,IAAW,EAAgB,CAAQ,GACnC,IAAS,QAAc,IAAI,IAAI,KAAkB,CAAC,CAAC,GAAG,CAAC,CAAc,CAAC,GAEtE,IACF,MACC,KAAY,OAAO,KAAa,WAC3B,WAAW,MACX,kBAAkB,MAAa,UAAU,KAAK,OAAO,QAEzD,IAAY,EAAQ,KAAa;CAEvC,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,SAAS,CAAS;EAAG,GAAI;YAAnD,CACK,KACG,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB,CACI,kBAAC,QAAD;IAAM,WAAW,EAAO;cACnB,MAAa,MAAa,UAAU,KAAK;GACxC,CAAA,GACL,KAAY,kBAAC,GAAD;IAAY,OAAO;IAAS,WAAW,EAAO;GAAO,CAAA,CACjE;MAGT,kBAAC,OAAD;GACI,WAAW,EAAG,EAAO,KAAK,KAAQ,EAAO,IAAI;GAC7C,OAAO,EAAE,aAAU;GACnB,UAAU;GACV,MAAK;GACL,cAAY;aAEZ,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAM,iBAAe;cACxC,EAAM,KAAK,GAAQ,MAChB,kBAAC,GAAD,EAAA,UAAA,CACI,kBAAC,QAAD;KACI,WAAW,EAAG,EAAO,MAAM,EAAO,IAAI,IAAQ,CAAC,KAAK,EAAO,MAAM;eADrE,CAGK,KAOG,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAY,eAAY;gBAC3C,IAAQ;KACP,CAAA,GAEV,kBAAC,QAAD;MAAM,WAAW,EAAO;gBACnB,EAAO,KAAK,GAAO,MAChB,kBAAC,QAAD;OAEI,WAAW,EAAO,EAAM;OACxB,cAAY,EAAM;iBAEjB,EAAM;MACL,GALG,CAKH,CACT;KACC,CAAA,CACJ;QAWL,IAAQ,EAAM,SAAS,IAAI,OAAO,IAC7B,EAAA,GAtCK,CAsCL,CACb;GACC,CAAA;EACL,CAAA,CACJ;;AAEb"}

package/dist/components/Combobox/Combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.cjs","names":[],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Combobox.module.css\";\n\nexport interface ComboboxOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n    options: ComboboxOption[];\n    value: string;\n    onChange: (value: string) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Custom filter — return true to keep the option. Default is case-insensitive substring match on label. */\n    filter?: (option: ComboboxOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    className?: string;\n}\n\nfunction defaultFilter(option: ComboboxOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/**\n * Combobox — text input with a filterable dropdown of options.\n *\n * Selecting an option fires `onChange(value)`. Typing filters the list.\n * Keyboard: ArrowUp/ArrowDown to navigate, Enter to select, Esc to close.\n */\nexport function Combobox({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    className,\n}: ComboboxProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n\n    const selectedLabel = useMemo(\n        () => options.find((o) => o.value === value)?.label ?? \"\",\n        [options, value],\n    );\n\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const closeAndReset = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n        setActiveIndex(0);\n    }, []);\n\n    const handleSelect = useCallback(\n        (option: ComboboxOption): void => {\n            if (option.disabled) return;\n            onChange(option.value);\n            closeAndReset();\n        },\n        [onChange, closeAndReset],\n    );\n\n    useEffect(() => {\n        if (!open) return;\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) {\n                closeAndReset();\n            }\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => window.removeEventListener(\"mousedown\", onDown);\n    }, [open, closeAndReset]);\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) handleSelect(option);\n        } else if (event.key === \"Escape\") {\n            closeAndReset();\n        }\n    };\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field}>\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    className={styles.input}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    value={open ? query : selectedLabel}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                />\n                <span className={styles.caret} aria-hidden>\n                    ▾\n                </span>\n            </div>\n            {open && (\n                <ul id={`${id}-listbox`} role=\"listbox\" className={styles.menu}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        filtered.map((option, index) => (\n                            <li\n                                key={option.value}\n                                role=\"option\"\n                                aria-selected={option.value === value}\n                                className={cn(\n                                    styles.option,\n                                    index === activeIndex && styles.active,\n                                    option.value === value && styles.selected,\n                                )}\n                                onMouseEnter={() => setActiveIndex(index)}\n                                onMouseDown={(event) => {\n                                    event.preventDefault();\n                                    handleSelect(option);\n                                }}\n                            >\n                                {option.label}\n                            </li>\n                        ))\n                    )}\n                </ul>\n            )}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Combobox.cjs","names":[],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — options/value/onChange\n * plus the shared field contract (label, placeholder, helperText, error, disabled,\n * className) and the three combobox-specific knobs: filter, emptyMessage. The body\n * is the listbox — open state, active descendant, type-ahead and the ARIA wiring —\n * and those cannot be separated without passing the same active index back and\n * forth.\n */\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Combobox.module.css\";\n\nexport interface ComboboxOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n    options: ComboboxOption[];\n    value: string;\n    onChange: (value: string) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Custom filter — return true to keep the option. Default is case-insensitive substring match on label. */\n    filter?: (option: ComboboxOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    className?: string;\n}\n\nfunction defaultFilter(option: ComboboxOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/**\n * Combobox — text input with a filterable dropdown of options.\n *\n * Selecting an option fires `onChange(value)`. Typing filters the list.\n * Keyboard: ArrowUp/ArrowDown to navigate, Enter to select, Esc to close.\n */\nexport function Combobox({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    className,\n}: ComboboxProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n\n    const selectedLabel = useMemo(\n        () => options.find((o) => o.value === value)?.label ?? \"\",\n        [options, value],\n    );\n\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const closeAndReset = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n        setActiveIndex(0);\n    }, []);\n\n    const handleSelect = useCallback(\n        (option: ComboboxOption): void => {\n            if (option.disabled) return;\n            onChange(option.value);\n            closeAndReset();\n        },\n        [onChange, closeAndReset],\n    );\n\n    useEffect(() => {\n        if (!open) return;\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) {\n                closeAndReset();\n            }\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => window.removeEventListener(\"mousedown\", onDown);\n    }, [open, closeAndReset]);\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) handleSelect(option);\n        } else if (event.key === \"Escape\") {\n            closeAndReset();\n        }\n    };\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field}>\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    className={styles.input}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    value={open ? query : selectedLabel}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                />\n                <span className={styles.caret} aria-hidden>\n                    ▾\n                </span>\n            </div>\n            {open && (\n                <ul id={`${id}-listbox`} role=\"listbox\" className={styles.menu}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        filtered.map((option, index) => (\n                            <li\n                                key={option.value}\n                                role=\"option\"\n                                aria-selected={option.value === value}\n                                className={cn(\n                                    styles.option,\n                                    index === activeIndex && styles.active,\n                                    option.value === value && styles.selected,\n                                )}\n                                onMouseEnter={() => setActiveIndex(index)}\n                                onMouseDown={(event) => {\n                                    event.preventDefault();\n                                    handleSelect(option);\n                                }}\n                            >\n                                {option.label}\n                            </li>\n                        ))\n                    )}\n                </ul>\n            )}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Combobox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","names":[],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Combobox.module.css\";\n\nexport interface ComboboxOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n    options: ComboboxOption[];\n    value: string;\n    onChange: (value: string) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Custom filter — return true to keep the option. Default is case-insensitive substring match on label. */\n    filter?: (option: ComboboxOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    className?: string;\n}\n\nfunction defaultFilter(option: ComboboxOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/**\n * Combobox — text input with a filterable dropdown of options.\n *\n * Selecting an option fires `onChange(value)`. Typing filters the list.\n * Keyboard: ArrowUp/ArrowDown to navigate, Enter to select, Esc to close.\n */\nexport function Combobox({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    className,\n}: ComboboxProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n\n    const selectedLabel = useMemo(\n        () => options.find((o) => o.value === value)?.label ?? \"\",\n        [options, value],\n    );\n\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const closeAndReset = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n        setActiveIndex(0);\n    }, []);\n\n    const handleSelect = useCallback(\n        (option: ComboboxOption): void => {\n            if (option.disabled) return;\n            onChange(option.value);\n            closeAndReset();\n        },\n        [onChange, closeAndReset],\n    );\n\n    useEffect(() => {\n        if (!open) return;\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) {\n                closeAndReset();\n            }\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => window.removeEventListener(\"mousedown\", onDown);\n    }, [open, closeAndReset]);\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) handleSelect(option);\n        } else if (event.key === \"Escape\") {\n            closeAndReset();\n        }\n    };\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field}>\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    className={styles.input}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    value={open ? query : selectedLabel}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                />\n                <span className={styles.caret} aria-hidden>\n                    ▾\n                </span>\n            </div>\n            {open && (\n                <ul id={`${id}-listbox`} role=\"listbox\" className={styles.menu}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        filtered.map((option, index) => (\n                            <li\n                                key={option.value}\n                                role=\"option\"\n                                aria-selected={option.value === value}\n                                className={cn(\n                                    styles.option,\n                                    index === activeIndex && styles.active,\n                                    option.value === value && styles.selected,\n                                )}\n                                onMouseEnter={() => setActiveIndex(index)}\n                                onMouseDown={(event) => {\n                                    event.preventDefault();\n                                    handleSelect(option);\n                                }}\n                            >\n                                {option.label}\n                            </li>\n                        ))\n                    )}\n                </ul>\n            )}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","names":[],"sources":["../../../src/components/Combobox/Combobox.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — options/value/onChange\n * plus the shared field contract (label, placeholder, helperText, error, disabled,\n * className) and the three combobox-specific knobs: filter, emptyMessage. The body\n * is the listbox — open state, active descendant, type-ahead and the ARIA wiring —\n * and those cannot be separated without passing the same active index back and\n * forth.\n */\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Combobox.module.css\";\n\nexport interface ComboboxOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n    options: ComboboxOption[];\n    value: string;\n    onChange: (value: string) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Custom filter — return true to keep the option. Default is case-insensitive substring match on label. */\n    filter?: (option: ComboboxOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    className?: string;\n}\n\nfunction defaultFilter(option: ComboboxOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/**\n * Combobox — text input with a filterable dropdown of options.\n *\n * Selecting an option fires `onChange(value)`. Typing filters the list.\n * Keyboard: ArrowUp/ArrowDown to navigate, Enter to select, Esc to close.\n */\nexport function Combobox({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    className,\n}: ComboboxProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n\n    const selectedLabel = useMemo(\n        () => options.find((o) => o.value === value)?.label ?? \"\",\n        [options, value],\n    );\n\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const closeAndReset = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n        setActiveIndex(0);\n    }, []);\n\n    const handleSelect = useCallback(\n        (option: ComboboxOption): void => {\n            if (option.disabled) return;\n            onChange(option.value);\n            closeAndReset();\n        },\n        [onChange, closeAndReset],\n    );\n\n    useEffect(() => {\n        if (!open) return;\n        const onDown = (event: MouseEvent): void => {\n            if (rootRef.current && !rootRef.current.contains(event.target as Node)) {\n                closeAndReset();\n            }\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => window.removeEventListener(\"mousedown\", onDown);\n    }, [open, closeAndReset]);\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) handleSelect(option);\n        } else if (event.key === \"Escape\") {\n            closeAndReset();\n        }\n    };\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div className={styles.field}>\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    className={styles.input}\n                    placeholder={placeholder}\n                    disabled={disabled}\n                    value={open ? query : selectedLabel}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                />\n                <span className={styles.caret} aria-hidden>\n                    ▾\n                </span>\n            </div>\n            {open && (\n                <ul id={`${id}-listbox`} role=\"listbox\" className={styles.menu}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        filtered.map((option, index) => (\n                            <li\n                                key={option.value}\n                                role=\"option\"\n                                aria-selected={option.value === value}\n                                className={cn(\n                                    styles.option,\n                                    index === activeIndex && styles.active,\n                                    option.value === value && styles.selected,\n                                )}\n                                onMouseEnter={() => setActiveIndex(index)}\n                                onMouseDown={(event) => {\n                                    event.preventDefault();\n                                    handleSelect(option);\n                                }}\n                            >\n                                {option.label}\n                            </li>\n                        ))\n                    )}\n                </ul>\n            )}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Command/Command.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Command.cjs","names":[],"sources":["../../../src/components/Command/Command.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport styles from \"./Command.module.css\";\n\nexport interface CommandItem {\n    /** Stable unique identifier for the item. */\n    id: string;\n    /** Human-readable label shown in the list and matched against the query. */\n    label: string;\n    /** Optional group heading; items sharing a group are rendered together. */\n    group?: string;\n    /** Extra terms matched against the query in addition to `label`. */\n    keywords?: string[];\n    /** Invoked when the item is chosen (click or Enter on the active row). */\n    onSelect: () => void;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n}\n\nexport interface CommandProps {\n    /** Whether the palette is visible. */\n    open: boolean;\n    /** Called with the next open state (Escape, selection, backdrop click). */\n    onOpenChange: (open: boolean) => void;\n    /** Candidate items to filter and display. */\n    items: CommandItem[];\n    /** Placeholder for the search input. */\n    placeholder?: string;\n    /** Rendered when no item matches the current query. */\n    emptyMessage?: ReactNode;\n    /** Forwarded to the dialog element. */\n    className?: string;\n}\n\ninterface CommandGroup {\n    name: string | undefined;\n    items: CommandItem[];\n}\n\n/**\n * Case-insensitively test whether `item` matches `query` by substring against\n * its label and any keywords. An empty query matches everything.\n *\n * @param item - The candidate command item.\n * @param query - The lowercased search query.\n * @returns `true` when the item should be shown.\n */\nfunction matchesQuery(item: CommandItem, query: string): boolean {\n    if (query === \"\") return true;\n    if (item.label.toLowerCase().includes(query)) return true;\n    return (item.keywords ?? []).some((keyword) => keyword.toLowerCase().includes(query));\n}\n\n/**\n * Partition a flat item list into ordered groups, preserving first-seen order\n * for both groups and the items within them.\n *\n * @param items - The (already filtered) items to group.\n * @returns An ordered list of groups.\n */\nfunction groupItems(items: CommandItem[]): CommandGroup[] {\n    const groups: CommandGroup[] = [];\n    const indexByName = new Map<string | undefined, number>();\n    for (const item of items) {\n        const existing = indexByName.get(item.group);\n        if (existing === undefined) {\n            indexByName.set(item.group, groups.length);\n            groups.push({ name: item.group, items: [item] });\n        } else {\n            groups[existing]!.items.push(item);\n        }\n    }\n    return groups;\n}\n\n/**\n * A ⌘K-style command palette: an overlay dialog with a search input that\n * substring-filters items by label and keywords, groups results, and supports\n * full keyboard navigation (Arrow up/down, Enter, Escape). Traps focus while\n * open.\n */\nexport function Command({\n    open,\n    onOpenChange,\n    items,\n    placeholder = \"Type a command…\",\n    emptyMessage = \"No results\",\n    className,\n}: CommandProps) {\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [query, setQuery] = useState<string>(\"\");\n    const [activeIndex, setActiveIndex] = useState<number>(0);\n    const listId = \"tempest-command-list\";\n\n    useFocusTrap(dialogRef, open);\n\n    const filtered = useMemo<CommandItem[]>(() => {\n        const normalized = query.trim().toLowerCase();\n        const visible = items.filter((item) => matchesQuery(item, normalized));\n        return groupItems(visible).flatMap((group) => group.items);\n    }, [items, query]);\n\n    const groups = useMemo<CommandGroup[]>(() => groupItems(filtered), [filtered]);\n\n    // Reset transient state whenever the palette opens.\n    useEffect(() => {\n        if (open) {\n            setQuery(\"\");\n            setActiveIndex(0);\n        }\n    }, [open]);\n\n    // Keep the active index within bounds as the filtered list shrinks/grows.\n    useEffect(() => {\n        setActiveIndex((index) => {\n            if (filtered.length === 0) return 0;\n            return Math.min(index, filtered.length - 1);\n        });\n    }, [filtered.length]);\n\n    if (!open || typeof document === \"undefined\") return null;\n\n    function selectItem(item: CommandItem): void {\n        item.onSelect();\n        onOpenChange(false);\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            onOpenChange(false);\n            return;\n        }\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index + 1) % filtered.length);\n            return;\n        }\n        if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index - 1 + filtered.length) % filtered.length);\n            return;\n        }\n        if (event.key === \"Enter\") {\n            event.preventDefault();\n            const item = filtered[activeIndex];\n            if (item) selectItem(item);\n        }\n    }\n\n    let renderIndex = -1;\n\n    return createPortal(\n        <div className={styles.overlay} role=\"presentation\" onClick={() => onOpenChange(false)}>\n            <div\n                ref={dialogRef}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-label=\"Command palette\"\n                className={cn(styles.dialog, className)}\n                onClick={(event) => event.stopPropagation()}\n            >\n                <div className={styles.inputRow}>\n                    <SearchIcon />\n                    <input\n                        type=\"text\"\n                        role=\"combobox\"\n                        aria-expanded=\"true\"\n                        aria-controls={listId}\n                        aria-autocomplete=\"list\"\n                        autoFocus\n                        className={styles.input}\n                        placeholder={placeholder}\n                        value={query}\n                        onChange={(event) => setQuery(event.target.value)}\n                        onKeyDown={handleKeyDown}\n                    />\n                </div>\n                <ul id={listId} role=\"listbox\" className={styles.list}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        groups.map((group) => (\n                            <li key={group.name ?? \"__ungrouped__\"} className={styles.group}>\n                                {group.name && (\n                                    <div className={styles.groupHeading}>{group.name}</div>\n                                )}\n                                <ul role=\"presentation\" className={styles.groupList}>\n                                    {group.items.map((item) => {\n                                        renderIndex += 1;\n                                        const isActive = renderIndex === activeIndex;\n                                        const index = renderIndex;\n                                        return (\n                                            <li\n                                                key={item.id}\n                                                role=\"option\"\n                                                aria-selected={isActive}\n                                                className={cn(\n                                                    styles.option,\n                                                    isActive && styles.active,\n                                                )}\n                                                onMouseMove={() => setActiveIndex(index)}\n                                                onClick={() => selectItem(item)}\n                                            >\n                                                {item.icon && (\n                                                    <span className={styles.icon}>{item.icon}</span>\n                                                )}\n                                                <span className={styles.label}>{item.label}</span>\n                                            </li>\n                                        );\n                                    })}\n                                </ul>\n                            </li>\n                        ))\n                    )}\n                </ul>\n            </div>\n        </div>,\n        document.body,\n    );\n}\n\nfunction SearchIcon() {\n    return (\n        <svg\n            className={styles.searchIcon}\n            width=\"18\"\n            height=\"18\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n        >\n            <circle cx=\"11\" cy=\"11\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"2\" />\n            <path d=\"M20 20l-3.5-3.5\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n        </svg>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Command.cjs","names":[],"sources":["../../../src/components/Command/Command.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a command palette is a filtered\n * listbox with its own keyboard contract: the body holds the query, the flattened\n * result list, the active index and the Escape/Enter handling, all of which read\n * each other on every keystroke.\n */\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport styles from \"./Command.module.css\";\n\nexport interface CommandItem {\n    /** Stable unique identifier for the item. */\n    id: string;\n    /** Human-readable label shown in the list and matched against the query. */\n    label: string;\n    /** Optional group heading; items sharing a group are rendered together. */\n    group?: string;\n    /** Extra terms matched against the query in addition to `label`. */\n    keywords?: string[];\n    /** Invoked when the item is chosen (click or Enter on the active row). */\n    onSelect: () => void;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n}\n\nexport interface CommandProps {\n    /** Whether the palette is visible. */\n    open: boolean;\n    /** Called with the next open state (Escape, selection, backdrop click). */\n    onOpenChange: (open: boolean) => void;\n    /** Candidate items to filter and display. */\n    items: CommandItem[];\n    /** Placeholder for the search input. */\n    placeholder?: string;\n    /** Rendered when no item matches the current query. */\n    emptyMessage?: ReactNode;\n    /** Forwarded to the dialog element. */\n    className?: string;\n}\n\ninterface CommandGroup {\n    name: string | undefined;\n    items: CommandItem[];\n}\n\n/**\n * Case-insensitively test whether `item` matches `query` by substring against\n * its label and any keywords. An empty query matches everything.\n *\n * @param item - The candidate command item.\n * @param query - The lowercased search query.\n * @returns `true` when the item should be shown.\n */\nfunction matchesQuery(item: CommandItem, query: string): boolean {\n    if (query === \"\") return true;\n    if (item.label.toLowerCase().includes(query)) return true;\n    return (item.keywords ?? []).some((keyword) => keyword.toLowerCase().includes(query));\n}\n\n/**\n * Partition a flat item list into ordered groups, preserving first-seen order\n * for both groups and the items within them.\n *\n * @param items - The (already filtered) items to group.\n * @returns An ordered list of groups.\n */\nfunction groupItems(items: CommandItem[]): CommandGroup[] {\n    const groups: CommandGroup[] = [];\n    const indexByName = new Map<string | undefined, number>();\n    for (const item of items) {\n        const existing = indexByName.get(item.group);\n        if (existing === undefined) {\n            indexByName.set(item.group, groups.length);\n            groups.push({ name: item.group, items: [item] });\n        } else {\n            groups[existing]!.items.push(item);\n        }\n    }\n    return groups;\n}\n\n/**\n * A ⌘K-style command palette: an overlay dialog with a search input that\n * substring-filters items by label and keywords, groups results, and supports\n * full keyboard navigation (Arrow up/down, Enter, Escape). Traps focus while\n * open.\n */\nexport function Command({\n    open,\n    onOpenChange,\n    items,\n    placeholder = \"Type a command…\",\n    emptyMessage = \"No results\",\n    className,\n}: CommandProps) {\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [query, setQuery] = useState<string>(\"\");\n    const [activeIndex, setActiveIndex] = useState<number>(0);\n    const listId = \"tempest-command-list\";\n\n    useFocusTrap(dialogRef, open);\n\n    const filtered = useMemo<CommandItem[]>(() => {\n        const normalized = query.trim().toLowerCase();\n        const visible = items.filter((item) => matchesQuery(item, normalized));\n        return groupItems(visible).flatMap((group) => group.items);\n    }, [items, query]);\n\n    const groups = useMemo<CommandGroup[]>(() => groupItems(filtered), [filtered]);\n\n    // Reset transient state whenever the palette opens.\n    useEffect(() => {\n        if (open) {\n            setQuery(\"\");\n            setActiveIndex(0);\n        }\n    }, [open]);\n\n    // Keep the active index within bounds as the filtered list shrinks/grows.\n    useEffect(() => {\n        setActiveIndex((index) => {\n            if (filtered.length === 0) return 0;\n            return Math.min(index, filtered.length - 1);\n        });\n    }, [filtered.length]);\n\n    if (!open || typeof document === \"undefined\") return null;\n\n    function selectItem(item: CommandItem): void {\n        item.onSelect();\n        onOpenChange(false);\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            onOpenChange(false);\n            return;\n        }\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index + 1) % filtered.length);\n            return;\n        }\n        if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index - 1 + filtered.length) % filtered.length);\n            return;\n        }\n        if (event.key === \"Enter\") {\n            event.preventDefault();\n            const item = filtered[activeIndex];\n            if (item) selectItem(item);\n        }\n    }\n\n    let renderIndex = -1;\n\n    return createPortal(\n        <div className={styles.overlay} role=\"presentation\" onClick={() => onOpenChange(false)}>\n            <div\n                ref={dialogRef}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-label=\"Command palette\"\n                className={cn(styles.dialog, className)}\n                onClick={(event) => event.stopPropagation()}\n            >\n                <div className={styles.inputRow}>\n                    <SearchIcon />\n                    <input\n                        type=\"text\"\n                        role=\"combobox\"\n                        aria-expanded=\"true\"\n                        aria-controls={listId}\n                        aria-autocomplete=\"list\"\n                        autoFocus\n                        className={styles.input}\n                        placeholder={placeholder}\n                        value={query}\n                        onChange={(event) => setQuery(event.target.value)}\n                        onKeyDown={handleKeyDown}\n                    />\n                </div>\n                <ul id={listId} role=\"listbox\" className={styles.list}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        groups.map((group) => (\n                            <li key={group.name ?? \"__ungrouped__\"} className={styles.group}>\n                                {group.name && (\n                                    <div className={styles.groupHeading}>{group.name}</div>\n                                )}\n                                <ul role=\"presentation\" className={styles.groupList}>\n                                    {group.items.map((item) => {\n                                        renderIndex += 1;\n                                        const isActive = renderIndex === activeIndex;\n                                        const index = renderIndex;\n                                        return (\n                                            <li\n                                                key={item.id}\n                                                role=\"option\"\n                                                aria-selected={isActive}\n                                                className={cn(\n                                                    styles.option,\n                                                    isActive && styles.active,\n                                                )}\n                                                onMouseMove={() => setActiveIndex(index)}\n                                                onClick={() => selectItem(item)}\n                                            >\n                                                {item.icon && (\n                                                    <span className={styles.icon}>{item.icon}</span>\n                                                )}\n                                                <span className={styles.label}>{item.label}</span>\n                                            </li>\n                                        );\n                                    })}\n                                </ul>\n                            </li>\n                        ))\n                    )}\n                </ul>\n            </div>\n        </div>,\n        document.body,\n    );\n}\n\nfunction SearchIcon() {\n    return (\n        <svg\n            className={styles.searchIcon}\n            width=\"18\"\n            height=\"18\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n        >\n            <circle cx=\"11\" cy=\"11\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"2\" />\n            <path d=\"M20 20l-3.5-3.5\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n        </svg>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Command/Command.js.map

@@ -1 +1 @@
-{"version":3,"file":"Command.js","names":[],"sources":["../../../src/components/Command/Command.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport styles from \"./Command.module.css\";\n\nexport interface CommandItem {\n    /** Stable unique identifier for the item. */\n    id: string;\n    /** Human-readable label shown in the list and matched against the query. */\n    label: string;\n    /** Optional group heading; items sharing a group are rendered together. */\n    group?: string;\n    /** Extra terms matched against the query in addition to `label`. */\n    keywords?: string[];\n    /** Invoked when the item is chosen (click or Enter on the active row). */\n    onSelect: () => void;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n}\n\nexport interface CommandProps {\n    /** Whether the palette is visible. */\n    open: boolean;\n    /** Called with the next open state (Escape, selection, backdrop click). */\n    onOpenChange: (open: boolean) => void;\n    /** Candidate items to filter and display. */\n    items: CommandItem[];\n    /** Placeholder for the search input. */\n    placeholder?: string;\n    /** Rendered when no item matches the current query. */\n    emptyMessage?: ReactNode;\n    /** Forwarded to the dialog element. */\n    className?: string;\n}\n\ninterface CommandGroup {\n    name: string | undefined;\n    items: CommandItem[];\n}\n\n/**\n * Case-insensitively test whether `item` matches `query` by substring against\n * its label and any keywords. An empty query matches everything.\n *\n * @param item - The candidate command item.\n * @param query - The lowercased search query.\n * @returns `true` when the item should be shown.\n */\nfunction matchesQuery(item: CommandItem, query: string): boolean {\n    if (query === \"\") return true;\n    if (item.label.toLowerCase().includes(query)) return true;\n    return (item.keywords ?? []).some((keyword) => keyword.toLowerCase().includes(query));\n}\n\n/**\n * Partition a flat item list into ordered groups, preserving first-seen order\n * for both groups and the items within them.\n *\n * @param items - The (already filtered) items to group.\n * @returns An ordered list of groups.\n */\nfunction groupItems(items: CommandItem[]): CommandGroup[] {\n    const groups: CommandGroup[] = [];\n    const indexByName = new Map<string | undefined, number>();\n    for (const item of items) {\n        const existing = indexByName.get(item.group);\n        if (existing === undefined) {\n            indexByName.set(item.group, groups.length);\n            groups.push({ name: item.group, items: [item] });\n        } else {\n            groups[existing]!.items.push(item);\n        }\n    }\n    return groups;\n}\n\n/**\n * A ⌘K-style command palette: an overlay dialog with a search input that\n * substring-filters items by label and keywords, groups results, and supports\n * full keyboard navigation (Arrow up/down, Enter, Escape). Traps focus while\n * open.\n */\nexport function Command({\n    open,\n    onOpenChange,\n    items,\n    placeholder = \"Type a command…\",\n    emptyMessage = \"No results\",\n    className,\n}: CommandProps) {\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [query, setQuery] = useState<string>(\"\");\n    const [activeIndex, setActiveIndex] = useState<number>(0);\n    const listId = \"tempest-command-list\";\n\n    useFocusTrap(dialogRef, open);\n\n    const filtered = useMemo<CommandItem[]>(() => {\n        const normalized = query.trim().toLowerCase();\n        const visible = items.filter((item) => matchesQuery(item, normalized));\n        return groupItems(visible).flatMap((group) => group.items);\n    }, [items, query]);\n\n    const groups = useMemo<CommandGroup[]>(() => groupItems(filtered), [filtered]);\n\n    // Reset transient state whenever the palette opens.\n    useEffect(() => {\n        if (open) {\n            setQuery(\"\");\n            setActiveIndex(0);\n        }\n    }, [open]);\n\n    // Keep the active index within bounds as the filtered list shrinks/grows.\n    useEffect(() => {\n        setActiveIndex((index) => {\n            if (filtered.length === 0) return 0;\n            return Math.min(index, filtered.length - 1);\n        });\n    }, [filtered.length]);\n\n    if (!open || typeof document === \"undefined\") return null;\n\n    function selectItem(item: CommandItem): void {\n        item.onSelect();\n        onOpenChange(false);\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            onOpenChange(false);\n            return;\n        }\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index + 1) % filtered.length);\n            return;\n        }\n        if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index - 1 + filtered.length) % filtered.length);\n            return;\n        }\n        if (event.key === \"Enter\") {\n            event.preventDefault();\n            const item = filtered[activeIndex];\n            if (item) selectItem(item);\n        }\n    }\n\n    let renderIndex = -1;\n\n    return createPortal(\n        <div className={styles.overlay} role=\"presentation\" onClick={() => onOpenChange(false)}>\n            <div\n                ref={dialogRef}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-label=\"Command palette\"\n                className={cn(styles.dialog, className)}\n                onClick={(event) => event.stopPropagation()}\n            >\n                <div className={styles.inputRow}>\n                    <SearchIcon />\n                    <input\n                        type=\"text\"\n                        role=\"combobox\"\n                        aria-expanded=\"true\"\n                        aria-controls={listId}\n                        aria-autocomplete=\"list\"\n                        autoFocus\n                        className={styles.input}\n                        placeholder={placeholder}\n                        value={query}\n                        onChange={(event) => setQuery(event.target.value)}\n                        onKeyDown={handleKeyDown}\n                    />\n                </div>\n                <ul id={listId} role=\"listbox\" className={styles.list}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        groups.map((group) => (\n                            <li key={group.name ?? \"__ungrouped__\"} className={styles.group}>\n                                {group.name && (\n                                    <div className={styles.groupHeading}>{group.name}</div>\n                                )}\n                                <ul role=\"presentation\" className={styles.groupList}>\n                                    {group.items.map((item) => {\n                                        renderIndex += 1;\n                                        const isActive = renderIndex === activeIndex;\n                                        const index = renderIndex;\n                                        return (\n                                            <li\n                                                key={item.id}\n                                                role=\"option\"\n                                                aria-selected={isActive}\n                                                className={cn(\n                                                    styles.option,\n                                                    isActive && styles.active,\n                                                )}\n                                                onMouseMove={() => setActiveIndex(index)}\n                                                onClick={() => selectItem(item)}\n                                            >\n                                                {item.icon && (\n                                                    <span className={styles.icon}>{item.icon}</span>\n                                                )}\n                                                <span className={styles.label}>{item.label}</span>\n                                            </li>\n                                        );\n                                    })}\n                                </ul>\n                            </li>\n                        ))\n                    )}\n                </ul>\n            </div>\n        </div>,\n        document.body,\n    );\n}\n\nfunction SearchIcon() {\n    return (\n        <svg\n            className={styles.searchIcon}\n            width=\"18\"\n            height=\"18\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n        >\n            <circle cx=\"11\" cy=\"11\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"2\" />\n            <path d=\"M20 20l-3.5-3.5\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n        </svg>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Command.js","names":[],"sources":["../../../src/components/Command/Command.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a command palette is a filtered\n * listbox with its own keyboard contract: the body holds the query, the flattened\n * result list, the active index and the Escape/Enter handling, all of which read\n * each other on every keystroke.\n */\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport styles from \"./Command.module.css\";\n\nexport interface CommandItem {\n    /** Stable unique identifier for the item. */\n    id: string;\n    /** Human-readable label shown in the list and matched against the query. */\n    label: string;\n    /** Optional group heading; items sharing a group are rendered together. */\n    group?: string;\n    /** Extra terms matched against the query in addition to `label`. */\n    keywords?: string[];\n    /** Invoked when the item is chosen (click or Enter on the active row). */\n    onSelect: () => void;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n}\n\nexport interface CommandProps {\n    /** Whether the palette is visible. */\n    open: boolean;\n    /** Called with the next open state (Escape, selection, backdrop click). */\n    onOpenChange: (open: boolean) => void;\n    /** Candidate items to filter and display. */\n    items: CommandItem[];\n    /** Placeholder for the search input. */\n    placeholder?: string;\n    /** Rendered when no item matches the current query. */\n    emptyMessage?: ReactNode;\n    /** Forwarded to the dialog element. */\n    className?: string;\n}\n\ninterface CommandGroup {\n    name: string | undefined;\n    items: CommandItem[];\n}\n\n/**\n * Case-insensitively test whether `item` matches `query` by substring against\n * its label and any keywords. An empty query matches everything.\n *\n * @param item - The candidate command item.\n * @param query - The lowercased search query.\n * @returns `true` when the item should be shown.\n */\nfunction matchesQuery(item: CommandItem, query: string): boolean {\n    if (query === \"\") return true;\n    if (item.label.toLowerCase().includes(query)) return true;\n    return (item.keywords ?? []).some((keyword) => keyword.toLowerCase().includes(query));\n}\n\n/**\n * Partition a flat item list into ordered groups, preserving first-seen order\n * for both groups and the items within them.\n *\n * @param items - The (already filtered) items to group.\n * @returns An ordered list of groups.\n */\nfunction groupItems(items: CommandItem[]): CommandGroup[] {\n    const groups: CommandGroup[] = [];\n    const indexByName = new Map<string | undefined, number>();\n    for (const item of items) {\n        const existing = indexByName.get(item.group);\n        if (existing === undefined) {\n            indexByName.set(item.group, groups.length);\n            groups.push({ name: item.group, items: [item] });\n        } else {\n            groups[existing]!.items.push(item);\n        }\n    }\n    return groups;\n}\n\n/**\n * A ⌘K-style command palette: an overlay dialog with a search input that\n * substring-filters items by label and keywords, groups results, and supports\n * full keyboard navigation (Arrow up/down, Enter, Escape). Traps focus while\n * open.\n */\nexport function Command({\n    open,\n    onOpenChange,\n    items,\n    placeholder = \"Type a command…\",\n    emptyMessage = \"No results\",\n    className,\n}: CommandProps) {\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [query, setQuery] = useState<string>(\"\");\n    const [activeIndex, setActiveIndex] = useState<number>(0);\n    const listId = \"tempest-command-list\";\n\n    useFocusTrap(dialogRef, open);\n\n    const filtered = useMemo<CommandItem[]>(() => {\n        const normalized = query.trim().toLowerCase();\n        const visible = items.filter((item) => matchesQuery(item, normalized));\n        return groupItems(visible).flatMap((group) => group.items);\n    }, [items, query]);\n\n    const groups = useMemo<CommandGroup[]>(() => groupItems(filtered), [filtered]);\n\n    // Reset transient state whenever the palette opens.\n    useEffect(() => {\n        if (open) {\n            setQuery(\"\");\n            setActiveIndex(0);\n        }\n    }, [open]);\n\n    // Keep the active index within bounds as the filtered list shrinks/grows.\n    useEffect(() => {\n        setActiveIndex((index) => {\n            if (filtered.length === 0) return 0;\n            return Math.min(index, filtered.length - 1);\n        });\n    }, [filtered.length]);\n\n    if (!open || typeof document === \"undefined\") return null;\n\n    function selectItem(item: CommandItem): void {\n        item.onSelect();\n        onOpenChange(false);\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n        if (event.key === \"Escape\") {\n            event.preventDefault();\n            onOpenChange(false);\n            return;\n        }\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index + 1) % filtered.length);\n            return;\n        }\n        if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            if (filtered.length === 0) return;\n            setActiveIndex((index) => (index - 1 + filtered.length) % filtered.length);\n            return;\n        }\n        if (event.key === \"Enter\") {\n            event.preventDefault();\n            const item = filtered[activeIndex];\n            if (item) selectItem(item);\n        }\n    }\n\n    let renderIndex = -1;\n\n    return createPortal(\n        <div className={styles.overlay} role=\"presentation\" onClick={() => onOpenChange(false)}>\n            <div\n                ref={dialogRef}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-label=\"Command palette\"\n                className={cn(styles.dialog, className)}\n                onClick={(event) => event.stopPropagation()}\n            >\n                <div className={styles.inputRow}>\n                    <SearchIcon />\n                    <input\n                        type=\"text\"\n                        role=\"combobox\"\n                        aria-expanded=\"true\"\n                        aria-controls={listId}\n                        aria-autocomplete=\"list\"\n                        autoFocus\n                        className={styles.input}\n                        placeholder={placeholder}\n                        value={query}\n                        onChange={(event) => setQuery(event.target.value)}\n                        onKeyDown={handleKeyDown}\n                    />\n                </div>\n                <ul id={listId} role=\"listbox\" className={styles.list}>\n                    {filtered.length === 0 ? (\n                        <li className={styles.empty}>{emptyMessage}</li>\n                    ) : (\n                        groups.map((group) => (\n                            <li key={group.name ?? \"__ungrouped__\"} className={styles.group}>\n                                {group.name && (\n                                    <div className={styles.groupHeading}>{group.name}</div>\n                                )}\n                                <ul role=\"presentation\" className={styles.groupList}>\n                                    {group.items.map((item) => {\n                                        renderIndex += 1;\n                                        const isActive = renderIndex === activeIndex;\n                                        const index = renderIndex;\n                                        return (\n                                            <li\n                                                key={item.id}\n                                                role=\"option\"\n                                                aria-selected={isActive}\n                                                className={cn(\n                                                    styles.option,\n                                                    isActive && styles.active,\n                                                )}\n                                                onMouseMove={() => setActiveIndex(index)}\n                                                onClick={() => selectItem(item)}\n                                            >\n                                                {item.icon && (\n                                                    <span className={styles.icon}>{item.icon}</span>\n                                                )}\n                                                <span className={styles.label}>{item.label}</span>\n                                            </li>\n                                        );\n                                    })}\n                                </ul>\n                            </li>\n                        ))\n                    )}\n                </ul>\n            </div>\n        </div>,\n        document.body,\n    );\n}\n\nfunction SearchIcon() {\n    return (\n        <svg\n            className={styles.searchIcon}\n            width=\"18\"\n            height=\"18\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n        >\n            <circle cx=\"11\" cy=\"11\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"2\" />\n            <path d=\"M20 20l-3.5-3.5\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" />\n        </svg>\n    );\n}\n"],"mappings":"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"}

package/dist/components/ConfirmDialog/ConfirmDialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDialog.cjs","names":[],"sources":["../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Button } from \"@/components/Button\";\nimport { Modal } from \"@/components/Modal\";\n\nexport interface ConfirmDialogProps {\n    open: boolean;\n    title: ReactNode;\n    description?: ReactNode;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    variant?: \"primary\" | \"danger\";\n    loading?: boolean;\n    onConfirm: () => void | Promise<void>;\n    onCancel: () => void;\n}\n\n/**\n * Quick confirmation prompt built on top of {@link Modal}. Use for destructive\n * actions with `variant=\"danger\"`.\n */\nexport function ConfirmDialog({\n    open,\n    title,\n    description,\n    confirmLabel = \"Confirmar\",\n    cancelLabel = \"Cancelar\",\n    variant = \"primary\",\n    loading = false,\n    onConfirm,\n    onCancel,\n}: ConfirmDialogProps) {\n    return (\n        <Modal\n            open={open}\n            onClose={onCancel}\n            title={title}\n            size=\"sm\"\n            footer={\n                <>\n                    <Button variant=\"secondary\" onClick={onCancel} disabled={loading}>\n                        {cancelLabel}\n                    </Button>\n                    <Button variant={variant} loading={loading} onClick={() => void onConfirm()}>\n                        {confirmLabel}\n                    </Button>\n                </>\n            }\n        >\n            {description}\n        </Modal>\n    );\n}\n"],"mappings":"2GAoBA,SAAgB,EAAc,CAC1B,OACA,QACA,cACA,eAAe,YACf,cAAc,WACd,UAAU,UACV,UAAU,GACV,YACA,YACmB,CACnB,OACI,EAAA,EAAA,IAAA,CAAC,EAAA,MAAD,CACU,OACN,QAAS,EACF,QACP,KAAK,KACL,QACI,EAAA,EAAA,KAAA,CAAA,EAAA,SAAA,CAAA,SAAA,EACI,EAAA,EAAA,IAAA,CAAC,EAAA,OAAD,CAAQ,QAAQ,YAAY,QAAS,EAAU,SAAU,WACpD,CACG,CAAA,GACR,EAAA,EAAA,IAAA,CAAC,EAAA,OAAD,CAAiB,UAAkB,UAAS,YAAe,KAAK,EAAU,WACrE,CACG,CAAA,CACV,CAAA,CAAA,WAGL,CACE,CAAA,CAEf"}
+{"version":3,"file":"ConfirmDialog.cjs","names":[],"sources":["../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — a confirmation is a question (title, description),\n * two buttons whose copy the app must own (confirmLabel, cancelLabel), a\n * destructive-or-not tone (variant), and the async state of the answer (loading,\n * onConfirm, onCancel, open). Fewer props means the app writes the dialog again\n * around a Modal.\n */\nimport type { ReactNode } from \"react\";\nimport { Button } from \"@/components/Button\";\nimport { Modal } from \"@/components/Modal\";\n\nexport interface ConfirmDialogProps {\n    open: boolean;\n    title: ReactNode;\n    description?: ReactNode;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    variant?: \"primary\" | \"danger\";\n    loading?: boolean;\n    onConfirm: () => void | Promise<void>;\n    onCancel: () => void;\n}\n\n/**\n * Quick confirmation prompt built on top of {@link Modal}. Use for destructive\n * actions with `variant=\"danger\"`.\n */\nexport function ConfirmDialog({\n    open,\n    title,\n    description,\n    confirmLabel = \"Confirmar\",\n    cancelLabel = \"Cancelar\",\n    variant = \"primary\",\n    loading = false,\n    onConfirm,\n    onCancel,\n}: ConfirmDialogProps) {\n    return (\n        <Modal\n            open={open}\n            onClose={onCancel}\n            title={title}\n            size=\"sm\"\n            footer={\n                <>\n                    <Button variant=\"secondary\" onClick={onCancel} disabled={loading}>\n                        {cancelLabel}\n                    </Button>\n                    <Button variant={variant} loading={loading} onClick={() => void onConfirm()}>\n                        {confirmLabel}\n                    </Button>\n                </>\n            }\n        >\n            {description}\n        </Modal>\n    );\n}\n"],"mappings":"2GA2BA,SAAgB,EAAc,CAC1B,OACA,QACA,cACA,eAAe,YACf,cAAc,WACd,UAAU,UACV,UAAU,GACV,YACA,YACmB,CACnB,OACI,EAAA,EAAA,IAAA,CAAC,EAAA,MAAD,CACU,OACN,QAAS,EACF,QACP,KAAK,KACL,QACI,EAAA,EAAA,KAAA,CAAA,EAAA,SAAA,CAAA,SAAA,EACI,EAAA,EAAA,IAAA,CAAC,EAAA,OAAD,CAAQ,QAAQ,YAAY,QAAS,EAAU,SAAU,WACpD,CACG,CAAA,GACR,EAAA,EAAA,IAAA,CAAC,EAAA,OAAD,CAAiB,UAAkB,UAAS,YAAe,KAAK,EAAU,WACrE,CACG,CAAA,CACV,CAAA,CAAA,WAGL,CACE,CAAA,CAEf"}

package/dist/components/ConfirmDialog/ConfirmDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmDialog.js","names":[],"sources":["../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Button } from \"@/components/Button\";\nimport { Modal } from \"@/components/Modal\";\n\nexport interface ConfirmDialogProps {\n    open: boolean;\n    title: ReactNode;\n    description?: ReactNode;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    variant?: \"primary\" | \"danger\";\n    loading?: boolean;\n    onConfirm: () => void | Promise<void>;\n    onCancel: () => void;\n}\n\n/**\n * Quick confirmation prompt built on top of {@link Modal}. Use for destructive\n * actions with `variant=\"danger\"`.\n */\nexport function ConfirmDialog({\n    open,\n    title,\n    description,\n    confirmLabel = \"Confirmar\",\n    cancelLabel = \"Cancelar\",\n    variant = \"primary\",\n    loading = false,\n    onConfirm,\n    onCancel,\n}: ConfirmDialogProps) {\n    return (\n        <Modal\n            open={open}\n            onClose={onCancel}\n            title={title}\n            size=\"sm\"\n            footer={\n                <>\n                    <Button variant=\"secondary\" onClick={onCancel} disabled={loading}>\n                        {cancelLabel}\n                    </Button>\n                    <Button variant={variant} loading={loading} onClick={() => void onConfirm()}>\n                        {confirmLabel}\n                    </Button>\n                </>\n            }\n        >\n            {description}\n        </Modal>\n    );\n}\n"],"mappings":";;;;AAoBA,SAAgB,EAAc,EAC1B,SACA,UACA,gBACA,kBAAe,aACf,iBAAc,YACd,aAAU,WACV,aAAU,IACV,cACA,eACmB;CACnB,OACI,kBAAC,GAAD;EACU;EACN,SAAS;EACF;EACP,MAAK;EACL,QACI,kBAAA,GAAA,EAAA,UAAA,CACI,kBAAC,GAAD;GAAQ,SAAQ;GAAY,SAAS;GAAU,UAAU;aACpD;EACG,CAAA,GACR,kBAAC,GAAD;GAAiB;GAAkB;GAAS,eAAe,KAAK,EAAU;aACrE;EACG,CAAA,CACV,EAAA,CAAA;YAGL;CACE,CAAA;AAEf"}
+{"version":3,"file":"ConfirmDialog.js","names":[],"sources":["../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — a confirmation is a question (title, description),\n * two buttons whose copy the app must own (confirmLabel, cancelLabel), a\n * destructive-or-not tone (variant), and the async state of the answer (loading,\n * onConfirm, onCancel, open). Fewer props means the app writes the dialog again\n * around a Modal.\n */\nimport type { ReactNode } from \"react\";\nimport { Button } from \"@/components/Button\";\nimport { Modal } from \"@/components/Modal\";\n\nexport interface ConfirmDialogProps {\n    open: boolean;\n    title: ReactNode;\n    description?: ReactNode;\n    confirmLabel?: string;\n    cancelLabel?: string;\n    variant?: \"primary\" | \"danger\";\n    loading?: boolean;\n    onConfirm: () => void | Promise<void>;\n    onCancel: () => void;\n}\n\n/**\n * Quick confirmation prompt built on top of {@link Modal}. Use for destructive\n * actions with `variant=\"danger\"`.\n */\nexport function ConfirmDialog({\n    open,\n    title,\n    description,\n    confirmLabel = \"Confirmar\",\n    cancelLabel = \"Cancelar\",\n    variant = \"primary\",\n    loading = false,\n    onConfirm,\n    onCancel,\n}: ConfirmDialogProps) {\n    return (\n        <Modal\n            open={open}\n            onClose={onCancel}\n            title={title}\n            size=\"sm\"\n            footer={\n                <>\n                    <Button variant=\"secondary\" onClick={onCancel} disabled={loading}>\n                        {cancelLabel}\n                    </Button>\n                    <Button variant={variant} loading={loading} onClick={() => void onConfirm()}>\n                        {confirmLabel}\n                    </Button>\n                </>\n            }\n        >\n            {description}\n        </Modal>\n    );\n}\n"],"mappings":";;;;AA2BA,SAAgB,EAAc,EAC1B,SACA,UACA,gBACA,kBAAe,aACf,iBAAc,YACd,aAAU,WACV,aAAU,IACV,cACA,eACmB;CACnB,OACI,kBAAC,GAAD;EACU;EACN,SAAS;EACF;EACP,MAAK;EACL,QACI,kBAAA,GAAA,EAAA,UAAA,CACI,kBAAC,GAAD;GAAQ,SAAQ;GAAY,SAAS;GAAU,UAAU;aACpD;EACG,CAAA,GACR,kBAAC,GAAD;GAAiB;GAAkB;GAAS,eAAe,KAAK,EAAU;aACrE;EACG,CAAA,CACV,EAAA,CAAA;YAGL;CACE,CAAA;AAEf"}

package/dist/components/ContextMenu/ContextMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.cjs","names":[],"sources":["../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { Portal } from \"@/components/Portal\";\nimport styles from \"./ContextMenu.module.css\";\n\nexport type ContextMenuItem =\n    | {\n          label: ReactNode;\n          onSelect?: () => void;\n          disabled?: boolean;\n          danger?: boolean;\n      }\n    | { separator: true };\n\nexport interface ContextMenuProps {\n    /** Menu entries — selectable items and separators. */\n    items: ContextMenuItem[];\n    /** Trigger area. Right-clicking anywhere within opens the menu at the cursor. */\n    children: ReactNode;\n    /** Extra class names forwarded to the menu element. */\n    className?: string;\n}\n\ninterface Position {\n    x: number;\n    y: number;\n}\n\nfunction isSeparator(item: ContextMenuItem): item is { separator: true } {\n    return \"separator\" in item && item.separator === true;\n}\n\n/**\n * Right-click context menu.\n *\n * - Opens at the cursor position on `onContextMenu` (default browser menu suppressed).\n * - Rendered through a {@link Portal} so it escapes parent overflow/stacking contexts.\n * - Closes on outside click, Escape, or item selection.\n * - Arrow Up/Down move focus across selectable items; Enter activates the focused item.\n *\n * @param props - The context menu props.\n * @returns The trigger wrapper plus the portalled menu when open.\n */\nexport function ContextMenu({ items, children, className }: ContextMenuProps) {\n    const [open, setOpen] = useState(false);\n    const [position, setPosition] = useState<Position>({ x: 0, y: 0 });\n    const [activeIndex, setActiveIndex] = useState<number>(-1);\n    const id = useId();\n    const menuRef = useRef<HTMLUListElement>(null);\n    const itemRefs = useRef<Array<HTMLButtonElement | null>>([]);\n\n    const selectableIndexes = items\n        .map((item, index) => (!isSeparator(item) && !item.disabled ? index : -1))\n        .filter((i) => i !== -1);\n\n    const close = useCallback((): void => {\n        setOpen(false);\n        setActiveIndex(-1);\n    }, []);\n\n    const handleContextMenu = (event: React.MouseEvent): void => {\n        event.preventDefault();\n        setPosition({ x: event.clientX, y: event.clientY });\n        setActiveIndex(-1);\n        setOpen(true);\n    };\n\n    useEffect(() => {\n        if (!open) return;\n        const onKey = (event: KeyboardEvent): void => {\n            if (event.key === \"Escape\") {\n                close();\n                return;\n            }\n            if (event.key === \"ArrowDown\") {\n                event.preventDefault();\n                const current = selectableIndexes.indexOf(activeIndex);\n                const next = selectableIndexes[(current + 1) % selectableIndexes.length] ?? -1;\n                setActiveIndex(next);\n                itemRefs.current[next]?.focus();\n            }\n            if (event.key === \"ArrowUp\") {\n                event.preventDefault();\n                const current = selectableIndexes.indexOf(activeIndex);\n                const prev =\n                    selectableIndexes[\n                        (current - 1 + selectableIndexes.length) % selectableIndexes.length\n                    ] ?? -1;\n                setActiveIndex(prev);\n                itemRefs.current[prev]?.focus();\n            }\n        };\n        const onDown = (event: MouseEvent): void => {\n            if (menuRef.current && !menuRef.current.contains(event.target as Node)) close();\n        };\n        window.addEventListener(\"keydown\", onKey);\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"keydown\", onKey);\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [open, activeIndex, selectableIndexes, close]);\n\n    const handleSelect = (item: Extract<ContextMenuItem, { label: ReactNode }>): void => {\n        item.onSelect?.();\n        close();\n    };\n\n    return (\n        <>\n            <span className={styles.root} onContextMenu={handleContextMenu}>\n                {children}\n            </span>\n            {open && (\n                <Portal>\n                    <ul\n                        ref={menuRef}\n                        id={id}\n                        role=\"menu\"\n                        className={cn(styles.menu, className)}\n                        style={{ top: position.y, left: position.x }}\n                    >\n                        {items.map((item, index) => {\n                            if (isSeparator(item)) {\n                                return (\n                                    <li\n                                        key={`separator-${index}`}\n                                        role=\"separator\"\n                                        className={styles.separator}\n                                        aria-hidden\n                                    />\n                                );\n                            }\n                            return (\n                                <li key={`item-${index}`} role=\"none\">\n                                    <button\n                                        ref={(el) => {\n                                            itemRefs.current[index] = el;\n                                        }}\n                                        type=\"button\"\n                                        role=\"menuitem\"\n                                        className={cn(\n                                            styles.item,\n                                            item.danger && styles.danger,\n                                            activeIndex === index && styles.active,\n                                        )}\n                                        disabled={item.disabled}\n                                        onClick={() => handleSelect(item)}\n                                        onMouseEnter={() => setActiveIndex(index)}\n                                    >\n                                        {item.label}\n                                    </button>\n                                </li>\n                            );\n                        })}\n                    </ul>\n                </Portal>\n            )}\n        </>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ContextMenu.cjs","names":[],"sources":["../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["/**\n * @tempest-limits function-lines — the body positions the menu against the pointer,\n * flips it inside the viewport, and owns roving focus for the keyboard path — one\n * geometry computed from one anchor point.\n */\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport { Portal } from \"@/components/Portal\";\nimport styles from \"./ContextMenu.module.css\";\n\nexport type ContextMenuItem =\n    | {\n          label: ReactNode;\n          onSelect?: () => void;\n          disabled?: boolean;\n          danger?: boolean;\n      }\n    | { separator: true };\n\nexport interface ContextMenuProps {\n    /** Menu entries — selectable items and separators. */\n    items: ContextMenuItem[];\n    /** Trigger area. Right-clicking anywhere within opens the menu at the cursor. */\n    children: ReactNode;\n    /** Extra class names forwarded to the menu element. */\n    className?: string;\n}\n\ninterface Position {\n    x: number;\n    y: number;\n}\n\nfunction isSeparator(item: ContextMenuItem): item is { separator: true } {\n    return \"separator\" in item && item.separator === true;\n}\n\n/**\n * Right-click context menu.\n *\n * - Opens at the cursor position on `onContextMenu` (default browser menu suppressed).\n * - Rendered through a {@link Portal} so it escapes parent overflow/stacking contexts.\n * - Closes on outside click, Escape, or item selection.\n * - Arrow Up/Down move focus across selectable items; Enter activates the focused item.\n *\n * @param props - The context menu props.\n * @returns The trigger wrapper plus the portalled menu when open.\n */\nexport function ContextMenu({ items, children, className }: ContextMenuProps) {\n    const [open, setOpen] = useState(false);\n    const [position, setPosition] = useState<Position>({ x: 0, y: 0 });\n    const [activeIndex, setActiveIndex] = useState<number>(-1);\n    const id = useId();\n    const menuRef = useRef<HTMLUListElement>(null);\n    const itemRefs = useRef<Array<HTMLButtonElement | null>>([]);\n\n    const selectableIndexes = items\n        .map((item, index) => (!isSeparator(item) && !item.disabled ? index : -1))\n        .filter((i) => i !== -1);\n\n    const close = useCallback((): void => {\n        setOpen(false);\n        setActiveIndex(-1);\n    }, []);\n\n    const handleContextMenu = (event: React.MouseEvent): void => {\n        event.preventDefault();\n        setPosition({ x: event.clientX, y: event.clientY });\n        setActiveIndex(-1);\n        setOpen(true);\n    };\n\n    useEffect(() => {\n        if (!open) return;\n        const onKey = (event: KeyboardEvent): void => {\n            if (event.key === \"Escape\") {\n                close();\n                return;\n            }\n            if (event.key === \"ArrowDown\") {\n                event.preventDefault();\n                const current = selectableIndexes.indexOf(activeIndex);\n                const next = selectableIndexes[(current + 1) % selectableIndexes.length] ?? -1;\n                setActiveIndex(next);\n                itemRefs.current[next]?.focus();\n            }\n            if (event.key === \"ArrowUp\") {\n                event.preventDefault();\n                const current = selectableIndexes.indexOf(activeIndex);\n                const prev =\n                    selectableIndexes[\n                        (current - 1 + selectableIndexes.length) % selectableIndexes.length\n                    ] ?? -1;\n                setActiveIndex(prev);\n                itemRefs.current[prev]?.focus();\n            }\n        };\n        const onDown = (event: MouseEvent): void => {\n            if (menuRef.current && !menuRef.current.contains(event.target as Node)) close();\n        };\n        window.addEventListener(\"keydown\", onKey);\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"keydown\", onKey);\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [open, activeIndex, selectableIndexes, close]);\n\n    const handleSelect = (item: Extract<ContextMenuItem, { label: ReactNode }>): void => {\n        item.onSelect?.();\n        close();\n    };\n\n    return (\n        <>\n            <span className={styles.root} onContextMenu={handleContextMenu}>\n                {children}\n            </span>\n            {open && (\n                <Portal>\n                    <ul\n                        ref={menuRef}\n                        id={id}\n                        role=\"menu\"\n                        className={cn(styles.menu, className)}\n                        style={{ top: position.y, left: position.x }}\n                    >\n                        {items.map((item, index) => {\n                            if (isSeparator(item)) {\n                                return (\n                                    <li\n                                        key={`separator-${index}`}\n                                        role=\"separator\"\n                                        className={styles.separator}\n                                        aria-hidden\n                                    />\n                                );\n                            }\n                            return (\n                                <li key={`item-${index}`} role=\"none\">\n                                    <button\n                                        ref={(el) => {\n                                            itemRefs.current[index] = el;\n                                        }}\n                                        type=\"button\"\n                                        role=\"menuitem\"\n                                        className={cn(\n                                            styles.item,\n                                            item.danger && styles.danger,\n                                            activeIndex === index && styles.active,\n                                        )}\n                                        disabled={item.disabled}\n                                        onClick={() => handleSelect(item)}\n                                        onMouseEnter={() => setActiveIndex(index)}\n                                    >\n                                        {item.label}\n                                    </button>\n                                </li>\n                            );\n                        })}\n                    </ul>\n                </Portal>\n            )}\n        </>\n    );\n}\n"],"mappings":"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"}