@lax-wp/design-system 0.13.33-beta.5 → 0.13.33-beta.7

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.
Files changed (102) hide show
  1. package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.cjs.js +1 -1
  2. package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.cjs.js.map +1 -1
  3. package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.es.js +57 -56
  4. package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.es.js.map +1 -1
  5. package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.cjs.js +1 -1
  6. package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.cjs.js.map +1 -1
  7. package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.es.js +43 -42
  8. package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.es.js.map +1 -1
  9. package/dist/components/data-display/infinite-table/body/cell/DataCell.cjs.js +1 -1
  10. package/dist/components/data-display/infinite-table/body/cell/DataCell.cjs.js.map +1 -1
  11. package/dist/components/data-display/infinite-table/body/cell/DataCell.es.js +141 -138
  12. package/dist/components/data-display/infinite-table/body/cell/DataCell.es.js.map +1 -1
  13. package/dist/components/data-display/infinite-table/body/cell/LoaderCell.cjs.js +1 -1
  14. package/dist/components/data-display/infinite-table/body/cell/LoaderCell.cjs.js.map +1 -1
  15. package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js +10 -9
  16. package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js.map +1 -1
  17. package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js +1 -1
  18. package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js.map +1 -1
  19. package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js +7 -7
  20. package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js.map +1 -1
  21. package/dist/components/data-display/infinite-table/body/cell/RowActionCell.cjs.js +1 -1
  22. package/dist/components/data-display/infinite-table/body/cell/RowActionCell.cjs.js.map +1 -1
  23. package/dist/components/data-display/infinite-table/body/cell/RowActionCell.es.js +1 -1
  24. package/dist/components/data-display/infinite-table/body/cell/RowActionCell.es.js.map +1 -1
  25. package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js +1 -1
  26. package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js.map +1 -1
  27. package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js +1 -1
  28. package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js.map +1 -1
  29. package/dist/components/data-display/infinite-table/body/rows/row.cjs.js +1 -1
  30. package/dist/components/data-display/infinite-table/body/rows/row.cjs.js.map +1 -1
  31. package/dist/components/data-display/infinite-table/body/rows/row.es.js +286 -281
  32. package/dist/components/data-display/infinite-table/body/rows/row.es.js.map +1 -1
  33. package/dist/components/data-display/infinite-table/constants.cjs.js +2 -0
  34. package/dist/components/data-display/infinite-table/constants.cjs.js.map +1 -0
  35. package/dist/components/data-display/infinite-table/constants.d.ts +41 -0
  36. package/dist/components/data-display/infinite-table/constants.es.js +27 -0
  37. package/dist/components/data-display/infinite-table/constants.es.js.map +1 -0
  38. package/dist/components/data-display/infinite-table/context.cjs.js.map +1 -1
  39. package/dist/components/data-display/infinite-table/context.d.ts +1 -0
  40. package/dist/components/data-display/infinite-table/context.es.js.map +1 -1
  41. package/dist/components/data-display/infinite-table/head/cell/index.cjs.js +1 -1
  42. package/dist/components/data-display/infinite-table/head/cell/index.cjs.js.map +1 -1
  43. package/dist/components/data-display/infinite-table/head/cell/index.es.js +36 -35
  44. package/dist/components/data-display/infinite-table/head/cell/index.es.js.map +1 -1
  45. package/dist/components/data-display/infinite-table/index.cjs.js +1 -1
  46. package/dist/components/data-display/infinite-table/index.cjs.js.map +1 -1
  47. package/dist/components/data-display/infinite-table/index.d.ts +1 -1
  48. package/dist/components/data-display/infinite-table/index.es.js +410 -406
  49. package/dist/components/data-display/infinite-table/index.es.js.map +1 -1
  50. package/dist/components/data-display/infinite-table/types.d.ts +22 -0
  51. package/dist/components/forms/base-input-field/BaseInputField.cjs.js +2 -2
  52. package/dist/components/forms/base-input-field/BaseInputField.cjs.js.map +1 -1
  53. package/dist/components/forms/base-input-field/BaseInputField.es.js +20 -20
  54. package/dist/components/forms/base-input-field/BaseInputField.es.js.map +1 -1
  55. package/dist/components/forms/creatable-select/CreatableSelect.cjs.js +1 -1
  56. package/dist/components/forms/creatable-select/CreatableSelect.cjs.js.map +1 -1
  57. package/dist/components/forms/creatable-select/CreatableSelect.es.js +7 -7
  58. package/dist/components/forms/creatable-select/CreatableSelect.es.js.map +1 -1
  59. package/dist/components/forms/currency-input/CurrencyInputField.cjs.js +1 -1
  60. package/dist/components/forms/currency-input/CurrencyInputField.cjs.js.map +1 -1
  61. package/dist/components/forms/currency-input/CurrencyInputField.es.js +12 -12
  62. package/dist/components/forms/currency-input/CurrencyInputField.es.js.map +1 -1
  63. package/dist/components/forms/date-time-field/DateTimeField.cjs.js +1 -1
  64. package/dist/components/forms/date-time-field/DateTimeField.cjs.js.map +1 -1
  65. package/dist/components/forms/date-time-field/DateTimeField.es.js +1 -1
  66. package/dist/components/forms/date-time-field/DateTimeField.es.js.map +1 -1
  67. package/dist/components/forms/dynamic-data-input/DynamicDataInput.cjs.js +1 -1
  68. package/dist/components/forms/dynamic-data-input/DynamicDataInput.cjs.js.map +1 -1
  69. package/dist/components/forms/dynamic-data-input/DynamicDataInput.es.js +7 -7
  70. package/dist/components/forms/dynamic-data-input/DynamicDataInput.es.js.map +1 -1
  71. package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js +1 -1
  72. package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js.map +1 -1
  73. package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js +1 -1
  74. package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js.map +1 -1
  75. package/dist/components/forms/formula-input/FormulaInput.cjs.js +1 -1
  76. package/dist/components/forms/formula-input/FormulaInput.cjs.js.map +1 -1
  77. package/dist/components/forms/formula-input/FormulaInput.es.js +10 -10
  78. package/dist/components/forms/formula-input/FormulaInput.es.js.map +1 -1
  79. package/dist/components/forms/input-field/InputField.cjs.js.map +1 -1
  80. package/dist/components/forms/input-field/InputField.es.js.map +1 -1
  81. package/dist/components/forms/master-data-input/MasterDataInputField.cjs.js +1 -1
  82. package/dist/components/forms/master-data-input/MasterDataInputField.cjs.js.map +1 -1
  83. package/dist/components/forms/master-data-input/MasterDataInputField.es.js +1 -1
  84. package/dist/components/forms/master-data-input/MasterDataInputField.es.js.map +1 -1
  85. package/dist/components/forms/percentage-input/PercentageInputField.cjs.js +2 -2
  86. package/dist/components/forms/percentage-input/PercentageInputField.cjs.js.map +1 -1
  87. package/dist/components/forms/percentage-input/PercentageInputField.es.js +19 -19
  88. package/dist/components/forms/percentage-input/PercentageInputField.es.js.map +1 -1
  89. package/dist/components/forms/select-field/SelectField.cjs.js +2 -2
  90. package/dist/components/forms/select-field/SelectField.cjs.js.map +1 -1
  91. package/dist/components/forms/select-field/SelectField.es.js +1 -1
  92. package/dist/components/forms/select-field/SelectField.es.js.map +1 -1
  93. package/dist/components/forms/text-area-field/TextAreaField.cjs.js +1 -1
  94. package/dist/components/forms/text-area-field/TextAreaField.cjs.js.map +1 -1
  95. package/dist/components/forms/text-area-field/TextAreaField.es.js +14 -14
  96. package/dist/components/forms/text-area-field/TextAreaField.es.js.map +1 -1
  97. package/dist/components/forms/toggle/Toggle.cjs.js +1 -1
  98. package/dist/components/forms/toggle/Toggle.cjs.js.map +1 -1
  99. package/dist/components/forms/toggle/Toggle.es.js +23 -23
  100. package/dist/components/forms/toggle/Toggle.es.js.map +1 -1
  101. package/dist/index.d.ts +1 -1
  102. package/package.json +1 -1
@@ -14,7 +14,7 @@ import L from "../../tooltip/Tooltip.es.js";
14
14
  import { HelpIcon as he } from "../../icons/HelpIcon.es.js";
15
15
  import { InputLabel as be } from "../shared/InputLabel.es.js";
16
16
  import { shouldShowConfidenceScore as O, getConfidenceScoreBadgeFill as xe, getConfidenceScoreBadgeColor as ve, getConfidenceScoreBadgeTextColor as ke, getConfidenceScoreBadgeClass as ye } from "../../../utils/confidenceScoreUtils.es.js";
17
- const we = (t, a, o, u = "medium") => {
17
+ const we = (a, t, o, u = "medium") => {
18
18
  const n = {
19
19
  small: "w-7 h-4 after:h-3 after:w-3 after:top-0.5 after:left-0.5",
20
20
  medium: "w-10 h-[1.375rem] after:h-[1.125rem] after:w-[1.125rem] after:top-0.5 after:left-0.5",
@@ -29,28 +29,28 @@ const we = (t, a, o, u = "medium") => {
29
29
  n[u],
30
30
  g[u],
31
31
  {
32
- "peer-checked:bg-primary-600 dark:peer-checked:bg-primary-700 peer-checked:after:translate-x-full after:bg-white dark:after:bg-primary-500": t,
33
- "after:bg-white dark:after:bg-black-500": !t,
34
- "text-white dark:text-black-900": a,
32
+ "peer-checked:bg-primary-600 dark:peer-checked:bg-primary-700 peer-checked:after:translate-x-full after:bg-white dark:after:bg-primary-500": a,
33
+ "after:bg-white dark:after:bg-black-500": !a,
34
+ "text-white dark:text-black-900": t,
35
35
  "cursor-not-allowed opacity-70": o
36
36
  }
37
37
  );
38
- }, Ne = ({ size: t = 18, fill: a = "#016DCF" }) => /* @__PURE__ */ e("svg", { width: t, height: t, viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
38
+ }, Ne = ({ size: a = 18, fill: t = "#016DCF" }) => /* @__PURE__ */ e("svg", { width: a, height: a, viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
39
39
  "path",
40
40
  {
41
41
  d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z",
42
- fill: a
42
+ fill: t
43
43
  }
44
- ) }), Ce = ({ size: t = 18, fill: a = "#101828" }) => /* @__PURE__ */ e("svg", { width: t, height: t, viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
44
+ ) }), Ce = ({ size: a = 18, fill: t = "#101828" }) => /* @__PURE__ */ e("svg", { width: a, height: a, viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
45
45
  "path",
46
46
  {
47
47
  d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z",
48
- fill: a
48
+ fill: t
49
49
  }
50
50
  ) }), Fe = ie(
51
51
  ({
52
- isGTN: t = !1,
53
- isChecked: a,
52
+ isGTN: a = !1,
53
+ isChecked: t,
54
54
  id: o,
55
55
  onChange: u,
56
56
  label: n,
@@ -87,10 +87,10 @@ const we = (t, a, o, u = "medium") => {
87
87
  onAddGTNToDocument: D,
88
88
  inputEmphasis: C = "default"
89
89
  }, U) => {
90
- const { t: X } = de(), Z = C === "modified", ee = C === "deleted", re = C === "success", F = W ?? Y, b = !!F, E = typeof F == "string" ? F : void 0, te = v === x.TOP, ae = v === x.LEFT, A = v === x.RIGHT, [I, P] = oe(!1), M = () => {
90
+ const { t: X } = de(), Z = C === "modified", ee = C === "deleted", re = C === "success", F = W ?? Y, b = !!F, E = typeof F == "string" ? F : void 0, ae = v === x.TOP, te = v === x.LEFT, A = v === x.RIGHT, [I, P] = oe(!1), M = () => {
91
91
  D && D({
92
92
  key: J,
93
- value: a ? "Yes" : "No"
93
+ value: t ? "Yes" : "No"
94
94
  });
95
95
  }, le = () => m === "error" ? "text-red-500 dark:text-red-400" : m === "success" ? "text-green-500 dark:text-green-400" : m === "info" ? "text-primary-500 dark:text-primary-400" : "text-neutral-500 dark:text-neutral-400";
96
96
  return /* @__PURE__ */ l(
@@ -98,7 +98,7 @@ const we = (t, a, o, u = "medium") => {
98
98
  {
99
99
  className: r(
100
100
  "flex gap-0.5",
101
- I && t ? "border rounded-lg border-primary-100 bg-primary-50 p-1" : "",
101
+ I && a ? "border rounded-lg border-primary-100 bg-primary-50 p-1" : "",
102
102
  Q
103
103
  ),
104
104
  onMouseEnter: () => P(!0),
@@ -107,14 +107,14 @@ const we = (t, a, o, u = "medium") => {
107
107
  G && s.stopPropagation();
108
108
  },
109
109
  children: [
110
- t && !I ? /* @__PURE__ */ e("div", { className: "w-1 h-1 bg-primary-600 rounded-full animate-pulse mt-1.5" }) : null,
110
+ a && !I ? /* @__PURE__ */ e("div", { className: "w-1 h-1 bg-primary-600 rounded-full animate-pulse mt-1.5" }) : null,
111
111
  /* @__PURE__ */ l("div", { className: r(
112
112
  "w-full flex flex-col",
113
113
  Z && "rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] px-2 py-1.5",
114
114
  ee && "rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] px-2 py-1.5",
115
115
  re && "rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] px-2 py-1.5"
116
116
  ), children: [
117
- te && n && /* @__PURE__ */ l("div", { className: "grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1", children: [
117
+ ae && n && /* @__PURE__ */ l("div", { className: "grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1", children: [
118
118
  /* @__PURE__ */ l(
119
119
  "h1",
120
120
  {
@@ -127,7 +127,7 @@ const we = (t, a, o, u = "medium") => {
127
127
  K && /* @__PURE__ */ e(me, { sx: { fontSize: 16, color: "var(--color-primary-600)", rotate: "15deg" } }),
128
128
  H && !O(y) && /* @__PURE__ */ e(pe, {}),
129
129
  /* @__PURE__ */ e(ge, { labels: j || [] }),
130
- _ && /* @__PURE__ */ e(L, { placement: "top", title: _, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(he, {}) }) }),
130
+ _ && /* @__PURE__ */ e(L, { placement: "top", title: _, children: /* @__PURE__ */ e("div", { className: "cursor-pointer", children: /* @__PURE__ */ e(he, { className: "w-icon-sm h-icon-sm" }) }) }),
131
131
  T
132
132
  ]
133
133
  }
@@ -166,7 +166,7 @@ const we = (t, a, o, u = "medium") => {
166
166
  )
167
167
  }
168
168
  ) : null,
169
- t && I ? B ? B(M) : /* @__PURE__ */ e(
169
+ a && I ? B ? B(M) : /* @__PURE__ */ e(
170
170
  "button",
171
171
  {
172
172
  id: "btn-toggle-add-to-document",
@@ -189,7 +189,7 @@ const we = (t, a, o, u = "medium") => {
189
189
  }
190
190
  ),
191
191
  /* @__PURE__ */ l("div", { className: "flex", children: [
192
- ae && /* @__PURE__ */ e(
192
+ te && /* @__PURE__ */ e(
193
193
  p,
194
194
  {
195
195
  size: "small",
@@ -218,14 +218,14 @@ const we = (t, a, o, u = "medium") => {
218
218
  onChange: (s) => !b && u(s.target.checked),
219
219
  value: "",
220
220
  disabled: b,
221
- checked: a,
221
+ checked: t,
222
222
  className: r("sr-only peer w-full", V),
223
223
  "aria-required": g,
224
224
  "aria-invalid": d && m === "error" ? "true" : "false",
225
225
  "aria-describedby": d || f ? `${o}-description` : void 0
226
226
  }
227
227
  ),
228
- /* @__PURE__ */ e("div", { className: we(a, S, b, i), children: S ? (
228
+ /* @__PURE__ */ e("div", { className: we(t, S, b, i), children: S ? (
229
229
  // Overlay the icon on the sliding knob using the knob's exact
230
230
  // geometry (same top/left, same size, same full-width slide) so
231
231
  // it stays perfectly centered in the circle for every size/state.
@@ -237,9 +237,9 @@ const we = (t, a, o, u = "medium") => {
237
237
  i === "small" && "h-3 w-3",
238
238
  i === "medium" && "h-[1.125rem] w-[1.125rem]",
239
239
  i === "large" && "h-5 w-5",
240
- a && "translate-x-full"
240
+ t && "translate-x-full"
241
241
  ),
242
- children: a ? h?.checkedIcon ? h.checkedIcon : /* @__PURE__ */ e(Ne, { size: 18, fill: "#016DCF" }) : h?.uncheckedIcon ? h.uncheckedIcon : /* @__PURE__ */ e(Ce, { size: 18, fill: "#101828" })
242
+ children: t ? h?.checkedIcon ? h.checkedIcon : /* @__PURE__ */ e(Ne, { size: 18, fill: "#016DCF" }) : h?.uncheckedIcon ? h.uncheckedIcon : /* @__PURE__ */ e(Ce, { size: 18, fill: "#101828" })
243
243
  }
244
244
  )
245
245
  ) : null }),
@@ -266,7 +266,7 @@ const we = (t, a, o, u = "medium") => {
266
266
  variant: "medium",
267
267
  className: "ml-2 text-neutral-900 dark:text-black-100",
268
268
  appearance: "custom",
269
- children: k || (a ? "Yes" : "No")
269
+ children: k || (t ? "Yes" : "No")
270
270
  }
271
271
  )
272
272
  ]
@@ -1 +1 @@
1
- {"version":3,"file":"Toggle.es.js","sources":["../../../../src/components/forms/toggle/Toggle.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport { forwardRef, type ReactNode, useState } from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { TOGGLE_LABEL_DIRECTION } from \"../../../constants/toggle\";\nimport type { TToggleDirection } from \"../../../constants/toggle\";\nimport { BoltOutlined, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { Label, type LabelType } from \"../../data-display/label/Label\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\n\n// Re-export LabelType from Label component for external use\nexport type { LabelType };\n\n/** Visual emphasis for the toggle container (background + border) */\nexport type ToggleEmphasis = \"default\" | \"modified\" | \"deleted\" | \"success\";\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 * Props for the Toggle component\n */\nexport interface ToggleProps {\n /** Whether this is a GTN (Global Term Name) field */\n isGTN?: boolean;\n /** Unique identifier for the toggle */\n id?: string;\n /** Whether the toggle is checked */\n isChecked: boolean;\n /** Callback function called when toggle state changes */\n onChange: (val: boolean) => void;\n /** Label text or element to display */\n label?: ReactNode;\n /** Whether to preserve original case in the label */\n originalCase?: boolean;\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 /** Tags/labels to display next to the label */\n tags?: (string | LabelType)[];\n /** Whether to hide the status text (Yes/No) */\n hideStatus?: boolean;\n /** Label direction relative to toggle */\n labelDirection?: TToggleDirection;\n /** Custom status text instead of Yes/No */\n statusText?: string;\n /** Whether to show icons in the toggle */\n withIcon?: boolean;\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?: 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 /** Tooltip text to display */\n tooltip?: string;\n /** Additional CSS classes for the toggle input */\n className?: string;\n /** Whether the toggle is disabled. Pass a string to disable with a tooltip message. */\n disabled?: boolean | string;\n /**\n * @deprecated Use `disabled` instead.\n */\n isDisabled?: boolean | string;\n /** Custom icons for checked/unchecked states */\n icon?: {\n checkedIcon: ReactNode;\n uncheckedIcon: ReactNode;\n };\n /** Whether to stop click propagation */\n stopClickPropagation?: boolean;\n /** GTN field name for document integration */\n gtnName?: any;\n /** Visual variant for the toggle */\n variant?: 'primary' | 'secondary';\n /** Additional CSS classes for the label */\n labelClassName?: string;\n /** Whether this is a live field */\n isLiveField?: boolean;\n /** Message to display below the toggle */\n message?: string;\n /** Type of message to display */\n messageType?: \"success\" | \"error\" | \"info\" | \"default\";\n /** Additional CSS classes for the wrapper container */\n wrapperClassName?: string;\n /** Help text to display below the label */\n helpText?: string;\n /** Optional extra content in the label row (e.g. actions, badges) */\n labelExtra?: React.ReactNode;\n /** Size variant for the toggle */\n size?: \"small\" | \"medium\" | \"large\";\n /** Custom render function for GTN add to document button */\n renderGTNAddButton?: (onClick: () => void) => ReactNode;\n /** Handler for adding GTN to document */\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /** Container surface style: `'modified'` — Warning-50/Warning-200; `'deleted'` — Error-50/Error-200; `'success'` — Success-50/Success-200 */\n inputEmphasis?: ToggleEmphasis;\n}\n\n/**\n * Get toggle class names based on state and options\n */\nconst getToggleClassNames = (\n isChecked: boolean,\n withIcon: boolean,\n isDisabled: boolean,\n size: \"small\" | \"medium\" | \"large\" = \"medium\"\n): string => {\n const sizeClasses = {\n small: \"w-7 h-4 after:h-3 after:w-3 after:top-0.5 after:left-0.5\",\n medium: \"w-10 h-[1.375rem] after:h-[1.125rem] after:w-[1.125rem] after:top-0.5 after:left-0.5\",\n large: \"w-11 h-6 after:h-5 after:w-5 after:top-0.5 after:left-0.5\",\n };\n\n const translateClasses = {\n small: \"peer-checked:after:translate-x-3\",\n medium: \"peer-checked:after:translate-x-full\",\n large: \"peer-checked:after:translate-x-5\",\n };\n\n return cn(\n \"p-0.5 rounded-full peer after:content-[''] after:absolute after:rounded-full after:transition-all bg-gray-200 dark:bg-black-400 peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-white dark:peer-focus-visible:ring-primary-400 dark:peer-focus-visible:ring-offset-black-900 peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-100)] dark:peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-950)]\",\n sizeClasses[size],\n translateClasses[size],\n {\n 'peer-checked:bg-primary-600 dark:peer-checked:bg-primary-700 peer-checked:after:translate-x-full after:bg-white dark:after:bg-primary-500':\n isChecked,\n 'after:bg-white dark:after:bg-black-500': !isChecked,\n 'text-white dark:text-black-900': withIcon,\n 'cursor-not-allowed opacity-70': isDisabled,\n }\n );\n};\n\n/**\n * Default Check icon component\n */\nconst CheckIcon = ({ size = 18, fill = '#016DCF' }: { size?: number; fill?: string }) => (\n <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\">\n <path\n d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"\n fill={fill}\n />\n </svg>\n);\n\n/**\n * Default Close icon component\n */\nconst CloseIcon = ({ size = 18, fill = '#101828' }: { size?: number; fill?: string }) => (\n <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\">\n <path\n d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"\n fill={fill}\n />\n </svg>\n);\n\n/**\n * A highly customizable toggle component with label, validation, and styling support.\n * Features multiple sizes, variants, icon support, GTN integration, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <Toggle\n * id=\"notifications\"\n * label=\"Enable Notifications\"\n * isChecked={notificationsEnabled}\n * onChange={(checked) => setNotificationsEnabled(checked)}\n * required\n * />\n * ```\n */\nexport const Toggle = forwardRef<HTMLInputElement, ToggleProps>(\n (\n {\n isGTN = false,\n isChecked,\n id,\n onChange,\n label,\n required,\n isRequiredConditional = false,\n hideStatus = false,\n labelDirection = TOGGLE_LABEL_DIRECTION.TOP,\n statusText,\n withIcon = false,\n tags,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n tooltip = '',\n className = '',\n disabled,\n isDisabled = false,\n icon,\n stopClickPropagation = true,\n gtnName: _gtnName,\n variant: _variant = 'primary',\n labelClassName,\n isLiveField = false,\n message,\n messageType = \"default\",\n wrapperClassName,\n helpText,\n labelExtra,\n size = \"medium\",\n renderGTNAddButton,\n onAddGTNToDocument,\n inputEmphasis = \"default\",\n },\n ref\n ) => {\n const { t } = useTranslation();\n const emphasisModifiedSkin = inputEmphasis === \"modified\";\n const emphasisDeletedSkin = inputEmphasis === \"deleted\";\n const emphasisSuccessSkin = inputEmphasis === \"success\";\n const resolvedDisabled = disabled ?? isDisabled;\n const isDisabledBool = !!resolvedDisabled;\n const disabledTooltip = typeof resolvedDisabled === 'string' ? resolvedDisabled : undefined;\n const isLabelDirectionTop = labelDirection === TOGGLE_LABEL_DIRECTION.TOP;\n const isLabelDirectionLeft = labelDirection === TOGGLE_LABEL_DIRECTION.LEFT;\n const isLabelDirectionRight = labelDirection === TOGGLE_LABEL_DIRECTION.RIGHT;\n const [isHovered, setIsHovered] = useState(false);\n\n const handleAddGTNToDocument = () => {\n if (onAddGTNToDocument) {\n const keyValuePair = {\n key: _gtnName,\n value: isChecked ? 'Yes' : 'No',\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const getMessageTypographyClass = (): string => {\n if (messageType === \"error\") return \"text-red-500 dark:text-red-400\";\n if (messageType === \"success\")\n return \"text-green-500 dark:text-green-400\";\n if (messageType === \"info\") return \"text-primary-500 dark:text-primary-400\";\n return \"text-neutral-500 dark:text-neutral-400\";\n };\n\n const _defaultRenderLabels = (labels?: (string | LabelType)[]) => {\n if (!labels || labels.length === 0) return null;\n return (\n <span className=\"inline-flex gap-1 ml-1\">\n {labels.map((tag, index) => {\n const label = typeof tag === 'string' ? tag : tag.label;\n const color = typeof tag === 'string' ? undefined : tag.color;\n return (\n <span\n key={index}\n className=\"px-1.5 py-0.5 text-xs rounded bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300\"\n style={color ? { backgroundColor: color } : undefined}\n >\n {label}\n </span>\n );\n })}\n </span>\n );\n };\n\n return (\n <div\n className={cn(\n 'flex gap-0.5',\n isHovered && isGTN ? 'border rounded-lg border-primary-100 bg-primary-50 p-1' : '',\n wrapperClassName\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n onClick={(e) => {\n if (stopClickPropagation) e.stopPropagation();\n }}\n >\n {isGTN && !isHovered ? (\n <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-pulse mt-1.5\" />\n ) : null}\n <div className={cn(\n \"w-full flex flex-col\",\n emphasisModifiedSkin && \"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] px-2 py-1.5\",\n emphasisDeletedSkin && \"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] px-2 py-1.5\",\n emphasisSuccessSkin && \"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] px-2 py-1.5\",\n )}>\n {isLabelDirectionTop && label && (\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <h1\n className={cn(\n 'mb-1 min-w-0 font-inter text-neutral-600 font-medium text-xs flex items-center gap-0.5 flex-wrap',\n labelClassName\n )}\n >\n <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n {isLiveField && <BoltOutlined sx={{ fontSize: 16, color: 'var(--color-primary-600)', rotate: '15deg' }} />}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags || []} />\n {tooltip && (\n <Tooltip placement='top' title={tooltip}>\n <div className='cursor-pointer'>\n <HelpIcon />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </h1>\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 ? (\n renderGTNAddButton ? (\n renderGTNAddButton(handleAddGTNToDocument)\n ) : (\n <button\n id=\"btn-toggle-add-to-document\"\n className=\"cursor-pointer\"\n onClick={handleAddGTNToDocument}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined className=\"text-primary-600\" sx={{ fontSize: 16 }} />\n </AntTooltip>\n </button>\n )\n ) : null}\n </div>\n </div>\n )}\n\n {/* Help text */}\n {helpText && (\n <Typography\n className=\"mb-2 text-neutral-600 dark:text-neutral-400\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"regular\"\n >\n {helpText}\n </Typography>\n )}\n\n <div className=\"flex\">\n {isLabelDirectionLeft && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={cn('mr-2 text-neutral-700 dark:text-black-200', labelClassName)}\n appearance=\"custom\"\n >\n {label}\n </Typography>\n )}\n\n <label\n className={cn(\n 'relative inline-flex items-center',\n isLabelDirectionRight || statusText ? '' : 'w-min',\n !isDisabledBool ? 'cursor-pointer' : 'cursor-not-allowed opacity-50'\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <input\n ref={ref}\n type=\"checkbox\"\n id={id}\n onChange={(e) => !isDisabledBool && onChange(e.target.checked)}\n value=\"\"\n disabled={isDisabledBool}\n checked={isChecked}\n className={cn('sr-only peer w-full', className)}\n aria-required={required}\n aria-invalid={\n message && messageType === \"error\" ? \"true\" : \"false\"\n }\n aria-describedby={\n message || helpText ? `${id}-description` : undefined\n }\n />\n <div className={getToggleClassNames(isChecked, withIcon, isDisabledBool, size)}>\n {withIcon ? (\n // Overlay the icon on the sliding knob using the knob's exact\n // geometry (same top/left, same size, same full-width slide) so\n // it stays perfectly centered in the circle for every size/state.\n <div\n className={cn(\n \"pointer-events-none absolute top-0.5 left-0.5 z-10 flex items-center justify-center transition-transform\",\n size === \"small\" && \"h-3 w-3\",\n size === \"medium\" && \"h-[1.125rem] w-[1.125rem]\",\n size === \"large\" && \"h-5 w-5\",\n isChecked && \"translate-x-full\"\n )}\n >\n {isChecked ? (\n icon?.checkedIcon ? (\n icon.checkedIcon\n ) : (\n <CheckIcon size={18} fill=\"#016DCF\" />\n )\n ) : icon?.uncheckedIcon ? (\n icon.uncheckedIcon\n ) : (\n <CloseIcon size={18} fill=\"#101828\" />\n )}\n </div>\n ) : null}\n </div>\n {disabledTooltip && (\n <Tooltip placement=\"top\" title={disabledTooltip} className=\"-ml-2\">\n <span className={cn(\n 'absolute inset-y-0 left-0',\n size === 'small' && 'w-7',\n size === 'medium' && 'w-9',\n size === 'large' && 'w-11',\n )} />\n </Tooltip>\n )}\n\n {isLabelDirectionRight && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={cn('ml-2 text-neutral-700 dark:text-black-300', labelClassName)}\n appearance=\"custom\"\n >\n {label}\n </Typography>\n )}\n\n {hideStatus ? null : (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"ml-2 text-neutral-900 dark:text-black-100\"\n appearance=\"custom\"\n >\n {statusText ? statusText : isChecked ? 'Yes' : 'No'}\n </Typography>\n )}\n </label>\n </div>\n\n {/* Message */}\n <AnimatePresence>\n {message && (\n <motion.div\n initial={{ opacity: 0, y: -10 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: -10 }}\n transition={{ duration: 0.2 }}\n id={`${id}-description`}\n role={messageType === \"error\" ? \"alert\" : undefined}\n >\n <Typography\n className={cn(\"mt-1\", getMessageTypographyClass())}\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {message}\n </Typography>\n </motion.div>\n )}\n </AnimatePresence>\n\n {/* Help text description for accessibility */}\n {helpText && !message && (\n <div id={`${id}-description`} className=\"sr-only\">\n {helpText}\n </div>\n )}\n </div>\n </div>\n );\n }\n);\n\nToggle.displayName = \"Toggle\";\n"],"names":["getToggleClassNames","isChecked","withIcon","isDisabled","size","sizeClasses","translateClasses","cn","CheckIcon","fill","jsx","CloseIcon","Toggle","forwardRef","isGTN","id","onChange","label","required","isRequiredConditional","hideStatus","labelDirection","TOGGLE_LABEL_DIRECTION","statusText","tags","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","tooltip","className","disabled","icon","stopClickPropagation","_gtnName","_variant","labelClassName","isLiveField","message","messageType","wrapperClassName","helpText","labelExtra","renderGTNAddButton","onAddGTNToDocument","inputEmphasis","ref","t","useTranslation","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","resolvedDisabled","isDisabledBool","disabledTooltip","isLabelDirectionTop","isLabelDirectionLeft","isLabelDirectionRight","isHovered","setIsHovered","useState","handleAddGTNToDocument","getMessageTypographyClass","jsxs","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography","AnimatePresence","motion"],"mappings":"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"}
1
+ {"version":3,"file":"Toggle.es.js","sources":["../../../../src/components/forms/toggle/Toggle.tsx"],"sourcesContent":["import cn from \"classnames\";\nimport { forwardRef, type ReactNode, useState } from \"react\";\nimport { AnimatePresence, motion } from \"framer-motion\";\nimport { Tooltip as AntTooltip } from \"antd\";\nimport { useTranslation } from 'react-i18next';\nimport { Typography } from \"../../data-display/typography/Typography\";\nimport { TOGGLE_LABEL_DIRECTION } from \"../../../constants/toggle\";\nimport type { TToggleDirection } from \"../../../constants/toggle\";\nimport { BoltOutlined, NoteAddOutlined } from \"@mui/icons-material\";\nimport { AIExtractedIndicator } from \"../../icons/AIExtractedIndicator\";\nimport { AIStarIcon } from \"../../icons/AIStarIcon\";\nimport { Label, type LabelType } from \"../../data-display/label/Label\";\nimport Tooltip from \"../../tooltip/Tooltip\";\nimport { HelpIcon } from \"../../icons/HelpIcon\";\nimport { InputLabel } from \"../shared/InputLabel\";\nimport {\n getConfidenceScoreBadgeClass,\n getConfidenceScoreBadgeColor,\n getConfidenceScoreBadgeFill,\n getConfidenceScoreBadgeTextColor,\n shouldShowConfidenceScore,\n} from \"../../../utils/confidenceScoreUtils\";\n\n// Re-export LabelType from Label component for external use\nexport type { LabelType };\n\n/** Visual emphasis for the toggle container (background + border) */\nexport type ToggleEmphasis = \"default\" | \"modified\" | \"deleted\" | \"success\";\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 * Props for the Toggle component\n */\nexport interface ToggleProps {\n /** Whether this is a GTN (Global Term Name) field */\n isGTN?: boolean;\n /** Unique identifier for the toggle */\n id?: string;\n /** Whether the toggle is checked */\n isChecked: boolean;\n /** Callback function called when toggle state changes */\n onChange: (val: boolean) => void;\n /** Label text or element to display */\n label?: ReactNode;\n /** Whether to preserve original case in the label */\n originalCase?: boolean;\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 /** Tags/labels to display next to the label */\n tags?: (string | LabelType)[];\n /** Whether to hide the status text (Yes/No) */\n hideStatus?: boolean;\n /** Label direction relative to toggle */\n labelDirection?: TToggleDirection;\n /** Custom status text instead of Yes/No */\n statusText?: string;\n /** Whether to show icons in the toggle */\n withIcon?: boolean;\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?: 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 /** Tooltip text to display */\n tooltip?: string;\n /** Additional CSS classes for the toggle input */\n className?: string;\n /** Whether the toggle is disabled. Pass a string to disable with a tooltip message. */\n disabled?: boolean | string;\n /**\n * @deprecated Use `disabled` instead.\n */\n isDisabled?: boolean | string;\n /** Custom icons for checked/unchecked states */\n icon?: {\n checkedIcon: ReactNode;\n uncheckedIcon: ReactNode;\n };\n /** Whether to stop click propagation */\n stopClickPropagation?: boolean;\n /** GTN field name for document integration */\n gtnName?: any;\n /** Visual variant for the toggle */\n variant?: 'primary' | 'secondary';\n /** Additional CSS classes for the label */\n labelClassName?: string;\n /** Whether this is a live field */\n isLiveField?: boolean;\n /** Message to display below the toggle */\n message?: string;\n /** Type of message to display */\n messageType?: \"success\" | \"error\" | \"info\" | \"default\";\n /** Additional CSS classes for the wrapper container */\n wrapperClassName?: string;\n /** Help text to display below the label */\n helpText?: string;\n /** Optional extra content in the label row (e.g. actions, badges) */\n labelExtra?: React.ReactNode;\n /** Size variant for the toggle */\n size?: \"small\" | \"medium\" | \"large\";\n /** Custom render function for GTN add to document button */\n renderGTNAddButton?: (onClick: () => void) => ReactNode;\n /** Handler for adding GTN to document */\n onAddGTNToDocument?: (keyValuePair: { key: string; value: string }) => void;\n /** Container surface style: `'modified'` — Warning-50/Warning-200; `'deleted'` — Error-50/Error-200; `'success'` — Success-50/Success-200 */\n inputEmphasis?: ToggleEmphasis;\n}\n\n/**\n * Get toggle class names based on state and options\n */\nconst getToggleClassNames = (\n isChecked: boolean,\n withIcon: boolean,\n isDisabled: boolean,\n size: \"small\" | \"medium\" | \"large\" = \"medium\"\n): string => {\n const sizeClasses = {\n small: \"w-7 h-4 after:h-3 after:w-3 after:top-0.5 after:left-0.5\",\n medium: \"w-10 h-[1.375rem] after:h-[1.125rem] after:w-[1.125rem] after:top-0.5 after:left-0.5\",\n large: \"w-11 h-6 after:h-5 after:w-5 after:top-0.5 after:left-0.5\",\n };\n\n const translateClasses = {\n small: \"peer-checked:after:translate-x-3\",\n medium: \"peer-checked:after:translate-x-full\",\n large: \"peer-checked:after:translate-x-5\",\n };\n\n return cn(\n \"p-0.5 rounded-full peer after:content-[''] after:absolute after:rounded-full after:transition-all bg-gray-200 dark:bg-black-400 peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500 peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-white dark:peer-focus-visible:ring-primary-400 dark:peer-focus-visible:ring-offset-black-900 peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-100)] dark:peer-focus-visible:shadow-[0_0_0_3px_var(--color-primary-950)]\",\n sizeClasses[size],\n translateClasses[size],\n {\n 'peer-checked:bg-primary-600 dark:peer-checked:bg-primary-700 peer-checked:after:translate-x-full after:bg-white dark:after:bg-primary-500':\n isChecked,\n 'after:bg-white dark:after:bg-black-500': !isChecked,\n 'text-white dark:text-black-900': withIcon,\n 'cursor-not-allowed opacity-70': isDisabled,\n }\n );\n};\n\n/**\n * Default Check icon component\n */\nconst CheckIcon = ({ size = 18, fill = '#016DCF' }: { size?: number; fill?: string }) => (\n <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\">\n <path\n d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"\n fill={fill}\n />\n </svg>\n);\n\n/**\n * Default Close icon component\n */\nconst CloseIcon = ({ size = 18, fill = '#101828' }: { size?: number; fill?: string }) => (\n <svg width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\">\n <path\n d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"\n fill={fill}\n />\n </svg>\n);\n\n/**\n * A highly customizable toggle component with label, validation, and styling support.\n * Features multiple sizes, variants, icon support, GTN integration, and comprehensive prop support.\n *\n * @example\n * ```tsx\n * <Toggle\n * id=\"notifications\"\n * label=\"Enable Notifications\"\n * isChecked={notificationsEnabled}\n * onChange={(checked) => setNotificationsEnabled(checked)}\n * required\n * />\n * ```\n */\nexport const Toggle = forwardRef<HTMLInputElement, ToggleProps>(\n (\n {\n isGTN = false,\n isChecked,\n id,\n onChange,\n label,\n required,\n isRequiredConditional = false,\n hideStatus = false,\n labelDirection = TOGGLE_LABEL_DIRECTION.TOP,\n statusText,\n withIcon = false,\n tags,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n tooltip = '',\n className = '',\n disabled,\n isDisabled = false,\n icon,\n stopClickPropagation = true,\n gtnName: _gtnName,\n variant: _variant = 'primary',\n labelClassName,\n isLiveField = false,\n message,\n messageType = \"default\",\n wrapperClassName,\n helpText,\n labelExtra,\n size = \"medium\",\n renderGTNAddButton,\n onAddGTNToDocument,\n inputEmphasis = \"default\",\n },\n ref\n ) => {\n const { t } = useTranslation();\n const emphasisModifiedSkin = inputEmphasis === \"modified\";\n const emphasisDeletedSkin = inputEmphasis === \"deleted\";\n const emphasisSuccessSkin = inputEmphasis === \"success\";\n const resolvedDisabled = disabled ?? isDisabled;\n const isDisabledBool = !!resolvedDisabled;\n const disabledTooltip = typeof resolvedDisabled === 'string' ? resolvedDisabled : undefined;\n const isLabelDirectionTop = labelDirection === TOGGLE_LABEL_DIRECTION.TOP;\n const isLabelDirectionLeft = labelDirection === TOGGLE_LABEL_DIRECTION.LEFT;\n const isLabelDirectionRight = labelDirection === TOGGLE_LABEL_DIRECTION.RIGHT;\n const [isHovered, setIsHovered] = useState(false);\n\n const handleAddGTNToDocument = () => {\n if (onAddGTNToDocument) {\n const keyValuePair = {\n key: _gtnName,\n value: isChecked ? 'Yes' : 'No',\n };\n onAddGTNToDocument(keyValuePair);\n }\n };\n\n const getMessageTypographyClass = (): string => {\n if (messageType === \"error\") return \"text-red-500 dark:text-red-400\";\n if (messageType === \"success\")\n return \"text-green-500 dark:text-green-400\";\n if (messageType === \"info\") return \"text-primary-500 dark:text-primary-400\";\n return \"text-neutral-500 dark:text-neutral-400\";\n };\n\n const _defaultRenderLabels = (labels?: (string | LabelType)[]) => {\n if (!labels || labels.length === 0) return null;\n return (\n <span className=\"inline-flex gap-1 ml-1\">\n {labels.map((tag, index) => {\n const label = typeof tag === 'string' ? tag : tag.label;\n const color = typeof tag === 'string' ? undefined : tag.color;\n return (\n <span\n key={index}\n className=\"px-1.5 py-0.5 text-xs rounded bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300\"\n style={color ? { backgroundColor: color } : undefined}\n >\n {label}\n </span>\n );\n })}\n </span>\n );\n };\n\n return (\n <div\n className={cn(\n 'flex gap-0.5',\n isHovered && isGTN ? 'border rounded-lg border-primary-100 bg-primary-50 p-1' : '',\n wrapperClassName\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n onClick={(e) => {\n if (stopClickPropagation) e.stopPropagation();\n }}\n >\n {isGTN && !isHovered ? (\n <div className=\"w-1 h-1 bg-primary-600 rounded-full animate-pulse mt-1.5\" />\n ) : null}\n <div className={cn(\n \"w-full flex flex-col\",\n emphasisModifiedSkin && \"rounded-lg border border-solid border-[var(--Warning-200,#FEDF89)] bg-[var(--Warning-50,#FFFAEB)] px-2 py-1.5\",\n emphasisDeletedSkin && \"rounded-lg border border-solid border-[var(--Error-200,#FECACA)] bg-[var(--Error-50,#FEF2F2)] px-2 py-1.5\",\n emphasisSuccessSkin && \"rounded-lg border border-solid border-[var(--Success-200,#BBF7D0)] bg-[var(--Success-50,#F0FDF4)] px-2 py-1.5\",\n )}>\n {isLabelDirectionTop && label && (\n <div className=\"grid w-full grid-cols-[minmax(0,1fr)_auto] items-start gap-x-1\">\n <h1\n className={cn(\n 'mb-1 min-w-0 font-inter text-neutral-600 font-medium text-xs flex items-center gap-0.5 flex-wrap',\n labelClassName\n )}\n >\n <InputLabel label={label || \"\"} required={required || false} isRequiredConditional={isRequiredConditional || false} />\n {isLiveField && <BoltOutlined sx={{ fontSize: 16, color: 'var(--color-primary-600)', rotate: '15deg' }} />}\n {isAiExtracted && !shouldShowConfidenceScore(confidenceScore) && <AIExtractedIndicator />}\n <Label labels={tags || []} />\n {tooltip && (\n <Tooltip placement='top' title={tooltip}>\n <div className='cursor-pointer'>\n <HelpIcon className=\"w-icon-sm h-icon-sm\" />\n </div>\n </Tooltip>\n )}\n {labelExtra}\n </h1>\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 ? (\n renderGTNAddButton ? (\n renderGTNAddButton(handleAddGTNToDocument)\n ) : (\n <button\n id=\"btn-toggle-add-to-document\"\n className=\"cursor-pointer\"\n onClick={handleAddGTNToDocument}\n type=\"button\"\n >\n <AntTooltip placement=\"top\" title={t(\"Add to document\")}>\n <NoteAddOutlined className=\"text-primary-600\" sx={{ fontSize: 16 }} />\n </AntTooltip>\n </button>\n )\n ) : null}\n </div>\n </div>\n )}\n\n {/* Help text */}\n {helpText && (\n <Typography\n className=\"mb-2 text-neutral-600 dark:text-neutral-400\"\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"regular\"\n >\n {helpText}\n </Typography>\n )}\n\n <div className=\"flex\">\n {isLabelDirectionLeft && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={cn('mr-2 text-neutral-700 dark:text-black-200', labelClassName)}\n appearance=\"custom\"\n >\n {label}\n </Typography>\n )}\n\n <label\n className={cn(\n 'relative inline-flex items-center',\n isLabelDirectionRight || statusText ? '' : 'w-min',\n !isDisabledBool ? 'cursor-pointer' : 'cursor-not-allowed opacity-50'\n )}\n onClick={(e) => e.stopPropagation()}\n >\n <input\n ref={ref}\n type=\"checkbox\"\n id={id}\n onChange={(e) => !isDisabledBool && onChange(e.target.checked)}\n value=\"\"\n disabled={isDisabledBool}\n checked={isChecked}\n className={cn('sr-only peer w-full', className)}\n aria-required={required}\n aria-invalid={\n message && messageType === \"error\" ? \"true\" : \"false\"\n }\n aria-describedby={\n message || helpText ? `${id}-description` : undefined\n }\n />\n <div className={getToggleClassNames(isChecked, withIcon, isDisabledBool, size)}>\n {withIcon ? (\n // Overlay the icon on the sliding knob using the knob's exact\n // geometry (same top/left, same size, same full-width slide) so\n // it stays perfectly centered in the circle for every size/state.\n <div\n className={cn(\n \"pointer-events-none absolute top-0.5 left-0.5 z-10 flex items-center justify-center transition-transform\",\n size === \"small\" && \"h-3 w-3\",\n size === \"medium\" && \"h-[1.125rem] w-[1.125rem]\",\n size === \"large\" && \"h-5 w-5\",\n isChecked && \"translate-x-full\"\n )}\n >\n {isChecked ? (\n icon?.checkedIcon ? (\n icon.checkedIcon\n ) : (\n <CheckIcon size={18} fill=\"#016DCF\" />\n )\n ) : icon?.uncheckedIcon ? (\n icon.uncheckedIcon\n ) : (\n <CloseIcon size={18} fill=\"#101828\" />\n )}\n </div>\n ) : null}\n </div>\n {disabledTooltip && (\n <Tooltip placement=\"top\" title={disabledTooltip} className=\"-ml-2\">\n <span className={cn(\n 'absolute inset-y-0 left-0',\n size === 'small' && 'w-7',\n size === 'medium' && 'w-9',\n size === 'large' && 'w-11',\n )} />\n </Tooltip>\n )}\n\n {isLabelDirectionRight && (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className={cn('ml-2 text-neutral-700 dark:text-black-300', labelClassName)}\n appearance=\"custom\"\n >\n {label}\n </Typography>\n )}\n\n {hideStatus ? null : (\n <Typography\n size=\"small\"\n variant=\"medium\"\n className=\"ml-2 text-neutral-900 dark:text-black-100\"\n appearance=\"custom\"\n >\n {statusText ? statusText : isChecked ? 'Yes' : 'No'}\n </Typography>\n )}\n </label>\n </div>\n\n {/* Message */}\n <AnimatePresence>\n {message && (\n <motion.div\n initial={{ opacity: 0, y: -10 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: -10 }}\n transition={{ duration: 0.2 }}\n id={`${id}-description`}\n role={messageType === \"error\" ? \"alert\" : undefined}\n >\n <Typography\n className={cn(\"mt-1\", getMessageTypographyClass())}\n appearance=\"custom\"\n size=\"extra-small\"\n variant=\"medium\"\n >\n {message}\n </Typography>\n </motion.div>\n )}\n </AnimatePresence>\n\n {/* Help text description for accessibility */}\n {helpText && !message && (\n <div id={`${id}-description`} className=\"sr-only\">\n {helpText}\n </div>\n )}\n </div>\n </div>\n );\n }\n);\n\nToggle.displayName = \"Toggle\";\n"],"names":["getToggleClassNames","isChecked","withIcon","isDisabled","size","sizeClasses","translateClasses","cn","CheckIcon","fill","jsx","CloseIcon","Toggle","forwardRef","isGTN","id","onChange","label","required","isRequiredConditional","hideStatus","labelDirection","TOGGLE_LABEL_DIRECTION","statusText","tags","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","tooltip","className","disabled","icon","stopClickPropagation","_gtnName","_variant","labelClassName","isLiveField","message","messageType","wrapperClassName","helpText","labelExtra","renderGTNAddButton","onAddGTNToDocument","inputEmphasis","ref","t","useTranslation","emphasisModifiedSkin","emphasisDeletedSkin","emphasisSuccessSkin","resolvedDisabled","isDisabledBool","disabledTooltip","isLabelDirectionTop","isLabelDirectionLeft","isLabelDirectionRight","isHovered","setIsHovered","useState","handleAddGTNToDocument","getMessageTypographyClass","jsxs","e","InputLabel","BoltOutlined","shouldShowConfidenceScore","AIExtractedIndicator","Label","Tooltip","HelpIcon","getConfidenceScoreBadgeClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","getConfidenceScoreBadgeTextColor","AntTooltip","NoteAddOutlined","Typography","AnimatePresence","motion"],"mappings":"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"}
package/dist/index.d.ts CHANGED
@@ -253,7 +253,7 @@ export type { DesignSystemConfig, TabConfig, TableConfig, TableViewApi, MasterDa
253
253
  export { InfiniteTable } from "./components/data-display/infinite-table";
254
254
  export { TableContext } from "./components/data-display/infinite-table/context";
255
255
  export type { ITableContext } from "./components/data-display/infinite-table/context";
256
- export type { ITableProps, ICell, IColumn, ITableView, IMultiSelectConfig, TTableKey, TTableRow, TCheckboxUtilities, IMasterDataModalConfig, ICurrencyDropdownConfig, IPendingEdit, PendingEditsMap, ValidateAndSaveResult, } from "./components/data-display/infinite-table/types";
256
+ export type { ITableProps, ICell, IColumn, ITableView, IMultiSelectConfig, TTableKey, TTableRow, TCheckboxUtilities, IMasterDataModalConfig, ICurrencyDropdownConfig, IPendingEdit, PendingEditsMap, ValidateAndSaveResult, THeaderInlineAction, } from "./components/data-display/infinite-table/types";
257
257
  export { useCheckbox } from "./hooks/useCheckbox";
258
258
  export { default as UserCell } from "./components/data-display/infinite-table/body/cell/UserCell";
259
259
  export { Dropdown } from "./components/dropdown/Dropdown";
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.33-beta.5",
4
+ "version": "0.13.33-beta.7",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs.js",
7
7
  "module": "dist/index.es.js",