@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.
- package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.es.js +57 -56
- package/dist/components/data-display/infinite-table/PendingEditsFloatingBar.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.es.js +43 -42
- package/dist/components/data-display/infinite-table/body/cell/CheckboxCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/DataCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/DataCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/DataCell.es.js +141 -138
- package/dist/components/data-display/infinite-table/body/cell/DataCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/LoaderCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/LoaderCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js +10 -9
- package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js +7 -7
- package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowActionCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowActionCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowActionCell.es.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowActionCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js +1 -1
- package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/rows/row.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/body/rows/row.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/body/rows/row.es.js +286 -281
- package/dist/components/data-display/infinite-table/body/rows/row.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/constants.cjs.js +2 -0
- package/dist/components/data-display/infinite-table/constants.cjs.js.map +1 -0
- package/dist/components/data-display/infinite-table/constants.d.ts +41 -0
- package/dist/components/data-display/infinite-table/constants.es.js +27 -0
- package/dist/components/data-display/infinite-table/constants.es.js.map +1 -0
- package/dist/components/data-display/infinite-table/context.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/context.d.ts +1 -0
- package/dist/components/data-display/infinite-table/context.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/head/cell/index.es.js +36 -35
- package/dist/components/data-display/infinite-table/head/cell/index.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/index.cjs.js +1 -1
- package/dist/components/data-display/infinite-table/index.cjs.js.map +1 -1
- package/dist/components/data-display/infinite-table/index.d.ts +1 -1
- package/dist/components/data-display/infinite-table/index.es.js +410 -406
- package/dist/components/data-display/infinite-table/index.es.js.map +1 -1
- package/dist/components/data-display/infinite-table/types.d.ts +22 -0
- package/dist/components/forms/base-input-field/BaseInputField.cjs.js +2 -2
- package/dist/components/forms/base-input-field/BaseInputField.cjs.js.map +1 -1
- package/dist/components/forms/base-input-field/BaseInputField.es.js +20 -20
- package/dist/components/forms/base-input-field/BaseInputField.es.js.map +1 -1
- package/dist/components/forms/creatable-select/CreatableSelect.cjs.js +1 -1
- package/dist/components/forms/creatable-select/CreatableSelect.cjs.js.map +1 -1
- package/dist/components/forms/creatable-select/CreatableSelect.es.js +7 -7
- package/dist/components/forms/creatable-select/CreatableSelect.es.js.map +1 -1
- package/dist/components/forms/currency-input/CurrencyInputField.cjs.js +1 -1
- package/dist/components/forms/currency-input/CurrencyInputField.cjs.js.map +1 -1
- package/dist/components/forms/currency-input/CurrencyInputField.es.js +12 -12
- package/dist/components/forms/currency-input/CurrencyInputField.es.js.map +1 -1
- package/dist/components/forms/date-time-field/DateTimeField.cjs.js +1 -1
- package/dist/components/forms/date-time-field/DateTimeField.cjs.js.map +1 -1
- package/dist/components/forms/date-time-field/DateTimeField.es.js +1 -1
- package/dist/components/forms/date-time-field/DateTimeField.es.js.map +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInput.cjs.js +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInput.cjs.js.map +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInput.es.js +7 -7
- package/dist/components/forms/dynamic-data-input/DynamicDataInput.es.js.map +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInputField.cjs.js.map +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js +1 -1
- package/dist/components/forms/dynamic-data-input/DynamicDataInputField.es.js.map +1 -1
- package/dist/components/forms/formula-input/FormulaInput.cjs.js +1 -1
- package/dist/components/forms/formula-input/FormulaInput.cjs.js.map +1 -1
- package/dist/components/forms/formula-input/FormulaInput.es.js +10 -10
- package/dist/components/forms/formula-input/FormulaInput.es.js.map +1 -1
- package/dist/components/forms/input-field/InputField.cjs.js.map +1 -1
- package/dist/components/forms/input-field/InputField.es.js.map +1 -1
- package/dist/components/forms/master-data-input/MasterDataInputField.cjs.js +1 -1
- package/dist/components/forms/master-data-input/MasterDataInputField.cjs.js.map +1 -1
- package/dist/components/forms/master-data-input/MasterDataInputField.es.js +1 -1
- package/dist/components/forms/master-data-input/MasterDataInputField.es.js.map +1 -1
- package/dist/components/forms/percentage-input/PercentageInputField.cjs.js +2 -2
- package/dist/components/forms/percentage-input/PercentageInputField.cjs.js.map +1 -1
- package/dist/components/forms/percentage-input/PercentageInputField.es.js +19 -19
- package/dist/components/forms/percentage-input/PercentageInputField.es.js.map +1 -1
- package/dist/components/forms/select-field/SelectField.cjs.js +2 -2
- package/dist/components/forms/select-field/SelectField.cjs.js.map +1 -1
- package/dist/components/forms/select-field/SelectField.es.js +1 -1
- package/dist/components/forms/select-field/SelectField.es.js.map +1 -1
- package/dist/components/forms/text-area-field/TextAreaField.cjs.js +1 -1
- package/dist/components/forms/text-area-field/TextAreaField.cjs.js.map +1 -1
- package/dist/components/forms/text-area-field/TextAreaField.es.js +14 -14
- package/dist/components/forms/text-area-field/TextAreaField.es.js.map +1 -1
- package/dist/components/forms/toggle/Toggle.cjs.js +1 -1
- package/dist/components/forms/toggle/Toggle.cjs.js.map +1 -1
- package/dist/components/forms/toggle/Toggle.es.js +23 -23
- package/dist/components/forms/toggle/Toggle.es.js.map +1 -1
- package/dist/index.d.ts +1 -1
- 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 = (
|
|
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":
|
|
33
|
-
"after:bg-white dark:after:bg-black-500": !
|
|
34
|
-
"text-white dark:text-black-900":
|
|
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:
|
|
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:
|
|
42
|
+
fill: t
|
|
43
43
|
}
|
|
44
|
-
) }), Ce = ({ size:
|
|
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:
|
|
48
|
+
fill: t
|
|
49
49
|
}
|
|
50
50
|
) }), Fe = ie(
|
|
51
51
|
({
|
|
52
|
-
isGTN:
|
|
53
|
-
isChecked:
|
|
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,
|
|
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:
|
|
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 &&
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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:
|
|
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(
|
|
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
|
-
|
|
240
|
+
t && "translate-x-full"
|
|
241
241
|
),
|
|
242
|
-
children:
|
|
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 || (
|
|
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";
|