@lax-wp/design-system 0.13.76 → 0.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { jsxs as n, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as o, jsx as t } from "react/jsx-runtime";
2
2
  import l from "../../../_virtual/index.es.js";
3
3
  import { forwardRef as Ee, useState as f, useRef as Ne, useEffect as k } from "react";
4
4
  import { Tooltip as Ie } from "antd";
@@ -22,7 +22,7 @@ const qe = Ee(
22
22
  placeholder: X,
23
23
  value: i,
24
24
  onChange: V,
25
- errorMessage: o,
25
+ errorMessage: n,
26
26
  defaultValue: Y,
27
27
  required: $ = !1,
28
28
  isRequiredConditional: Z = !1,
@@ -36,12 +36,12 @@ const qe = Ee(
36
36
  originalCase: le = !1,
37
37
  color: d = "",
38
38
  isGTN: v = !1,
39
- labelClassName: ne,
39
+ labelClassName: oe,
40
40
  gtnName: R = null,
41
- isAiExtracted: oe = !1,
42
- confidenceScore: w,
41
+ isAiExtracted: ne = !1,
42
+ confidenceScore: C,
43
43
  confidenceType: m = "high",
44
- confidenceTooltip: C,
44
+ confidenceTooltip: w,
45
45
  sourceMeta: ae = [],
46
46
  onConfidenceScoreClick: ie,
47
47
  disabled: L = !1,
@@ -56,10 +56,10 @@ const qe = Ee(
56
56
  setDisableActions: O,
57
57
  showDeprecatedFieldWarning: j,
58
58
  MasterDataModal: H,
59
- parseMasterDataFormula: x,
59
+ parseMasterDataFormula: h,
60
60
  inputEmphasis: S = "default"
61
61
  }, fe) => {
62
- const { t: me } = Be(), g = !!(W && c?.color), pe = S === "modified" && !o && !g, be = S === "deleted" && !o && !g, xe = S === "success" && !o && !g, [h, F] = f(!1), [a, p] = f(null), [u, K] = f(!1), [ge, he] = f(""), [E, P] = f(null), [ke, ve] = f(!1), N = Ne(null), I = fe || N;
62
+ const { t: me } = Be(), g = !!(W && c?.color), pe = S === "modified" && !n && !g, be = S === "deleted" && !n && !g, he = S === "success" && !n && !g, [x, F] = f(!1), [a, p] = f(null), [u, K] = f(!1), [ge, xe] = f(""), [E, P] = f(null), [ke, ve] = f(!1), N = Ne(null), I = fe || N;
63
63
  k(() => {
64
64
  const e = () => {
65
65
  const r = I.current || N.current;
@@ -73,14 +73,14 @@ const qe = Ee(
73
73
  }, [a, E]);
74
74
  const B = () => {
75
75
  O?.(!u), K(!u);
76
- }, we = (e) => {
76
+ }, Ce = (e) => {
77
77
  if (e.keyCode === 9 || e.key === "Enter") {
78
78
  const r = I.current || N.current;
79
79
  r && (p(ge), r.blur());
80
80
  }
81
- }, Ce = (e, r) => {
81
+ }, we = (e, r) => {
82
82
  let q = e;
83
- s && x && (q = x(s, r)), he(""), p(q), B(), P(r);
83
+ s && h && (q = h(s, r)), xe(""), p(q), B(), P(r);
84
84
  }, ye = () => {
85
85
  p(""), P(null);
86
86
  }, Se = (e) => {
@@ -89,58 +89,58 @@ const qe = Ee(
89
89
  value: e
90
90
  });
91
91
  }, Fe = () => {
92
- const e = "border h-8 text-sm rounded-lg block w-full p-2.5 pr-16 font-inter font-medium", r = "placeholder:text-neutral-900 dark:placeholder:text-black-400";
93
- return o ? l(
92
+ const e = "border h-8 text-sm rounded-lg block w-full p-2.5 pr-16 font-inter font-medium";
93
+ return n ? l(
94
94
  e,
95
- r,
95
+ "",
96
96
  "border-red-300 bg-gray-200 dark:border-black-600 dark:bg-black-600",
97
97
  d || "text-neutral-900 dark:text-black-200"
98
98
  ) : g && c?.color ? l(
99
99
  e,
100
- r,
100
+ "",
101
101
  `border-${c.color}-300 bg-${c.color}-50`,
102
102
  d || "text-neutral-900 dark:text-black-200"
103
103
  ) : be ? l(
104
104
  e,
105
- r,
105
+ "",
106
106
  "border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467]"
107
107
  ) : pe ? l(
108
108
  e,
109
- r,
109
+ "",
110
110
  "border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)]"
111
- ) : xe ? l(
111
+ ) : he ? l(
112
112
  e,
113
- r,
113
+ "",
114
114
  "border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828]"
115
115
  ) : l(
116
116
  e,
117
- r,
117
+ "",
118
118
  "border-gray-300 bg-gray-200 dark:border-black-600 dark:bg-black-600",
119
119
  d || "text-neutral-900 dark:text-black-200"
120
120
  );
121
- }, _ = () => a !== null ? a : s && x ? x(s, se) : i;
121
+ }, _ = () => a !== null ? a : s && h ? h(s, se) : i;
122
122
  return k(() => {
123
123
  u && !b && (j?.(), K(!1));
124
- }, [u, b, j]), /* @__PURE__ */ n(
124
+ }, [u, b, j]), /* @__PURE__ */ o(
125
125
  "div",
126
126
  {
127
127
  className: l(
128
128
  "flex gap-0.5 w-full relative",
129
- h && v ? "border rounded-lg border-primary-100 p-1" : "",
130
- { "error-field": !!o }
129
+ x && v ? "border rounded-lg border-primary-100 p-1" : "",
130
+ { "error-field": !!n }
131
131
  ),
132
132
  onMouseEnter: () => F(!0),
133
133
  onMouseLeave: () => F(!1),
134
134
  children: [
135
- v && !h ? /* @__PURE__ */ t("div", { className: "w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5" }) : null,
136
- /* @__PURE__ */ n("div", { className: l("flex flex-col w-full"), children: [
135
+ v && !x ? /* @__PURE__ */ t("div", { className: "w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5" }) : null,
136
+ /* @__PURE__ */ o("div", { className: l("flex flex-col w-full"), children: [
137
137
  /* @__PURE__ */ t(
138
138
  "label",
139
139
  {
140
140
  htmlFor: "text",
141
- className: `text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${le ? "" : "capitalize"} ${ne || ""}`,
142
- children: /* @__PURE__ */ n("div", { className: "grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1", children: [
143
- /* @__PURE__ */ n("div", { className: "inline-flex min-w-0 items-center gap-1 flex-wrap", children: [
141
+ className: `text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${le ? "" : "capitalize"} ${oe || ""}`,
142
+ children: /* @__PURE__ */ o("div", { className: "grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1", children: [
143
+ /* @__PURE__ */ o("div", { className: "inline-flex min-w-0 items-center gap-1 flex-wrap", children: [
144
144
  /* @__PURE__ */ t(Oe, { label: T || "", required: $ || !1, isRequiredConditional: Z || !1 }),
145
145
  de && /* @__PURE__ */ t(
146
146
  $e,
@@ -152,7 +152,7 @@ const qe = Ee(
152
152
  }
153
153
  }
154
154
  ),
155
- oe && !J(w) && /* @__PURE__ */ t(Le, {}),
155
+ ne && !J(C) && /* @__PURE__ */ t(Le, {}),
156
156
  /* @__PURE__ */ t(Ve, { labels: te }),
157
157
  A && /* @__PURE__ */ t(
158
158
  z,
@@ -164,15 +164,15 @@ const qe = Ee(
164
164
  ),
165
165
  U
166
166
  ] }),
167
- /* @__PURE__ */ n("div", { className: "flex items-center gap-1 justify-self-end", children: [
168
- J(w) && m ? /* @__PURE__ */ t(
167
+ /* @__PURE__ */ o("div", { className: "flex items-center gap-1 justify-self-end", children: [
168
+ J(C) && m ? /* @__PURE__ */ t(
169
169
  z,
170
170
  {
171
171
  placement: "top-end",
172
- title: C ?? "",
173
- hideTooltip: C == null,
172
+ title: w ?? "",
173
+ hideTooltip: w == null,
174
174
  className: "cursor-pointer",
175
- children: /* @__PURE__ */ n(
175
+ children: /* @__PURE__ */ o(
176
176
  "div",
177
177
  {
178
178
  className: l(
@@ -189,8 +189,8 @@ const qe = Ee(
189
189
  fillSecondary: je(m)
190
190
  }
191
191
  ),
192
- /* @__PURE__ */ n("span", { className: l("text-xs font-medium leading-4", Ke(m)), children: [
193
- w,
192
+ /* @__PURE__ */ o("span", { className: l("text-xs font-medium leading-4", Ke(m)), children: [
193
+ C,
194
194
  "%"
195
195
  ] })
196
196
  ]
@@ -198,7 +198,7 @@ const qe = Ee(
198
198
  )
199
199
  }
200
200
  ) : null,
201
- v && h && y ? /* @__PURE__ */ t(
201
+ v && x && y ? /* @__PURE__ */ t(
202
202
  "button",
203
203
  {
204
204
  id: "btn-master-data-input-add-to-document",
@@ -220,7 +220,7 @@ const qe = Ee(
220
220
  ] })
221
221
  }
222
222
  ),
223
- /* @__PURE__ */ n("label", { className: "relative block mt-1", children: [
223
+ /* @__PURE__ */ o("label", { className: "relative block mt-1", children: [
224
224
  /* @__PURE__ */ t(
225
225
  z,
226
226
  {
@@ -236,7 +236,7 @@ const qe = Ee(
236
236
  onChange: (e) => {
237
237
  V(e.target.value, E), p(e.target?.value);
238
238
  },
239
- onKeyDown: we,
239
+ onKeyDown: Ce,
240
240
  value: _(),
241
241
  defaultValue: Y,
242
242
  disabled: !0,
@@ -274,21 +274,21 @@ const qe = Ee(
274
274
  }
275
275
  )
276
276
  ] }),
277
- o && /* @__PURE__ */ t(
277
+ n && /* @__PURE__ */ t(
278
278
  ze,
279
279
  {
280
280
  className: "text-error-500 mt-1",
281
281
  appearance: "custom",
282
282
  size: "extra-small",
283
283
  variant: "medium",
284
- children: o
284
+ children: n
285
285
  }
286
286
  ),
287
287
  u && H && /* @__PURE__ */ t(
288
288
  H,
289
289
  {
290
290
  isVisible: u,
291
- onSelected: Ce,
291
+ onSelected: we,
292
292
  onClose: B,
293
293
  masterDataColumnName: G,
294
294
  masterDataFilters: ee,
@@ -298,7 +298,7 @@ const qe = Ee(
298
298
  }
299
299
  )
300
300
  ] }),
301
- h && c && W && M && /* @__PURE__ */ t(
301
+ x && c && W && M && /* @__PURE__ */ t(
302
302
  "div",
303
303
  {
304
304
  role: "tooltip",
@@ -1 +1 @@
1
- {"version":3,"file":"MasterDataInputField.es.js","sources":["../../../../src/components/forms/master-data-input/MasterDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport {\n BoltOutlined,\n CloseRounded,\n NoteAddOutlined,\n TableChartRounded,\n} from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { CloseIcon, CloseSmallIcon } from \"../../icon\";\n\n/**\n * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\nexport type SourceMetaItem = {\n bbox: SourceMetaBBox;\n confidence_score?: number;\n is_primary?: boolean;\n match_score?: number;\n match_type?: string;\n page_height: number;\n page_width: number;\n source_page: number;\n source_text?: string;\n};\n\n/**\n * Risk details interface for risk analysis integration\n */\nexport interface RiskDetails {\n color?: string;\n description?: string;\n hexBgColor?: string;\n hexBorderColor?: string;\n [key: string]: any;\n}\n\n/**\n * Risk details card component props - generic to allow consumer-specific risk types\n */\nexport interface RiskDetailsCardProps<T = any> {\n riskDetails: T;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/** Visual emphasis for the input surface (background + border) */\nexport type MasterDataInputFieldEmphasis =\n | \"default\"\n | \"modified\"\n | \"deleted\"\n | \"success\";\n\n/**\n * Props for the MasterDataModal component\n */\nexport interface MasterDataModalProps {\n isVisible: boolean;\n onSelected?: (masterDataValue: any, masterDataRow?: any) => void;\n onClose: () => void;\n masterDataColumnName?: string;\n masterDataFilters?: any;\n masterDataName?: string;\n masterDataId: string | null;\n showFilters?: boolean;\n}\n\n/**\n * Props for the MasterDataInputField component\n */\nexport interface MasterDataInputFieldProps {\n /** Unique identifier for the input */\n id: string;\n /** Label text to display above the input */\n label: string;\n /** Optional extra content in the label row (e.g. actions, badges) */\n labelExtra?: React.ReactNode;\n /** Placeholder text for the input */\n placeholder?: string;\n /** Current value of the input */\n value: any;\n /** Callback function called when value changes */\n onChange: (value: any, masterDataRowValue?: any) => void;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Callback to set error message */\n setErrorMessage: (message: string) => void;\n /** Callback to remove error message */\n removeErrorMessage: () => void;\n /** Default value for the input */\n defaultValue?: any;\n /** Whether the field is required */\n required?: boolean;\n /** Whether the required indicator shows as conditional (yellow instead of red) */\n isRequiredConditional?: boolean;\n /** Name of the master data source */\n masterDataName: string;\n /** Column name in the master data */\n masterDataColumnName: string;\n /** Formula for computing master data value */\n masterDataFormula?: string;\n /** Filters for master data */\n masterDataFilters?: any;\n /** Tags/labels to display next to the label */\n tags?: (string | LabelType)[];\n /** Index for array fields */\n index?: number;\n /** Tooltip text for the help icon */\n tooltip?: string;\n /** Whether to preserve original case in the label */\n originalCase?: boolean;\n /** Color for the input text */\n color?: string;\n /** Whether this is a GTN (Global Term Name) field */\n isGTN?: boolean;\n /** GTN field name for document integration */\n gtnName?: any;\n /** Whether the value was AI extracted */\n isAiExtracted?: boolean;\n /** Confidence percentage shown as a badge */\n confidenceScore?: number;\n /** Confidence classification for badge styling */\n confidenceType?: ConfidenceScoreType;\n /** Optional tooltip content for confidence badge */\n confidenceTooltip?: React.ReactNode;\n /** Source meta for confidence score */\n sourceMeta?: SourceMetaItem[];\n /** Handler fired when confidence score badge is clicked */\n onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n /** Reference data for formula computation */\n reference?: any;\n /** Whether the input is disabled */\n disabled?: boolean;\n /** Additional CSS classes for the label */\n labelClassName?: string;\n /** Whether this is a live field */\n isLiveField?: boolean;\n /** Callback function called when input loses focus */\n onBlur?: () => void;\n /** Handler for adding GTN to document */\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /** Risk details data */\n riskDetails?: RiskDetails;\n /** Whether risk analysis is open */\n isRiskAnalysisOpen?: boolean;\n /** Custom risk details card component */\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /** Primary color shades for styling */\n primaryColorShades?: Record<number, string>;\n /** Callback to set disable actions state */\n setDisableActions?: (disabled: boolean) => void;\n /** Toast function for deprecated field warning */\n showDeprecatedFieldWarning?: () => void;\n /** Master data modal component */\n MasterDataModal?: React.ComponentType<MasterDataModalProps>;\n /** Function to parse master data formula */\n parseMasterDataFormula?: (formula: string, row: any) => string;\n /** Input surface style: `'modified'` — `--Warning-50` / `--Warning-200`; `'deleted'` — `--Error-50` / `--Error-200`, text `#475467`; `'success'` — `--Success-50` / `--Success-200`, text `#101828`. */\n inputEmphasis?: MasterDataInputFieldEmphasis;\n}\n\n/**\n * A highly customizable master data input component with label, validation, and styling support.\n * Features master data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <MasterDataInputField\n * id=\"master-field\"\n * label=\"Master Field\"\n * value={fieldValue}\n * onChange={(value, rowValue) => setFieldValue(value)}\n * setErrorMessage={(msg) => setError(msg)}\n * removeErrorMessage={() => setError('')}\n * masterDataName=\"customers\"\n * masterDataColumnName=\"name\"\n * required\n * />\n * ```\n */\nexport const MasterDataInputField = forwardRef<\n HTMLInputElement,\n MasterDataInputFieldProps\n>(\n (\n {\n id,\n label,\n labelExtra,\n placeholder,\n value,\n onChange,\n errorMessage,\n defaultValue,\n required = false,\n isRequiredConditional = false,\n masterDataName,\n masterDataColumnName,\n masterDataFormula,\n masterDataFilters,\n tags,\n index,\n tooltip = \"\",\n originalCase = false,\n color = \"\",\n isGTN = false,\n labelClassName,\n gtnName = null,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n disabled = false,\n reference = {},\n isLiveField = false,\n onBlur,\n onAddGTNToDocument,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n primaryColorShades,\n setDisableActions,\n showDeprecatedFieldWarning,\n MasterDataModal,\n parseMasterDataFormula,\n inputEmphasis = \"default\",\n },\n ref\n ) => {\n const { t } = useTranslation();\n const showRiskSkin = Boolean(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisModifiedSkin =\n inputEmphasis === \"modified\" && !errorMessage && !showRiskSkin;\n const emphasisDeletedSkin =\n inputEmphasis === \"deleted\" && !errorMessage && !showRiskSkin;\n const emphasisSuccessSkin =\n inputEmphasis === \"success\" && !errorMessage && !showRiskSkin;\n const [isHovered, setIsHovered] = useState(false);\n const [inputValue, setInputValue] = useState<string | null>(null);\n const [showMasterDataModal, setShowMasterDataModal] = useState(false);\n const [suggestion, setSuggestion] = useState(\"\");\n const [masterDataRowValue, setMasterDataRowValue] = useState<any>(null);\n const [isTextOverflowing, setIsTextOverflowing] = useState(false);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Use forwarded ref or internal ref\n const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n // Check if text is overflowing\n useEffect(() => {\n const checkOverflow = () => {\n const input = combinedRef.current || inputRef.current;\n if (input) {\n setIsTextOverflowing(input.scrollWidth > input.clientWidth);\n }\n };\n\n checkOverflow();\n // Recheck on window resize\n window.addEventListener('resize', checkOverflow);\n return () => window.removeEventListener('resize', checkOverflow);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [inputValue, value]);\n\n useEffect(() => {\n setInputValue(value);\n }, [index, value]);\n\n useEffect(() => {\n if (inputValue !== null && inputValue !== value) {\n onChange(inputValue, masterDataRowValue);\n }\n }, [inputValue, masterDataRowValue]);\n\n const toggleMasterDataModal = () => {\n if (showMasterDataModal) {\n setDisableActions?.(false);\n } else {\n setDisableActions?.(true);\n }\n setShowMasterDataModal(!showMasterDataModal);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.keyCode === 9 || event.key === \"Enter\") {\n const currentRef = combinedRef.current || inputRef.current;\n if (currentRef) {\n setInputValue(suggestion);\n currentRef.blur();\n }\n }\n };\n\n const handleSetMasterData = (masterDataValue: any, masterDataRow?: any) => {\n let _value = masterDataValue;\n\n if (masterDataFormula && parseMasterDataFormula) {\n _value = parseMasterDataFormula(masterDataFormula, masterDataRow);\n }\n\n setSuggestion(\"\");\n setInputValue(_value);\n toggleMasterDataModal();\n setMasterDataRowValue(masterDataRow);\n };\n\n const handleClear = () => {\n setInputValue(\"\");\n setMasterDataRowValue(null);\n };\n\n const handleAddGTNToDocument = (_value: string) => {\n if (onAddGTNToDocument && gtnName) {\n const keyValuePair = {\n key: gtnName,\n value: _value,\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const getClassName = (): string => {\n const baseClasses =\n \"border h-8 text-sm rounded-lg block w-full p-2.5 pr-16 font-inter font-medium\";\n const placeholderColor = `placeholder:text-neutral-900 dark:placeholder:text-black-400`;\n\n if (errorMessage) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-red-300 bg-gray-200 dark:border-black-600 dark:bg-black-600\",\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n }\n if (showRiskSkin && riskDetails?.color) {\n return cn(\n baseClasses,\n placeholderColor,\n `border-${riskDetails.color}-300 bg-${riskDetails.color}-50`,\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n }\n if (emphasisDeletedSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467]\"\n );\n }\n if (emphasisModifiedSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)]\"\n );\n }\n if (emphasisSuccessSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828]\"\n );\n }\n\n return cn(\n baseClasses,\n placeholderColor,\n \"border-gray-300 bg-gray-200 dark:border-black-600 dark:bg-black-600\",\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n };\n\n const resolveMasterDataValue = () => {\n if (inputValue !== null) {\n return inputValue;\n }\n if (masterDataFormula && parseMasterDataFormula) {\n return parseMasterDataFormula(masterDataFormula, reference);\n }\n\n return value;\n };\n\n useEffect(() => {\n if (showMasterDataModal && !masterDataName) {\n showDeprecatedFieldWarning?.();\n setShowMasterDataModal(false);\n }\n }, [showMasterDataModal, masterDataName, showDeprecatedFieldWarning]);\n\n return (\n <div\n className={cn(\n `flex gap-0.5 w-full relative`,\n isHovered && isGTN\n ? \"border rounded-lg border-primary-100 p-1\"\n : \"\",\n { \"error-field\": !!errorMessage }\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isGTN && !isHovered ? (\n <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n ) : null}\n\n <div className={cn(`flex flex-col w-full`)}>\n <label\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n !originalCase ? \"capitalize\" : \"\"\n } ${labelClassName || \"\"}`}\n >\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap\">\n <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n {isLiveField && (\n <BoltOutlined\n sx={{\n fontSize: 16,\n color: \"var(--color-primary-600)\",\n rotate: \"15deg\",\n }}\n />\n )}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags} />\n {tooltip && (\n <Tooltip\n placement=\"top\"\n title={`${tooltip}${masterDataFormula ? ` | ${masterDataFormula}` : \"\"}`}\n >\n <div className=\"cursor-pointer\">\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </div>\n\n <div className=\"flex items-center gap-1 justify-self-end\">\n {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n <Tooltip\n placement=\"top-end\"\n title={confidenceTooltip ?? \"\"}\n hideTooltip={confidenceTooltip === undefined || confidenceTooltip === null}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\n \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n getConfidenceScoreBadgeClass(confidenceType)\n )}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n {confidenceScore}%\n </span>\n </div>\n </Tooltip>\n ) : null}\n {isGTN && isHovered && onAddGTNToDocument ? (\n <button\n id=\"btn-master-data-input-add-to-document\"\n className=\"cursor-pointer\"\n onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined\n sx={{\n fontSize: 16,\n color:\n primaryColorShades?.[600] || \"var(--color-primary-600)\",\n }}\n />\n </AntTooltip>\n </button>\n ) : null}\n </div>\n </div>\n </label>\n <label className=\"relative block mt-1\">\n <Tooltip\n title={isTextOverflowing ? resolveMasterDataValue() : \"\"}\n >\n <input\n id={id}\n ref={combinedRef}\n required={required}\n placeholder={placeholder}\n className={getClassName()}\n onChange={(e) => {\n onChange(e.target.value, masterDataRowValue);\n setInputValue(e.target?.value);\n }}\n onKeyDown={handleKeyDown}\n value={resolveMasterDataValue()}\n defaultValue={defaultValue}\n disabled={true}\n autoComplete=\"off\"\n onBlur={onBlur}\n />\n </Tooltip>\n\n <IconButton\n id={`btn-dynamic-data-input-rx-cross`}\n onClick={handleClear}\n className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n variant=\"ghost\"\n disabled={disabled}\n >\n <CloseIcon className=\"w-6 h-6 text-neutral-500 dark:text-neutral-400 w-sm h-sm\" />\n </IconButton>\n\n <IconButton\n id={`btn-dynamic-data-input-ai-outline-pic-center`}\n onClick={toggleMasterDataModal}\n className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n variant=\"ghost\"\n disabled={disabled}\n >\n <TableChartRounded\n className=\"text-neutral-500 dark:text-neutral-400 w-sm h-sm\"\n />\n </IconButton>\n </label>\n\n {errorMessage && (\n <Typography\n className=\"text-error-500 mt-1\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n\n {showMasterDataModal && MasterDataModal && (\n <MasterDataModal\n isVisible={showMasterDataModal}\n onSelected={handleSetMasterData}\n onClose={toggleMasterDataModal}\n masterDataColumnName={masterDataColumnName}\n masterDataFilters={masterDataFilters}\n masterDataName={masterDataName}\n masterDataId={masterDataName}\n showFilters\n />\n )}\n </div>\n\n {isHovered &&\n riskDetails &&\n isRiskAnalysisOpen &&\n RiskDetailsCard && (\n <div\n role=\"tooltip\"\n tabIndex={0}\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === \"Escape\") {\n setIsHovered(false);\n }\n }}\n >\n <RiskDetailsCard riskDetails={riskDetails} />\n </div>\n )}\n </div>\n );\n }\n);\n\nMasterDataInputField.displayName = \"MasterDataInputField\";\n\n"],"names":["MasterDataInputField","forwardRef","id","label","labelExtra","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","masterDataName","masterDataColumnName","masterDataFormula","masterDataFilters","tags","index","tooltip","originalCase","color","isGTN","labelClassName","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","disabled","reference","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","setDisableActions","showDeprecatedFieldWarning","MasterDataModal","parseMasterDataFormula","inputEmphasis","ref","t","useTranslation","showRiskSkin","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","isHovered","setIsHovered","useState","inputValue","setInputValue","showMasterDataModal","setShowMasterDataModal","suggestion","setSuggestion","masterDataRowValue","setMasterDataRowValue","isTextOverflowing","setIsTextOverflowing","inputRef","useRef","combinedRef","useEffect","checkOverflow","input","toggleMasterDataModal","handleKeyDown","event","currentRef","handleSetMasterData","masterDataValue","masterDataRow","_value","handleClear","handleAddGTNToDocument","getClassName","baseClasses","placeholderColor","cn","resolveMasterDataValue","jsxs","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","IconButton","CloseIcon","TableChartRounded","Typography"],"mappings":"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"}
1
+ {"version":3,"file":"MasterDataInputField.es.js","sources":["../../../../src/components/forms/master-data-input/MasterDataInputField.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport cn from \"classnames\";\nimport { forwardRef, useEffect, useRef, useState } from \"react\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { Label } from \"../../data-display/label/Label\";\nimport type { LabelType } from \"../../data-display/label/Label\";\nimport {\n BoltOutlined,\n CloseRounded,\n NoteAddOutlined,\n TableChartRounded,\n} from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport IconButton from \"../../button/IconButton\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\nimport { CloseIcon, CloseSmallIcon } from \"../../icon\";\n\n/**\n * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\nexport type SourceMetaItem = {\n bbox: SourceMetaBBox;\n confidence_score?: number;\n is_primary?: boolean;\n match_score?: number;\n match_type?: string;\n page_height: number;\n page_width: number;\n source_page: number;\n source_text?: string;\n};\n\n/**\n * Risk details interface for risk analysis integration\n */\nexport interface RiskDetails {\n color?: string;\n description?: string;\n hexBgColor?: string;\n hexBorderColor?: string;\n [key: string]: any;\n}\n\n/**\n * Risk details card component props - generic to allow consumer-specific risk types\n */\nexport interface RiskDetailsCardProps<T = any> {\n riskDetails: T;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/** Visual emphasis for the input surface (background + border) */\nexport type MasterDataInputFieldEmphasis =\n | \"default\"\n | \"modified\"\n | \"deleted\"\n | \"success\";\n\n/**\n * Props for the MasterDataModal component\n */\nexport interface MasterDataModalProps {\n isVisible: boolean;\n onSelected?: (masterDataValue: any, masterDataRow?: any) => void;\n onClose: () => void;\n masterDataColumnName?: string;\n masterDataFilters?: any;\n masterDataName?: string;\n masterDataId: string | null;\n showFilters?: boolean;\n}\n\n/**\n * Props for the MasterDataInputField component\n */\nexport interface MasterDataInputFieldProps {\n /** Unique identifier for the input */\n id: string;\n /** Label text to display above the input */\n label: string;\n /** Optional extra content in the label row (e.g. actions, badges) */\n labelExtra?: React.ReactNode;\n /** Placeholder text for the input */\n placeholder?: string;\n /** Current value of the input */\n value: any;\n /** Callback function called when value changes */\n onChange: (value: any, masterDataRowValue?: any) => void;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Callback to set error message */\n setErrorMessage: (message: string) => void;\n /** Callback to remove error message */\n removeErrorMessage: () => void;\n /** Default value for the input */\n defaultValue?: any;\n /** Whether the field is required */\n required?: boolean;\n /** Whether the required indicator shows as conditional (yellow instead of red) */\n isRequiredConditional?: boolean;\n /** Name of the master data source */\n masterDataName: string;\n /** Column name in the master data */\n masterDataColumnName: string;\n /** Formula for computing master data value */\n masterDataFormula?: string;\n /** Filters for master data */\n masterDataFilters?: any;\n /** Tags/labels to display next to the label */\n tags?: (string | LabelType)[];\n /** Index for array fields */\n index?: number;\n /** Tooltip text for the help icon */\n tooltip?: string;\n /** Whether to preserve original case in the label */\n originalCase?: boolean;\n /** Color for the input text */\n color?: string;\n /** Whether this is a GTN (Global Term Name) field */\n isGTN?: boolean;\n /** GTN field name for document integration */\n gtnName?: any;\n /** Whether the value was AI extracted */\n isAiExtracted?: boolean;\n /** Confidence percentage shown as a badge */\n confidenceScore?: number;\n /** Confidence classification for badge styling */\n confidenceType?: ConfidenceScoreType;\n /** Optional tooltip content for confidence badge */\n confidenceTooltip?: React.ReactNode;\n /** Source meta for confidence score */\n sourceMeta?: SourceMetaItem[];\n /** Handler fired when confidence score badge is clicked */\n onConfidenceScoreClick?: (sourceMeta: SourceMetaItem[]) => void;\n /** Reference data for formula computation */\n reference?: any;\n /** Whether the input is disabled */\n disabled?: boolean;\n /** Additional CSS classes for the label */\n labelClassName?: string;\n /** Whether this is a live field */\n isLiveField?: boolean;\n /** Callback function called when input loses focus */\n onBlur?: () => void;\n /** Handler for adding GTN to document */\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /** Risk details data */\n riskDetails?: RiskDetails;\n /** Whether risk analysis is open */\n isRiskAnalysisOpen?: boolean;\n /** Custom risk details card component */\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /** Primary color shades for styling */\n primaryColorShades?: Record<number, string>;\n /** Callback to set disable actions state */\n setDisableActions?: (disabled: boolean) => void;\n /** Toast function for deprecated field warning */\n showDeprecatedFieldWarning?: () => void;\n /** Master data modal component */\n MasterDataModal?: React.ComponentType<MasterDataModalProps>;\n /** Function to parse master data formula */\n parseMasterDataFormula?: (formula: string, row: any) => string;\n /** Input surface style: `'modified'` — `--Warning-50` / `--Warning-200`; `'deleted'` — `--Error-50` / `--Error-200`, text `#475467`; `'success'` — `--Success-50` / `--Success-200`, text `#101828`. */\n inputEmphasis?: MasterDataInputFieldEmphasis;\n}\n\n/**\n * A highly customizable master data input component with label, validation, and styling support.\n * Features master data modal integration, GTN support, risk analysis support,\n * and comprehensive prop support for various use cases.\n *\n * @example\n * ```tsx\n * <MasterDataInputField\n * id=\"master-field\"\n * label=\"Master Field\"\n * value={fieldValue}\n * onChange={(value, rowValue) => setFieldValue(value)}\n * setErrorMessage={(msg) => setError(msg)}\n * removeErrorMessage={() => setError('')}\n * masterDataName=\"customers\"\n * masterDataColumnName=\"name\"\n * required\n * />\n * ```\n */\nexport const MasterDataInputField = forwardRef<\n HTMLInputElement,\n MasterDataInputFieldProps\n>(\n (\n {\n id,\n label,\n labelExtra,\n placeholder,\n value,\n onChange,\n errorMessage,\n defaultValue,\n required = false,\n isRequiredConditional = false,\n masterDataName,\n masterDataColumnName,\n masterDataFormula,\n masterDataFilters,\n tags,\n index,\n tooltip = \"\",\n originalCase = false,\n color = \"\",\n isGTN = false,\n labelClassName,\n gtnName = null,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n disabled = false,\n reference = {},\n isLiveField = false,\n onBlur,\n onAddGTNToDocument,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n primaryColorShades,\n setDisableActions,\n showDeprecatedFieldWarning,\n MasterDataModal,\n parseMasterDataFormula,\n inputEmphasis = \"default\",\n },\n ref\n ) => {\n const { t } = useTranslation();\n const showRiskSkin = Boolean(isRiskAnalysisOpen && riskDetails?.color);\n const emphasisModifiedSkin =\n inputEmphasis === \"modified\" && !errorMessage && !showRiskSkin;\n const emphasisDeletedSkin =\n inputEmphasis === \"deleted\" && !errorMessage && !showRiskSkin;\n const emphasisSuccessSkin =\n inputEmphasis === \"success\" && !errorMessage && !showRiskSkin;\n const [isHovered, setIsHovered] = useState(false);\n const [inputValue, setInputValue] = useState<string | null>(null);\n const [showMasterDataModal, setShowMasterDataModal] = useState(false);\n const [suggestion, setSuggestion] = useState(\"\");\n const [masterDataRowValue, setMasterDataRowValue] = useState<any>(null);\n const [isTextOverflowing, setIsTextOverflowing] = useState(false);\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Use forwarded ref or internal ref\n const combinedRef = (ref as React.RefObject<HTMLInputElement>) || inputRef;\n\n // Check if text is overflowing\n useEffect(() => {\n const checkOverflow = () => {\n const input = combinedRef.current || inputRef.current;\n if (input) {\n setIsTextOverflowing(input.scrollWidth > input.clientWidth);\n }\n };\n\n checkOverflow();\n // Recheck on window resize\n window.addEventListener('resize', checkOverflow);\n return () => window.removeEventListener('resize', checkOverflow);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [inputValue, value]);\n\n useEffect(() => {\n setInputValue(value);\n }, [index, value]);\n\n useEffect(() => {\n if (inputValue !== null && inputValue !== value) {\n onChange(inputValue, masterDataRowValue);\n }\n }, [inputValue, masterDataRowValue]);\n\n const toggleMasterDataModal = () => {\n if (showMasterDataModal) {\n setDisableActions?.(false);\n } else {\n setDisableActions?.(true);\n }\n setShowMasterDataModal(!showMasterDataModal);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.keyCode === 9 || event.key === \"Enter\") {\n const currentRef = combinedRef.current || inputRef.current;\n if (currentRef) {\n setInputValue(suggestion);\n currentRef.blur();\n }\n }\n };\n\n const handleSetMasterData = (masterDataValue: any, masterDataRow?: any) => {\n let _value = masterDataValue;\n\n if (masterDataFormula && parseMasterDataFormula) {\n _value = parseMasterDataFormula(masterDataFormula, masterDataRow);\n }\n\n setSuggestion(\"\");\n setInputValue(_value);\n toggleMasterDataModal();\n setMasterDataRowValue(masterDataRow);\n };\n\n const handleClear = () => {\n setInputValue(\"\");\n setMasterDataRowValue(null);\n };\n\n const handleAddGTNToDocument = (_value: string) => {\n if (onAddGTNToDocument && gtnName) {\n const keyValuePair = {\n key: gtnName,\n value: _value,\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const getClassName = (): string => {\n const baseClasses =\n \"border h-8 text-sm rounded-lg block w-full p-2.5 pr-16 font-inter font-medium\";\n const placeholderColor = ``;\n\n if (errorMessage) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-red-300 bg-gray-200 dark:border-black-600 dark:bg-black-600\",\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n }\n if (showRiskSkin && riskDetails?.color) {\n return cn(\n baseClasses,\n placeholderColor,\n `border-${riskDetails.color}-300 bg-${riskDetails.color}-50`,\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n }\n if (emphasisDeletedSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] !text-[#475467] dark:border-[var(--Error-200,#FECACA)] dark:bg-[var(--Error-50,#FEF2F2)] dark:!text-[#475467]\"\n );\n }\n if (emphasisModifiedSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] text-neutral-900 dark:text-black-100 dark:border-[var(--Warning-200,#FEDF89)] dark:bg-[var(--Warning-50,#FFFAEB)]\"\n );\n }\n if (emphasisSuccessSkin) {\n return cn(\n baseClasses,\n placeholderColor,\n \"border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] !text-[#101828] dark:border-[var(--Success-200,#BBF7D0)] dark:bg-[var(--Success-50,#F0FDF4)] dark:!text-[#101828]\"\n );\n }\n\n return cn(\n baseClasses,\n placeholderColor,\n \"border-gray-300 bg-gray-200 dark:border-black-600 dark:bg-black-600\",\n color ? color : \"text-neutral-900 dark:text-black-200\"\n );\n };\n\n const resolveMasterDataValue = () => {\n if (inputValue !== null) {\n return inputValue;\n }\n if (masterDataFormula && parseMasterDataFormula) {\n return parseMasterDataFormula(masterDataFormula, reference);\n }\n\n return value;\n };\n\n useEffect(() => {\n if (showMasterDataModal && !masterDataName) {\n showDeprecatedFieldWarning?.();\n setShowMasterDataModal(false);\n }\n }, [showMasterDataModal, masterDataName, showDeprecatedFieldWarning]);\n\n return (\n <div\n className={cn(\n `flex gap-0.5 w-full relative`,\n isHovered && isGTN\n ? \"border rounded-lg border-primary-100 p-1\"\n : \"\",\n { \"error-field\": !!errorMessage }\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isGTN && !isHovered ? (\n <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-blink mt-1.5\" />\n ) : null}\n\n <div className={cn(`flex flex-col w-full`)}>\n <label\n htmlFor=\"text\"\n className={`text-xs font-medium text-gray-600 inline-flex items-center gap-1 ${\n !originalCase ? \"capitalize\" : \"\"\n } ${labelClassName || \"\"}`}\n >\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <div className=\"inline-flex min-w-0 items-center gap-1 flex-wrap\">\n <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n {isLiveField && (\n <BoltOutlined\n sx={{\n fontSize: 16,\n color: \"var(--color-primary-600)\",\n rotate: \"15deg\",\n }}\n />\n )}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags} />\n {tooltip && (\n <Tooltip\n placement=\"top\"\n title={`${tooltip}${masterDataFormula ? ` | ${masterDataFormula}` : \"\"}`}\n >\n <div className=\"cursor-pointer\">\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </div>\n\n <div className=\"flex items-center gap-1 justify-self-end\">\n {(shouldShowConfidenceScore(confidenceScore) && confidenceType) ? (\n <Tooltip\n placement=\"top-end\"\n title={confidenceTooltip ?? \"\"}\n hideTooltip={confidenceTooltip === undefined || confidenceTooltip === null}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\n \"inline-flex min-w-[50px] items-center gap-1 rounded-md px-1 py-0.5\",\n getConfidenceScoreBadgeClass(confidenceType)\n )}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n <span className={cn(\"text-xs font-medium leading-4\", getConfidenceScoreBadgeTextColor(confidenceType))}>\n {confidenceScore}%\n </span>\n </div>\n </Tooltip>\n ) : null}\n {isGTN && isHovered && onAddGTNToDocument ? (\n <button\n id=\"btn-master-data-input-add-to-document\"\n className=\"cursor-pointer\"\n onClick={() => handleAddGTNToDocument(value?.toString() || \"\")}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined\n sx={{\n fontSize: 16,\n color:\n primaryColorShades?.[600] || \"var(--color-primary-600)\",\n }}\n />\n </AntTooltip>\n </button>\n ) : null}\n </div>\n </div>\n </label>\n <label className=\"relative block mt-1\">\n <Tooltip\n title={isTextOverflowing ? resolveMasterDataValue() : \"\"}\n >\n <input\n id={id}\n ref={combinedRef}\n required={required}\n placeholder={placeholder}\n className={getClassName()}\n onChange={(e) => {\n onChange(e.target.value, masterDataRowValue);\n setInputValue(e.target?.value);\n }}\n onKeyDown={handleKeyDown}\n value={resolveMasterDataValue()}\n defaultValue={defaultValue}\n disabled={true}\n autoComplete=\"off\"\n onBlur={onBlur}\n />\n </Tooltip>\n\n <IconButton\n id={`btn-dynamic-data-input-rx-cross`}\n onClick={handleClear}\n className=\"absolute inset-y-0 right-1 flex items-center px-2 focus:border-transparent\"\n variant=\"ghost\"\n disabled={disabled}\n >\n <CloseIcon className=\"w-6 h-6 text-neutral-500 dark:text-neutral-400 w-sm h-sm\" />\n </IconButton>\n\n <IconButton\n id={`btn-dynamic-data-input-ai-outline-pic-center`}\n onClick={toggleMasterDataModal}\n className=\"absolute inset-y-0 right-8 flex items-center px-2 focus:border-transparent\"\n variant=\"ghost\"\n disabled={disabled}\n >\n <TableChartRounded\n className=\"text-neutral-500 dark:text-neutral-400 w-sm h-sm\"\n />\n </IconButton>\n </label>\n\n {errorMessage && (\n <Typography\n className=\"text-error-500 mt-1\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {errorMessage}\n </Typography>\n )}\n\n {showMasterDataModal && MasterDataModal && (\n <MasterDataModal\n isVisible={showMasterDataModal}\n onSelected={handleSetMasterData}\n onClose={toggleMasterDataModal}\n masterDataColumnName={masterDataColumnName}\n masterDataFilters={masterDataFilters}\n masterDataName={masterDataName}\n masterDataId={masterDataName}\n showFilters\n />\n )}\n </div>\n\n {isHovered &&\n riskDetails &&\n isRiskAnalysisOpen &&\n RiskDetailsCard && (\n <div\n role=\"tooltip\"\n tabIndex={0}\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === \"Escape\") {\n setIsHovered(false);\n }\n }}\n >\n <RiskDetailsCard riskDetails={riskDetails} />\n </div>\n )}\n </div>\n );\n }\n);\n\nMasterDataInputField.displayName = \"MasterDataInputField\";\n\n"],"names":["MasterDataInputField","forwardRef","id","label","labelExtra","placeholder","value","onChange","errorMessage","defaultValue","required","isRequiredConditional","masterDataName","masterDataColumnName","masterDataFormula","masterDataFilters","tags","index","tooltip","originalCase","color","isGTN","labelClassName","gtnName","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","disabled","reference","isLiveField","onBlur","onAddGTNToDocument","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","primaryColorShades","setDisableActions","showDeprecatedFieldWarning","MasterDataModal","parseMasterDataFormula","inputEmphasis","ref","t","useTranslation","showRiskSkin","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","isHovered","setIsHovered","useState","inputValue","setInputValue","showMasterDataModal","setShowMasterDataModal","suggestion","setSuggestion","masterDataRowValue","setMasterDataRowValue","isTextOverflowing","setIsTextOverflowing","inputRef","useRef","combinedRef","useEffect","checkOverflow","input","toggleMasterDataModal","handleKeyDown","event","currentRef","handleSetMasterData","masterDataValue","masterDataRow","_value","handleClear","handleAddGTNToDocument","getClassName","baseClasses","cn","resolveMasterDataValue","jsxs","jsx","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","IconButton","CloseIcon","TableChartRounded","Typography"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("@mui/icons-material"),s=require("../../../_virtual/index.cjs.js"),T=require("framer-motion");require("react");const h=require("../../data-display/typography/Typography.cjs.js"),E=require("../../button/IconButton.cjs.js"),M=require("../../button/Radio.cjs.js"),j=require("../../icon/icons.generated.cjs.js"),p=({children:n,title:f,toggle:N,isOpen:t,hoveringIndex:v,index:y,viewOnly:i,onTitleClick:l,isChecked:b,onSelect:o,subTitle:g,noSpace:c,isDraggable:d,sortableConfig:a,headerClass:q,icon:k,additionalHeader:w,mainClass:I,id:z,childrenClass:$,withAnimation:u=!1,...m})=>{const x=s(!c&&"p-4",$);return e.jsxs("div",{id:z,className:`${!c&&"mb-4"} ${t?"pb-1":""} ${I||""}`,style:a?.style,...m,children:[e.jsxs("div",{className:s("flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg",q),onClick:N,...m,children:[e.jsxs("div",{onClick:r=>l?l(r):null,className:`${d&&"flex"} w-full`,children:[d&&!i&&e.jsx("button",{id:"btn-accordion-outline-drag-indicator",className:"flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out",...a?.attributes,...a?.listeners,children:e.jsx(j.DragIndicatorIcon,{size:16,className:"text-neutral-400 dark:text-neutral-400"})}),e.jsxs("div",{className:"flex items-center gap-1 w-full",children:[o&&e.jsx(M,{isChecked:b,onSelect:r=>{r.stopPropagation(),o()},className:"h-4 w-4 accent-[#366FE3]"}),e.jsxs("div",{className:"flex gap-2 items-center",children:[k,e.jsx(h.Typography,{size:"small",appearance:"body",variant:"medium",className:"whitespace-nowrap",children:f})]}),e.jsx(h.Typography,{size:"extra-small",appearance:"title",variant:"medium",className:"ml-1",children:g}),w,e.jsx("span",{children:v===y&&!i&&e.jsx(E,{variant:"ghost",children:e.jsx(j.EditIcon,{className:"ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400"})})})]})]}),e.jsx(A.ChevronLeft,{sx:{fontSize:18},className:s("text-neutral-600 dark:text-neutral-400",t?"rotate-90":"-rotate-90",u&&"transition-transform duration-300 ease-in-out")})]}),u?e.jsx(T.motion.div,{initial:!1,animate:{height:t?"auto":0},transition:{duration:.3,ease:[.4,0,.2,1]},style:{overflow:"hidden"},children:e.jsx("div",{className:x,children:n})}):t?e.jsx("div",{className:x,children:n}):null]})};p.displayName="Accordion";exports.Accordion=p;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),A=require("@mui/icons-material"),s=require("../../../_virtual/index.cjs.js"),T=require("framer-motion");require("react");const h=require("../../data-display/typography/Typography.cjs.js"),E=require("../../button/IconButton.cjs.js"),M=require("../../button/Radio.cjs.js"),j=require("../../icon/icons.generated.cjs.js"),p=({children:n,title:N,toggle:f,isOpen:t,hoveringIndex:v,index:y,viewOnly:i,onTitleClick:c,isChecked:b,onSelect:l,subTitle:g,noSpace:o,isDraggable:d,sortableConfig:a,headerClass:q,icon:k,additionalHeader:w,mainClass:I,id:z,childrenClass:$,withAnimation:u=!1,...m})=>{const x=s(!o&&"p-4",$);return e.jsxs("div",{id:z,className:`${!o&&"mb-4"} ${t?"pb-1":""} ${I||""}`,style:a?.style,...m,children:[e.jsxs("div",{className:s("flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg",q),onClick:f,...m,children:[e.jsxs("div",{onClick:r=>c?c(r):null,className:`${d&&"flex"} w-full`,children:[d&&!i&&e.jsx("button",{id:"btn-accordion-outline-drag-indicator",className:"flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out",...a?.attributes,...a?.listeners,children:e.jsx(j.DragIndicatorIcon,{size:16,className:"text-neutral-400 dark:text-neutral-400"})}),e.jsxs("div",{className:"flex items-center gap-1 w-full",children:[l&&e.jsx(M,{isChecked:b,onSelect:r=>{r.stopPropagation(),l()},className:"h-4 w-4 accent-[#366FE3]"}),e.jsxs("div",{className:"flex gap-2 items-center",children:[k,e.jsx(h.Typography,{size:"small",appearance:"body",variant:"medium",className:"whitespace-nowrap",children:N})]}),e.jsx(h.Typography,{size:"extra-small",appearance:"title",variant:"medium",className:"ml-1",children:g}),w,e.jsx("span",{children:v===y&&!i&&e.jsx(E,{variant:"ghost",children:e.jsx(j.EditIcon,{className:"ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400"})})})]})]}),e.jsx(A.ChevronLeft,{sx:{fontSize:18},className:s("text-neutral-600 dark:text-neutral-400",t?"rotate-90":"-rotate-90",u&&"transition-transform duration-300 ease-in-out")})]}),u?e.jsx(T.motion.div,{initial:!1,animate:{height:t?"auto":0},transition:{duration:.3,ease:[.4,0,.2,1]},children:e.jsx("div",{className:x,children:n})}):t?e.jsx("div",{className:x,children:n}):null]})};p.displayName="Accordion";exports.Accordion=p;
2
2
  //# sourceMappingURL=Accordion.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.cjs.js","sources":["../../../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { ChevronLeft } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { type FC, type HTMLAttributes } from 'react';\n\nimport { Typography } from '../../data-display/typography/Typography';\nimport IconButton from '../../button/IconButton';\nimport Radio from '../../button/Radio';\nimport { DragIndicatorIcon, EditIcon } from '../../icon';\n\nexport type AccordionProps = HTMLAttributes<HTMLDivElement> & {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n title: any;\n toggle: () => void;\n isOpen: boolean;\n hoveringIndex?: number | null;\n index?: number;\n viewOnly?: boolean;\n onTitleClick?: (e: React.MouseEvent) => void;\n onSelect?: () => void;\n isChecked?: boolean;\n subTitle?: string;\n noSpace?: boolean;\n isDraggable?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n sortableConfig?: Record<string, any>;\n headerClass?: string;\n icon?: JSX.Element;\n additionalHeader?: JSX.Element;\n id: string;\n isEditMode?: boolean;\n mainClass?: string;\n childrenClass?: string;\n /** When true, expands and collapses the panel with a smooth height animation. Default false. */\n withAnimation?: boolean;\n};\n\n/**\n * Accordion component for collapsible content sections\n *\n * @example\n * ```tsx\n * <Accordion\n * id=\"my-accordion\"\n * title=\"Section Title\"\n * isOpen={isOpen}\n * toggle={() => setIsOpen(!isOpen)}\n * >\n * <div>Accordion content</div>\n * </Accordion>\n * ```\n */\nexport const Accordion: FC<AccordionProps> = ({\n children,\n title,\n toggle,\n isOpen,\n hoveringIndex,\n index,\n viewOnly,\n onTitleClick,\n isChecked,\n onSelect,\n subTitle,\n noSpace,\n isDraggable,\n sortableConfig,\n headerClass,\n icon,\n additionalHeader,\n mainClass,\n id,\n childrenClass,\n withAnimation = false,\n ...props\n}) => {\n const contentClassName = cn(!noSpace && 'p-4', childrenClass);\n\n return (\n <div id={id} className={`${!noSpace && 'mb-4'} ${isOpen ? 'pb-1' : ''} ${mainClass || ''}`} style={sortableConfig?.style} {...props}>\n <div\n className={cn(\n 'flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg',\n headerClass,\n )}\n onClick={toggle}\n {...props}\n >\n <div onClick={(e) => (onTitleClick ? onTitleClick(e) : null)} className={`${isDraggable && 'flex'} w-full`}>\n {isDraggable && !viewOnly && (\n <button\n id={`btn-accordion-outline-drag-indicator`}\n className='flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out'\n {...sortableConfig?.attributes}\n {...sortableConfig?.listeners}\n >\n <DragIndicatorIcon size={16} className='text-neutral-400 dark:text-neutral-400' />\n </button>\n )}\n\n <div className={`flex items-center gap-1 w-full`}>\n {onSelect && (\n <Radio\n isChecked={isChecked}\n onSelect={(e) => {\n e.stopPropagation();\n onSelect();\n }}\n className='h-4 w-4 accent-[#366FE3]'\n />\n )}\n <div className='flex gap-2 items-center'>\n {icon}\n\n <Typography size='small' appearance='body' variant='medium' className='whitespace-nowrap'>\n {title}\n </Typography>\n </div>\n <Typography size='extra-small' appearance='title' variant='medium' className={`ml-1`}>\n {subTitle}\n </Typography>\n {additionalHeader}\n <span>\n {hoveringIndex === index && !viewOnly && (\n <IconButton variant='ghost'>\n <EditIcon className='ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400' />\n </IconButton>\n )}\n </span>\n </div>\n </div>\n <ChevronLeft\n sx={{ fontSize: 18 }}\n className={cn(\n 'text-neutral-600 dark:text-neutral-400',\n isOpen ? 'rotate-90' : '-rotate-90',\n withAnimation && 'transition-transform duration-300 ease-in-out',\n )}\n />\n </div>\n {withAnimation ? (\n <motion.div\n initial={false}\n animate={{\n height: isOpen ? 'auto' : 0,\n }}\n transition={{\n duration: 0.3,\n ease: [0.4, 0, 0.2, 1],\n }}\n style={{ overflow: 'hidden' }}\n >\n <div className={contentClassName}>{children}</div>\n </motion.div>\n ) : isOpen ? (\n <div className={contentClassName}>{children}</div>\n ) : null}\n </div>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\n\n\n"],"names":["Accordion","children","title","toggle","isOpen","hoveringIndex","index","viewOnly","onTitleClick","isChecked","onSelect","subTitle","noSpace","isDraggable","sortableConfig","headerClass","icon","additionalHeader","mainClass","id","childrenClass","withAnimation","props","contentClassName","cn","jsxs","e","jsx","DragIndicatorIcon","Radio","Typography","IconButton","EditIcon","ChevronLeft","motion"],"mappings":"mbAoDaA,EAAgC,CAAC,CAC5C,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,OAAAC,EACA,cAAAC,EAAA,MACAC,EACA,SAAAC,EACA,aAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,YAAAC,EACA,eAAAC,EACA,YAAAC,EACA,KAAAC,EACA,iBAAAC,EACA,UAAAC,EACA,GAAAC,EACA,cAAAC,EACA,cAAAC,EAAgB,GAChB,GAAGC,CACL,IAAM,CACJ,MAAMC,EAAmBC,EAAG,CAACZ,GAAW,MAAOQ,CAAa,EAE5D,OACEK,EAAAA,KAAC,OAAI,GAAAN,EAAQ,UAAW,GAAG,CAACP,GAAW,MAAM,KAAKR,EAAS,OAAS,EAAE,IAAIc,GAAa,EAAE,GAAI,MAAOJ,GAAgB,MAAQ,GAAGQ,EAC7H,SAAA,CAAAG,EAAAA,KAAC,MAAA,CACC,UAAWD,EACT,oJACAT,CAAA,EAEF,QAASZ,EACR,GAAGmB,EAEJ,SAAA,CAAAG,EAAAA,KAAC,MAAA,CAAI,QAAUC,GAAOlB,EAAeA,EAAakB,CAAC,EAAI,KAAO,UAAW,GAAGb,GAAe,MAAM,UAC9F,SAAA,CAAAA,GAAe,CAACN,GACfoB,EAAAA,IAAC,SAAA,CACC,GAAI,uCACJ,UAAU,yHACT,GAAGb,GAAgB,WACnB,GAAGA,GAAgB,UAEpB,SAAAa,EAAAA,IAACC,oBAAA,CAAkB,KAAM,GAAI,UAAU,wCAAA,CAAyC,CAAA,CAAA,EAIpFH,EAAAA,KAAC,MAAA,CAAI,UAAW,iCACb,SAAA,CAAAf,GACCiB,EAAAA,IAACE,EAAA,CACC,UAAApB,EACA,SAAWiB,GAAM,CACfA,EAAE,gBAAA,EACFhB,EAAA,CACF,EACA,UAAU,0BAAA,CAAA,EAGde,EAAAA,KAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAT,EAEDW,EAAAA,IAACG,EAAAA,WAAA,CAAW,KAAK,QAAQ,WAAW,OAAO,QAAQ,SAAS,UAAU,oBACnE,SAAA5B,CAAA,CACH,CAAA,EACF,EACAyB,EAAAA,IAACG,EAAAA,WAAA,CAAW,KAAK,cAAc,WAAW,QAAQ,QAAQ,SAAS,UAAW,OAC3E,SAAAnB,CAAA,CACH,EACCM,EACDU,MAAC,OAAA,CACE,SAAAtB,IAAkBC,GAAS,CAACC,GAC3BoB,EAAAA,IAACI,EAAA,CAAW,QAAQ,QAClB,SAAAJ,MAACK,EAAAA,SAAA,CAAS,UAAU,sDAAsD,EAC5E,CAAA,CAEJ,CAAA,CAAA,CACF,CAAA,EACF,EACAL,EAAAA,IAACM,EAAAA,YAAA,CACC,GAAI,CAAE,SAAU,EAAA,EAChB,UAAWT,EACT,yCACApB,EAAS,YAAc,aACvBiB,GAAiB,+CAAA,CACnB,CAAA,CACF,CAAA,CAAA,EAEDA,EACCM,EAAAA,IAACO,EAAAA,OAAO,IAAP,CACC,QAAS,GACT,QAAS,CACP,OAAQ9B,EAAS,OAAS,CAAA,EAE5B,WAAY,CACV,SAAU,GACV,KAAM,CAAC,GAAK,EAAG,GAAK,CAAC,CAAA,EAEvB,MAAO,CAAE,SAAU,QAAA,EAEnB,SAAAuB,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAmB,SAAAtB,CAAA,CAAS,CAAA,CAAA,EAE5CG,EACFuB,EAAAA,IAAC,OAAI,UAAWJ,EAAmB,SAAAtB,EAAS,EAC1C,IAAA,EACN,CAEJ,EAEAD,EAAU,YAAc"}
1
+ {"version":3,"file":"Accordion.cjs.js","sources":["../../../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { ChevronLeft } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { type FC, type HTMLAttributes } from 'react';\n\nimport { Typography } from '../../data-display/typography/Typography';\nimport IconButton from '../../button/IconButton';\nimport Radio from '../../button/Radio';\nimport { DragIndicatorIcon, EditIcon } from '../../icon';\n\nexport type AccordionProps = HTMLAttributes<HTMLDivElement> & {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n title: any;\n toggle: () => void;\n isOpen: boolean;\n hoveringIndex?: number | null;\n index?: number;\n viewOnly?: boolean;\n onTitleClick?: (e: React.MouseEvent) => void;\n onSelect?: () => void;\n isChecked?: boolean;\n subTitle?: string;\n noSpace?: boolean;\n isDraggable?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n sortableConfig?: Record<string, any>;\n headerClass?: string;\n icon?: JSX.Element;\n additionalHeader?: JSX.Element;\n id: string;\n isEditMode?: boolean;\n mainClass?: string;\n childrenClass?: string;\n /** When true, expands and collapses the panel with a smooth height animation. Default false. */\n withAnimation?: boolean;\n};\n\n/**\n * Accordion component for collapsible content sections\n *\n * @example\n * ```tsx\n * <Accordion\n * id=\"my-accordion\"\n * title=\"Section Title\"\n * isOpen={isOpen}\n * toggle={() => setIsOpen(!isOpen)}\n * >\n * <div>Accordion content</div>\n * </Accordion>\n * ```\n */\nexport const Accordion: FC<AccordionProps> = ({\n children,\n title,\n toggle,\n isOpen,\n hoveringIndex,\n index,\n viewOnly,\n onTitleClick,\n isChecked,\n onSelect,\n subTitle,\n noSpace,\n isDraggable,\n sortableConfig,\n headerClass,\n icon,\n additionalHeader,\n mainClass,\n id,\n childrenClass,\n withAnimation = false,\n ...props\n}) => {\n const contentClassName = cn(!noSpace && 'p-4', childrenClass);\n\n return (\n <div id={id} className={`${!noSpace && 'mb-4'} ${isOpen ? 'pb-1' : ''} ${mainClass || ''}`} style={sortableConfig?.style} {...props}>\n <div\n className={cn(\n 'flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg',\n headerClass,\n )}\n onClick={toggle}\n {...props}\n >\n <div onClick={(e) => (onTitleClick ? onTitleClick(e) : null)} className={`${isDraggable && 'flex'} w-full`}>\n {isDraggable && !viewOnly && (\n <button\n id={`btn-accordion-outline-drag-indicator`}\n className='flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out'\n {...sortableConfig?.attributes}\n {...sortableConfig?.listeners}\n >\n <DragIndicatorIcon size={16} className='text-neutral-400 dark:text-neutral-400' />\n </button>\n )}\n\n <div className={`flex items-center gap-1 w-full`}>\n {onSelect && (\n <Radio\n isChecked={isChecked}\n onSelect={(e) => {\n e.stopPropagation();\n onSelect();\n }}\n className='h-4 w-4 accent-[#366FE3]'\n />\n )}\n <div className='flex gap-2 items-center'>\n {icon}\n\n <Typography size='small' appearance='body' variant='medium' className='whitespace-nowrap'>\n {title}\n </Typography>\n </div>\n <Typography size='extra-small' appearance='title' variant='medium' className={`ml-1`}>\n {subTitle}\n </Typography>\n {additionalHeader}\n <span>\n {hoveringIndex === index && !viewOnly && (\n <IconButton variant='ghost'>\n <EditIcon className='ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400' />\n </IconButton>\n )}\n </span>\n </div>\n </div>\n <ChevronLeft\n sx={{ fontSize: 18 }}\n className={cn(\n 'text-neutral-600 dark:text-neutral-400',\n isOpen ? 'rotate-90' : '-rotate-90',\n withAnimation && 'transition-transform duration-300 ease-in-out',\n )}\n />\n </div>\n {withAnimation ? (\n <motion.div\n initial={false}\n animate={{\n height: isOpen ? 'auto' : 0,\n }}\n transition={{\n duration: 0.3,\n ease: [0.4, 0, 0.2, 1],\n }}\n >\n <div className={contentClassName}>{children}</div>\n </motion.div>\n ) : isOpen ? (\n <div className={contentClassName}>{children}</div>\n ) : null}\n </div>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\n\n\n"],"names":["Accordion","children","title","toggle","isOpen","hoveringIndex","index","viewOnly","onTitleClick","isChecked","onSelect","subTitle","noSpace","isDraggable","sortableConfig","headerClass","icon","additionalHeader","mainClass","id","childrenClass","withAnimation","props","contentClassName","cn","jsxs","e","jsx","DragIndicatorIcon","Radio","Typography","IconButton","EditIcon","ChevronLeft","motion"],"mappings":"mbAoDaA,EAAgC,CAAC,CAC5C,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,OAAAC,EACA,cAAAC,EAAA,MACAC,EACA,SAAAC,EACA,aAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,YAAAC,EACA,eAAAC,EACA,YAAAC,EACA,KAAAC,EACA,iBAAAC,EACA,UAAAC,EACA,GAAAC,EACA,cAAAC,EACA,cAAAC,EAAgB,GAChB,GAAGC,CACL,IAAM,CACJ,MAAMC,EAAmBC,EAAG,CAACZ,GAAW,MAAOQ,CAAa,EAE5D,OACEK,EAAAA,KAAC,OAAI,GAAAN,EAAQ,UAAW,GAAG,CAACP,GAAW,MAAM,KAAKR,EAAS,OAAS,EAAE,IAAIc,GAAa,EAAE,GAAI,MAAOJ,GAAgB,MAAQ,GAAGQ,EAC7H,SAAA,CAAAG,EAAAA,KAAC,MAAA,CACC,UAAWD,EACT,oJACAT,CAAA,EAEF,QAASZ,EACR,GAAGmB,EAEJ,SAAA,CAAAG,EAAAA,KAAC,MAAA,CAAI,QAAUC,GAAOlB,EAAeA,EAAakB,CAAC,EAAI,KAAO,UAAW,GAAGb,GAAe,MAAM,UAC9F,SAAA,CAAAA,GAAe,CAACN,GACfoB,EAAAA,IAAC,SAAA,CACC,GAAI,uCACJ,UAAU,yHACT,GAAGb,GAAgB,WACnB,GAAGA,GAAgB,UAEpB,SAAAa,EAAAA,IAACC,oBAAA,CAAkB,KAAM,GAAI,UAAU,wCAAA,CAAyC,CAAA,CAAA,EAIpFH,EAAAA,KAAC,MAAA,CAAI,UAAW,iCACb,SAAA,CAAAf,GACCiB,EAAAA,IAACE,EAAA,CACC,UAAApB,EACA,SAAWiB,GAAM,CACfA,EAAE,gBAAA,EACFhB,EAAA,CACF,EACA,UAAU,0BAAA,CAAA,EAGde,EAAAA,KAAC,MAAA,CAAI,UAAU,0BACZ,SAAA,CAAAT,EAEDW,EAAAA,IAACG,EAAAA,WAAA,CAAW,KAAK,QAAQ,WAAW,OAAO,QAAQ,SAAS,UAAU,oBACnE,SAAA5B,CAAA,CACH,CAAA,EACF,EACAyB,EAAAA,IAACG,EAAAA,WAAA,CAAW,KAAK,cAAc,WAAW,QAAQ,QAAQ,SAAS,UAAW,OAC3E,SAAAnB,CAAA,CACH,EACCM,EACDU,MAAC,OAAA,CACE,SAAAtB,IAAkBC,GAAS,CAACC,GAC3BoB,EAAAA,IAACI,EAAA,CAAW,QAAQ,QAClB,SAAAJ,MAACK,EAAAA,SAAA,CAAS,UAAU,sDAAsD,EAC5E,CAAA,CAEJ,CAAA,CAAA,CACF,CAAA,EACF,EACAL,EAAAA,IAACM,EAAAA,YAAA,CACC,GAAI,CAAE,SAAU,EAAA,EAChB,UAAWT,EACT,yCACApB,EAAS,YAAc,aACvBiB,GAAiB,+CAAA,CACnB,CAAA,CACF,CAAA,CAAA,EAEDA,EACCM,EAAAA,IAACO,EAAAA,OAAO,IAAP,CACC,QAAS,GACT,QAAS,CACP,OAAQ9B,EAAS,OAAS,CAAA,EAE5B,WAAY,CACV,SAAU,GACV,KAAM,CAAC,GAAK,EAAG,GAAK,CAAC,CAAA,EAGvB,SAAAuB,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAmB,SAAAtB,CAAA,CAAS,CAAA,CAAA,EAE5CG,EACFuB,EAAAA,IAAC,OAAI,UAAWJ,EAAmB,SAAAtB,EAAS,EAC1C,IAAA,EACN,CAEJ,EAEAD,EAAU,YAAc"}
@@ -99,7 +99,6 @@ const P = ({
99
99
  duration: 0.3,
100
100
  ease: [0.4, 0, 0.2, 1]
101
101
  },
102
- style: { overflow: "hidden" },
103
102
  children: /* @__PURE__ */ e("div", { className: f, children: o })
104
103
  }
105
104
  ) : a ? /* @__PURE__ */ e("div", { className: f, children: o }) : null
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.es.js","sources":["../../../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { ChevronLeft } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { type FC, type HTMLAttributes } from 'react';\n\nimport { Typography } from '../../data-display/typography/Typography';\nimport IconButton from '../../button/IconButton';\nimport Radio from '../../button/Radio';\nimport { DragIndicatorIcon, EditIcon } from '../../icon';\n\nexport type AccordionProps = HTMLAttributes<HTMLDivElement> & {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n title: any;\n toggle: () => void;\n isOpen: boolean;\n hoveringIndex?: number | null;\n index?: number;\n viewOnly?: boolean;\n onTitleClick?: (e: React.MouseEvent) => void;\n onSelect?: () => void;\n isChecked?: boolean;\n subTitle?: string;\n noSpace?: boolean;\n isDraggable?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n sortableConfig?: Record<string, any>;\n headerClass?: string;\n icon?: JSX.Element;\n additionalHeader?: JSX.Element;\n id: string;\n isEditMode?: boolean;\n mainClass?: string;\n childrenClass?: string;\n /** When true, expands and collapses the panel with a smooth height animation. Default false. */\n withAnimation?: boolean;\n};\n\n/**\n * Accordion component for collapsible content sections\n *\n * @example\n * ```tsx\n * <Accordion\n * id=\"my-accordion\"\n * title=\"Section Title\"\n * isOpen={isOpen}\n * toggle={() => setIsOpen(!isOpen)}\n * >\n * <div>Accordion content</div>\n * </Accordion>\n * ```\n */\nexport const Accordion: FC<AccordionProps> = ({\n children,\n title,\n toggle,\n isOpen,\n hoveringIndex,\n index,\n viewOnly,\n onTitleClick,\n isChecked,\n onSelect,\n subTitle,\n noSpace,\n isDraggable,\n sortableConfig,\n headerClass,\n icon,\n additionalHeader,\n mainClass,\n id,\n childrenClass,\n withAnimation = false,\n ...props\n}) => {\n const contentClassName = cn(!noSpace && 'p-4', childrenClass);\n\n return (\n <div id={id} className={`${!noSpace && 'mb-4'} ${isOpen ? 'pb-1' : ''} ${mainClass || ''}`} style={sortableConfig?.style} {...props}>\n <div\n className={cn(\n 'flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg',\n headerClass,\n )}\n onClick={toggle}\n {...props}\n >\n <div onClick={(e) => (onTitleClick ? onTitleClick(e) : null)} className={`${isDraggable && 'flex'} w-full`}>\n {isDraggable && !viewOnly && (\n <button\n id={`btn-accordion-outline-drag-indicator`}\n className='flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out'\n {...sortableConfig?.attributes}\n {...sortableConfig?.listeners}\n >\n <DragIndicatorIcon size={16} className='text-neutral-400 dark:text-neutral-400' />\n </button>\n )}\n\n <div className={`flex items-center gap-1 w-full`}>\n {onSelect && (\n <Radio\n isChecked={isChecked}\n onSelect={(e) => {\n e.stopPropagation();\n onSelect();\n }}\n className='h-4 w-4 accent-[#366FE3]'\n />\n )}\n <div className='flex gap-2 items-center'>\n {icon}\n\n <Typography size='small' appearance='body' variant='medium' className='whitespace-nowrap'>\n {title}\n </Typography>\n </div>\n <Typography size='extra-small' appearance='title' variant='medium' className={`ml-1`}>\n {subTitle}\n </Typography>\n {additionalHeader}\n <span>\n {hoveringIndex === index && !viewOnly && (\n <IconButton variant='ghost'>\n <EditIcon className='ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400' />\n </IconButton>\n )}\n </span>\n </div>\n </div>\n <ChevronLeft\n sx={{ fontSize: 18 }}\n className={cn(\n 'text-neutral-600 dark:text-neutral-400',\n isOpen ? 'rotate-90' : '-rotate-90',\n withAnimation && 'transition-transform duration-300 ease-in-out',\n )}\n />\n </div>\n {withAnimation ? (\n <motion.div\n initial={false}\n animate={{\n height: isOpen ? 'auto' : 0,\n }}\n transition={{\n duration: 0.3,\n ease: [0.4, 0, 0.2, 1],\n }}\n style={{ overflow: 'hidden' }}\n >\n <div className={contentClassName}>{children}</div>\n </motion.div>\n ) : isOpen ? (\n <div className={contentClassName}>{children}</div>\n ) : null}\n </div>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\n\n\n"],"names":["Accordion","children","title","toggle","isOpen","hoveringIndex","index","viewOnly","onTitleClick","isChecked","onSelect","subTitle","noSpace","isDraggable","sortableConfig","headerClass","icon","additionalHeader","mainClass","id","childrenClass","withAnimation","props","contentClassName","cn","jsxs","e","jsx","DragIndicatorIcon","Radio","Typography","IconButton","EditIcon","ChevronLeft","motion"],"mappings":";;;;;;;;;AAoDO,MAAMA,IAAgC,CAAC;AAAA,EAC5C,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAmBC,EAAG,CAACZ,KAAW,OAAOQ,CAAa;AAE5D,SACE,gBAAAK,EAAC,SAAI,IAAAN,GAAQ,WAAW,GAAG,CAACP,KAAW,MAAM,KAAKR,IAAS,SAAS,EAAE,IAAIc,KAAa,EAAE,IAAI,OAAOJ,GAAgB,OAAQ,GAAGQ,GAC7H,UAAA;AAAA,IAAA,gBAAAG;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWD;AAAA,UACT;AAAA,UACAT;AAAA,QAAA;AAAA,QAEF,SAASZ;AAAA,QACR,GAAGmB;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAG,EAAC,OAAA,EAAI,SAAS,CAACC,MAAOlB,IAAeA,EAAakB,CAAC,IAAI,MAAO,WAAW,GAAGb,KAAe,MAAM,WAC9F,UAAA;AAAA,YAAAA,KAAe,CAACN,KACf,gBAAAoB;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,IAAI;AAAA,gBACJ,WAAU;AAAA,gBACT,GAAGb,GAAgB;AAAA,gBACnB,GAAGA,GAAgB;AAAA,gBAEpB,UAAA,gBAAAa,EAACC,GAAA,EAAkB,MAAM,IAAI,WAAU,yCAAA,CAAyC;AAAA,cAAA;AAAA,YAAA;AAAA,YAIpF,gBAAAH,EAAC,OAAA,EAAI,WAAW,kCACb,UAAA;AAAA,cAAAf,KACC,gBAAAiB;AAAA,gBAACE;AAAA,gBAAA;AAAA,kBACC,WAAApB;AAAA,kBACA,UAAU,CAACiB,MAAM;AACf,oBAAAA,EAAE,gBAAA,GACFhB,EAAA;AAAA,kBACF;AAAA,kBACA,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGd,gBAAAe,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAA;AAAA,gBAAAT;AAAA,gBAED,gBAAAW,EAACG,GAAA,EAAW,MAAK,SAAQ,YAAW,QAAO,SAAQ,UAAS,WAAU,qBACnE,UAAA5B,EAAA,CACH;AAAA,cAAA,GACF;AAAA,cACA,gBAAAyB,EAACG,GAAA,EAAW,MAAK,eAAc,YAAW,SAAQ,SAAQ,UAAS,WAAW,QAC3E,UAAAnB,EAAA,CACH;AAAA,cACCM;AAAA,cACD,gBAAAU,EAAC,QAAA,EACE,UAAAtB,MAAkBC,KAAS,CAACC,KAC3B,gBAAAoB,EAACI,GAAA,EAAW,SAAQ,SAClB,UAAA,gBAAAJ,EAACK,GAAA,EAAS,WAAU,uDAAsD,GAC5E,EAAA,CAEJ;AAAA,YAAA,EAAA,CACF;AAAA,UAAA,GACF;AAAA,UACA,gBAAAL;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,IAAI,EAAE,UAAU,GAAA;AAAA,cAChB,WAAWT;AAAA,gBACT;AAAA,gBACApB,IAAS,cAAc;AAAA,gBACvBiB,KAAiB;AAAA,cAAA;AAAA,YACnB;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,IAEDA,IACC,gBAAAM;AAAA,MAACO,EAAO;AAAA,MAAP;AAAA,QACC,SAAS;AAAA,QACT,SAAS;AAAA,UACP,QAAQ9B,IAAS,SAAS;AAAA,QAAA;AAAA,QAE5B,YAAY;AAAA,UACV,UAAU;AAAA,UACV,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;AAAA,QAAA;AAAA,QAEvB,OAAO,EAAE,UAAU,SAAA;AAAA,QAEnB,UAAA,gBAAAuB,EAAC,OAAA,EAAI,WAAWJ,GAAmB,UAAAtB,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA,IAE5CG,IACF,gBAAAuB,EAAC,SAAI,WAAWJ,GAAmB,UAAAtB,GAAS,IAC1C;AAAA,EAAA,GACN;AAEJ;AAEAD,EAAU,cAAc;"}
1
+ {"version":3,"file":"Accordion.es.js","sources":["../../../../src/components/navigation/accordion/Accordion.tsx"],"sourcesContent":["import { ChevronLeft } from '@mui/icons-material';\nimport cn from 'classnames';\nimport { motion } from 'framer-motion';\nimport { type FC, type HTMLAttributes } from 'react';\n\nimport { Typography } from '../../data-display/typography/Typography';\nimport IconButton from '../../button/IconButton';\nimport Radio from '../../button/Radio';\nimport { DragIndicatorIcon, EditIcon } from '../../icon';\n\nexport type AccordionProps = HTMLAttributes<HTMLDivElement> & {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n title: any;\n toggle: () => void;\n isOpen: boolean;\n hoveringIndex?: number | null;\n index?: number;\n viewOnly?: boolean;\n onTitleClick?: (e: React.MouseEvent) => void;\n onSelect?: () => void;\n isChecked?: boolean;\n subTitle?: string;\n noSpace?: boolean;\n isDraggable?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n sortableConfig?: Record<string, any>;\n headerClass?: string;\n icon?: JSX.Element;\n additionalHeader?: JSX.Element;\n id: string;\n isEditMode?: boolean;\n mainClass?: string;\n childrenClass?: string;\n /** When true, expands and collapses the panel with a smooth height animation. Default false. */\n withAnimation?: boolean;\n};\n\n/**\n * Accordion component for collapsible content sections\n *\n * @example\n * ```tsx\n * <Accordion\n * id=\"my-accordion\"\n * title=\"Section Title\"\n * isOpen={isOpen}\n * toggle={() => setIsOpen(!isOpen)}\n * >\n * <div>Accordion content</div>\n * </Accordion>\n * ```\n */\nexport const Accordion: FC<AccordionProps> = ({\n children,\n title,\n toggle,\n isOpen,\n hoveringIndex,\n index,\n viewOnly,\n onTitleClick,\n isChecked,\n onSelect,\n subTitle,\n noSpace,\n isDraggable,\n sortableConfig,\n headerClass,\n icon,\n additionalHeader,\n mainClass,\n id,\n childrenClass,\n withAnimation = false,\n ...props\n}) => {\n const contentClassName = cn(!noSpace && 'p-4', childrenClass);\n\n return (\n <div id={id} className={`${!noSpace && 'mb-4'} ${isOpen ? 'pb-1' : ''} ${mainClass || ''}`} style={sortableConfig?.style} {...props}>\n <div\n className={cn(\n 'flex items-center justify-between cursor-pointer border border-neutral-200 dark:border-none bg-neutral-100 dark:bg-black-600 px-3 py-1 rounded-lg',\n headerClass,\n )}\n onClick={toggle}\n {...props}\n >\n <div onClick={(e) => (onTitleClick ? onTitleClick(e) : null)} className={`${isDraggable && 'flex'} w-full`}>\n {isDraggable && !viewOnly && (\n <button\n id={`btn-accordion-outline-drag-indicator`}\n className='flex items-center justify-center w-icon h-icon hover:transform hover:scale-125 transition-all duration-200 ease-in-out'\n {...sortableConfig?.attributes}\n {...sortableConfig?.listeners}\n >\n <DragIndicatorIcon size={16} className='text-neutral-400 dark:text-neutral-400' />\n </button>\n )}\n\n <div className={`flex items-center gap-1 w-full`}>\n {onSelect && (\n <Radio\n isChecked={isChecked}\n onSelect={(e) => {\n e.stopPropagation();\n onSelect();\n }}\n className='h-4 w-4 accent-[#366FE3]'\n />\n )}\n <div className='flex gap-2 items-center'>\n {icon}\n\n <Typography size='small' appearance='body' variant='medium' className='whitespace-nowrap'>\n {title}\n </Typography>\n </div>\n <Typography size='extra-small' appearance='title' variant='medium' className={`ml-1`}>\n {subTitle}\n </Typography>\n {additionalHeader}\n <span>\n {hoveringIndex === index && !viewOnly && (\n <IconButton variant='ghost'>\n <EditIcon className='ml-2 h-4 w-4 text-neutral-400 dark:text-neutral-400' />\n </IconButton>\n )}\n </span>\n </div>\n </div>\n <ChevronLeft\n sx={{ fontSize: 18 }}\n className={cn(\n 'text-neutral-600 dark:text-neutral-400',\n isOpen ? 'rotate-90' : '-rotate-90',\n withAnimation && 'transition-transform duration-300 ease-in-out',\n )}\n />\n </div>\n {withAnimation ? (\n <motion.div\n initial={false}\n animate={{\n height: isOpen ? 'auto' : 0,\n }}\n transition={{\n duration: 0.3,\n ease: [0.4, 0, 0.2, 1],\n }}\n >\n <div className={contentClassName}>{children}</div>\n </motion.div>\n ) : isOpen ? (\n <div className={contentClassName}>{children}</div>\n ) : null}\n </div>\n );\n};\n\nAccordion.displayName = 'Accordion';\n\n\n\n"],"names":["Accordion","children","title","toggle","isOpen","hoveringIndex","index","viewOnly","onTitleClick","isChecked","onSelect","subTitle","noSpace","isDraggable","sortableConfig","headerClass","icon","additionalHeader","mainClass","id","childrenClass","withAnimation","props","contentClassName","cn","jsxs","e","jsx","DragIndicatorIcon","Radio","Typography","IconButton","EditIcon","ChevronLeft","motion"],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@lax-wp/design-system",
3
3
  "private": false,
4
- "version": "0.13.76",
4
+ "version": "0.14.0",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",
7
7
  "module": "dist/index.es.js",