@commercetools/nimbus 2.0.1 → 2.2.0

package/README.md

@@ -16,17 +16,91 @@ pnpm run build
 
 ### Workflow
 
-- Create a new `.i18n.ts` file in the component's directory and add the new
-  message(s) to it.
-  - Example: `/components/alert/alert.i18n.ts`
-  - The message should follow the pattern: `Nimbus.{ComponentName}.{messageKey}`
-  - Be specific with the message description, these are used to help translators
-    with context for each message.
-- Use the messages in your component:
-  - Example: `/components/alert/components/alert.dismiss-button.tsx`
-- Run `pnpm extract-intl` prior to merging to update the `core.json` file so
-  Transifex can detect new translation keys.
-- Test in Storybook to ensure the locale is working as expected.
+1. **Create `.i18n.ts` source file** in the component's directory:
+   - Example: `/components/alert/alert.i18n.ts`
+   - Use the [i18n template](../../docs/component-templates/i18n.template.md) as
+     a starting point
+   - Message IDs must follow: `Nimbus.{ComponentName}.{messageKey}`
+   - Be specific with descriptions - they help translators understand context
+   - **Note:** This file is for extraction only - components don't import it at
+     runtime
+
+2. **Use messages in your component**:
+   - Import the compiled message strings and the hook:
+     ```typescript
+     import { useLocalizedStringFormatter } from "@/hooks";
+     import { componentMessagesStrings } from "./component.messages";
+     ```
+   - Use the hook in your component:
+     ```typescript
+     const msg = useLocalizedStringFormatter(componentMessagesStrings);
+     ```
+   - Call `msg.format("key")` for simple strings
+   - Call `msg.format("key", { variableName: value })` for variable messages
+   - See [i18n guidelines](../../docs/file-type-guidelines/i18n.md) for detailed
+     usage patterns
+
+3. **Extract and compile messages**:
+   - Run `pnpm extract-intl` from the project root
+   - This command performs two operations:
+     1. **Extracts** messages from all `.i18n.ts` files →
+        `packages/i18n/data/core.json`
+     2. **Compiles** messages into `*.messages.ts` dictionaries (runs full build
+        pipeline)
+   - Messages are translated via Transifex workflow
+   - **Note:** The i18n build also runs automatically during `pnpm build`
+
+4. **Test in Storybook** to ensure locale is working as expected:
+   - Use `NimbusI18nProvider` in stories to test different locales
+   - Set `locale` prop to verify translations appear correctly
+
+### Dependencies
+
+**`react-intl` is a dev dependency only** - it is not required at runtime:
+
+- **In `devDependencies`**: Needed for `.i18n.ts` source files which use
+  `defineMessages` from `react-intl`. The `@formatjs/cli extract` tool expects
+  this format to extract messages.
+- **Not in `peerDependencies`**: Consumers do not need to install `react-intl`.
+  Components use compiled `.messages.ts` dictionaries at runtime, not the
+  `.i18n.ts` source files.
+- **Runtime**: Components use `LocalizedStringDictionary` from
+  `@internationalized/string` and `react-aria-components` for message retrieval,
+  not `react-intl`.
+
+### Quick Reference
+
+**Adding a new message:**
+
+1. Create/update `.i18n.ts` file in component directory
+2. Run `pnpm extract-intl` (extracts + compiles in one step)
+3. Use in component: `msg.format("key")` or
+   `msg.format("key", { variable: value })`
+
+**Updating existing messages:**
+
+- Edit `.i18n.ts` file
+- Run `pnpm extract-intl` to re-extract and compile
+- Changes reflect immediately in components
+
+**Testing locale changes:**
+
+- Use `NimbusI18nProvider` in Storybook stories
+- Set `locale` prop to test different languages (e.g., `locale="de"`)
+- Verify messages appear correctly for each locale
+
+**Troubleshooting:**
+
+- **Empty string returned?** Check that message key matches the ID (not the
+  object key from `.i18n.ts`)
+  - Example: `id: "Nimbus.Alert.dismiss"` → use `msg.format("dismiss")`, not the
+    object key
+- **TypeScript error about missing messages?** Run `pnpm extract-intl` to
+  regenerate `*.messages.ts` files
+- **Messages not updating?** Ensure `*.messages.ts` files are generated by
+  running `pnpm extract-intl`
+- **Wrong locale showing?** Verify `NimbusI18nProvider` wraps your component
+  with correct `locale` prop
 
 ### Extracting Messages
 
@@ -38,18 +112,10 @@ This command performs two operations:
 
 1. **Extracts** translation messages from all `.i18n.ts` files and saves them to
    `packages/i18n/data/core.json`
-2. **Compiles** the extracted messages into optimized AST format in
-   `compiled-data/` for distribution
+2. **Compiles** the extracted messages into component-level message dictionaries
+   in `packages/nimbus/src/components/*/intl/` and `*.messages.ts` files
 
 **Note:** The i18n package also builds automatically during `pnpm build`.
 
 > 📦 Translation data is organized in the
 > [`@commercetools/nimbus-i18n`](../i18n/README.md) package.
-
-## Translation Workflow
-
-- Notifying Tx, TBD
-
-## Distribution
-
-- Describe how i18n will be packaged for appkit to be consumed by mc-apps.

package/dist/chunks/Button-BjcDZ5eb.es.js

@@ -0,0 +1,79 @@
+import { $ as F, a as h } from "./utils-B6pV5ewr.es.js";
+import { $ as V } from "./ProgressBar-Dm2Ge45l.es.js";
+import { $ as x } from "./LiveAnnouncer-CsPyaceH.es.js";
+import { $ as B } from "./Hidden-X9vuhkMZ.es.js";
+import { a as v, $ as C } from "./mergeProps-Dsl8k3Ig.es.js";
+import { $ as E } from "./filterDOMProps-BSVCO5jK.es.js";
+import g, { createContext as H, useRef as I, useEffect as k } from "react";
+import { $ as R } from "./useButton-CiPiehgC.es.js";
+import { $ as _ } from "./useFocusRing-FPt2Rwil.es.js";
+import { $ as w } from "./useHover-BQRSM3qT.es.js";
+const L = /* @__PURE__ */ H({}), K = /* @__PURE__ */ B(function(a, d) {
+  [a, d] = F(a, d, L);
+  let n = a, { isPending: e } = n, { buttonProps: t, isPressed: p } = R(a, d);
+  t = M(t, e);
+  let { focusProps: y, isFocused: r, isFocusVisible: c } = _(a), { hoverProps: D, isHovered: $ } = w({
+    ...a,
+    isDisabled: a.isDisabled || e
+  }), b = {
+    isHovered: $,
+    isPressed: (n.isPressed || p) && !e,
+    isFocused: r,
+    isFocusVisible: c,
+    isDisabled: a.isDisabled || !1,
+    isPending: e ?? !1
+  }, u = h({
+    ...a,
+    values: b,
+    defaultClassName: "react-aria-Button"
+  }), o = v(t.id), f = v(), i = t["aria-labelledby"];
+  e && (i ? i = `${i} ${f}` : t["aria-label"] && (i = `${o} ${f}`));
+  let l = I(e);
+  k(() => {
+    let P = {
+      "aria-labelledby": i || o
+    };
+    !l.current && r && e ? x(P, "assertive") : l.current && r && !e && x(P, "assertive"), l.current = e;
+  }, [
+    e,
+    r,
+    i,
+    o
+  ]);
+  let m = E(a, {
+    global: !0
+  });
+  return delete m.onClick, /* @__PURE__ */ g.createElement("button", {
+    ...C(m, u, t, y, D),
+    // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).
+    // We do this by changing the button's type to button.
+    type: t.type === "submit" && e ? "button" : t.type,
+    id: o,
+    ref: d,
+    "aria-labelledby": i,
+    slot: a.slot || void 0,
+    "aria-disabled": e ? "true" : t["aria-disabled"],
+    "data-disabled": a.isDisabled || void 0,
+    "data-pressed": b.isPressed || void 0,
+    "data-hovered": $ || void 0,
+    "data-focused": r || void 0,
+    "data-pending": e || void 0,
+    "data-focus-visible": c || void 0
+  }, /* @__PURE__ */ g.createElement(V.Provider, {
+    value: {
+      id: f
+    }
+  }, u.children));
+});
+function M(s, a) {
+  if (a) {
+    for (const d in s) d.startsWith("on") && !(d.includes("Focus") || d.includes("Blur")) && (s[d] = void 0);
+    s.href = void 0, s.target = void 0;
+  }
+  return s;
+}
+export {
+  L as $,
+  K as a
+};
+//# sourceMappingURL=Button-BjcDZ5eb.es.js.map

package/dist/chunks/Button-BjcDZ5eb.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-BjcDZ5eb.es.js","sources":["../../../../node_modules/.pnpm/react-aria-components@1.13.0_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/react-aria-components/dist/Button.mjs"],"sourcesContent":["import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from \"./utils.mjs\";\nimport {ProgressBarContext as $0393f8ab869a0f1a$export$e9f3bf65a26ce129} from \"./ProgressBar.mjs\";\nimport {announce as $fM325$announce} from \"@react-aria/live-announcer\";\nimport {useButton as $fM325$useButton, useFocusRing as $fM325$useFocusRing, useHover as $fM325$useHover, useId as $fM325$useId, mergeProps as $fM325$mergeProps} from \"react-aria\";\nimport {createHideableComponent as $fM325$createHideableComponent} from \"@react-aria/collections\";\nimport {filterDOMProps as $fM325$filterDOMProps} from \"@react-aria/utils\";\nimport $fM325$react, {createContext as $fM325$createContext, useRef as $fM325$useRef, useEffect as $fM325$useEffect} from \"react\";\n\n/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */ \n\n\n\n\n\n\nconst $d2b4bc8c273e7be6$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $fM325$createContext)({});\nconst $d2b4bc8c273e7be6$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $fM325$createHideableComponent)(function Button(props, ref) {\n    [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $d2b4bc8c273e7be6$export$24d547caef80ccd1);\n    let ctx = props;\n    let { isPending: isPending } = ctx;\n    let { buttonProps: buttonProps, isPressed: isPressed } = (0, $fM325$useButton)(props, ref);\n    buttonProps = $d2b4bc8c273e7be6$var$useDisableInteractions(buttonProps, isPending);\n    let { focusProps: focusProps, isFocused: isFocused, isFocusVisible: isFocusVisible } = (0, $fM325$useFocusRing)(props);\n    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $fM325$useHover)({\n        ...props,\n        isDisabled: props.isDisabled || isPending\n    });\n    let renderValues = {\n        isHovered: isHovered,\n        isPressed: (ctx.isPressed || isPressed) && !isPending,\n        isFocused: isFocused,\n        isFocusVisible: isFocusVisible,\n        isDisabled: props.isDisabled || false,\n        isPending: isPending !== null && isPending !== void 0 ? isPending : false\n    };\n    let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({\n        ...props,\n        values: renderValues,\n        defaultClassName: 'react-aria-Button'\n    });\n    let buttonId = (0, $fM325$useId)(buttonProps.id);\n    let progressId = (0, $fM325$useId)();\n    let ariaLabelledby = buttonProps['aria-labelledby'];\n    if (isPending) {\n        // aria-labelledby wins over aria-label\n        // https://www.w3.org/TR/accname-1.2/#computation-steps\n        if (ariaLabelledby) ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n        else if (buttonProps['aria-label']) ariaLabelledby = `${buttonId} ${progressId}`;\n    }\n    let wasPending = (0, $fM325$useRef)(isPending);\n    (0, $fM325$useEffect)(()=>{\n        let message = {\n            'aria-labelledby': ariaLabelledby || buttonId\n        };\n        if (!wasPending.current && isFocused && isPending) (0, $fM325$announce)(message, 'assertive');\n        else if (wasPending.current && isFocused && !isPending) (0, $fM325$announce)(message, 'assertive');\n        wasPending.current = isPending;\n    }, [\n        isPending,\n        isFocused,\n        ariaLabelledby,\n        buttonId\n    ]);\n    let DOMProps = (0, $fM325$filterDOMProps)(props, {\n        global: true\n    });\n    delete DOMProps.onClick;\n    return /*#__PURE__*/ (0, $fM325$react).createElement(\"button\", {\n        ...(0, $fM325$mergeProps)(DOMProps, renderProps, buttonProps, focusProps, hoverProps),\n        // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).\n        // We do this by changing the button's type to button.\n        type: buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type,\n        id: buttonId,\n        ref: ref,\n        \"aria-labelledby\": ariaLabelledby,\n        slot: props.slot || undefined,\n        \"aria-disabled\": isPending ? 'true' : buttonProps['aria-disabled'],\n        \"data-disabled\": props.isDisabled || undefined,\n        \"data-pressed\": renderValues.isPressed || undefined,\n        \"data-hovered\": isHovered || undefined,\n        \"data-focused\": isFocused || undefined,\n        \"data-pending\": isPending || undefined,\n        \"data-focus-visible\": isFocusVisible || undefined\n    }, /*#__PURE__*/ (0, $fM325$react).createElement((0, $0393f8ab869a0f1a$export$e9f3bf65a26ce129).Provider, {\n        value: {\n            id: progressId\n        }\n    }, renderProps.children));\n});\nfunction $d2b4bc8c273e7be6$var$useDisableInteractions(props, isPending) {\n    // Don't allow interaction while isPending is true\n    if (isPending) {\n        for(const key in props)if (key.startsWith('on') && !(key.includes('Focus') || key.includes('Blur'))) props[key] = undefined;\n        props.href = undefined;\n        props.target = undefined;\n    }\n    return props;\n}\n\n\nexport {$d2b4bc8c273e7be6$export$24d547caef80ccd1 as ButtonContext, $d2b4bc8c273e7be6$export$353f5b6fc5456de1 as Button};\n//# sourceMappingURL=Button.module.js.map\n"],"names":["$d2b4bc8c273e7be6$export$24d547caef80ccd1","$fM325$createContext","$d2b4bc8c273e7be6$export$353f5b6fc5456de1","$fM325$createHideableComponent","props","ref","$64fa3d84918910a7$export$29f1550f4b0d4415","ctx","isPending","buttonProps","isPressed","$fM325$useButton","$d2b4bc8c273e7be6$var$useDisableInteractions","focusProps","isFocused","isFocusVisible","$fM325$useFocusRing","hoverProps","isHovered","$fM325$useHover","renderValues","renderProps","$64fa3d84918910a7$export$4d86445c2cf5e3","buttonId","$fM325$useId","progressId","ariaLabelledby","wasPending","$fM325$useRef","$fM325$useEffect","message","$fM325$announce","DOMProps","$fM325$filterDOMProps","$fM325$react","$fM325$mergeProps","$0393f8ab869a0f1a$export$e9f3bf65a26ce129","key"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/chunks/Button-DLCecw8f.cjs.js

@@ -0,0 +1,2 @@
+"use strict";const q=require("./utils-DVb3jcp5.cjs.js"),B=require("./ProgressBar-BnIWveAr.cjs.js"),y=require("./LiveAnnouncer-BkrEjKY8.cjs.js"),H=require("./Hidden-CNJIJ63M.cjs.js"),u=require("./mergeProps-CxnHrnow.cjs.js"),V=require("./filterDOMProps-WUskt27c.cjs.js"),c=require("react"),p=require("./useButton-BwsmYrml.cjs.js"),C=require("./useFocusRing-B7_ogYbr.cjs.js"),E=require("./useHover-xrdh1GG9.cjs.js"),D=c.createContext({}),I=H.$f39a9eba43920ace$export$86427a43e3e48ebb(function(d,t){[d,t]=q.$64fa3d84918910a7$export$29f1550f4b0d4415(d,t,D);let l=d,{isPending:e}=l,{buttonProps:s,isPressed:F}=p.$701a24aa0da5b062$export$ea18c227d4417cc3(d,t);s=R(s,e);let{focusProps:h,isFocused:r,isFocusVisible:f}=C.$f7dceffc5ad7768b$export$4e328f61c538687f(d),{hoverProps:m,isHovered:$}=E.$6179b936705e76d3$export$ae780daf29e6d456({...d,isDisabled:d.isDisabled||e}),P={isHovered:$,isPressed:(l.isPressed||F)&&!e,isFocused:r,isFocusVisible:f,isDisabled:d.isDisabled||!1,isPending:e??!1},x=q.$64fa3d84918910a7$export$4d86445c2cf5e3({...d,values:P,defaultClassName:"react-aria-Button"}),n=u.$bdb11010cef70236$export$f680877a34711e37(s.id),b=u.$bdb11010cef70236$export$f680877a34711e37(),i=s["aria-labelledby"];e&&(i?i=`${i} ${b}`:s["aria-label"]&&(i=`${n} ${b}`));let o=c.useRef(e);c.useEffect(()=>{let g={"aria-labelledby":i||n};(!o.current&&r&&e||o.current&&r&&!e)&&y.$319e236875307eab$export$a9b970dcc4ae71a9(g,"assertive"),o.current=e},[e,r,i,n]);let v=V.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(d,{global:!0});return delete v.onClick,c.createElement("button",{...u.$3ef42575df84b30b$export$9d1611c77c2fe928(v,x,s,h,m),type:s.type==="submit"&&e?"button":s.type,id:n,ref:t,"aria-labelledby":i,slot:d.slot||void 0,"aria-disabled":e?"true":s["aria-disabled"],"data-disabled":d.isDisabled||void 0,"data-pressed":P.isPressed||void 0,"data-hovered":$||void 0,"data-focused":r||void 0,"data-pending":e||void 0,"data-focus-visible":f||void 0},c.createElement(B.$0393f8ab869a0f1a$export$e9f3bf65a26ce129.Provider,{value:{id:b}},x.children))});function R(a,d){if(d){for(const t in a)t.startsWith("on")&&!(t.includes("Focus")||t.includes("Blur"))&&(a[t]=void 0);a.href=void 0,a.target=void 0}return a}exports.$d2b4bc8c273e7be6$export$24d547caef80ccd1=D;exports.$d2b4bc8c273e7be6$export$353f5b6fc5456de1=I;
+//# sourceMappingURL=Button-DLCecw8f.cjs.js.map

package/dist/chunks/Button-DLCecw8f.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-DLCecw8f.cjs.js","sources":["../../../../node_modules/.pnpm/react-aria-components@1.13.0_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/react-aria-components/dist/Button.mjs"],"sourcesContent":["import {useContextProps as $64fa3d84918910a7$export$29f1550f4b0d4415, useRenderProps as $64fa3d84918910a7$export$4d86445c2cf5e3} from \"./utils.mjs\";\nimport {ProgressBarContext as $0393f8ab869a0f1a$export$e9f3bf65a26ce129} from \"./ProgressBar.mjs\";\nimport {announce as $fM325$announce} from \"@react-aria/live-announcer\";\nimport {useButton as $fM325$useButton, useFocusRing as $fM325$useFocusRing, useHover as $fM325$useHover, useId as $fM325$useId, mergeProps as $fM325$mergeProps} from \"react-aria\";\nimport {createHideableComponent as $fM325$createHideableComponent} from \"@react-aria/collections\";\nimport {filterDOMProps as $fM325$filterDOMProps} from \"@react-aria/utils\";\nimport $fM325$react, {createContext as $fM325$createContext, useRef as $fM325$useRef, useEffect as $fM325$useEffect} from \"react\";\n\n/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */ \n\n\n\n\n\n\nconst $d2b4bc8c273e7be6$export$24d547caef80ccd1 = /*#__PURE__*/ (0, $fM325$createContext)({});\nconst $d2b4bc8c273e7be6$export$353f5b6fc5456de1 = /*#__PURE__*/ (0, $fM325$createHideableComponent)(function Button(props, ref) {\n    [props, ref] = (0, $64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $d2b4bc8c273e7be6$export$24d547caef80ccd1);\n    let ctx = props;\n    let { isPending: isPending } = ctx;\n    let { buttonProps: buttonProps, isPressed: isPressed } = (0, $fM325$useButton)(props, ref);\n    buttonProps = $d2b4bc8c273e7be6$var$useDisableInteractions(buttonProps, isPending);\n    let { focusProps: focusProps, isFocused: isFocused, isFocusVisible: isFocusVisible } = (0, $fM325$useFocusRing)(props);\n    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $fM325$useHover)({\n        ...props,\n        isDisabled: props.isDisabled || isPending\n    });\n    let renderValues = {\n        isHovered: isHovered,\n        isPressed: (ctx.isPressed || isPressed) && !isPending,\n        isFocused: isFocused,\n        isFocusVisible: isFocusVisible,\n        isDisabled: props.isDisabled || false,\n        isPending: isPending !== null && isPending !== void 0 ? isPending : false\n    };\n    let renderProps = (0, $64fa3d84918910a7$export$4d86445c2cf5e3)({\n        ...props,\n        values: renderValues,\n        defaultClassName: 'react-aria-Button'\n    });\n    let buttonId = (0, $fM325$useId)(buttonProps.id);\n    let progressId = (0, $fM325$useId)();\n    let ariaLabelledby = buttonProps['aria-labelledby'];\n    if (isPending) {\n        // aria-labelledby wins over aria-label\n        // https://www.w3.org/TR/accname-1.2/#computation-steps\n        if (ariaLabelledby) ariaLabelledby = `${ariaLabelledby} ${progressId}`;\n        else if (buttonProps['aria-label']) ariaLabelledby = `${buttonId} ${progressId}`;\n    }\n    let wasPending = (0, $fM325$useRef)(isPending);\n    (0, $fM325$useEffect)(()=>{\n        let message = {\n            'aria-labelledby': ariaLabelledby || buttonId\n        };\n        if (!wasPending.current && isFocused && isPending) (0, $fM325$announce)(message, 'assertive');\n        else if (wasPending.current && isFocused && !isPending) (0, $fM325$announce)(message, 'assertive');\n        wasPending.current = isPending;\n    }, [\n        isPending,\n        isFocused,\n        ariaLabelledby,\n        buttonId\n    ]);\n    let DOMProps = (0, $fM325$filterDOMProps)(props, {\n        global: true\n    });\n    delete DOMProps.onClick;\n    return /*#__PURE__*/ (0, $fM325$react).createElement(\"button\", {\n        ...(0, $fM325$mergeProps)(DOMProps, renderProps, buttonProps, focusProps, hoverProps),\n        // When the button is in a pending state, we want to stop implicit form submission (ie. when the user presses enter on a text input).\n        // We do this by changing the button's type to button.\n        type: buttonProps.type === 'submit' && isPending ? 'button' : buttonProps.type,\n        id: buttonId,\n        ref: ref,\n        \"aria-labelledby\": ariaLabelledby,\n        slot: props.slot || undefined,\n        \"aria-disabled\": isPending ? 'true' : buttonProps['aria-disabled'],\n        \"data-disabled\": props.isDisabled || undefined,\n        \"data-pressed\": renderValues.isPressed || undefined,\n        \"data-hovered\": isHovered || undefined,\n        \"data-focused\": isFocused || undefined,\n        \"data-pending\": isPending || undefined,\n        \"data-focus-visible\": isFocusVisible || undefined\n    }, /*#__PURE__*/ (0, $fM325$react).createElement((0, $0393f8ab869a0f1a$export$e9f3bf65a26ce129).Provider, {\n        value: {\n            id: progressId\n        }\n    }, renderProps.children));\n});\nfunction $d2b4bc8c273e7be6$var$useDisableInteractions(props, isPending) {\n    // Don't allow interaction while isPending is true\n    if (isPending) {\n        for(const key in props)if (key.startsWith('on') && !(key.includes('Focus') || key.includes('Blur'))) props[key] = undefined;\n        props.href = undefined;\n        props.target = undefined;\n    }\n    return props;\n}\n\n\nexport {$d2b4bc8c273e7be6$export$24d547caef80ccd1 as ButtonContext, $d2b4bc8c273e7be6$export$353f5b6fc5456de1 as Button};\n//# sourceMappingURL=Button.module.js.map\n"],"names":["$d2b4bc8c273e7be6$export$24d547caef80ccd1","$fM325$createContext","$d2b4bc8c273e7be6$export$353f5b6fc5456de1","$fM325$createHideableComponent","props","ref","$64fa3d84918910a7$export$29f1550f4b0d4415","ctx","isPending","buttonProps","isPressed","$fM325$useButton","$d2b4bc8c273e7be6$var$useDisableInteractions","focusProps","isFocused","isFocusVisible","$fM325$useFocusRing","hoverProps","isHovered","$fM325$useHover","renderValues","renderProps","$64fa3d84918910a7$export$4d86445c2cf5e3","buttonId","$fM325$useId","progressId","ariaLabelledby","wasPending","$fM325$useRef","$fM325$useEffect","message","$fM325$announce","DOMProps","$fM325$filterDOMProps","$fM325$react","$fM325$mergeProps","$0393f8ab869a0f1a$export$e9f3bf65a26ce129","key"],"mappings":"8ZAyBMA,EAA8DC,EAAAA,cAAsB,CAAA,CAAE,EACtFC,EAA8DC,EAAAA,0CAAgC,SAAgBC,EAAOC,EAAK,CAC5H,CAACD,EAAOC,CAAG,EAAQC,EAAAA,0CAA2CF,EAAOC,EAAKL,CAAyC,EACnH,IAAIO,EAAMH,EACN,CAAE,UAAWI,CAAS,EAAKD,EAC3B,CAAE,YAAaE,EAAa,UAAWC,CAAS,EAASC,EAAAA,0CAAkBP,EAAOC,CAAG,EACzFI,EAAcG,EAA6CH,EAAaD,CAAS,EACjF,GAAI,CAAE,WAAYK,EAAY,UAAWC,EAAW,eAAgBC,CAAc,EAASC,EAAAA,0CAAqBZ,CAAK,EACjH,CAAE,WAAYa,EAAY,UAAWC,CAAS,EAASC,4CAAiB,CACxE,GAAGf,EACH,WAAYA,EAAM,YAAcI,CACxC,CAAK,EACGY,EAAe,CACf,UAAWF,EACX,WAAYX,EAAI,WAAaG,IAAc,CAACF,EAC5C,UAAWM,EACX,eAAgBC,EAChB,WAAYX,EAAM,YAAc,GAChC,UAAWI,GAAyD,EAC5E,EACQa,EAAkBC,0CAAyC,CAC3D,GAAGlB,EACH,OAAQgB,EACR,iBAAkB,mBAC1B,CAAK,EACGG,EAAeC,4CAAcf,EAAY,EAAE,EAC3CgB,EAAiBD,4CAAY,EAC7BE,EAAiBjB,EAAY,iBAAiB,EAC9CD,IAGIkB,EAAgBA,EAAiB,GAAGA,CAAc,IAAID,CAAU,GAC3DhB,EAAY,YAAY,IAAGiB,EAAiB,GAAGH,CAAQ,IAAIE,CAAU,KAElF,IAAIE,EAAiBC,EAAAA,OAAepB,CAAS,EACzCqB,EAAAA,UAAkB,IAAI,CACtB,IAAIC,EAAU,CACV,kBAAmBJ,GAAkBH,CACjD,GACY,CAACI,EAAW,SAAWb,GAAaN,GAC/BmB,EAAW,SAAWb,GAAa,CAACN,IAAeuB,EAAAA,0CAAiBD,EAAS,WAAW,EACjGH,EAAW,QAAUnB,CACzB,EAAG,CACCA,EACAM,EACAY,EACAH,CACR,CAAK,EACD,IAAIS,EAAeC,EAAAA,0CAAuB7B,EAAO,CAC7C,OAAQ,EAChB,CAAK,EACD,cAAO4B,EAAS,QACSE,EAAc,cAAc,SAAU,CAC3D,GAAOC,EAAAA,0CAAmBH,EAAUX,EAAaZ,EAAaI,EAAYI,CAAU,EAGpF,KAAMR,EAAY,OAAS,UAAYD,EAAY,SAAWC,EAAY,KAC1E,GAAIc,EACJ,IAAKlB,EACL,kBAAmBqB,EACnB,KAAMtB,EAAM,MAAQ,OACpB,gBAAiBI,EAAY,OAASC,EAAY,eAAe,EACjE,gBAAiBL,EAAM,YAAc,OACrC,eAAgBgB,EAAa,WAAa,OAC1C,eAAgBF,GAAa,OAC7B,eAAgBJ,GAAa,OAC7B,eAAgBN,GAAa,OAC7B,qBAAsBO,GAAkB,MAChD,EAAyBmB,EAAc,cAAkBE,EAAAA,0CAA2C,SAAU,CACtG,MAAO,CACH,GAAIX,CAChB,CACA,EAAOJ,EAAY,QAAQ,CAAC,CAC5B,CAAC,EACD,SAAST,EAA6CR,EAAOI,EAAW,CAEpE,GAAIA,EAAW,CACX,UAAU6B,KAAOjC,EAAUiC,EAAI,WAAW,IAAI,GAAK,EAAEA,EAAI,SAAS,OAAO,GAAKA,EAAI,SAAS,MAAM,KAAIjC,EAAMiC,CAAG,EAAI,QAClHjC,EAAM,KAAO,OACbA,EAAM,OAAS,MACnB,CACA,OAAOA,CACX","x_google_ignoreList":[0]}