ods-ant 0.2.0 → 0.4.0

package/dist-lib/forms/FormError.cjs

@@ -0,0 +1,2 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../core-bPY3ouxp.cjs`),t=require(`../useCustomIcon-DbSB56Pd.cjs`);let n=require(`react/jsx-runtime`);var r={fontSize:`12px`,lineHeight:`16px`,letterSpacing:`0.012px`,fontWeight:600,color:e.t.status.errorDark,fontFamily:`Nunito, sans-serif`,marginTop:0,display:`flex`,alignItems:`flex-start`,gap:6},i={flexShrink:0,width:14,height:14,lineHeight:`14px`,marginTop:1},a=({message:e,containerStyle:a,live:o=`polite`})=>e?(0,n.jsxs)(`div`,{role:o===`assertive`?`alert`:void 0,"aria-live":o===`assertive`?`assertive`:`polite`,style:{...r,...a},children:[(0,n.jsx)(`span`,{style:i,"aria-hidden":`true`,children:(0,n.jsx)(t.t,{name:`alertTriangle`,size:14})}),(0,n.jsx)(`span`,{children:e})]}):null;exports.FormError=a;
+//# sourceMappingURL=FormError.cjs.map

package/dist-lib/forms/FormError.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormError.cjs","names":[],"sources":["../../src/ds/forms/FormError.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormErrorProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.status.errorDark,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n};\n\n/**\n * Accessible form error message component\n * - Uses role=\"alert\" for polite announcements (default)\n * - Supports aria-live=\"assertive\" for urgent errors\n * - Pairs with aria-invalid and aria-describedby on form controls\n */\nexport const FormError = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormErrorProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'alert' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"alertTriangle\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":"0NAUA,IAAM,EAAuC,CAC3C,SAAU,OACV,WAAY,OACZ,cAAe,UACf,WAAY,IACZ,MAAO,EAAA,EAAY,OAAO,UAC1B,WAAY,qBACZ,UAAW,EACX,QAAS,OACT,WAAY,aACZ,IAAK,EACN,CAEK,EAA2B,CAC/B,WAAY,EACZ,MAAO,GACP,OAAQ,GACR,WAAY,OACZ,UAAW,EACZ,CAQY,GAAa,CACxB,UACA,eAAgB,EAChB,OAAO,YAEF,GAKH,EAAA,EAAA,MAAC,MAAD,CACE,KAAM,IAAS,YAAc,QAAU,IAAA,GACvC,YAAW,IAAS,YAAc,YAAc,SAChD,MAAO,CAAE,GAAG,EAAuB,GAAG,EAAsB,UAH9D,EAKE,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,EAAW,cAAY,iBAClC,EAAA,EAAA,KAAC,EAAA,EAAD,CAAM,KAAK,gBAAgB,KAAM,GAAM,CAAA,CAClC,CAAA,EACP,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAe,CAAA,CAClB,GAbC"}

package/dist-lib/forms/FormError.js

@@ -0,0 +1,41 @@
+import { t as e } from "../core-C-tv3mqr.js";
+import { t } from "../useCustomIcon-B-VUK-84.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/ds/forms/FormError.tsx
+var i = {
+	fontSize: "12px",
+	lineHeight: "16px",
+	letterSpacing: "0.012px",
+	fontWeight: 600,
+	color: e.status.errorDark,
+	fontFamily: "Nunito, sans-serif",
+	marginTop: 0,
+	display: "flex",
+	alignItems: "flex-start",
+	gap: 6
+}, a = {
+	flexShrink: 0,
+	width: 14,
+	height: 14,
+	lineHeight: "14px",
+	marginTop: 1
+}, o = ({ message: e, containerStyle: o, live: s = "polite" }) => e ? /* @__PURE__ */ r("div", {
+	role: s === "assertive" ? "alert" : void 0,
+	"aria-live": s === "assertive" ? "assertive" : "polite",
+	style: {
+		...i,
+		...o
+	},
+	children: [/* @__PURE__ */ n("span", {
+		style: a,
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ n(t, {
+			name: "alertTriangle",
+			size: 14
+		})
+	}), /* @__PURE__ */ n("span", { children: e })]
+}) : null;
+//#endregion
+export { o as FormError };
+
+//# sourceMappingURL=FormError.js.map

package/dist-lib/forms/FormError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormError.js","names":[],"sources":["../../src/ds/forms/FormError.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormErrorProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.status.errorDark,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n};\n\n/**\n * Accessible form error message component\n * - Uses role=\"alert\" for polite announcements (default)\n * - Supports aria-live=\"assertive\" for urgent errors\n * - Pairs with aria-invalid and aria-describedby on form controls\n */\nexport const FormError = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormErrorProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'alert' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"alertTriangle\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":";;;;AAUA,IAAM,IAAuC;CAC3C,UAAU;CACV,YAAY;CACZ,eAAe;CACf,YAAY;CACZ,OAAO,EAAY,OAAO;CAC1B,YAAY;CACZ,WAAW;CACX,SAAS;CACT,YAAY;CACZ,KAAK;CACN,EAEK,IAA2B;CAC/B,YAAY;CACZ,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,WAAW;CACZ,EAQY,KAAa,EACxB,YACA,gBAAgB,GAChB,UAAO,eAEF,IAKH,kBAAC,OAAD;CACE,MAAM,MAAS,cAAc,UAAU,KAAA;CACvC,aAAW,MAAS,cAAc,cAAc;CAChD,OAAO;EAAE,GAAG;EAAuB,GAAG;EAAsB;WAH9D,CAKE,kBAAC,QAAD;EAAM,OAAO;EAAW,eAAY;YAClC,kBAAC,GAAD;GAAM,MAAK;GAAgB,MAAM;GAAM,CAAA;EAClC,CAAA,EACP,kBAAC,QAAD,EAAA,UAAO,GAAe,CAAA,CAClB;KAbC"}

package/dist-lib/forms/FormSuccess.cjs

@@ -0,0 +1,2 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../core-bPY3ouxp.cjs`),t=require(`../useCustomIcon-DbSB56Pd.cjs`);let n=require(`react/jsx-runtime`);var r={fontSize:`12px`,lineHeight:`16px`,letterSpacing:`0.012px`,fontWeight:600,color:e.t.text.primary,fontFamily:`Nunito, sans-serif`,marginTop:0,display:`flex`,alignItems:`flex-start`,gap:6},i={flexShrink:0,width:14,height:14,lineHeight:`14px`,marginTop:1,color:e.t.status.successDark},a=({message:e,containerStyle:a,live:o=`polite`})=>e?(0,n.jsxs)(`div`,{role:o===`assertive`?`status`:void 0,"aria-live":o===`assertive`?`assertive`:`polite`,style:{...r,...a},children:[(0,n.jsx)(`span`,{style:i,"aria-hidden":`true`,children:(0,n.jsx)(t.t,{name:`check`,size:14})}),(0,n.jsx)(`span`,{children:e})]}):null;exports.FormSuccess=a;
+//# sourceMappingURL=FormSuccess.cjs.map

package/dist-lib/forms/FormSuccess.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSuccess.cjs","names":[],"sources":["../../src/ds/forms/FormSuccess.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormSuccessProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.text.primary,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n  color: CORE_COLORS.status.successDark,\n};\n\n/**\n * Accessible form success message component for submission validation feedback.\n */\nexport const FormSuccess = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormSuccessProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'status' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"check\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":"0NAUA,IAAM,EAAuC,CAC3C,SAAU,OACV,WAAY,OACZ,cAAe,UACf,WAAY,IACZ,MAAO,EAAA,EAAY,KAAK,QACxB,WAAY,qBACZ,UAAW,EACX,QAAS,OACT,WAAY,aACZ,IAAK,EACN,CAEK,EAA2B,CAC/B,WAAY,EACZ,MAAO,GACP,OAAQ,GACR,WAAY,OACZ,UAAW,EACX,MAAO,EAAA,EAAY,OAAO,YAC3B,CAKY,GAAe,CAC1B,UACA,eAAgB,EAChB,OAAO,YAEF,GAKH,EAAA,EAAA,MAAC,MAAD,CACE,KAAM,IAAS,YAAc,SAAW,IAAA,GACxC,YAAW,IAAS,YAAc,YAAc,SAChD,MAAO,CAAE,GAAG,EAAuB,GAAG,EAAsB,UAH9D,EAKE,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,EAAW,cAAY,iBAClC,EAAA,EAAA,KAAC,EAAA,EAAD,CAAM,KAAK,QAAQ,KAAM,GAAM,CAAA,CAC1B,CAAA,EACP,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAe,CAAA,CAClB,GAbC"}

package/dist-lib/forms/FormSuccess.js

@@ -0,0 +1,42 @@
+import { t as e } from "../core-C-tv3mqr.js";
+import { t } from "../useCustomIcon-B-VUK-84.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/ds/forms/FormSuccess.tsx
+var i = {
+	fontSize: "12px",
+	lineHeight: "16px",
+	letterSpacing: "0.012px",
+	fontWeight: 600,
+	color: e.text.primary,
+	fontFamily: "Nunito, sans-serif",
+	marginTop: 0,
+	display: "flex",
+	alignItems: "flex-start",
+	gap: 6
+}, a = {
+	flexShrink: 0,
+	width: 14,
+	height: 14,
+	lineHeight: "14px",
+	marginTop: 1,
+	color: e.status.successDark
+}, o = ({ message: e, containerStyle: o, live: s = "polite" }) => e ? /* @__PURE__ */ r("div", {
+	role: s === "assertive" ? "status" : void 0,
+	"aria-live": s === "assertive" ? "assertive" : "polite",
+	style: {
+		...i,
+		...o
+	},
+	children: [/* @__PURE__ */ n("span", {
+		style: a,
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ n(t, {
+			name: "check",
+			size: 14
+		})
+	}), /* @__PURE__ */ n("span", { children: e })]
+}) : null;
+//#endregion
+export { o as FormSuccess };
+
+//# sourceMappingURL=FormSuccess.js.map

package/dist-lib/forms/FormSuccess.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSuccess.js","names":[],"sources":["../../src/ds/forms/FormSuccess.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormSuccessProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.text.primary,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n  color: CORE_COLORS.status.successDark,\n};\n\n/**\n * Accessible form success message component for submission validation feedback.\n */\nexport const FormSuccess = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormSuccessProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'status' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"check\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":";;;;AAUA,IAAM,IAAuC;CAC3C,UAAU;CACV,YAAY;CACZ,eAAe;CACf,YAAY;CACZ,OAAO,EAAY,KAAK;CACxB,YAAY;CACZ,WAAW;CACX,SAAS;CACT,YAAY;CACZ,KAAK;CACN,EAEK,IAA2B;CAC/B,YAAY;CACZ,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,WAAW;CACX,OAAO,EAAY,OAAO;CAC3B,EAKY,KAAe,EAC1B,YACA,gBAAgB,GAChB,UAAO,eAEF,IAKH,kBAAC,OAAD;CACE,MAAM,MAAS,cAAc,WAAW,KAAA;CACxC,aAAW,MAAS,cAAc,cAAc;CAChD,OAAO;EAAE,GAAG;EAAuB,GAAG;EAAsB;WAH9D,CAKE,kBAAC,QAAD;EAAM,OAAO;EAAW,eAAY;YAClC,kBAAC,GAAD;GAAM,MAAK;GAAQ,MAAM;GAAM,CAAA;EAC1B,CAAA,EACP,kBAAC,QAAD,EAAA,UAAO,GAAe,CAAA,CAClB;KAbC"}

package/dist-lib/forms/FormWarning.cjs

@@ -0,0 +1,2 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../core-bPY3ouxp.cjs`),t=require(`../useCustomIcon-DbSB56Pd.cjs`);let n=require(`react/jsx-runtime`);var r={fontSize:`12px`,lineHeight:`16px`,letterSpacing:`0.012px`,fontWeight:600,color:e.t.text.primary,fontFamily:`Nunito, sans-serif`,marginTop:0,display:`flex`,alignItems:`flex-start`,gap:6},i={flexShrink:0,width:14,height:14,lineHeight:`14px`,marginTop:1,color:e.t.status.warningDark},a=({message:e,containerStyle:a,live:o=`polite`})=>e?(0,n.jsxs)(`div`,{role:o===`assertive`?`status`:void 0,"aria-live":o===`assertive`?`assertive`:`polite`,style:{...r,...a},children:[(0,n.jsx)(`span`,{style:i,"aria-hidden":`true`,children:(0,n.jsx)(t.t,{name:`alertTriangle`,size:14})}),(0,n.jsx)(`span`,{children:e})]}):null;exports.FormWarning=a;
+//# sourceMappingURL=FormWarning.cjs.map

package/dist-lib/forms/FormWarning.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormWarning.cjs","names":[],"sources":["../../src/ds/forms/FormWarning.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormWarningProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.text.primary,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n  color: CORE_COLORS.status.warningDark,\n};\n\n/**\n * Accessible form warning message component for non-blocking validation feedback.\n */\nexport const FormWarning = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormWarningProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'status' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"alertTriangle\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":"0NAUA,IAAM,EAAuC,CAC3C,SAAU,OACV,WAAY,OACZ,cAAe,UACf,WAAY,IACZ,MAAO,EAAA,EAAY,KAAK,QACxB,WAAY,qBACZ,UAAW,EACX,QAAS,OACT,WAAY,aACZ,IAAK,EACN,CAEK,EAA2B,CAC/B,WAAY,EACZ,MAAO,GACP,OAAQ,GACR,WAAY,OACZ,UAAW,EACX,MAAO,EAAA,EAAY,OAAO,YAC3B,CAKY,GAAe,CAC1B,UACA,eAAgB,EAChB,OAAO,YAEF,GAKH,EAAA,EAAA,MAAC,MAAD,CACE,KAAM,IAAS,YAAc,SAAW,IAAA,GACxC,YAAW,IAAS,YAAc,YAAc,SAChD,MAAO,CAAE,GAAG,EAAuB,GAAG,EAAsB,UAH9D,EAKE,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,EAAW,cAAY,iBAClC,EAAA,EAAA,KAAC,EAAA,EAAD,CAAM,KAAK,gBAAgB,KAAM,GAAM,CAAA,CAClC,CAAA,EACP,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAe,CAAA,CAClB,GAbC"}

package/dist-lib/forms/FormWarning.js

@@ -0,0 +1,42 @@
+import { t as e } from "../core-C-tv3mqr.js";
+import { t } from "../useCustomIcon-B-VUK-84.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/ds/forms/FormWarning.tsx
+var i = {
+	fontSize: "12px",
+	lineHeight: "16px",
+	letterSpacing: "0.012px",
+	fontWeight: 600,
+	color: e.text.primary,
+	fontFamily: "Nunito, sans-serif",
+	marginTop: 0,
+	display: "flex",
+	alignItems: "flex-start",
+	gap: 6
+}, a = {
+	flexShrink: 0,
+	width: 14,
+	height: 14,
+	lineHeight: "14px",
+	marginTop: 1,
+	color: e.status.warningDark
+}, o = ({ message: e, containerStyle: o, live: s = "polite" }) => e ? /* @__PURE__ */ r("div", {
+	role: s === "assertive" ? "status" : void 0,
+	"aria-live": s === "assertive" ? "assertive" : "polite",
+	style: {
+		...i,
+		...o
+	},
+	children: [/* @__PURE__ */ n("span", {
+		style: a,
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ n(t, {
+			name: "alertTriangle",
+			size: 14
+		})
+	}), /* @__PURE__ */ n("span", { children: e })]
+}) : null;
+//#endregion
+export { o as FormWarning };
+
+//# sourceMappingURL=FormWarning.js.map

package/dist-lib/forms/FormWarning.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormWarning.js","names":[],"sources":["../../src/ds/forms/FormWarning.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { CORE_COLORS } from '../../tokens/core';\nimport { Icon } from '../../utils/useCustomIcon';\n\nexport type FormWarningProps = {\n  message?: ReactNode;\n  containerStyle?: CSSProperties;\n  live?: 'polite' | 'assertive';\n};\n\nconst defaultContainerStyle: CSSProperties = {\n  fontSize: '12px',\n  lineHeight: '16px',\n  letterSpacing: '0.012px',\n  fontWeight: 600,\n  color: CORE_COLORS.text.primary,\n  fontFamily: 'Nunito, sans-serif',\n  marginTop: 0,\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: 6,\n};\n\nconst iconStyle: CSSProperties = {\n  flexShrink: 0,\n  width: 14,\n  height: 14,\n  lineHeight: '14px',\n  marginTop: 1,\n  color: CORE_COLORS.status.warningDark,\n};\n\n/**\n * Accessible form warning message component for non-blocking validation feedback.\n */\nexport const FormWarning = ({\n  message,\n  containerStyle: customContainerStyle,\n  live = 'polite',\n}: FormWarningProps) => {\n  if (!message) {\n    return null;\n  }\n\n  return (\n    <div\n      role={live === 'assertive' ? 'status' : undefined}\n      aria-live={live === 'assertive' ? 'assertive' : 'polite'}\n      style={{ ...defaultContainerStyle, ...customContainerStyle }}\n    >\n      <span style={iconStyle} aria-hidden=\"true\">\n        <Icon name=\"alertTriangle\" size={14} />\n      </span>\n      <span>{message}</span>\n    </div>\n  );\n};\n"],"mappings":";;;;AAUA,IAAM,IAAuC;CAC3C,UAAU;CACV,YAAY;CACZ,eAAe;CACf,YAAY;CACZ,OAAO,EAAY,KAAK;CACxB,YAAY;CACZ,WAAW;CACX,SAAS;CACT,YAAY;CACZ,KAAK;CACN,EAEK,IAA2B;CAC/B,YAAY;CACZ,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,WAAW;CACX,OAAO,EAAY,OAAO;CAC3B,EAKY,KAAe,EAC1B,YACA,gBAAgB,GAChB,UAAO,eAEF,IAKH,kBAAC,OAAD;CACE,MAAM,MAAS,cAAc,WAAW,KAAA;CACxC,aAAW,MAAS,cAAc,cAAc;CAChD,OAAO;EAAE,GAAG;EAAuB,GAAG;EAAsB;WAH9D,CAKE,kBAAC,QAAD;EAAM,OAAO;EAAW,eAAY;YAClC,kBAAC,GAAD;GAAM,MAAK;GAAgB,MAAM;GAAM,CAAA;EAClC,CAAA,EACP,kBAAC,QAAD,EAAA,UAAO,GAAe,CAAA,CAClB;KAbC"}

package/dist-lib/forms/Input.cjs

@@ -0,0 +1,295 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../theme.cjs`),t=require(`./FieldShell.cjs`),n=require(`../fieldProps-CuWfEbFx.cjs`);let r=require(`antd`),i=require(`react`),a=require(`react/jsx-runtime`);var o=`ds-input-styles`,s=`ds-input`,c=e=>{let t=`${s} ${e.className??``}`.trim();return{...e,className:t}},l=({className:c=``,fieldLabel:l,fieldRequired:u,fieldDescription:d,fieldError:f,fieldActions:p,containerStyle:m,clear:h,clearable:g=!1,clearLabel:_,clearVisibility:v=`always`,onClear:y,onValueChange:b,id:x,...S})=>{let C=(0,i.useId)();(0,i.useEffect)(()=>{if(typeof document<`u`){let t=document.getElementById(o);t||(t=document.createElement(`style`),t.id=o,document.head.appendChild(t));let{input:n}=e.dsSemanticTokens;t.textContent=`
+        .ds-input.ant-input,
+        .ds-input.ant-input-affix-wrapper,
+        .ds-input.ant-input-filled,
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled,
+        .ds-input.ant-input-borderless,
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-borderless,
+        .ds-input.ant-input-underlined,
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-underlined,
+        .ds-input.ant-input-group-wrapper,
+        .ds-input.ant-input-search,
+        .ds-input.ant-space-compact.ant-input-search,
+        .ds-input.ant-input-outlined,
+        .ds-input.ant-input-affix-wrapper.ant-input-outlined {
+          border-color: ${n.border.default} !important;
+          border-width: ${n.border.widthDefault} !important;
+          border-style: solid !important;
+          border-radius: ${n.border.radius} !important;
+          background-color: ${n.background.default} !important;
+          color: ${n.text.default} !important;
+          transition: none !important;
+          box-sizing: border-box !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group-addon,
+        .ds-input.ant-input-search .ant-input-search-button,
+        .ds-input.ant-input-search .ant-input-search-btn {
+          border-radius: ${n.border.radius} !important;
+        }
+
+        .ds-input.ant-input-search .ant-input-search-btn,
+        .ds-input.ant-input-search .ant-input-search-button {
+          border-top-left-radius: 0 !important;
+          border-bottom-left-radius: 0 !important;
+          border-top-right-radius: ${n.border.radius} !important;
+          border-bottom-right-radius: ${n.border.radius} !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group-addon:first-child {
+          border-top-right-radius: 0 !important;
+          border-bottom-right-radius: 0 !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group-addon:last-child {
+          border-top-left-radius: 0 !important;
+          border-bottom-left-radius: 0 !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input {
+          border-radius: ${n.border.radius} !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input,
+        .ds-input.ant-input-group-wrapper .ant-input-group-addon,
+        .ds-input.ant-input-search .ant-input,
+        .ds-input.ant-input-search .ant-input-search-btn,
+        .ds-input.ant-input-search .ant-input-search-button {
+          border-color: ${n.border.default} !important;
+          outline: none !important;
+          box-shadow: none !important;
+          transition: none !important;
+        }
+
+        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input,
+        .ds-input.ant-input-search .ant-input {
+          border-color: transparent !important;
+        }
+
+        .ds-input.ant-input-group-wrapper:focus-within {
+          border-color: ${n.border.focus} !important;
+          border-width: ${n.border.widthFocus} !important;
+          border-style: solid !important;
+          box-shadow: none !important;
+          outline: none !important;
+        }
+
+        .ds-input.ant-space-compact.ant-input-search:focus-within {
+          border-color: ${n.border.focus} !important;
+          border-width: ${n.border.widthFocus} !important;
+          border-style: solid !important;
+          box-shadow: none !important;
+          outline: none !important;
+        }
+
+        .ds-input.ant-input-group-wrapper:hover .ant-input-group-addon,
+        .ds-input.ant-space-compact.ant-input-search:hover .ant-input,
+        .ds-input.ant-input-search:hover .ant-input-search-btn,
+        .ds-input.ant-space-compact.ant-input-search:hover .ant-input-search-btn,
+        .ds-input.ant-input-search:hover .ant-input-search-button {
+          border-color: ${n.border.hover} !important;
+        }
+
+        .ds-input.ant-input-group-wrapper:hover .ant-input-group > .ant-input,
+        .ds-input.ant-input-search:hover .ant-input,
+        .ds-input.ant-space-compact.ant-input-search:hover .ant-input {
+          border-color: transparent !important;
+        }
+
+        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group-addon,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input,
+        .ds-input.ant-input-search:focus-within .ant-input-search-btn,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-btn,
+        .ds-input.ant-input-search:focus-within .ant-input-search-button {
+          border-color: ${n.border.focus} !important;
+          box-shadow: none !important;
+          outline: none !important;
+        }
+
+        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group > .ant-input,
+        .ds-input.ant-input-search:focus-within .ant-input,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input {
+          border-color: transparent !important;
+        }
+
+        .ds-input.ant-otp .ant-otp-input {
+          border: ${n.border.widthDefault} solid ${n.border.default} !important;
+          border-radius: ${n.border.radius} !important;
+          box-shadow: none !important;
+          outline: none !important;
+          transition: none !important;
+          background-color: ${n.background.default} !important;
+          color: ${n.text.default} !important;
+        }
+
+        .ds-input.ant-otp .ant-otp-input:hover {
+          border-color: ${n.border.hover} !important;
+        }
+
+        .ds-input.ant-otp .ant-otp-input:focus,
+        .ds-input.ant-otp .ant-otp-input:focus-visible {
+          border-color: ${n.border.focus} !important;
+          box-shadow: none !important;
+          outline: none !important;
+          color: ${n.text.focus} !important;
+        }
+
+        .ds-input.ant-input::placeholder,
+        .ds-input .ant-input::placeholder {
+          color: ${n.text.placeholder} !important;
+          opacity: 1;
+        }
+
+        .ds-input.ant-input:hover,
+        .ds-input.ant-input-affix-wrapper:hover,
+        .ds-input.ant-input-filled:hover,
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled:hover,
+        .ds-input.ant-input-outlined:hover,
+        .ds-input.ant-input-affix-wrapper.ant-input-outlined:hover {
+          border-color: ${n.border.hover} !important;
+        }
+
+        .ds-input.ant-input-filled,
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled {
+          background-color: ${n.background.readOnly} !important;
+        }
+
+        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled .ant-input {
+          background-color: transparent !important;
+        }
+
+        .ds-input.ant-input:focus,
+        .ds-input.ant-input-focused,
+        .ds-input.ant-input-affix-wrapper-focused,
+        .ds-input.ant-input-affix-wrapper:focus-within {
+          border-color: ${n.border.focus} !important;
+          border-width: ${n.border.widthFocus} !important;
+          border-style: solid !important;
+          box-shadow: none !important;
+          outline: none !important;
+          color: ${n.text.focus} !important;
+          font-weight: ${n.focusFontWeight} !important;
+        }
+
+        .ds-input.ant-input:focus-visible,
+        .ds-input.ant-input-affix-wrapper:focus-visible,
+        .ds-input.ant-input-affix-wrapper .ant-input:focus,
+        .ds-input.ant-input-affix-wrapper .ant-input:focus-visible {
+          outline: none !important;
+          box-shadow: none !important;
+        }
+
+        .ds-input.ant-input:focus::placeholder,
+        .ds-input.ant-input-focused::placeholder,
+        .ds-input.ant-input-affix-wrapper-focused .ant-input::placeholder,
+        .ds-input.ant-input-affix-wrapper:focus-within .ant-input::placeholder {
+          color: ${n.text.focus} !important;
+        }
+
+        .ds-input.ant-input-status-error,
+        .ds-input.ant-input-affix-wrapper-status-error {
+          border-color: ${n.border.error} !important;
+        }
+
+        .ds-input.ant-input-status-success,
+        .ds-input.ant-input-affix-wrapper-status-success {
+          border-color: ${n.border.success} !important;
+        }
+
+        .ds-input.ant-input-disabled,
+        .ds-input.ant-input-affix-wrapper-disabled,
+        .ds-input.ant-input[disabled],
+        .ds-input.ant-input-affix-wrapper[disabled],
+        .ds-input.ant-input-affix-wrapper-disabled .ant-input {
+          background-color: ${n.background.disabled} !important;
+          border-color: transparent !important;
+          color: ${n.text.disabled} !important;
+          -webkit-text-fill-color: ${n.text.disabled} !important;
+        }
+
+        .ds-input.ant-input[readonly],
+        .ds-input.ant-input-affix-wrapper:has(.ant-input[readonly]),
+        .ds-input.ant-input-affix-wrapper-readonly {
+          background-color: ${n.background.readOnly} !important;
+          border-color: ${n.border.default} !important;
+          color: ${n.text.readOnly} !important;
+        }
+
+        .ds-input.ant-input[readonly]::placeholder,
+        .ds-input.ant-input-affix-wrapper:has(.ant-input[readonly]) .ant-input::placeholder,
+        .ds-input.ant-input-affix-wrapper-readonly .ant-input::placeholder {
+          color: ${n.text.placeholder} !important;
+        }
+
+        .ds-input.ant-input-sm,
+        .ds-input.ant-input-affix-wrapper-sm {
+          height: ${n.height.small} !important;
+          min-height: ${n.height.small} !important;
+          padding: ${n.padding.small.y} ${n.padding.small.x} !important;
+        }
+
+        .ds-input.ant-input,
+        .ds-input.ant-input-affix-wrapper {
+          height: ${n.height.middle} !important;
+          min-height: ${n.height.middle} !important;
+          padding: ${n.padding.middle.y} ${n.padding.middle.x} !important;
+        }
+
+        .ds-input.ant-input-lg,
+        .ds-input.ant-input-affix-wrapper-lg {
+          height: ${n.height.large} !important;
+          min-height: ${n.height.large} !important;
+          padding: ${n.padding.large.y} ${n.padding.large.x} !important;
+        }
+
+        .ds-input.ant-input-affix-wrapper .ant-input {
+          border: none !important;
+          border-color: transparent !important;
+          outline: none !important;
+          box-shadow: none !important;
+          background: transparent !important;
+          padding: 0 !important;
+          height: auto !important;
+          min-height: 0 !important;
+        }
+
+        .ds-input.ant-input:focus,
+        .ds-input.ant-input:focus-visible,
+        .ds-input.ant-input:focus:hover,
+        .ds-input.ant-input-focused,
+        .ds-input.ant-input-focused:hover,
+        .ds-input.ant-input-affix-wrapper-focused,
+        .ds-input.ant-input-affix-wrapper-focused:hover,
+        .ds-input.ant-input-affix-wrapper:focus,
+        .ds-input.ant-input-affix-wrapper:focus-visible,
+        .ds-input.ant-input-affix-wrapper:focus-within,
+        .ds-input.ant-input-affix-wrapper:focus-within:hover,
+        .ds-input.ant-input-group-wrapper:focus-within,
+        .ds-input.ant-input-group-wrapper:focus-within:hover,
+        .ds-input.ant-input-search:focus-within,
+        .ds-input.ant-input-search:focus-within:hover,
+        .ds-input.ant-space-compact.ant-input-search:focus-within,
+        .ds-input.ant-space-compact.ant-input-search:focus-within:hover {
+          border-color: ${n.border.focus} !important;
+          border-width: ${n.border.widthFocus} !important;
+          border-style: solid !important;
+          box-shadow: none !important;
+          outline: none !important;
+        }
+
+        .ds-input.ant-input-affix-wrapper:focus-within .ant-input,
+        .ds-input.ant-input-affix-wrapper-focused .ant-input,
+        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group > .ant-input,
+        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group-addon,
+        .ds-input.ant-input-search:focus-within .ant-input,
+        .ds-input.ant-input-search:focus-within .ant-input-search-btn,
+        .ds-input.ant-input-search:focus-within .ant-input-search-button,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-btn,
+        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-button {
+          border-color: transparent !important;
+          box-shadow: none !important;
+          outline: none !important;
+        }
+      `}},[]);let w=`${s} ${c}`.trim(),T=!!(l||u||d||f||p||g||h||y),E=x??(T?C:void 0),D=E?`${E}-description`:void 0,O=E?`${E}-error`:void 0,k=h?.onClear??y,A=n.t(d?D:void 0,f?O:void 0),j=(0,a.jsx)(r.Input,{...S,id:E,className:w,"aria-describedby":A,"aria-invalid":f?!0:void 0,onChange:e=>{S.onChange?.(e),b?.(e.target.value)}});return T?(0,a.jsx)(t.FieldShell,{label:l,required:u,htmlFor:E,description:d,descriptionId:D,error:f,errorId:O,clear:h,clearable:g,clearLabel:_,clearVisibility:v,clearValue:S.value,onClear:()=>{k?.(),b?.(``)},extraActions:p,style:m,children:j}):j};l.displayName=`Input`;var u=e=>(0,a.jsx)(r.Input.TextArea,{...c(e)});u.displayName=`InputTextArea`;var d=e=>(0,a.jsx)(r.Input.Search,{...c(e)});d.displayName=`InputSearch`;var f=e=>(0,a.jsx)(r.Input.OTP,{...c(e)});f.displayName=`InputOTP`,exports.Input=l,exports.InputOTP=f,exports.InputSearch=d,exports.InputTextArea=u;
+//# sourceMappingURL=Input.cjs.map

package/dist-lib/forms/Input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.cjs","names":[],"sources":["../../src/ds/forms/Input.tsx"],"sourcesContent":["import { Input as AntInput } from 'antd';\nimport type { InputProps as AntInputProps } from 'antd';\nimport type { ComponentProps } from 'react';\nimport { useEffect, useId } from 'react';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\nimport { FieldShell } from './FieldShell';\nimport type { DSFieldShellProps } from './fieldProps';\nimport { joinDescribedByIds } from './fieldProps';\n\nconst STYLE_ID = 'ds-input-styles';\nconst DS_INPUT_CLASS = 'ds-input';\n\ntype ClassNameProp = { className?: string };\n\nconst withDsInputClass = <T extends ClassNameProp>(props: T): T => {\n  const mergedClassName = `${DS_INPUT_CLASS} ${props.className ?? ''}`.trim();\n  return { ...props, className: mergedClassName };\n};\n\nexport type InputFieldProps = DSFieldShellProps & {\n  onValueChange?: (nextValue: string) => void;\n};\n\nexport type InputProps = AntInputProps & InputFieldProps;\nexport type InputTextAreaProps = ComponentProps<typeof AntInput.TextArea>;\nexport type InputSearchProps = ComponentProps<typeof AntInput.Search>;\nexport type InputOTPProps = ComponentProps<typeof AntInput.OTP>;\n\nexport const Input = ({\n  className = '',\n  fieldLabel,\n  fieldRequired,\n  fieldDescription,\n  fieldError,\n  fieldActions,\n  containerStyle,\n  clear,\n  clearable = false,\n  clearLabel,\n  clearVisibility = 'always',\n  onClear,\n  onValueChange,\n  id,\n  ...props\n}: InputProps) => {\n  const generatedId = useId();\n  useEffect(() => {\n    if (typeof document !== 'undefined') {\n      let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n      if (!style) {\n        style = document.createElement('style');\n        style.id = STYLE_ID;\n        document.head.appendChild(style);\n      }\n      const { input } = dsSemanticTokens;\n\n      style.textContent = `\n        .ds-input.ant-input,\n        .ds-input.ant-input-affix-wrapper,\n        .ds-input.ant-input-filled,\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled,\n        .ds-input.ant-input-borderless,\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-borderless,\n        .ds-input.ant-input-underlined,\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-underlined,\n        .ds-input.ant-input-group-wrapper,\n        .ds-input.ant-input-search,\n        .ds-input.ant-space-compact.ant-input-search,\n        .ds-input.ant-input-outlined,\n        .ds-input.ant-input-affix-wrapper.ant-input-outlined {\n          border-color: ${input.border.default} !important;\n          border-width: ${input.border.widthDefault} !important;\n          border-style: solid !important;\n          border-radius: ${input.border.radius} !important;\n          background-color: ${input.background.default} !important;\n          color: ${input.text.default} !important;\n          transition: none !important;\n          box-sizing: border-box !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group-addon,\n        .ds-input.ant-input-search .ant-input-search-button,\n        .ds-input.ant-input-search .ant-input-search-btn {\n          border-radius: ${input.border.radius} !important;\n        }\n\n        .ds-input.ant-input-search .ant-input-search-btn,\n        .ds-input.ant-input-search .ant-input-search-button {\n          border-top-left-radius: 0 !important;\n          border-bottom-left-radius: 0 !important;\n          border-top-right-radius: ${input.border.radius} !important;\n          border-bottom-right-radius: ${input.border.radius} !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group-addon:first-child {\n          border-top-right-radius: 0 !important;\n          border-bottom-right-radius: 0 !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group-addon:last-child {\n          border-top-left-radius: 0 !important;\n          border-bottom-left-radius: 0 !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input {\n          border-radius: ${input.border.radius} !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input,\n        .ds-input.ant-input-group-wrapper .ant-input-group-addon,\n        .ds-input.ant-input-search .ant-input,\n        .ds-input.ant-input-search .ant-input-search-btn,\n        .ds-input.ant-input-search .ant-input-search-button {\n          border-color: ${input.border.default} !important;\n          outline: none !important;\n          box-shadow: none !important;\n          transition: none !important;\n        }\n\n        .ds-input.ant-input-group-wrapper .ant-input-group > .ant-input,\n        .ds-input.ant-input-search .ant-input {\n          border-color: transparent !important;\n        }\n\n        .ds-input.ant-input-group-wrapper:focus-within {\n          border-color: ${input.border.focus} !important;\n          border-width: ${input.border.widthFocus} !important;\n          border-style: solid !important;\n          box-shadow: none !important;\n          outline: none !important;\n        }\n\n        .ds-input.ant-space-compact.ant-input-search:focus-within {\n          border-color: ${input.border.focus} !important;\n          border-width: ${input.border.widthFocus} !important;\n          border-style: solid !important;\n          box-shadow: none !important;\n          outline: none !important;\n        }\n\n        .ds-input.ant-input-group-wrapper:hover .ant-input-group-addon,\n        .ds-input.ant-space-compact.ant-input-search:hover .ant-input,\n        .ds-input.ant-input-search:hover .ant-input-search-btn,\n        .ds-input.ant-space-compact.ant-input-search:hover .ant-input-search-btn,\n        .ds-input.ant-input-search:hover .ant-input-search-button {\n          border-color: ${input.border.hover} !important;\n        }\n\n        .ds-input.ant-input-group-wrapper:hover .ant-input-group > .ant-input,\n        .ds-input.ant-input-search:hover .ant-input,\n        .ds-input.ant-space-compact.ant-input-search:hover .ant-input {\n          border-color: transparent !important;\n        }\n\n        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group-addon,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input,\n        .ds-input.ant-input-search:focus-within .ant-input-search-btn,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-btn,\n        .ds-input.ant-input-search:focus-within .ant-input-search-button {\n          border-color: ${input.border.focus} !important;\n          box-shadow: none !important;\n          outline: none !important;\n        }\n\n        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group > .ant-input,\n        .ds-input.ant-input-search:focus-within .ant-input,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input {\n          border-color: transparent !important;\n        }\n\n        .ds-input.ant-otp .ant-otp-input {\n          border: ${input.border.widthDefault} solid ${input.border.default} !important;\n          border-radius: ${input.border.radius} !important;\n          box-shadow: none !important;\n          outline: none !important;\n          transition: none !important;\n          background-color: ${input.background.default} !important;\n          color: ${input.text.default} !important;\n        }\n\n        .ds-input.ant-otp .ant-otp-input:hover {\n          border-color: ${input.border.hover} !important;\n        }\n\n        .ds-input.ant-otp .ant-otp-input:focus,\n        .ds-input.ant-otp .ant-otp-input:focus-visible {\n          border-color: ${input.border.focus} !important;\n          box-shadow: none !important;\n          outline: none !important;\n          color: ${input.text.focus} !important;\n        }\n\n        .ds-input.ant-input::placeholder,\n        .ds-input .ant-input::placeholder {\n          color: ${input.text.placeholder} !important;\n          opacity: 1;\n        }\n\n        .ds-input.ant-input:hover,\n        .ds-input.ant-input-affix-wrapper:hover,\n        .ds-input.ant-input-filled:hover,\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled:hover,\n        .ds-input.ant-input-outlined:hover,\n        .ds-input.ant-input-affix-wrapper.ant-input-outlined:hover {\n          border-color: ${input.border.hover} !important;\n        }\n\n        .ds-input.ant-input-filled,\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled {\n          background-color: ${input.background.readOnly} !important;\n        }\n\n        .ds-input.ant-input-affix-wrapper.ant-input-affix-wrapper-filled .ant-input {\n          background-color: transparent !important;\n        }\n\n        .ds-input.ant-input:focus,\n        .ds-input.ant-input-focused,\n        .ds-input.ant-input-affix-wrapper-focused,\n        .ds-input.ant-input-affix-wrapper:focus-within {\n          border-color: ${input.border.focus} !important;\n          border-width: ${input.border.widthFocus} !important;\n          border-style: solid !important;\n          box-shadow: none !important;\n          outline: none !important;\n          color: ${input.text.focus} !important;\n          font-weight: ${input.focusFontWeight} !important;\n        }\n\n        .ds-input.ant-input:focus-visible,\n        .ds-input.ant-input-affix-wrapper:focus-visible,\n        .ds-input.ant-input-affix-wrapper .ant-input:focus,\n        .ds-input.ant-input-affix-wrapper .ant-input:focus-visible {\n          outline: none !important;\n          box-shadow: none !important;\n        }\n\n        .ds-input.ant-input:focus::placeholder,\n        .ds-input.ant-input-focused::placeholder,\n        .ds-input.ant-input-affix-wrapper-focused .ant-input::placeholder,\n        .ds-input.ant-input-affix-wrapper:focus-within .ant-input::placeholder {\n          color: ${input.text.focus} !important;\n        }\n\n        .ds-input.ant-input-status-error,\n        .ds-input.ant-input-affix-wrapper-status-error {\n          border-color: ${input.border.error} !important;\n        }\n\n        .ds-input.ant-input-status-success,\n        .ds-input.ant-input-affix-wrapper-status-success {\n          border-color: ${input.border.success} !important;\n        }\n\n        .ds-input.ant-input-disabled,\n        .ds-input.ant-input-affix-wrapper-disabled,\n        .ds-input.ant-input[disabled],\n        .ds-input.ant-input-affix-wrapper[disabled],\n        .ds-input.ant-input-affix-wrapper-disabled .ant-input {\n          background-color: ${input.background.disabled} !important;\n          border-color: transparent !important;\n          color: ${input.text.disabled} !important;\n          -webkit-text-fill-color: ${input.text.disabled} !important;\n        }\n\n        .ds-input.ant-input[readonly],\n        .ds-input.ant-input-affix-wrapper:has(.ant-input[readonly]),\n        .ds-input.ant-input-affix-wrapper-readonly {\n          background-color: ${input.background.readOnly} !important;\n          border-color: ${input.border.default} !important;\n          color: ${input.text.readOnly} !important;\n        }\n\n        .ds-input.ant-input[readonly]::placeholder,\n        .ds-input.ant-input-affix-wrapper:has(.ant-input[readonly]) .ant-input::placeholder,\n        .ds-input.ant-input-affix-wrapper-readonly .ant-input::placeholder {\n          color: ${input.text.placeholder} !important;\n        }\n\n        .ds-input.ant-input-sm,\n        .ds-input.ant-input-affix-wrapper-sm {\n          height: ${input.height.small} !important;\n          min-height: ${input.height.small} !important;\n          padding: ${input.padding.small.y} ${input.padding.small.x} !important;\n        }\n\n        .ds-input.ant-input,\n        .ds-input.ant-input-affix-wrapper {\n          height: ${input.height.middle} !important;\n          min-height: ${input.height.middle} !important;\n          padding: ${input.padding.middle.y} ${input.padding.middle.x} !important;\n        }\n\n        .ds-input.ant-input-lg,\n        .ds-input.ant-input-affix-wrapper-lg {\n          height: ${input.height.large} !important;\n          min-height: ${input.height.large} !important;\n          padding: ${input.padding.large.y} ${input.padding.large.x} !important;\n        }\n\n        .ds-input.ant-input-affix-wrapper .ant-input {\n          border: none !important;\n          border-color: transparent !important;\n          outline: none !important;\n          box-shadow: none !important;\n          background: transparent !important;\n          padding: 0 !important;\n          height: auto !important;\n          min-height: 0 !important;\n        }\n\n        .ds-input.ant-input:focus,\n        .ds-input.ant-input:focus-visible,\n        .ds-input.ant-input:focus:hover,\n        .ds-input.ant-input-focused,\n        .ds-input.ant-input-focused:hover,\n        .ds-input.ant-input-affix-wrapper-focused,\n        .ds-input.ant-input-affix-wrapper-focused:hover,\n        .ds-input.ant-input-affix-wrapper:focus,\n        .ds-input.ant-input-affix-wrapper:focus-visible,\n        .ds-input.ant-input-affix-wrapper:focus-within,\n        .ds-input.ant-input-affix-wrapper:focus-within:hover,\n        .ds-input.ant-input-group-wrapper:focus-within,\n        .ds-input.ant-input-group-wrapper:focus-within:hover,\n        .ds-input.ant-input-search:focus-within,\n        .ds-input.ant-input-search:focus-within:hover,\n        .ds-input.ant-space-compact.ant-input-search:focus-within,\n        .ds-input.ant-space-compact.ant-input-search:focus-within:hover {\n          border-color: ${input.border.focus} !important;\n          border-width: ${input.border.widthFocus} !important;\n          border-style: solid !important;\n          box-shadow: none !important;\n          outline: none !important;\n        }\n\n        .ds-input.ant-input-affix-wrapper:focus-within .ant-input,\n        .ds-input.ant-input-affix-wrapper-focused .ant-input,\n        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group > .ant-input,\n        .ds-input.ant-input-group-wrapper:focus-within .ant-input-group-addon,\n        .ds-input.ant-input-search:focus-within .ant-input,\n        .ds-input.ant-input-search:focus-within .ant-input-search-btn,\n        .ds-input.ant-input-search:focus-within .ant-input-search-button,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-btn,\n        .ds-input.ant-space-compact.ant-input-search:focus-within .ant-input-search-button {\n          border-color: transparent !important;\n          box-shadow: none !important;\n          outline: none !important;\n        }\n      `;\n\n    }\n  }, []);\n\n  const mergedClassName = `${DS_INPUT_CLASS} ${className}`.trim();\n  const shouldWrapInFieldShell = Boolean(\n    fieldLabel ||\n      fieldRequired ||\n      fieldDescription ||\n      fieldError ||\n      fieldActions ||\n      clearable ||\n      clear ||\n      onClear,\n  );\n  const controlId = id ?? (shouldWrapInFieldShell ? generatedId : undefined);\n  const descriptionId = controlId ? `${controlId}-description` : undefined;\n  const errorId = controlId ? `${controlId}-error` : undefined;\n  const clearAction = clear?.onClear ?? onClear;\n  const describedBy = joinDescribedByIds(\n    fieldDescription ? descriptionId : undefined,\n    fieldError ? errorId : undefined,\n  );\n\n  const control = (\n    <AntInput\n      {...props}\n      id={controlId}\n      className={mergedClassName}\n      aria-describedby={describedBy}\n      aria-invalid={fieldError ? true : undefined}\n      onChange={(event) => {\n        props.onChange?.(event);\n        onValueChange?.(event.target.value);\n      }}\n    />\n  );\n\n  if (!shouldWrapInFieldShell) {\n    return control;\n  }\n\n  return (\n    <FieldShell\n      label={fieldLabel}\n      required={fieldRequired}\n      htmlFor={controlId}\n      description={fieldDescription}\n      descriptionId={descriptionId}\n      error={fieldError}\n      errorId={errorId}\n      clear={clear}\n      clearable={clearable}\n      clearLabel={clearLabel}\n      clearVisibility={clearVisibility}\n      clearValue={props.value}\n      onClear={() => {\n        clearAction?.();\n        onValueChange?.('');\n      }}\n      extraActions={fieldActions}\n      style={containerStyle}\n    >\n      {control}\n    </FieldShell>\n  );\n};\n\nInput.displayName = 'Input';\n\nexport const InputTextArea = (props: InputTextAreaProps) => {\n  return <AntInput.TextArea {...withDsInputClass(props)} />;\n};\n\nInputTextArea.displayName = 'InputTextArea';\n\nexport const InputSearch = (props: InputSearchProps) => {\n  return <AntInput.Search {...withDsInputClass(props)} />;\n};\n\nInputSearch.displayName = 'InputSearch';\n\nexport const InputOTP = (props: InputOTPProps) => {\n  return <AntInput.OTP {...withDsInputClass(props)} />;\n};\n\nInputOTP.displayName = 'InputOTP';"],"mappings":"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"}