@lax-wp/design-system 0.14.49 → 0.14.50
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/datatype-icon/LabelValueDataTypeIcon.cjs.js +2 -0
- package/dist/components/data-display/datatype-icon/LabelValueDataTypeIcon.cjs.js.map +1 -0
- package/dist/components/data-display/datatype-icon/LabelValueDataTypeIcon.d.ts +29 -0
- package/dist/components/data-display/datatype-icon/LabelValueDataTypeIcon.es.js +82 -0
- package/dist/components/data-display/datatype-icon/LabelValueDataTypeIcon.es.js.map +1 -0
- package/dist/components/data-display/datatype-icon/index.d.ts +2 -0
- package/dist/components/data-display/label-value/LabelValue.cjs.js +1 -1
- package/dist/components/data-display/label-value/LabelValue.cjs.js.map +1 -1
- package/dist/components/data-display/label-value/LabelValue.d.ts +4 -0
- package/dist/components/data-display/label-value/LabelValue.es.js +196 -182
- package/dist/components/data-display/label-value/LabelValue.es.js.map +1 -1
- package/dist/design-system.css +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.d.ts +3 -0
- package/dist/index.es.js +310 -305
- package/dist/index.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react/jsx-runtime"),i=require("../../../_virtual/index.cjs.js"),S=require("react"),Y=require("../../tooltip/Tooltip.cjs.js"),s=require("@mui/icons-material"),e=require("./DataTypeIcon.cjs.js"),c={[e.APP_DATA_TYPES.BOOLEAN]:"#12B76A",[e.APP_DATA_TYPES.CHOICE]:"#DF5384",[e.APP_DATA_TYPES.DATE]:"#292E92",[e.APP_DATA_TYPES.EMAIL]:"#139AFA",[e.APP_DATA_TYPES.CURRENCY]:"#F99417",[e.APP_DATA_TYPES.DATETIME]:"#6E9D6D",[e.APP_DATA_TYPES.TEXT]:"#58B507",[e.APP_DATA_TYPES.STRING]:"#58B507",[e.APP_DATA_TYPES.TAG]:"#B31121",[e.APP_DATA_TYPES.MASTER_DATA]:"#CCAE00",[e.APP_DATA_TYPES.DYNAMIC]:"#DB00CD",[e.APP_DATA_TYPES.NUMBER]:"#00E4D1"},o="#98A2B3",x=({fill:t=o,size:P=16})=>A.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:P,height:P,viewBox:"0 0 21 20",fill:"none",children:A.jsx("path",{d:"M10.666 17.5C8.56879 17.5 6.79449 17.1771 5.3431 16.5312C3.89171 15.8854 3.16602 15.0972 3.16602 14.1667V5.83333C3.16602 4.91667 3.89865 4.13194 5.36393 3.47917C6.82921 2.82639 8.59657 2.5 10.666 2.5C12.7355 2.5 14.5028 2.82639 15.9681 3.47917C17.4334 4.13194 18.166 4.91667 18.166 5.83333V14.1667C18.166 15.0972 17.4403 15.8854 15.9889 16.5312C14.5375 17.1771 12.7632 17.5 10.666 17.5Z",fill:t})}),O=({fill:t=o,size:P=16})=>A.jsx("svg",{width:P,height:P,viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:A.jsx("path",{d:"M3.70019 8.625C3.35019 8.91667 2.98561 9.05 2.60644 9.025C2.22727 9 1.89602 8.87083 1.61269 8.6375C1.32935 8.40417 1.1356 8.09792 1.03144 7.71875C0.927272 7.33958 0.996022 6.95 1.23769 6.55L2.17519 5C1.96685 4.81667 1.80227 4.59583 1.68144 4.3375C1.5606 4.07917 1.50019 3.8 1.50019 3.5C1.50019 2.95 1.69602 2.47917 2.08769 2.0875C2.47936 1.69583 2.95019 1.5 3.50019 1.5C4.05019 1.5 4.52102 1.69583 4.91269 2.0875C5.30436 2.47917 5.50019 2.95 5.50019 3.5C5.50019 4.05 5.30436 4.52083 4.91269 4.9125C4.52102 5.30417 4.05019 5.5 3.50019 5.5C3.42519 5.5 3.35019 5.49583 3.27519 5.4875C3.20019 5.47917 3.12935 5.46667 3.06269 5.45L2.10019 7.075C2.00852 7.225 1.97936 7.37292 2.01269 7.51875C2.04602 7.66458 2.11686 7.78333 2.22519 7.875C2.33352 7.96667 2.46269 8.01875 2.61269 8.03125C2.76269 8.04375 2.90852 7.99167 3.05019 7.875L8.30019 3.3625C8.65019 3.07083 9.01686 2.93958 9.40019 2.96875C9.78352 2.99792 10.1169 3.12917 10.4002 3.3625C10.6835 3.59583 10.8752 3.90208 10.9752 4.28125C11.0752 4.66042 11.0044 5.05 10.7627 5.45L9.82519 7C10.0335 7.18333 10.1981 7.40417 10.3189 7.6625C10.4398 7.92083 10.5002 8.2 10.5002 8.5C10.5002 9.05 10.3044 9.52083 9.91269 9.9125C9.52102 10.3042 9.05019 10.5 8.50019 10.5C7.95019 10.5 7.47936 10.3042 7.08769 9.9125C6.69602 9.52083 6.50019 9.05 6.50019 8.5C6.50019 7.95 6.69602 7.47917 7.08769 7.0875C7.47936 6.69583 7.95019 6.5 8.50019 6.5C8.57519 6.5 8.64811 6.50417 8.71894 6.5125C8.78977 6.52083 8.85852 6.53333 8.92519 6.55L9.90019 4.925C9.99186 4.775 10.021 4.62708 9.98769 4.48125C9.95436 4.33542 9.88352 4.21667 9.77519 4.125C9.66686 4.03333 9.53769 3.98125 9.38769 3.96875C9.23769 3.95625 9.09186 4.00833 8.95019 4.125L3.70019 8.625Z",fill:t})}),d=({dataType:t="text",tooltip:P,size:T=16,className:l})=>{const E=e.APP_DATA_TYPES_OPTIONS.find(D=>D.value===t),[C,_]=S.useState(!1),a=document.documentElement.classList.contains("dark"),r=C?c[t]:o,u=C?a?e.BG_COLORS_DARK[t]:e.BG_COLORS[t]:"transparent",n={fontSize:T,color:r,transition:"color 150ms ease"};return A.jsx(Y,{title:P||E?.label,placement:"top",children:A.jsx("span",{className:i("flex items-center justify-center p-0.5 rounded-full transition-colors duration-150",l),style:{backgroundColor:u},onMouseEnter:()=>_(!0),onMouseLeave:()=>_(!1),children:(()=>{switch(t){case e.APP_DATA_TYPES.BOOLEAN:return A.jsx(s.Rule,{sx:n});case e.APP_DATA_TYPES.CHOICE:return A.jsx(s.FormatListBulleted,{sx:n});case e.APP_DATA_TYPES.DATE:return A.jsx(s.CalendarMonth,{sx:n});case e.APP_DATA_TYPES.EMAIL:return A.jsx(s.MailOutline,{sx:n});case e.APP_DATA_TYPES.CURRENCY:return A.jsx(s.AttachMoney,{sx:n});case e.APP_DATA_TYPES.DATETIME:return A.jsx(s.Schedule,{sx:n});case e.APP_DATA_TYPES.TEXT:case e.APP_DATA_TYPES.STRING:return A.jsx(s.SubjectOutlined,{sx:n});case e.APP_DATA_TYPES.TAG:return A.jsx(s.LocalOfferOutlined,{sx:n});case e.APP_DATA_TYPES.MASTER_DATA:return A.jsx(x,{size:T,fill:r});case e.APP_DATA_TYPES.DYNAMIC:return A.jsx(O,{size:T,fill:r});case e.APP_DATA_TYPES.NUMBER:return A.jsx(s.Numbers,{sx:n});default:return null}})()})})};exports.DATA_TYPE_ICON_COLORS=c;exports.LabelValueDataTypeIcon=d;
|
|
2
|
+
//# sourceMappingURL=LabelValueDataTypeIcon.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LabelValueDataTypeIcon.cjs.js","sources":["../../../../src/components/data-display/datatype-icon/LabelValueDataTypeIcon.tsx"],"sourcesContent":["import cn from 'classnames';\nimport { useState } from 'react';\nimport Tooltip from '../../tooltip/Tooltip';\nimport {\n AttachMoney,\n CalendarMonth,\n FormatListBulleted,\n LocalOfferOutlined,\n MailOutline,\n Numbers,\n Rule,\n Schedule,\n SubjectOutlined,\n} from '@mui/icons-material';\nimport { APP_DATA_TYPES, APP_DATA_TYPES_OPTIONS, BG_COLORS, BG_COLORS_DARK } from './DataTypeIcon';\n\n/**\n * Accent color of each data type — the hover color of the icon\n */\nexport const DATA_TYPE_ICON_COLORS: Record<string, string> = {\n [APP_DATA_TYPES.BOOLEAN]: '#12B76A',\n [APP_DATA_TYPES.CHOICE]: '#DF5384',\n [APP_DATA_TYPES.DATE]: '#292E92',\n [APP_DATA_TYPES.EMAIL]: '#139AFA',\n [APP_DATA_TYPES.CURRENCY]: '#F99417',\n [APP_DATA_TYPES.DATETIME]: '#6E9D6D',\n [APP_DATA_TYPES.TEXT]: '#58B507',\n [APP_DATA_TYPES.STRING]: '#58B507',\n [APP_DATA_TYPES.TAG]: '#B31121',\n [APP_DATA_TYPES.MASTER_DATA]: '#CCAE00',\n [APP_DATA_TYPES.DYNAMIC]: '#DB00CD',\n [APP_DATA_TYPES.NUMBER]: '#00E4D1',\n};\n\n/** Neutral/400 — resting color of the icon */\nconst NEUTRAL_400 = '#98A2B3';\n\nconst DataBaseIcon = ({ fill = NEUTRAL_400, size = 16 }) => (\n <svg xmlns='http://www.w3.org/2000/svg' width={size} height={size} viewBox='0 0 21 20' fill='none'>\n <path\n d='M10.666 17.5C8.56879 17.5 6.79449 17.1771 5.3431 16.5312C3.89171 15.8854 3.16602 15.0972 3.16602 14.1667V5.83333C3.16602 4.91667 3.89865 4.13194 5.36393 3.47917C6.82921 2.82639 8.59657 2.5 10.666 2.5C12.7355 2.5 14.5028 2.82639 15.9681 3.47917C17.4334 4.13194 18.166 4.91667 18.166 5.83333V14.1667C18.166 15.0972 17.4403 15.8854 15.9889 16.5312C14.5375 17.1771 12.7632 17.5 10.666 17.5Z'\n fill={fill}\n />\n </svg>\n);\n\nconst AutomationIcon = ({ fill = NEUTRAL_400, size = 16 }) => (\n <svg width={size} height={size} viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'>\n <path\n d='M3.70019 8.625C3.35019 8.91667 2.98561 9.05 2.60644 9.025C2.22727 9 1.89602 8.87083 1.61269 8.6375C1.32935 8.40417 1.1356 8.09792 1.03144 7.71875C0.927272 7.33958 0.996022 6.95 1.23769 6.55L2.17519 5C1.96685 4.81667 1.80227 4.59583 1.68144 4.3375C1.5606 4.07917 1.50019 3.8 1.50019 3.5C1.50019 2.95 1.69602 2.47917 2.08769 2.0875C2.47936 1.69583 2.95019 1.5 3.50019 1.5C4.05019 1.5 4.52102 1.69583 4.91269 2.0875C5.30436 2.47917 5.50019 2.95 5.50019 3.5C5.50019 4.05 5.30436 4.52083 4.91269 4.9125C4.52102 5.30417 4.05019 5.5 3.50019 5.5C3.42519 5.5 3.35019 5.49583 3.27519 5.4875C3.20019 5.47917 3.12935 5.46667 3.06269 5.45L2.10019 7.075C2.00852 7.225 1.97936 7.37292 2.01269 7.51875C2.04602 7.66458 2.11686 7.78333 2.22519 7.875C2.33352 7.96667 2.46269 8.01875 2.61269 8.03125C2.76269 8.04375 2.90852 7.99167 3.05019 7.875L8.30019 3.3625C8.65019 3.07083 9.01686 2.93958 9.40019 2.96875C9.78352 2.99792 10.1169 3.12917 10.4002 3.3625C10.6835 3.59583 10.8752 3.90208 10.9752 4.28125C11.0752 4.66042 11.0044 5.05 10.7627 5.45L9.82519 7C10.0335 7.18333 10.1981 7.40417 10.3189 7.6625C10.4398 7.92083 10.5002 8.2 10.5002 8.5C10.5002 9.05 10.3044 9.52083 9.91269 9.9125C9.52102 10.3042 9.05019 10.5 8.50019 10.5C7.95019 10.5 7.47936 10.3042 7.08769 9.9125C6.69602 9.52083 6.50019 9.05 6.50019 8.5C6.50019 7.95 6.69602 7.47917 7.08769 7.0875C7.47936 6.69583 7.95019 6.5 8.50019 6.5C8.57519 6.5 8.64811 6.50417 8.71894 6.5125C8.78977 6.52083 8.85852 6.53333 8.92519 6.55L9.90019 4.925C9.99186 4.775 10.021 4.62708 9.98769 4.48125C9.95436 4.33542 9.88352 4.21667 9.77519 4.125C9.66686 4.03333 9.53769 3.98125 9.38769 3.96875C9.23769 3.95625 9.09186 4.00833 8.95019 4.125L3.70019 8.625Z'\n fill={fill}\n />\n </svg>\n);\n\nexport interface LabelValueDataTypeIconProps {\n /** One of `APP_DATA_TYPES` */\n dataType: string;\n /** Overrides the default tooltip (the data type label) */\n tooltip?: React.ReactNode;\n /** Icon size in px (default: 16) */\n size?: number;\n /** Additional CSS classes on the icon wrapper */\n className?: string;\n}\n\n/**\n * Data type icon used to emphasize the data type of a `LabelValue` field.\n *\n * Unlike `DataTypeIcon` — which always renders a colored icon on a colored\n * square, as used in table headers — this one is quiet at rest: the icon sits\n * at Neutral/400 on a transparent background, and only on hover does it take\n * the data type accent color over a round, light tint of that same color.\n * A tooltip names the data type.\n *\n * @example\n * ```tsx\n * <LabelValueDataTypeIcon dataType={APP_DATA_TYPES.CURRENCY} />\n * ```\n */\nexport const LabelValueDataTypeIcon = ({\n dataType = 'text',\n tooltip,\n size = 16,\n className,\n}: LabelValueDataTypeIconProps) => {\n const dataTypeOption = APP_DATA_TYPES_OPTIONS.find((option) => option.value === dataType);\n const [isHover, setIsHover] = useState(false);\n const isDark = document.documentElement.classList.contains('dark');\n\n const color = isHover ? DATA_TYPE_ICON_COLORS[dataType] : NEUTRAL_400;\n const backgroundColor = isHover ? (isDark ? BG_COLORS_DARK[dataType] : BG_COLORS[dataType]) : 'transparent';\n const sx = { fontSize: size, color, transition: 'color 150ms ease' };\n\n return (\n <Tooltip title={tooltip || dataTypeOption?.label} placement='top'>\n <span\n className={cn('flex items-center justify-center p-0.5 rounded-full transition-colors duration-150', className)}\n style={{ backgroundColor }}\n onMouseEnter={() => setIsHover(true)}\n onMouseLeave={() => setIsHover(false)}\n >\n {(() => {\n switch (dataType) {\n case APP_DATA_TYPES.BOOLEAN:\n return <Rule sx={sx} />;\n case APP_DATA_TYPES.CHOICE:\n return <FormatListBulleted sx={sx} />;\n case APP_DATA_TYPES.DATE:\n return <CalendarMonth sx={sx} />;\n case APP_DATA_TYPES.EMAIL:\n return <MailOutline sx={sx} />;\n case APP_DATA_TYPES.CURRENCY:\n return <AttachMoney sx={sx} />;\n case APP_DATA_TYPES.DATETIME:\n return <Schedule sx={sx} />;\n case APP_DATA_TYPES.TEXT:\n case APP_DATA_TYPES.STRING:\n return <SubjectOutlined sx={sx} />;\n case APP_DATA_TYPES.TAG:\n return <LocalOfferOutlined sx={sx} />;\n case APP_DATA_TYPES.MASTER_DATA:\n return <DataBaseIcon size={size} fill={color} />;\n case APP_DATA_TYPES.DYNAMIC:\n return <AutomationIcon size={size} fill={color} />;\n case APP_DATA_TYPES.NUMBER:\n return <Numbers sx={sx} />;\n default:\n return null;\n }\n })()}\n </span>\n </Tooltip>\n );\n};\n"],"names":["DATA_TYPE_ICON_COLORS","APP_DATA_TYPES","NEUTRAL_400","DataBaseIcon","fill","size","jsx","AutomationIcon","LabelValueDataTypeIcon","dataType","tooltip","className","dataTypeOption","APP_DATA_TYPES_OPTIONS","option","isHover","setIsHover","useState","isDark","color","backgroundColor","BG_COLORS_DARK","BG_COLORS","sx","Tooltip","cn","Rule","FormatListBulleted","CalendarMonth","MailOutline","AttachMoney","Schedule","SubjectOutlined","LocalOfferOutlined","Numbers"],"mappings":"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"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Accent color of each data type — the hover color of the icon
|
|
3
|
+
*/
|
|
4
|
+
export declare const DATA_TYPE_ICON_COLORS: Record<string, string>;
|
|
5
|
+
export interface LabelValueDataTypeIconProps {
|
|
6
|
+
/** One of `APP_DATA_TYPES` */
|
|
7
|
+
dataType: string;
|
|
8
|
+
/** Overrides the default tooltip (the data type label) */
|
|
9
|
+
tooltip?: React.ReactNode;
|
|
10
|
+
/** Icon size in px (default: 16) */
|
|
11
|
+
size?: number;
|
|
12
|
+
/** Additional CSS classes on the icon wrapper */
|
|
13
|
+
className?: string;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Data type icon used to emphasize the data type of a `LabelValue` field.
|
|
17
|
+
*
|
|
18
|
+
* Unlike `DataTypeIcon` — which always renders a colored icon on a colored
|
|
19
|
+
* square, as used in table headers — this one is quiet at rest: the icon sits
|
|
20
|
+
* at Neutral/400 on a transparent background, and only on hover does it take
|
|
21
|
+
* the data type accent color over a round, light tint of that same color.
|
|
22
|
+
* A tooltip names the data type.
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* ```tsx
|
|
26
|
+
* <LabelValueDataTypeIcon dataType={APP_DATA_TYPES.CURRENCY} />
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export declare const LabelValueDataTypeIcon: ({ dataType, tooltip, size, className, }: LabelValueDataTypeIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import m from "../../../_virtual/index.es.js";
|
|
3
|
+
import { useState as D } from "react";
|
|
4
|
+
import f from "../../tooltip/Tooltip.es.js";
|
|
5
|
+
import { Numbers as O, LocalOfferOutlined as d, SubjectOutlined as L, Schedule as h, AttachMoney as M, MailOutline as p, CalendarMonth as B, FormatListBulleted as I, Rule as R } from "@mui/icons-material";
|
|
6
|
+
import { APP_DATA_TYPES_OPTIONS as N, BG_COLORS_DARK as S, BG_COLORS as _, APP_DATA_TYPES as t } from "./DataTypeIcon.es.js";
|
|
7
|
+
const w = {
|
|
8
|
+
[t.BOOLEAN]: "#12B76A",
|
|
9
|
+
[t.CHOICE]: "#DF5384",
|
|
10
|
+
[t.DATE]: "#292E92",
|
|
11
|
+
[t.EMAIL]: "#139AFA",
|
|
12
|
+
[t.CURRENCY]: "#F99417",
|
|
13
|
+
[t.DATETIME]: "#6E9D6D",
|
|
14
|
+
[t.TEXT]: "#58B507",
|
|
15
|
+
[t.STRING]: "#58B507",
|
|
16
|
+
[t.TAG]: "#B31121",
|
|
17
|
+
[t.MASTER_DATA]: "#CCAE00",
|
|
18
|
+
[t.DYNAMIC]: "#DB00CD",
|
|
19
|
+
[t.NUMBER]: "#00E4D1"
|
|
20
|
+
}, c = "#98A2B3", v = ({ fill: n = c, size: o = 16 }) => /* @__PURE__ */ e("svg", { xmlns: "http://www.w3.org/2000/svg", width: o, height: o, viewBox: "0 0 21 20", fill: "none", children: /* @__PURE__ */ e(
|
|
21
|
+
"path",
|
|
22
|
+
{
|
|
23
|
+
d: "M10.666 17.5C8.56879 17.5 6.79449 17.1771 5.3431 16.5312C3.89171 15.8854 3.16602 15.0972 3.16602 14.1667V5.83333C3.16602 4.91667 3.89865 4.13194 5.36393 3.47917C6.82921 2.82639 8.59657 2.5 10.666 2.5C12.7355 2.5 14.5028 2.82639 15.9681 3.47917C17.4334 4.13194 18.166 4.91667 18.166 5.83333V14.1667C18.166 15.0972 17.4403 15.8854 15.9889 16.5312C14.5375 17.1771 12.7632 17.5 10.666 17.5Z",
|
|
24
|
+
fill: n
|
|
25
|
+
}
|
|
26
|
+
) }), g = ({ fill: n = c, size: o = 16 }) => /* @__PURE__ */ e("svg", { width: o, height: o, viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
|
|
27
|
+
"path",
|
|
28
|
+
{
|
|
29
|
+
d: "M3.70019 8.625C3.35019 8.91667 2.98561 9.05 2.60644 9.025C2.22727 9 1.89602 8.87083 1.61269 8.6375C1.32935 8.40417 1.1356 8.09792 1.03144 7.71875C0.927272 7.33958 0.996022 6.95 1.23769 6.55L2.17519 5C1.96685 4.81667 1.80227 4.59583 1.68144 4.3375C1.5606 4.07917 1.50019 3.8 1.50019 3.5C1.50019 2.95 1.69602 2.47917 2.08769 2.0875C2.47936 1.69583 2.95019 1.5 3.50019 1.5C4.05019 1.5 4.52102 1.69583 4.91269 2.0875C5.30436 2.47917 5.50019 2.95 5.50019 3.5C5.50019 4.05 5.30436 4.52083 4.91269 4.9125C4.52102 5.30417 4.05019 5.5 3.50019 5.5C3.42519 5.5 3.35019 5.49583 3.27519 5.4875C3.20019 5.47917 3.12935 5.46667 3.06269 5.45L2.10019 7.075C2.00852 7.225 1.97936 7.37292 2.01269 7.51875C2.04602 7.66458 2.11686 7.78333 2.22519 7.875C2.33352 7.96667 2.46269 8.01875 2.61269 8.03125C2.76269 8.04375 2.90852 7.99167 3.05019 7.875L8.30019 3.3625C8.65019 3.07083 9.01686 2.93958 9.40019 2.96875C9.78352 2.99792 10.1169 3.12917 10.4002 3.3625C10.6835 3.59583 10.8752 3.90208 10.9752 4.28125C11.0752 4.66042 11.0044 5.05 10.7627 5.45L9.82519 7C10.0335 7.18333 10.1981 7.40417 10.3189 7.6625C10.4398 7.92083 10.5002 8.2 10.5002 8.5C10.5002 9.05 10.3044 9.52083 9.91269 9.9125C9.52102 10.3042 9.05019 10.5 8.50019 10.5C7.95019 10.5 7.47936 10.3042 7.08769 9.9125C6.69602 9.52083 6.50019 9.05 6.50019 8.5C6.50019 7.95 6.69602 7.47917 7.08769 7.0875C7.47936 6.69583 7.95019 6.5 8.50019 6.5C8.57519 6.5 8.64811 6.50417 8.71894 6.5125C8.78977 6.52083 8.85852 6.53333 8.92519 6.55L9.90019 4.925C9.99186 4.775 10.021 4.62708 9.98769 4.48125C9.95436 4.33542 9.88352 4.21667 9.77519 4.125C9.66686 4.03333 9.53769 3.98125 9.38769 3.96875C9.23769 3.95625 9.09186 4.00833 8.95019 4.125L3.70019 8.625Z",
|
|
30
|
+
fill: n
|
|
31
|
+
}
|
|
32
|
+
) }), F = ({
|
|
33
|
+
dataType: n = "text",
|
|
34
|
+
tooltip: o,
|
|
35
|
+
size: C = 16,
|
|
36
|
+
className: i
|
|
37
|
+
}) => {
|
|
38
|
+
const u = N.find((T) => T.value === n), [l, a] = D(!1), A = document.documentElement.classList.contains("dark"), s = l ? w[n] : c, E = l ? A ? S[n] : _[n] : "transparent", r = { fontSize: C, color: s, transition: "color 150ms ease" };
|
|
39
|
+
return /* @__PURE__ */ e(f, { title: o || u?.label, placement: "top", children: /* @__PURE__ */ e(
|
|
40
|
+
"span",
|
|
41
|
+
{
|
|
42
|
+
className: m("flex items-center justify-center p-0.5 rounded-full transition-colors duration-150", i),
|
|
43
|
+
style: { backgroundColor: E },
|
|
44
|
+
onMouseEnter: () => a(!0),
|
|
45
|
+
onMouseLeave: () => a(!1),
|
|
46
|
+
children: (() => {
|
|
47
|
+
switch (n) {
|
|
48
|
+
case t.BOOLEAN:
|
|
49
|
+
return /* @__PURE__ */ e(R, { sx: r });
|
|
50
|
+
case t.CHOICE:
|
|
51
|
+
return /* @__PURE__ */ e(I, { sx: r });
|
|
52
|
+
case t.DATE:
|
|
53
|
+
return /* @__PURE__ */ e(B, { sx: r });
|
|
54
|
+
case t.EMAIL:
|
|
55
|
+
return /* @__PURE__ */ e(p, { sx: r });
|
|
56
|
+
case t.CURRENCY:
|
|
57
|
+
return /* @__PURE__ */ e(M, { sx: r });
|
|
58
|
+
case t.DATETIME:
|
|
59
|
+
return /* @__PURE__ */ e(h, { sx: r });
|
|
60
|
+
case t.TEXT:
|
|
61
|
+
case t.STRING:
|
|
62
|
+
return /* @__PURE__ */ e(L, { sx: r });
|
|
63
|
+
case t.TAG:
|
|
64
|
+
return /* @__PURE__ */ e(d, { sx: r });
|
|
65
|
+
case t.MASTER_DATA:
|
|
66
|
+
return /* @__PURE__ */ e(v, { size: C, fill: s });
|
|
67
|
+
case t.DYNAMIC:
|
|
68
|
+
return /* @__PURE__ */ e(g, { size: C, fill: s });
|
|
69
|
+
case t.NUMBER:
|
|
70
|
+
return /* @__PURE__ */ e(O, { sx: r });
|
|
71
|
+
default:
|
|
72
|
+
return null;
|
|
73
|
+
}
|
|
74
|
+
})()
|
|
75
|
+
}
|
|
76
|
+
) });
|
|
77
|
+
};
|
|
78
|
+
export {
|
|
79
|
+
w as DATA_TYPE_ICON_COLORS,
|
|
80
|
+
F as LabelValueDataTypeIcon
|
|
81
|
+
};
|
|
82
|
+
//# sourceMappingURL=LabelValueDataTypeIcon.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LabelValueDataTypeIcon.es.js","sources":["../../../../src/components/data-display/datatype-icon/LabelValueDataTypeIcon.tsx"],"sourcesContent":["import cn from 'classnames';\nimport { useState } from 'react';\nimport Tooltip from '../../tooltip/Tooltip';\nimport {\n AttachMoney,\n CalendarMonth,\n FormatListBulleted,\n LocalOfferOutlined,\n MailOutline,\n Numbers,\n Rule,\n Schedule,\n SubjectOutlined,\n} from '@mui/icons-material';\nimport { APP_DATA_TYPES, APP_DATA_TYPES_OPTIONS, BG_COLORS, BG_COLORS_DARK } from './DataTypeIcon';\n\n/**\n * Accent color of each data type — the hover color of the icon\n */\nexport const DATA_TYPE_ICON_COLORS: Record<string, string> = {\n [APP_DATA_TYPES.BOOLEAN]: '#12B76A',\n [APP_DATA_TYPES.CHOICE]: '#DF5384',\n [APP_DATA_TYPES.DATE]: '#292E92',\n [APP_DATA_TYPES.EMAIL]: '#139AFA',\n [APP_DATA_TYPES.CURRENCY]: '#F99417',\n [APP_DATA_TYPES.DATETIME]: '#6E9D6D',\n [APP_DATA_TYPES.TEXT]: '#58B507',\n [APP_DATA_TYPES.STRING]: '#58B507',\n [APP_DATA_TYPES.TAG]: '#B31121',\n [APP_DATA_TYPES.MASTER_DATA]: '#CCAE00',\n [APP_DATA_TYPES.DYNAMIC]: '#DB00CD',\n [APP_DATA_TYPES.NUMBER]: '#00E4D1',\n};\n\n/** Neutral/400 — resting color of the icon */\nconst NEUTRAL_400 = '#98A2B3';\n\nconst DataBaseIcon = ({ fill = NEUTRAL_400, size = 16 }) => (\n <svg xmlns='http://www.w3.org/2000/svg' width={size} height={size} viewBox='0 0 21 20' fill='none'>\n <path\n d='M10.666 17.5C8.56879 17.5 6.79449 17.1771 5.3431 16.5312C3.89171 15.8854 3.16602 15.0972 3.16602 14.1667V5.83333C3.16602 4.91667 3.89865 4.13194 5.36393 3.47917C6.82921 2.82639 8.59657 2.5 10.666 2.5C12.7355 2.5 14.5028 2.82639 15.9681 3.47917C17.4334 4.13194 18.166 4.91667 18.166 5.83333V14.1667C18.166 15.0972 17.4403 15.8854 15.9889 16.5312C14.5375 17.1771 12.7632 17.5 10.666 17.5Z'\n fill={fill}\n />\n </svg>\n);\n\nconst AutomationIcon = ({ fill = NEUTRAL_400, size = 16 }) => (\n <svg width={size} height={size} viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'>\n <path\n d='M3.70019 8.625C3.35019 8.91667 2.98561 9.05 2.60644 9.025C2.22727 9 1.89602 8.87083 1.61269 8.6375C1.32935 8.40417 1.1356 8.09792 1.03144 7.71875C0.927272 7.33958 0.996022 6.95 1.23769 6.55L2.17519 5C1.96685 4.81667 1.80227 4.59583 1.68144 4.3375C1.5606 4.07917 1.50019 3.8 1.50019 3.5C1.50019 2.95 1.69602 2.47917 2.08769 2.0875C2.47936 1.69583 2.95019 1.5 3.50019 1.5C4.05019 1.5 4.52102 1.69583 4.91269 2.0875C5.30436 2.47917 5.50019 2.95 5.50019 3.5C5.50019 4.05 5.30436 4.52083 4.91269 4.9125C4.52102 5.30417 4.05019 5.5 3.50019 5.5C3.42519 5.5 3.35019 5.49583 3.27519 5.4875C3.20019 5.47917 3.12935 5.46667 3.06269 5.45L2.10019 7.075C2.00852 7.225 1.97936 7.37292 2.01269 7.51875C2.04602 7.66458 2.11686 7.78333 2.22519 7.875C2.33352 7.96667 2.46269 8.01875 2.61269 8.03125C2.76269 8.04375 2.90852 7.99167 3.05019 7.875L8.30019 3.3625C8.65019 3.07083 9.01686 2.93958 9.40019 2.96875C9.78352 2.99792 10.1169 3.12917 10.4002 3.3625C10.6835 3.59583 10.8752 3.90208 10.9752 4.28125C11.0752 4.66042 11.0044 5.05 10.7627 5.45L9.82519 7C10.0335 7.18333 10.1981 7.40417 10.3189 7.6625C10.4398 7.92083 10.5002 8.2 10.5002 8.5C10.5002 9.05 10.3044 9.52083 9.91269 9.9125C9.52102 10.3042 9.05019 10.5 8.50019 10.5C7.95019 10.5 7.47936 10.3042 7.08769 9.9125C6.69602 9.52083 6.50019 9.05 6.50019 8.5C6.50019 7.95 6.69602 7.47917 7.08769 7.0875C7.47936 6.69583 7.95019 6.5 8.50019 6.5C8.57519 6.5 8.64811 6.50417 8.71894 6.5125C8.78977 6.52083 8.85852 6.53333 8.92519 6.55L9.90019 4.925C9.99186 4.775 10.021 4.62708 9.98769 4.48125C9.95436 4.33542 9.88352 4.21667 9.77519 4.125C9.66686 4.03333 9.53769 3.98125 9.38769 3.96875C9.23769 3.95625 9.09186 4.00833 8.95019 4.125L3.70019 8.625Z'\n fill={fill}\n />\n </svg>\n);\n\nexport interface LabelValueDataTypeIconProps {\n /** One of `APP_DATA_TYPES` */\n dataType: string;\n /** Overrides the default tooltip (the data type label) */\n tooltip?: React.ReactNode;\n /** Icon size in px (default: 16) */\n size?: number;\n /** Additional CSS classes on the icon wrapper */\n className?: string;\n}\n\n/**\n * Data type icon used to emphasize the data type of a `LabelValue` field.\n *\n * Unlike `DataTypeIcon` — which always renders a colored icon on a colored\n * square, as used in table headers — this one is quiet at rest: the icon sits\n * at Neutral/400 on a transparent background, and only on hover does it take\n * the data type accent color over a round, light tint of that same color.\n * A tooltip names the data type.\n *\n * @example\n * ```tsx\n * <LabelValueDataTypeIcon dataType={APP_DATA_TYPES.CURRENCY} />\n * ```\n */\nexport const LabelValueDataTypeIcon = ({\n dataType = 'text',\n tooltip,\n size = 16,\n className,\n}: LabelValueDataTypeIconProps) => {\n const dataTypeOption = APP_DATA_TYPES_OPTIONS.find((option) => option.value === dataType);\n const [isHover, setIsHover] = useState(false);\n const isDark = document.documentElement.classList.contains('dark');\n\n const color = isHover ? DATA_TYPE_ICON_COLORS[dataType] : NEUTRAL_400;\n const backgroundColor = isHover ? (isDark ? BG_COLORS_DARK[dataType] : BG_COLORS[dataType]) : 'transparent';\n const sx = { fontSize: size, color, transition: 'color 150ms ease' };\n\n return (\n <Tooltip title={tooltip || dataTypeOption?.label} placement='top'>\n <span\n className={cn('flex items-center justify-center p-0.5 rounded-full transition-colors duration-150', className)}\n style={{ backgroundColor }}\n onMouseEnter={() => setIsHover(true)}\n onMouseLeave={() => setIsHover(false)}\n >\n {(() => {\n switch (dataType) {\n case APP_DATA_TYPES.BOOLEAN:\n return <Rule sx={sx} />;\n case APP_DATA_TYPES.CHOICE:\n return <FormatListBulleted sx={sx} />;\n case APP_DATA_TYPES.DATE:\n return <CalendarMonth sx={sx} />;\n case APP_DATA_TYPES.EMAIL:\n return <MailOutline sx={sx} />;\n case APP_DATA_TYPES.CURRENCY:\n return <AttachMoney sx={sx} />;\n case APP_DATA_TYPES.DATETIME:\n return <Schedule sx={sx} />;\n case APP_DATA_TYPES.TEXT:\n case APP_DATA_TYPES.STRING:\n return <SubjectOutlined sx={sx} />;\n case APP_DATA_TYPES.TAG:\n return <LocalOfferOutlined sx={sx} />;\n case APP_DATA_TYPES.MASTER_DATA:\n return <DataBaseIcon size={size} fill={color} />;\n case APP_DATA_TYPES.DYNAMIC:\n return <AutomationIcon size={size} fill={color} />;\n case APP_DATA_TYPES.NUMBER:\n return <Numbers sx={sx} />;\n default:\n return null;\n }\n })()}\n </span>\n </Tooltip>\n );\n};\n"],"names":["DATA_TYPE_ICON_COLORS","APP_DATA_TYPES","NEUTRAL_400","DataBaseIcon","fill","size","jsx","AutomationIcon","LabelValueDataTypeIcon","dataType","tooltip","className","dataTypeOption","APP_DATA_TYPES_OPTIONS","option","isHover","setIsHover","useState","isDark","color","backgroundColor","BG_COLORS_DARK","BG_COLORS","sx","Tooltip","cn","Rule","FormatListBulleted","CalendarMonth","MailOutline","AttachMoney","Schedule","SubjectOutlined","LocalOfferOutlined","Numbers"],"mappings":"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"}
|
|
@@ -1,2 +1,4 @@
|
|
|
1
1
|
export { DataTypeIcon } from './DataTypeIcon';
|
|
2
2
|
export { APP_DATA_TYPES, APP_DATA_TYPES_OPTIONS, BG_COLORS, BG_COLORS_HOVER, BG_COLORS_DARK, BG_COLORS_DARK_HOVER, } from './DataTypeIcon';
|
|
3
|
+
export { LabelValueDataTypeIcon, DATA_TYPE_ICON_COLORS } from './LabelValueDataTypeIcon';
|
|
4
|
+
export type { LabelValueDataTypeIconProps } from './LabelValueDataTypeIcon';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),p=require("../../../_virtual/index.cjs.js"),Se=require("../../icons/HelpIcon.cjs.js"),Ne=require("../../icons/SearchIcon.cjs.js"),L=require("../typography/Typography.cjs.js"),i=require("../../../utils/formatters.cjs.js"),ke=require("../../forms/currency-input/currency.constant.cjs.js"),Le=require("../label/Label.cjs.js"),Ie=require("framer-motion"),j=require("@mui/icons-material"),C=require("../../tooltip/Tooltip.cjs.js"),Te=require("../../icons/AIExtractedIndicator.cjs.js"),qe=require("../../icons/AIStarIcon.cjs.js"),S=require("../../../utils/confidenceScoreUtils.cjs.js"),F=require("dayjs"),K=require("../../icon/icons.generated.cjs.js"),P=u.forwardRef(({id:Y,label:l,value:r,className:G,type:s="string",tags:J,tooltip:I,items:n,isModified:Q=!1,isChanged:W=!1,size:X="medium",isHighlighted:v=!1,deletedValue:a,highlightColor:V="warning",isSearchActive:ee=!1,originalValue:T=!1,showDiff:q=!1,isLiveField:re=!1,isAiExtracted:te=!1,confidenceScore:se,confidenceType:g="high",confidenceTooltip:oe,sourceMeta:ae=[],onConfidenceScoreClick:ne,deltaChange:m,theme:ze="light",onUpload:z,acceptsUpload:ie=!1,MasterDataModal:$,riskDetails:f,isRiskAnalysisOpen:M=!1,RiskDetailsCard:_,"aria-label":ce,decodeEntities:le=!0,onAiExtractedIndicatorClick:de,copyOnHover:ue=!1,urlAlias:D,allowTimezoneConversion:pe=!1},me)=>{const[c,fe]=u.useState(!0),[xe,E]=u.useState(!1),[he,R]=u.useState(null),[H,N]=u.useState(!1),[w,A]=u.useState(!1),y=u.useRef(null);u.useEffect(()=>()=>{y.current&&clearTimeout(y.current)},[]);const d=t=>le?i.decodeHTMLEntities(t):t,x=100,O=()=>{fe(!c)},k=()=>e.jsx("button",{id:`btn-label-value-${c?"Show more":"Show less"}`,className:"text-primary-400 text-sm hover:text-primary-500 cursor-pointer whitespace-nowrap",onClick:O,onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),O())},"aria-label":c?"Show more content":"Show less content",type:"button",children:c?"Show more":"Show less"}),Z=t=>{if(D)return e.jsxs("a",{href:t,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-1 font-semibold text-neutral-900 dark:text-white hover:text-primary-600 dark:hover:text-primary-400 transition-colors",children:[D,e.jsx(j.OpenInNew,{sx:{fontSize:16},className:"text-primary-600 dark:text-primary-400"})]});const o=d(t);return o.length<=x?e.jsx("a",{href:t,className:"text-primary-600 truncate",children:o}):e.jsxs("p",{children:[e.jsx("a",{href:t,className:"text-primary-600 break-all",children:o.slice(0,c?x:o.length)}),c?"... ":" ",k()]})},B=t=>{E(!0),R({...t,value:r})},ye=()=>{E(!1),R(null)},ge=()=>{const t=r==null||typeof r=="object"?"":String(r);t&&navigator.clipboard?.writeText(t).then(()=>{A(!0),y.current&&clearTimeout(y.current),y.current=setTimeout(()=>A(!1),1500)}).catch(()=>{})},we=t=>{const o=t.target.files?.[0];o&&z&&z(o),t.target.value=""},b=()=>{const t=typeof r=="string"&&i.isISODateString(r);if(ee&&typeof r=="object")return r;if(r||s?.toLowerCase()==="boolean"&&r===0||s?.toLowerCase()==="currency"&&Number(r)>=0){if((r===!0||r==="True")&&!T&&s?.toLowerCase()!=="choice")return"Yes";if((r===!1||r==="False")&&!T&&s?.toLowerCase()!=="choice")return"No";if(s?.toLowerCase()==="url")return Z(r);if(s?.toLowerCase()==="boolean")return i.formatBooleanValue(r);if(s?.toLowerCase()==="currency"){const o=i.formatCurrency(r,n?.currency_code)||"-",h=n?.currency_code?ke.CURRENCIES.find(Ce=>Ce.value===n.currency_code)?.label:void 0,je=h?`${n.currency_code} — ${h}`:n?.currency_code??"";return h?e.jsx(C,{title:je,placement:"top",children:e.jsx("span",{children:o})}):o}else if(s?.toLowerCase()==="datetime"){const o=typeof r=="string"&&r.includes("Z")?r.replace(/\.000Z$/,"Z"):r;return i.formatDate(o,{skipTimezone:!pe,withTime:!0})}else if(s?.toLowerCase()==="date"||t){let o=r;if(typeof r=="string"&&r.includes("Z"))o=r.replace(/\.000Z$/,"Z");else if(typeof r=="string"&&!r.includes("Z")){const h=F(r);o=F(h).isValid()?h.toString():r}return i.formatDate(o,{skipTimezone:!0,withTime:!1})}else{if(s?.toLowerCase()==="percentage")return`${r}%`;if(typeof r=="string"&&r.length>x){const o=d(r);return e.jsxs("p",{children:[o.slice(0,c?x:o.length),c?"... ":" ",k()]})}else return typeof r=="string"?d(r):r}}return"-"},U=()=>{switch(X){case"small":return"extra-small";case"large":return"large";default:return"small"}},be=()=>{switch(V){case"success":return"bg-success-100";case"warning":return"bg-warning-100";case"error":return"bg-error-100";case"info":return"bg-info-100";default:return"bg-warning-100"}};return e.jsxs("div",{id:Y||"",ref:me,className:p("font-medium relative",G),onMouseEnter:()=>N(!0),onMouseLeave:()=>N(!1),"aria-label":ce||`Label: ${l}, Value: ${r}`,children:[e.jsxs(L.Typography,{variant:"medium",size:U(),className:"flex gap-1 items-center flex-wrap",appearance:"subtitle",children:[typeof l=="string"?d(l):l," ",e.jsx(Le.Label,{labels:J?.map(t=>({...t,color:t.color||"primary"}))}),re&&e.jsx(j.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),te&&(S.shouldShowConfidenceScore(se)&&g?e.jsx(C,{placement:"top",title:oe||"",className:"cursor-pointer",children:e.jsx("div",{className:p("cursor-pointer w-3 h-3 flex items-center justify-center rounded-full",S.getConfidenceScoreBadgeHoverClass(g)),onClick:()=>ne?.(ae),children:e.jsx(qe.AIStarIcon,{size:12,fill:S.getConfidenceScoreBadgeColor(g),fillSecondary:S.getConfidenceScoreBadgeFill(g)})})}):e.jsx(Te.AIExtractedIndicator,{onClick:()=>de?.(b())})),I&&e.jsx(C,{placement:"top",title:I,whiteSpace:"pre-wrap",children:e.jsx("div",{className:"cursor-pointer",role:"button",tabIndex:0,onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&t.preventDefault()},children:e.jsx(Se.HelpIcon,{size:14})})}),ue&&H&&e.jsx(C,{title:w?"Copied":`Copy ${l??"value"}`,placement:"top",whiteSpace:"pre-wrap",children:e.jsx("button",{type:"button",onClick:ge,"aria-label":w?`Copied ${l??"value"}`:`Copy ${l??"value"}`,className:"p-1 flex items-center justify-center rounded text-neutral-500 hover:!text-primary-600 hover:bg-neutral-100 dark:text-primary-400 dark:hover:!text-primary-600 dark:hover:bg-neutral-800 cursor-pointer",children:e.jsxs("span",{className:"relative inline-flex h-4 w-4 items-center justify-center",children:[e.jsx(K.ContentCopyIcon,{size:16,className:p("absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out",w?"opacity-0 scale-50 rotate-[-90deg]":"opacity-100 scale-100 rotate-0")}),e.jsx(K.CheckFilledIcon,{size:16,className:p("absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out",w?"opacity-100 scale-100 rotate-0":"opacity-0 scale-50 rotate-90")})]})})})]}),e.jsxs(L.Typography,{variant:"medium",size:U(),className:p("text-- whitespace-normal break-all flex gap-1 pt-0.5",Q&&"bg-neutral-50 dark:bg-black-700 p-1 rounded",M&&f?.color&&`bg-${f.color}-50 border-${f.color}-300 px-0.5 rounded-lg`),appearance:"body",children:[q&&a&&r?e.jsxs("div",{className:"flex gap-2",children:[e.jsx("span",{className:"line-through",children:d(a)}),e.jsx("span",{children:b()})]}):W||v?e.jsx("mark",{className:p("rounded-md py-0.5 px-1",be()),children:b()}):b(),s?.toLowerCase()==="currency"&&m!==0&&m!==void 0&&m!==null&&e.jsxs(Ie.motion.span,{initial:{opacity:0,y:2},animate:{opacity:1,y:0},transition:{duration:.25},className:p("inline-flex items-center gap-1 ml-1.5 text-xs font-medium",m>0?"text-emerald-600 dark:text-emerald-400":"text-red-600 dark:text-red-400"),children:[e.jsx("span",{className:"flex items-center justify-center w-4 h-4",children:m>0?e.jsx(j.ArrowUpwardRounded,{sx:{fontSize:16},className:"text-emerald-600 dark:text-emerald-400"}):e.jsx(j.ArrowDownwardRounded,{sx:{fontSize:16},className:"text-red-600 dark:text-red-400"})}),e.jsx("span",{children:i.formatCurrency(Math.abs(m),n?.currency_code||"USD")})]}),n?.is_master_data&&n?.reference&&r&&e.jsx("button",{onClick:()=>B(n),onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),B(n))},"aria-label":`Search master data for ${l}`,type:"button",className:"cursor-pointer",children:e.jsx(Ne.SearchIcon,{width:20,height:20})}),ie&&e.jsx("input",{type:"file",onChange:we,className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer","aria-label":`Upload file for ${l}`})]}),a&&!q&&e.jsx(L.Typography,{variant:"medium",size:"extra-small",className:"pt-0.5",appearance:"body",children:e.jsx("mark",{className:"rounded-md py-0.5 px-1 bg-error-100",children:e.jsx("del",{children:a||s?.toLowerCase()==="boolean"&&a==="0"?a==="True"&&s?.toLowerCase()!=="choice"?"Yes":a==="False"&&s?.toLowerCase()!=="choice"?"No":s?.toLowerCase()==="boolean"?i.formatBooleanValue(a):s?.toLowerCase()==="currency"?i.formatCurrency(a,n?.currency_code):s?.toLowerCase()==="date"?i.formatDate(a,{skipTimezone:!0,withTime:!1}):s?.toLowerCase()==="datetime"?i.formatDate(a,{skipTimezone:!0,withTime:!0}):s?.toLowerCase()==="percentage"?`${a}%`:s?.toLowerCase()==="url"?Z(a):a.length>x?e.jsxs("p",{children:[d(a).slice(0,c?x:d(a).length),c?"... ":" ",k()]}):d(a):"-"})})}),$&&e.jsx($,{isVisible:xe,onClose:ye,masterdataInfo:he}),H&&f&&M&&e.jsx("div",{className:"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl",onClick:t=>t.stopPropagation(),onMouseDown:t=>t.preventDefault(),onKeyDown:t=>{t.key==="Escape"&&N(!1)},role:"tooltip","aria-label":"Risk analysis details",tabIndex:0,children:_?e.jsx(_,{riskDetails:f}):e.jsx("div",{className:"shadow-lg p-4",children:e.jsxs("div",{className:"text-sm",children:[e.jsx("h4",{className:"font-semibold mb-2",children:"Risk Details"}),e.jsx("p",{className:"text-neutral-600 dark:text-neutral-300",children:f.description||"Risk analysis information"})]})})})]})});P.displayName="LabelValue";exports.LabelValue=P;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("react"),m=require("../../../_virtual/index.cjs.js"),Ae=require("../../icons/HelpIcon.cjs.js"),Le=require("../../icons/SearchIcon.cjs.js"),L=require("../typography/Typography.cjs.js"),c=require("../../../utils/formatters.cjs.js"),_e=require("../../forms/currency-input/currency.constant.cjs.js"),Pe=require("../label/Label.cjs.js"),Ee=require("framer-motion"),j=require("@mui/icons-material"),C=require("../../tooltip/Tooltip.cjs.js"),De=require("../../icons/AIExtractedIndicator.cjs.js"),qe=require("../../icons/AIStarIcon.cjs.js"),u=require("../datatype-icon/DataTypeIcon.cjs.js"),Me=require("../datatype-icon/LabelValueDataTypeIcon.cjs.js"),S=require("../../../utils/confidenceScoreUtils.cjs.js"),G=require("dayjs"),J=require("../../icon/icons.generated.cjs.js"),Re={string:{dataType:u.APP_DATA_TYPES.STRING},number:{dataType:u.APP_DATA_TYPES.NUMBER},boolean:{dataType:u.APP_DATA_TYPES.BOOLEAN},currency:{dataType:u.APP_DATA_TYPES.CURRENCY},date:{dataType:u.APP_DATA_TYPES.DATE},datetime:{dataType:u.APP_DATA_TYPES.DATETIME},percentage:{dataType:u.APP_DATA_TYPES.NUMBER,label:"Percentage"},url:{dataType:u.APP_DATA_TYPES.STRING,label:"URL"}},Q=p.forwardRef(({id:V,label:l,value:r,className:W,type:a="string",tags:X,tooltip:_,items:n,isModified:v=!1,isChanged:ee=!1,size:N="medium",isHighlighted:re=!1,deletedValue:s,highlightColor:te="warning",isSearchActive:ae=!1,originalValue:P=!1,showDiff:E=!1,isLiveField:oe=!1,isAiExtracted:se=!1,confidenceScore:ne,confidenceType:b="high",confidenceTooltip:ce,sourceMeta:ie=[],onConfidenceScoreClick:le,deltaChange:f,theme:ze="light",onUpload:D,acceptsUpload:de=!1,MasterDataModal:q,riskDetails:x,isRiskAnalysisOpen:M=!1,RiskDetailsCard:R,"aria-label":pe,decodeEntities:ue=!0,onAiExtractedIndicatorClick:me,copyOnHover:fe=!1,urlAlias:z,showTypeIcon:xe=!1,dataType:$,allowTimezoneConversion:he=!1},ye)=>{const[i,ge]=p.useState(!0),[be,Y]=p.useState(!1),[we,O]=p.useState(null),[U,k]=p.useState(!1),[w,B]=p.useState(!1),g=p.useRef(null);p.useEffect(()=>()=>{g.current&&clearTimeout(g.current)},[]);const d=t=>ue?c.decodeHTMLEntities(t):t,h=100,I=$?{dataType:$}:Re[String(a).toLowerCase()],Te=N==="small"?14:N==="large"?18:16,H=()=>{ge(!i)},A=()=>e.jsx("button",{id:`btn-label-value-${i?"Show more":"Show less"}`,className:"text-primary-400 text-sm hover:text-primary-500 cursor-pointer whitespace-nowrap",onClick:H,onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),H())},"aria-label":i?"Show more content":"Show less content",type:"button",children:i?"Show more":"Show less"}),Z=t=>{if(z)return e.jsxs("a",{href:t,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-1 font-semibold text-neutral-900 dark:text-white hover:text-primary-600 dark:hover:text-primary-400 transition-colors",children:[z,e.jsx(j.OpenInNew,{sx:{fontSize:16},className:"text-primary-600 dark:text-primary-400"})]});const o=d(t);return o.length<=h?e.jsx("a",{href:t,className:"text-primary-600 truncate",children:o}):e.jsxs("p",{children:[e.jsx("a",{href:t,className:"text-primary-600 break-all",children:o.slice(0,i?h:o.length)}),i?"... ":" ",A()]})},F=t=>{Y(!0),O({...t,value:r})},je=()=>{Y(!1),O(null)},Ce=()=>{const t=r==null||typeof r=="object"?"":String(r);t&&navigator.clipboard?.writeText(t).then(()=>{B(!0),g.current&&clearTimeout(g.current),g.current=setTimeout(()=>B(!1),1500)}).catch(()=>{})},Se=t=>{const o=t.target.files?.[0];o&&D&&D(o),t.target.value=""},T=()=>{const t=typeof r=="string"&&c.isISODateString(r);if(ae&&typeof r=="object")return r;if(r||a?.toLowerCase()==="boolean"&&r===0||a?.toLowerCase()==="currency"&&Number(r)>=0){if((r===!0||r==="True")&&!P&&a?.toLowerCase()!=="choice")return"Yes";if((r===!1||r==="False")&&!P&&a?.toLowerCase()!=="choice")return"No";if(a?.toLowerCase()==="url")return Z(r);if(a?.toLowerCase()==="boolean")return c.formatBooleanValue(r);if(a?.toLowerCase()==="currency"){const o=c.formatCurrency(r,n?.currency_code)||"-",y=n?.currency_code?_e.CURRENCIES.find(Ie=>Ie.value===n.currency_code)?.label:void 0,ke=y?`${n.currency_code} — ${y}`:n?.currency_code??"";return y?e.jsx(C,{title:ke,placement:"top",children:e.jsx("span",{children:o})}):o}else if(a?.toLowerCase()==="datetime"){const o=typeof r=="string"&&r.includes("Z")?r.replace(/\.000Z$/,"Z"):r;return c.formatDate(o,{skipTimezone:!he,withTime:!0})}else if(a?.toLowerCase()==="date"||t){let o=r;if(typeof r=="string"&&r.includes("Z"))o=r.replace(/\.000Z$/,"Z");else if(typeof r=="string"&&!r.includes("Z")){const y=G(r);o=G(y).isValid()?y.toString():r}return c.formatDate(o,{skipTimezone:!0,withTime:!1})}else{if(a?.toLowerCase()==="percentage")return`${r}%`;if(typeof r=="string"&&r.length>h){const o=d(r);return e.jsxs("p",{children:[o.slice(0,i?h:o.length),i?"... ":" ",A()]})}else return typeof r=="string"?d(r):r}}return"-"},K=()=>{switch(N){case"small":return"extra-small";case"large":return"large";default:return"small"}},Ne=()=>{switch(te){case"success":return"bg-success-100";case"warning":return"bg-warning-100";case"error":return"bg-error-100";case"info":return"bg-info-100";default:return"bg-warning-100"}};return e.jsxs("div",{id:V||"",ref:ye,className:m("font-medium relative",W),onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),"aria-label":pe||`Label: ${l}, Value: ${r}`,children:[e.jsxs(L.Typography,{variant:"medium",size:K(),className:"flex gap-1 items-center flex-wrap",appearance:"subtitle",children:[xe&&I&&e.jsx(Me.LabelValueDataTypeIcon,{dataType:I.dataType,tooltip:I.label,size:Te}),typeof l=="string"?d(l):l," ",e.jsx(Pe.Label,{labels:X?.map(t=>({...t,color:t.color||"primary"}))}),oe&&e.jsx(j.BoltOutlined,{sx:{fontSize:16,color:"var(--color-primary-600)",rotate:"15deg"}}),se&&(S.shouldShowConfidenceScore(ne)&&b?e.jsx(C,{placement:"top",title:ce||"",className:"cursor-pointer",children:e.jsx("div",{className:m("cursor-pointer w-3 h-3 flex items-center justify-center rounded-full",S.getConfidenceScoreBadgeHoverClass(b)),onClick:()=>le?.(ie),children:e.jsx(qe.AIStarIcon,{size:12,fill:S.getConfidenceScoreBadgeColor(b),fillSecondary:S.getConfidenceScoreBadgeFill(b)})})}):e.jsx(De.AIExtractedIndicator,{onClick:()=>me?.(T())})),_&&e.jsx(C,{placement:"top",title:_,whiteSpace:"pre-wrap",children:e.jsx("div",{className:"cursor-pointer",role:"button",tabIndex:0,onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&t.preventDefault()},children:e.jsx(Ae.HelpIcon,{size:14})})}),fe&&U&&e.jsx(C,{title:w?"Copied":`Copy ${l??"value"}`,placement:"top",whiteSpace:"pre-wrap",children:e.jsx("button",{type:"button",onClick:Ce,"aria-label":w?`Copied ${l??"value"}`:`Copy ${l??"value"}`,className:"p-1 flex items-center justify-center rounded text-neutral-500 hover:!text-primary-600 hover:bg-neutral-100 dark:text-primary-400 dark:hover:!text-primary-600 dark:hover:bg-neutral-800 cursor-pointer",children:e.jsxs("span",{className:"relative inline-flex h-4 w-4 items-center justify-center",children:[e.jsx(J.ContentCopyIcon,{size:16,className:m("absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out",w?"opacity-0 scale-50 rotate-[-90deg]":"opacity-100 scale-100 rotate-0")}),e.jsx(J.CheckFilledIcon,{size:16,className:m("absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out",w?"opacity-100 scale-100 rotate-0":"opacity-0 scale-50 rotate-90")})]})})})]}),e.jsxs(L.Typography,{variant:"medium",size:K(),className:m("text-- whitespace-normal break-all flex gap-1 pt-0.5",v&&"bg-neutral-50 dark:bg-black-700 p-1 rounded",M&&x?.color&&`bg-${x.color}-50 border-${x.color}-300 px-0.5 rounded-lg`),appearance:"body",children:[E&&s&&r?e.jsxs("div",{className:"flex gap-2",children:[e.jsx("span",{className:"line-through",children:d(s)}),e.jsx("span",{children:T()})]}):ee||re?e.jsx("mark",{className:m("rounded-md py-0.5 px-1",Ne()),children:T()}):T(),a?.toLowerCase()==="currency"&&f!==0&&f!==void 0&&f!==null&&e.jsxs(Ee.motion.span,{initial:{opacity:0,y:2},animate:{opacity:1,y:0},transition:{duration:.25},className:m("inline-flex items-center gap-1 ml-1.5 text-xs font-medium",f>0?"text-emerald-600 dark:text-emerald-400":"text-red-600 dark:text-red-400"),children:[e.jsx("span",{className:"flex items-center justify-center w-4 h-4",children:f>0?e.jsx(j.ArrowUpwardRounded,{sx:{fontSize:16},className:"text-emerald-600 dark:text-emerald-400"}):e.jsx(j.ArrowDownwardRounded,{sx:{fontSize:16},className:"text-red-600 dark:text-red-400"})}),e.jsx("span",{children:c.formatCurrency(Math.abs(f),n?.currency_code||"USD")})]}),n?.is_master_data&&n?.reference&&r&&e.jsx("button",{onClick:()=>F(n),onKeyDown:t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),F(n))},"aria-label":`Search master data for ${l}`,type:"button",className:"cursor-pointer",children:e.jsx(Le.SearchIcon,{width:20,height:20})}),de&&e.jsx("input",{type:"file",onChange:Se,className:"absolute inset-0 w-full h-full opacity-0 cursor-pointer","aria-label":`Upload file for ${l}`})]}),s&&!E&&e.jsx(L.Typography,{variant:"medium",size:"extra-small",className:"pt-0.5",appearance:"body",children:e.jsx("mark",{className:"rounded-md py-0.5 px-1 bg-error-100",children:e.jsx("del",{children:s||a?.toLowerCase()==="boolean"&&s==="0"?s==="True"&&a?.toLowerCase()!=="choice"?"Yes":s==="False"&&a?.toLowerCase()!=="choice"?"No":a?.toLowerCase()==="boolean"?c.formatBooleanValue(s):a?.toLowerCase()==="currency"?c.formatCurrency(s,n?.currency_code):a?.toLowerCase()==="date"?c.formatDate(s,{skipTimezone:!0,withTime:!1}):a?.toLowerCase()==="datetime"?c.formatDate(s,{skipTimezone:!0,withTime:!0}):a?.toLowerCase()==="percentage"?`${s}%`:a?.toLowerCase()==="url"?Z(s):s.length>h?e.jsxs("p",{children:[d(s).slice(0,i?h:d(s).length),i?"... ":" ",A()]}):d(s):"-"})})}),q&&e.jsx(q,{isVisible:be,onClose:je,masterdataInfo:we}),U&&x&&M&&e.jsx("div",{className:"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl",onClick:t=>t.stopPropagation(),onMouseDown:t=>t.preventDefault(),onKeyDown:t=>{t.key==="Escape"&&k(!1)},role:"tooltip","aria-label":"Risk analysis details",tabIndex:0,children:R?e.jsx(R,{riskDetails:x}):e.jsx("div",{className:"shadow-lg p-4",children:e.jsxs("div",{className:"text-sm",children:[e.jsx("h4",{className:"font-semibold mb-2",children:"Risk Details"}),e.jsx("p",{className:"text-neutral-600 dark:text-neutral-300",children:x.description||"Risk analysis information"})]})})})]})});Q.displayName="LabelValue";exports.LabelValue=Q;
|
|
2
2
|
//# sourceMappingURL=LabelValue.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelValue.cjs.js","sources":["../../../../src/components/data-display/label-value/LabelValue.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef, type ReactNode } from 'react';\nimport cn from 'classnames';\nimport { HelpIcon } from '../../icons/HelpIcon';\nimport { SearchIcon } from '../../icons/SearchIcon';\nimport { Typography } from '../typography/Typography';\nimport { formatCurrency, formatDate, formatBooleanValue, isISODateString, decodeHTMLEntities } from '../../../utils/formatters';\nimport { CURRENCIES } from '../../forms/currency-input/currency.constant';\nimport { Label } from '../label/Label';\nimport { motion } from 'framer-motion';\nimport { ArrowUpwardRounded, ArrowDownwardRounded, BoltOutlined, OpenInNew } from '@mui/icons-material';\nimport Tooltip from '../../tooltip/Tooltip';\nimport { AIExtractedIndicator } from '../../icons/AIExtractedIndicator';\nimport { AIStarIcon } from '../../icons/AIStarIcon';\nimport { CheckFilledIcon, ContentCopyIcon } from '../../icon';\nimport { getConfidenceScoreBadgeColor, getConfidenceScoreBadgeFill, getConfidenceScoreBadgeHoverClass, shouldShowConfidenceScore } from '../../../utils/confidenceScoreUtils';\nimport dayjs from 'dayjs';\n\n/**\n * Source meta bounding box\n */\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\n/**\n * Source meta item\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 * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\n/**\n * Available label value size options\n */\nexport type LabelValueSize = 'small' | 'medium' | 'large';\n\n/**\n * Available highlight color options\n */\nexport type HighlightColor = 'success' | 'warning' | 'error' | 'info';\n\n/**\n * Theme mode for styling\n */\nexport type ThemeMode = 'light' | 'dark';\n\n/**\n * Upload handler function type\n */\nexport type UploadHandler = (file: File) => void | Promise<void>;\n\n/**\n * Master data item interface\n */\nexport interface MasterDataItem {\n is_master_data?: boolean;\n reference?: string;\n group_technical_name?: string;\n currency_code?: string;\n}\n\n/**\n * Risk details interface\n */\nexport interface RiskDetails {\n color?: string;\n description?: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n [key: string]: any;\n}\n\n/**\n * Master data modal component props\n */\nexport interface MasterDataModalProps {\n isVisible: boolean;\n onClose: () => void;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n masterdataInfo: any;\n}\n\n/**\n * Risk details card component props\n * Using generic to allow custom risk detail types from consumers\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport interface RiskDetailsCardProps<TRisk = any> {\n riskDetails: TRisk;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/**\n * Props for the LabelValue component\n */\nexport interface LabelValueProps {\n /** The id of the label value */\n id?: string;\n /** The label text to display */\n label?: string;\n /** The value to display */\n value?: string | number | boolean | ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Data type for formatting */\n type?: 'string' | 'number' | 'boolean' | 'currency' | 'date' | 'datetime' | 'percentage' | 'url';\n /** Tags to display with the label */\n tags?: Array<{ label: string; color?: string; value?: string }>;\n /** Tooltip text for the help icon */\n tooltip?: string;\n /** Master data item information */\n items?: MasterDataItem;\n /** Whether the value has been modified */\n isModified?: boolean;\n /** Whether the value has been changed */\n isChanged?: boolean;\n /** Size variant */\n size?: LabelValueSize;\n /** Whether the value is highlighted */\n isHighlighted?: boolean;\n /** Deleted value for diff display */\n deletedValue?: string;\n /** Highlight color for changes */\n highlightColor?: HighlightColor;\n /** Whether search is active */\n isSearchActive?: boolean;\n /** Whether to show original boolean value */\n originalValue?: boolean;\n /** Whether to show diff between old and new values */\n showDiff?: boolean;\n /** Whether this is a live field (shows bolt icon) */\n isLiveField?: boolean;\n /** Whether this is an AI extracted field (shows AI extracted icon) */\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 /** Delta change value for currency fields */\n deltaChange?: number;\n /** Theme mode */\n theme?: ThemeMode;\n /** Upload handler function */\n onUpload?: UploadHandler;\n /** Whether the component accepts file uploads */\n acceptsUpload?: boolean;\n /** Master data modal component */\n MasterDataModal?: React.ComponentType<MasterDataModalProps>;\n /** Risk analysis data - accepts any risk object extending RiskDetails */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n riskDetails?: RiskDetails | any;\n /** Whether risk analysis is open */\n isRiskAnalysisOpen?: boolean;\n /** Custom risk details card component - accepts components with custom risk types */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /** Custom aria-label for accessibility */\n 'aria-label'?: string;\n /** Whether to decode HTML character entities in string values (default: true) */\n decodeEntities?: boolean;\n /** Function to handle AI extracted indicator click */\n onAiExtractedIndicatorClick?: (value: string) => void;\n /** Whether to show a copy-to-clipboard icon in the top-right corner on hover */\n copyOnHover?: boolean;\n /** Display alias text for URL type — shown instead of the raw URL, with an external link icon */\n urlAlias?: string;\n /**\n * Whether a `datetime` value is an instant that should be converted to the viewer's timezone.\n * Field values are wall clock — what the user typed — so this is off by default; turn it on for\n * system timestamps (created_at, executed_on...).\n */\n allowTimezoneConversion?: boolean;\n}\n\n/**\n * LabelValue component displays a label-value pair with various formatting options\n *\n * @example\n * ```tsx\n * <LabelValue \n * label=\"Status\" \n * value=\"Active\" \n * type=\"string\" \n * size=\"medium\" \n * />\n * <LabelValue \n * label=\"Price\" \n * value={99.99} \n * type=\"currency\" \n * items={{ currency_code: 'USD' }}\n * />\n * <LabelValue \n * label=\"Upload File\" \n * acceptsUpload \n * onUpload={handleUpload}\n * />\n * ```\n */\nexport const LabelValue = forwardRef<HTMLDivElement, LabelValueProps>(\n (\n {\n id,\n label,\n value,\n className,\n type = 'string',\n tags,\n tooltip,\n items,\n isModified = false,\n isChanged = false,\n size = 'medium',\n isHighlighted = false,\n deletedValue,\n highlightColor = 'warning',\n isSearchActive = false,\n originalValue = false,\n showDiff = false,\n isLiveField = false,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n deltaChange,\n theme: _theme = 'light',\n onUpload,\n acceptsUpload = false,\n MasterDataModal,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n 'aria-label': ariaLabel,\n decodeEntities = true,\n onAiExtractedIndicatorClick,\n copyOnHover = false,\n urlAlias,\n allowTimezoneConversion = false,\n },\n ref\n ) => {\n const [collapseValue, setCollapseValue] = useState(true);\n const [isOpenMasterDataModal, setIsOpenMasterDataModal] = useState(false);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const [masterdataModalInfo, setMasterdataModalInfo] = useState<any>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isCopied, setIsCopied] = useState(false);\n const copyResetTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n return () => {\n if (copyResetTimer.current) clearTimeout(copyResetTimer.current);\n };\n }, []);\n\n // Theme is passed as prop but not used in current implementation\n\n /**\n * Conditionally decode HTML entities based on the decodeEntities prop\n */\n const decode = (text: string): string => decodeEntities ? decodeHTMLEntities(text) : text;\n\n const COLLAPSE_CHAR_LIMIT = 100;\n\n /**\n * Handle collapse toggle for long text\n */\n const handleCollapse = () => {\n setCollapseValue(!collapseValue);\n };\n\n /**\n * Show more / Show less toggle for long text and URLs\n */\n const renderCollapseToggle = () => (\n <button\n id={`btn-label-value-${collapseValue ? 'Show more' : 'Show less'}`}\n className=\"text-primary-400 text-sm hover:text-primary-500 cursor-pointer whitespace-nowrap\"\n onClick={handleCollapse}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleCollapse();\n }\n }}\n aria-label={collapseValue ? 'Show more content' : 'Show less content'}\n type=\"button\"\n >\n {collapseValue ? 'Show more' : 'Show less'}\n </button>\n );\n\n /**\n * Render a URL with optional collapse for long href/display text\n */\n const renderUrlValue = (href: string) => {\n if (urlAlias) {\n return (\n <a\n href={href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"inline-flex items-center gap-1 font-semibold text-neutral-900 dark:text-white hover:text-primary-600 dark:hover:text-primary-400 transition-colors\"\n >\n {urlAlias}\n <OpenInNew sx={{ fontSize: 16 }} className=\"text-primary-600 dark:text-primary-400\" />\n </a>\n );\n }\n const decoded = decode(href);\n if (decoded.length <= COLLAPSE_CHAR_LIMIT) {\n return (\n <a href={href} className=\"text-primary-600 truncate\">\n {decoded}\n </a>\n );\n }\n return (\n <p>\n <a href={href} className=\"text-primary-600 break-all\">\n {decoded.slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decoded.length)}\n </a>\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n );\n };\n\n /**\n * Handle master data click\n */\n const handleMasterDataClick = (item: MasterDataItem) => {\n setIsOpenMasterDataModal(true);\n setMasterdataModalInfo({ ...item, value });\n };\n\n /**\n * Handle master data modal close\n */\n const handleMasterDataClose = () => {\n setIsOpenMasterDataModal(false);\n setMasterdataModalInfo(null);\n };\n\n /**\n * Copy the current value to the clipboard\n */\n const handleCopyValue = () => {\n const textToCopy =\n value === null || value === undefined || typeof value === 'object'\n ? ''\n : String(value);\n if (!textToCopy) return;\n navigator.clipboard?.writeText(textToCopy)\n .then(() => {\n setIsCopied(true);\n if (copyResetTimer.current) clearTimeout(copyResetTimer.current);\n copyResetTimer.current = setTimeout(() => setIsCopied(false), 1500);\n })\n .catch(() => { });\n };\n\n /**\n * Handle file upload\n */\n const handleFileUpload = (event: React.ChangeEvent<HTMLInputElement>) => {\n const file = event.target.files?.[0];\n if (file && onUpload) {\n onUpload(file);\n }\n // Reset input value to allow same file selection\n event.target.value = '';\n };\n\n /**\n * Format and display the value based on type\n */\n const displayValue = () => {\n const isISODate = typeof value === 'string' && isISODateString(value);\n\n if (isSearchActive && typeof value === 'object') {\n return value;\n }\n\n if (value || (type?.toLowerCase() === 'boolean' && value === 0) || (type?.toLowerCase() === 'currency' && Number(value) >= 0)) {\n if ((value === true || value === 'True') && !originalValue && (type?.toLowerCase() !== 'choice')) {\n return 'Yes';\n } else if ((value === false || value === 'False') && !originalValue && (type?.toLowerCase() !== 'choice')) {\n return 'No';\n } else if (type?.toLowerCase() === 'url') {\n return renderUrlValue(value as string);\n } else if (type?.toLowerCase() === 'boolean') {\n return formatBooleanValue(value);\n } else if (type?.toLowerCase() === 'currency') {\n const formatted = formatCurrency(value, items?.currency_code) || '-';\n const currencyName = items?.currency_code\n ? CURRENCIES.find(c => c.value === items.currency_code)?.label\n : undefined;\n const tooltipTitle = currencyName\n ? `${items!.currency_code} — ${currencyName}`\n : items?.currency_code ?? '';\n return currencyName ? (\n <Tooltip title={tooltipTitle} placement=\"top\">\n <span>{formatted}</span>\n </Tooltip>\n ) : formatted;\n } else if (type?.toLowerCase() === 'datetime') {\n const dateValue = typeof value === 'string' && value.includes('Z') ? value.replace(/\\.000Z$/, 'Z') : value;\n return formatDate(dateValue as string, {\n skipTimezone: !allowTimezoneConversion,\n withTime: true,\n });\n } else if (type?.toLowerCase() === 'date' || isISODate) {\n let dateValue = value;\n\n if (typeof value === 'string' && value.includes('Z')) {\n dateValue = value.replace(/\\.000Z$/, 'Z')\n } else if (typeof value === 'string' && !value.includes('Z')) {\n const parsed = dayjs(value);\n dateValue = dayjs(parsed).isValid() ? parsed.toString() : value;\n }\n\n return formatDate(dateValue as string, {\n skipTimezone: true,\n withTime: false,\n });\n } else if (type?.toLowerCase() === 'percentage') {\n return `${value}%`;\n } else if (typeof value === 'string' && value.length > COLLAPSE_CHAR_LIMIT) {\n const decoded = decode(value);\n return (\n <p>\n {decoded.slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decoded.length)}\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n );\n } else {\n return typeof value === 'string' ? decode(value) : value;\n }\n }\n return '-';\n };\n\n /**\n * Get Typography size based on LabelValue size\n */\n const getTypographySize = () => {\n switch (size) {\n case 'small':\n return 'extra-small' as const;\n case 'large':\n return 'large' as const;\n default: // medium\n return 'small' as const;\n }\n };\n\n /**\n * Get highlight color classes\n */\n const getHighlightClasses = (): string => {\n switch (highlightColor) {\n case 'success':\n return 'bg-success-100';\n case 'warning':\n return 'bg-warning-100';\n case 'error':\n return 'bg-error-100';\n case 'info':\n return 'bg-info-100';\n default:\n return 'bg-warning-100';\n }\n };\n\n return (\n <div\n id={id || ''}\n ref={ref}\n className={cn(\n 'font-medium relative',\n className\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n aria-label={ariaLabel || `Label: ${label}, Value: ${value}`}\n >\n {/* Label section */}\n <Typography\n variant=\"medium\"\n size={getTypographySize()}\n className=\"flex gap-1 items-center flex-wrap\"\n appearance=\"subtitle\"\n >\n\n {/* Live field indicator */}\n {typeof label === 'string' ? decode(label) : label} {<Label labels={tags?.map(tag => ({ ...tag, color: tag.color || 'primary' }))} />}\n\n {isLiveField && <BoltOutlined sx={{ fontSize: 16, color: 'var(--color-primary-600)', rotate: '15deg' }} />}\n {isAiExtracted &&\n (shouldShowConfidenceScore(confidenceScore) && confidenceType ? (\n <Tooltip\n placement=\"top\"\n title={confidenceTooltip || \"\"}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\"cursor-pointer w-3 h-3 flex items-center justify-center rounded-full\", getConfidenceScoreBadgeHoverClass(confidenceType))}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n </div>\n </Tooltip>\n ) : (\n <AIExtractedIndicator onClick={() => onAiExtractedIndicatorClick?.(displayValue() as string)} />\n ))}\n\n {/* Tooltip */}\n {tooltip && (\n <Tooltip\n placement=\"top\"\n title={tooltip}\n whiteSpace=\"pre-wrap\"\n >\n <div\n className=\"cursor-pointer\"\n role=\"button\"\n tabIndex={0}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n // Tooltip will show on focus\n }\n }}\n >\n <HelpIcon size={14} />\n </div>\n </Tooltip>\n )}\n {copyOnHover && isHovered && (\n <Tooltip title={isCopied ? 'Copied' : `Copy ${label ?? 'value'}`} placement=\"top\" whiteSpace=\"pre-wrap\">\n <button\n type=\"button\"\n onClick={handleCopyValue}\n aria-label={isCopied ? `Copied ${label ?? 'value'}` : `Copy ${label ?? 'value'}`}\n className=\"p-1 flex items-center justify-center rounded text-neutral-500 hover:!text-primary-600 hover:bg-neutral-100 dark:text-primary-400 dark:hover:!text-primary-600 dark:hover:bg-neutral-800 cursor-pointer\"\n >\n <span className=\"relative inline-flex h-4 w-4 items-center justify-center\">\n <ContentCopyIcon\n size={16}\n className={cn(\n 'absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out',\n isCopied ? 'opacity-0 scale-50 rotate-[-90deg]' : 'opacity-100 scale-100 rotate-0'\n )}\n />\n <CheckFilledIcon\n size={16}\n className={cn(\n 'absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out',\n isCopied ? 'opacity-100 scale-100 rotate-0' : 'opacity-0 scale-50 rotate-90'\n )}\n />\n </span>\n </button>\n </Tooltip>\n )}\n </Typography>\n\n {/* Value section */}\n <Typography\n variant=\"medium\"\n size={getTypographySize()}\n className={cn(\n 'text-- whitespace-normal break-all flex gap-1 pt-0.5',\n isModified && 'bg-neutral-50 dark:bg-black-700 p-1 rounded',\n isRiskAnalysisOpen && riskDetails?.color &&\n `bg-${riskDetails.color}-50 border-${riskDetails.color}-300 px-0.5 rounded-lg`\n )}\n appearance=\"body\"\n >\n {/* Value display */}\n {showDiff && deletedValue && value ? (\n <div className=\"flex gap-2\">\n <span className=\"line-through\">{decode(deletedValue)}</span>\n <span>{displayValue()}</span>\n </div>\n ) : isChanged || isHighlighted ? (\n <mark className={cn('rounded-md py-0.5 px-1', getHighlightClasses())}>\n {displayValue()}\n </mark>\n ) : (\n displayValue()\n )}\n\n {/* Delta change indicator for currency fields */}\n {type?.toLowerCase() === 'currency' && deltaChange !== 0 && deltaChange !== undefined && deltaChange !== null && (\n <motion.span\n initial={{ opacity: 0, y: 2 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.25 }}\n className={cn(\n 'inline-flex items-center gap-1 ml-1.5 text-xs font-medium',\n deltaChange > 0 ? 'text-emerald-600 dark:text-emerald-400' : 'text-red-600 dark:text-red-400'\n )}\n >\n <span className=\"flex items-center justify-center w-4 h-4\">\n {deltaChange > 0 ? (\n <ArrowUpwardRounded sx={{ fontSize: 16 }} className=\"text-emerald-600 dark:text-emerald-400\" />\n ) : (\n <ArrowDownwardRounded sx={{ fontSize: 16 }} className=\"text-red-600 dark:text-red-400\" />\n )}\n </span>\n <span>{formatCurrency(Math.abs(deltaChange), items?.currency_code || 'USD')}</span>\n </motion.span>\n )}\n\n {/* Master data search icon */}\n {items?.is_master_data && items?.reference && value && (\n <button\n onClick={() => handleMasterDataClick(items)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleMasterDataClick(items);\n }\n }}\n aria-label={`Search master data for ${label}`}\n type=\"button\"\n className=\"cursor-pointer\"\n >\n <SearchIcon width={20} height={20} />\n </button>\n )}\n\n {/* File upload input */}\n {acceptsUpload && (\n <input\n type=\"file\"\n onChange={handleFileUpload}\n className=\"absolute inset-0 w-full h-full opacity-0 cursor-pointer\"\n aria-label={`Upload file for ${label}`}\n />\n )}\n </Typography>\n\n {/* Deleted value display */}\n {deletedValue && !showDiff && (\n <Typography\n variant=\"medium\"\n size=\"extra-small\"\n className=\"pt-0.5\"\n appearance=\"body\"\n >\n <mark className=\"rounded-md py-0.5 px-1 bg-error-100\">\n <del>\n {deletedValue || (type?.toLowerCase() === 'boolean' && deletedValue === '0') ? (\n deletedValue === 'True' && (type?.toLowerCase() !== 'choice') ? (\n 'Yes'\n ) : deletedValue === 'False' && (type?.toLowerCase() !== 'choice') ? (\n 'No'\n ) : type?.toLowerCase() === 'boolean' ? (\n formatBooleanValue(deletedValue)\n ) : type?.toLowerCase() === 'currency' ? (\n formatCurrency(deletedValue, items?.currency_code)\n ) : type?.toLowerCase() === 'date' ? (\n formatDate(deletedValue, {\n skipTimezone: true,\n withTime: false,\n })\n ) : type?.toLowerCase() === 'datetime' ? (\n formatDate(deletedValue, {\n skipTimezone: true,\n withTime: true,\n })\n ) : type?.toLowerCase() === 'percentage' ? (\n `${deletedValue}%`\n ) : type?.toLowerCase() === 'url' ? (\n renderUrlValue(deletedValue)\n ) : deletedValue.length > COLLAPSE_CHAR_LIMIT ? (\n <p>\n {decode(deletedValue).slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decode(deletedValue).length)}\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n ) : (\n decode(deletedValue)\n )\n ) : (\n '-'\n )}\n </del>\n </mark>\n </Typography>\n )}\n\n {/* Master data modal */}\n {MasterDataModal && (\n <MasterDataModal\n isVisible={isOpenMasterDataModal}\n onClose={handleMasterDataClose}\n masterdataInfo={masterdataModalInfo}\n />\n )}\n\n {/* Risk details tooltip */}\n {isHovered && riskDetails && isRiskAnalysisOpen && (\n <div\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === 'Escape') {\n setIsHovered(false);\n }\n }}\n role=\"tooltip\"\n aria-label=\"Risk analysis details\"\n tabIndex={0}\n >\n {RiskDetailsCard ? (\n <RiskDetailsCard riskDetails={riskDetails} />\n ) : (\n <div className=\"shadow-lg p-4\">\n <div className=\"text-sm\">\n <h4 className=\"font-semibold mb-2\">Risk Details</h4>\n <p className=\"text-neutral-600 dark:text-neutral-300\">\n {riskDetails.description || 'Risk analysis information'}\n </p>\n </div>\n </div>\n )}\n </div>\n )}\n </div>\n );\n }\n);\n\nLabelValue.displayName = 'LabelValue';\n"],"names":["LabelValue","forwardRef","id","label","value","className","type","tags","tooltip","items","isModified","isChanged","size","isHighlighted","deletedValue","highlightColor","isSearchActive","originalValue","showDiff","isLiveField","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","deltaChange","_theme","onUpload","acceptsUpload","MasterDataModal","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","ariaLabel","decodeEntities","onAiExtractedIndicatorClick","copyOnHover","urlAlias","allowTimezoneConversion","ref","collapseValue","setCollapseValue","useState","isOpenMasterDataModal","setIsOpenMasterDataModal","masterdataModalInfo","setMasterdataModalInfo","isHovered","setIsHovered","isCopied","setIsCopied","copyResetTimer","useRef","useEffect","decode","text","decodeHTMLEntities","COLLAPSE_CHAR_LIMIT","handleCollapse","renderCollapseToggle","jsx","e","renderUrlValue","href","jsxs","OpenInNew","decoded","handleMasterDataClick","item","handleMasterDataClose","handleCopyValue","textToCopy","handleFileUpload","event","file","displayValue","isISODate","isISODateString","formatBooleanValue","formatted","formatCurrency","currencyName","CURRENCIES","c","tooltipTitle","Tooltip","dateValue","formatDate","parsed","dayjs","getTypographySize","getHighlightClasses","cn","Typography","Label","tag","BoltOutlined","shouldShowConfidenceScore","getConfidenceScoreBadgeHoverClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","AIExtractedIndicator","HelpIcon","ContentCopyIcon","CheckFilledIcon","motion","ArrowUpwardRounded","ArrowDownwardRounded","SearchIcon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LabelValue.cjs.js","sources":["../../../../src/components/data-display/label-value/LabelValue.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, forwardRef, type ReactNode } from 'react';\nimport cn from 'classnames';\nimport { HelpIcon } from '../../icons/HelpIcon';\nimport { SearchIcon } from '../../icons/SearchIcon';\nimport { Typography } from '../typography/Typography';\nimport { formatCurrency, formatDate, formatBooleanValue, isISODateString, decodeHTMLEntities } from '../../../utils/formatters';\nimport { CURRENCIES } from '../../forms/currency-input/currency.constant';\nimport { Label } from '../label/Label';\nimport { motion } from 'framer-motion';\nimport { ArrowUpwardRounded, ArrowDownwardRounded, BoltOutlined, OpenInNew } from '@mui/icons-material';\nimport Tooltip from '../../tooltip/Tooltip';\nimport { AIExtractedIndicator } from '../../icons/AIExtractedIndicator';\nimport { AIStarIcon } from '../../icons/AIStarIcon';\nimport { CheckFilledIcon, ContentCopyIcon } from '../../icon';\nimport { APP_DATA_TYPES } from '../datatype-icon/DataTypeIcon';\nimport { LabelValueDataTypeIcon } from '../datatype-icon/LabelValueDataTypeIcon';\nimport { getConfidenceScoreBadgeColor, getConfidenceScoreBadgeFill, getConfidenceScoreBadgeHoverClass, shouldShowConfidenceScore } from '../../../utils/confidenceScoreUtils';\nimport dayjs from 'dayjs';\n\n/**\n * Source meta bounding box\n */\nexport type SourceMetaBBox = {\n b: number;\n l: number;\n r: number;\n t: number;\n};\n\n/**\n * Source meta item\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 * Confidence score type\n */\nexport type ConfidenceScoreType = \"low\" | \"medium\" | \"high\";\n\n/**\n * Available label value size options\n */\nexport type LabelValueSize = 'small' | 'medium' | 'large';\n\n/**\n * Available highlight color options\n */\nexport type HighlightColor = 'success' | 'warning' | 'error' | 'info';\n\n/**\n * Theme mode for styling\n */\nexport type ThemeMode = 'light' | 'dark';\n\n/**\n * Upload handler function type\n */\nexport type UploadHandler = (file: File) => void | Promise<void>;\n\n/**\n * Master data item interface\n */\nexport interface MasterDataItem {\n is_master_data?: boolean;\n reference?: string;\n group_technical_name?: string;\n currency_code?: string;\n}\n\n/**\n * Risk details interface\n */\nexport interface RiskDetails {\n color?: string;\n description?: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n [key: string]: any;\n}\n\n/**\n * Master data modal component props\n */\nexport interface MasterDataModalProps {\n isVisible: boolean;\n onClose: () => void;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n masterdataInfo: any;\n}\n\n/**\n * Risk details card component props\n * Using generic to allow custom risk detail types from consumers\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport interface RiskDetailsCardProps<TRisk = any> {\n riskDetails: TRisk;\n maxWidth?: string;\n showAllRisksSuggestions?: boolean;\n}\n\n/**\n * Maps the LabelValue `type` prop onto a `DataTypeIcon` data type, with an\n * optional tooltip override when the two vocabularies don't line up.\n */\nconst TYPE_TO_DATA_TYPE: Record<string, { dataType: string; label?: string }> = {\n string: { dataType: APP_DATA_TYPES.STRING },\n number: { dataType: APP_DATA_TYPES.NUMBER },\n boolean: { dataType: APP_DATA_TYPES.BOOLEAN },\n currency: { dataType: APP_DATA_TYPES.CURRENCY },\n date: { dataType: APP_DATA_TYPES.DATE },\n datetime: { dataType: APP_DATA_TYPES.DATETIME },\n percentage: { dataType: APP_DATA_TYPES.NUMBER, label: 'Percentage' },\n url: { dataType: APP_DATA_TYPES.STRING, label: 'URL' },\n};\n\n/**\n * Props for the LabelValue component\n */\nexport interface LabelValueProps {\n /** The id of the label value */\n id?: string;\n /** The label text to display */\n label?: string;\n /** The value to display */\n value?: string | number | boolean | ReactNode;\n /** Additional CSS classes */\n className?: string;\n /** Data type for formatting */\n type?: 'string' | 'number' | 'boolean' | 'currency' | 'date' | 'datetime' | 'percentage' | 'url';\n /** Tags to display with the label */\n tags?: Array<{ label: string; color?: string; value?: string }>;\n /** Tooltip text for the help icon */\n tooltip?: string;\n /** Master data item information */\n items?: MasterDataItem;\n /** Whether the value has been modified */\n isModified?: boolean;\n /** Whether the value has been changed */\n isChanged?: boolean;\n /** Size variant */\n size?: LabelValueSize;\n /** Whether the value is highlighted */\n isHighlighted?: boolean;\n /** Deleted value for diff display */\n deletedValue?: string;\n /** Highlight color for changes */\n highlightColor?: HighlightColor;\n /** Whether search is active */\n isSearchActive?: boolean;\n /** Whether to show original boolean value */\n originalValue?: boolean;\n /** Whether to show diff between old and new values */\n showDiff?: boolean;\n /** Whether this is a live field (shows bolt icon) */\n isLiveField?: boolean;\n /** Whether this is an AI extracted field (shows AI extracted icon) */\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 /** Delta change value for currency fields */\n deltaChange?: number;\n /** Theme mode */\n theme?: ThemeMode;\n /** Upload handler function */\n onUpload?: UploadHandler;\n /** Whether the component accepts file uploads */\n acceptsUpload?: boolean;\n /** Master data modal component */\n MasterDataModal?: React.ComponentType<MasterDataModalProps>;\n /** Risk analysis data - accepts any risk object extending RiskDetails */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n riskDetails?: RiskDetails | any;\n /** Whether risk analysis is open */\n isRiskAnalysisOpen?: boolean;\n /** Custom risk details card component - accepts components with custom risk types */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n RiskDetailsCard?: React.ComponentType<RiskDetailsCardProps<any>>;\n /** Custom aria-label for accessibility */\n 'aria-label'?: string;\n /** Whether to decode HTML character entities in string values (default: true) */\n decodeEntities?: boolean;\n /** Function to handle AI extracted indicator click */\n onAiExtractedIndicatorClick?: (value: string) => void;\n /** Whether to show a copy-to-clipboard icon in the top-right corner on hover */\n copyOnHover?: boolean;\n /** Display alias text for URL type — shown instead of the raw URL, with an external link icon */\n urlAlias?: string;\n /** Whether to show the data type icon next to the label */\n showTypeIcon?: boolean;\n /** Explicit data type for the icon (one of `APP_DATA_TYPES`) — overrides the mapping from `type` */\n dataType?: string;\n /**\n * Whether a `datetime` value is an instant that should be converted to the viewer's timezone.\n * Field values are wall clock — what the user typed — so this is off by default; turn it on for\n * system timestamps (created_at, executed_on...).\n */\n allowTimezoneConversion?: boolean;\n}\n\n/**\n * LabelValue component displays a label-value pair with various formatting options\n *\n * @example\n * ```tsx\n * <LabelValue \n * label=\"Status\" \n * value=\"Active\" \n * type=\"string\" \n * size=\"medium\" \n * />\n * <LabelValue \n * label=\"Price\" \n * value={99.99} \n * type=\"currency\" \n * items={{ currency_code: 'USD' }}\n * />\n * <LabelValue \n * label=\"Upload File\" \n * acceptsUpload \n * onUpload={handleUpload}\n * />\n * ```\n */\nexport const LabelValue = forwardRef<HTMLDivElement, LabelValueProps>(\n (\n {\n id,\n label,\n value,\n className,\n type = 'string',\n tags,\n tooltip,\n items,\n isModified = false,\n isChanged = false,\n size = 'medium',\n isHighlighted = false,\n deletedValue,\n highlightColor = 'warning',\n isSearchActive = false,\n originalValue = false,\n showDiff = false,\n isLiveField = false,\n isAiExtracted = false,\n confidenceScore,\n confidenceType = \"high\",\n confidenceTooltip,\n sourceMeta = [],\n onConfidenceScoreClick,\n deltaChange,\n theme: _theme = 'light',\n onUpload,\n acceptsUpload = false,\n MasterDataModal,\n riskDetails,\n isRiskAnalysisOpen = false,\n RiskDetailsCard,\n 'aria-label': ariaLabel,\n decodeEntities = true,\n onAiExtractedIndicatorClick,\n copyOnHover = false,\n urlAlias,\n showTypeIcon = false,\n dataType,\n allowTimezoneConversion = false,\n },\n ref\n ) => {\n const [collapseValue, setCollapseValue] = useState(true);\n const [isOpenMasterDataModal, setIsOpenMasterDataModal] = useState(false);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const [masterdataModalInfo, setMasterdataModalInfo] = useState<any>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isCopied, setIsCopied] = useState(false);\n const copyResetTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n return () => {\n if (copyResetTimer.current) clearTimeout(copyResetTimer.current);\n };\n }, []);\n\n // Theme is passed as prop but not used in current implementation\n\n /**\n * Conditionally decode HTML entities based on the decodeEntities prop\n */\n const decode = (text: string): string => decodeEntities ? decodeHTMLEntities(text) : text;\n\n const COLLAPSE_CHAR_LIMIT = 100;\n\n /**\n * Data type icon descriptor — an explicit `dataType` wins over the `type` mapping\n */\n const typeIcon: { dataType: string; label?: string } | undefined = dataType\n ? { dataType }\n : TYPE_TO_DATA_TYPE[String(type).toLowerCase()];\n\n /** Data type icon size, scaled with the LabelValue size */\n const typeIconSize = size === 'small' ? 14 : size === 'large' ? 18 : 16;\n\n /**\n * Handle collapse toggle for long text\n */\n const handleCollapse = () => {\n setCollapseValue(!collapseValue);\n };\n\n /**\n * Show more / Show less toggle for long text and URLs\n */\n const renderCollapseToggle = () => (\n <button\n id={`btn-label-value-${collapseValue ? 'Show more' : 'Show less'}`}\n className=\"text-primary-400 text-sm hover:text-primary-500 cursor-pointer whitespace-nowrap\"\n onClick={handleCollapse}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleCollapse();\n }\n }}\n aria-label={collapseValue ? 'Show more content' : 'Show less content'}\n type=\"button\"\n >\n {collapseValue ? 'Show more' : 'Show less'}\n </button>\n );\n\n /**\n * Render a URL with optional collapse for long href/display text\n */\n const renderUrlValue = (href: string) => {\n if (urlAlias) {\n return (\n <a\n href={href}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"inline-flex items-center gap-1 font-semibold text-neutral-900 dark:text-white hover:text-primary-600 dark:hover:text-primary-400 transition-colors\"\n >\n {urlAlias}\n <OpenInNew sx={{ fontSize: 16 }} className=\"text-primary-600 dark:text-primary-400\" />\n </a>\n );\n }\n const decoded = decode(href);\n if (decoded.length <= COLLAPSE_CHAR_LIMIT) {\n return (\n <a href={href} className=\"text-primary-600 truncate\">\n {decoded}\n </a>\n );\n }\n return (\n <p>\n <a href={href} className=\"text-primary-600 break-all\">\n {decoded.slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decoded.length)}\n </a>\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n );\n };\n\n /**\n * Handle master data click\n */\n const handleMasterDataClick = (item: MasterDataItem) => {\n setIsOpenMasterDataModal(true);\n setMasterdataModalInfo({ ...item, value });\n };\n\n /**\n * Handle master data modal close\n */\n const handleMasterDataClose = () => {\n setIsOpenMasterDataModal(false);\n setMasterdataModalInfo(null);\n };\n\n /**\n * Copy the current value to the clipboard\n */\n const handleCopyValue = () => {\n const textToCopy =\n value === null || value === undefined || typeof value === 'object'\n ? ''\n : String(value);\n if (!textToCopy) return;\n navigator.clipboard?.writeText(textToCopy)\n .then(() => {\n setIsCopied(true);\n if (copyResetTimer.current) clearTimeout(copyResetTimer.current);\n copyResetTimer.current = setTimeout(() => setIsCopied(false), 1500);\n })\n .catch(() => { });\n };\n\n /**\n * Handle file upload\n */\n const handleFileUpload = (event: React.ChangeEvent<HTMLInputElement>) => {\n const file = event.target.files?.[0];\n if (file && onUpload) {\n onUpload(file);\n }\n // Reset input value to allow same file selection\n event.target.value = '';\n };\n\n /**\n * Format and display the value based on type\n */\n const displayValue = () => {\n const isISODate = typeof value === 'string' && isISODateString(value);\n\n if (isSearchActive && typeof value === 'object') {\n return value;\n }\n\n if (value || (type?.toLowerCase() === 'boolean' && value === 0) || (type?.toLowerCase() === 'currency' && Number(value) >= 0)) {\n if ((value === true || value === 'True') && !originalValue && (type?.toLowerCase() !== 'choice')) {\n return 'Yes';\n } else if ((value === false || value === 'False') && !originalValue && (type?.toLowerCase() !== 'choice')) {\n return 'No';\n } else if (type?.toLowerCase() === 'url') {\n return renderUrlValue(value as string);\n } else if (type?.toLowerCase() === 'boolean') {\n return formatBooleanValue(value);\n } else if (type?.toLowerCase() === 'currency') {\n const formatted = formatCurrency(value, items?.currency_code) || '-';\n const currencyName = items?.currency_code\n ? CURRENCIES.find(c => c.value === items.currency_code)?.label\n : undefined;\n const tooltipTitle = currencyName\n ? `${items!.currency_code} — ${currencyName}`\n : items?.currency_code ?? '';\n return currencyName ? (\n <Tooltip title={tooltipTitle} placement=\"top\">\n <span>{formatted}</span>\n </Tooltip>\n ) : formatted;\n } else if (type?.toLowerCase() === 'datetime') {\n const dateValue = typeof value === 'string' && value.includes('Z') ? value.replace(/\\.000Z$/, 'Z') : value;\n return formatDate(dateValue as string, {\n skipTimezone: !allowTimezoneConversion,\n withTime: true,\n });\n } else if (type?.toLowerCase() === 'date' || isISODate) {\n let dateValue = value;\n\n if (typeof value === 'string' && value.includes('Z')) {\n dateValue = value.replace(/\\.000Z$/, 'Z')\n } else if (typeof value === 'string' && !value.includes('Z')) {\n const parsed = dayjs(value);\n dateValue = dayjs(parsed).isValid() ? parsed.toString() : value;\n }\n\n return formatDate(dateValue as string, {\n skipTimezone: true,\n withTime: false,\n });\n } else if (type?.toLowerCase() === 'percentage') {\n return `${value}%`;\n } else if (typeof value === 'string' && value.length > COLLAPSE_CHAR_LIMIT) {\n const decoded = decode(value);\n return (\n <p>\n {decoded.slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decoded.length)}\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n );\n } else {\n return typeof value === 'string' ? decode(value) : value;\n }\n }\n return '-';\n };\n\n /**\n * Get Typography size based on LabelValue size\n */\n const getTypographySize = () => {\n switch (size) {\n case 'small':\n return 'extra-small' as const;\n case 'large':\n return 'large' as const;\n default: // medium\n return 'small' as const;\n }\n };\n\n /**\n * Get highlight color classes\n */\n const getHighlightClasses = (): string => {\n switch (highlightColor) {\n case 'success':\n return 'bg-success-100';\n case 'warning':\n return 'bg-warning-100';\n case 'error':\n return 'bg-error-100';\n case 'info':\n return 'bg-info-100';\n default:\n return 'bg-warning-100';\n }\n };\n\n return (\n <div\n id={id || ''}\n ref={ref}\n className={cn(\n 'font-medium relative',\n className\n )}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n aria-label={ariaLabel || `Label: ${label}, Value: ${value}`}\n >\n {/* Label section */}\n <Typography\n variant=\"medium\"\n size={getTypographySize()}\n className=\"flex gap-1 items-center flex-wrap\"\n appearance=\"subtitle\"\n >\n {/* Data type icon */}\n {showTypeIcon && typeIcon && (\n <LabelValueDataTypeIcon dataType={typeIcon.dataType} tooltip={typeIcon.label} size={typeIconSize} />\n )}\n\n {/* Live field indicator */}\n {typeof label === 'string' ? decode(label) : label} {<Label labels={tags?.map(tag => ({ ...tag, color: tag.color || 'primary' }))} />}\n\n {isLiveField && <BoltOutlined sx={{ fontSize: 16, color: 'var(--color-primary-600)', rotate: '15deg' }} />}\n {isAiExtracted &&\n (shouldShowConfidenceScore(confidenceScore) && confidenceType ? (\n <Tooltip\n placement=\"top\"\n title={confidenceTooltip || \"\"}\n className=\"cursor-pointer\"\n >\n <div\n className={cn(\"cursor-pointer w-3 h-3 flex items-center justify-center rounded-full\", getConfidenceScoreBadgeHoverClass(confidenceType))}\n onClick={() => onConfidenceScoreClick?.(sourceMeta)}\n >\n <AIStarIcon\n size={12}\n fill={getConfidenceScoreBadgeColor(confidenceType)}\n fillSecondary={getConfidenceScoreBadgeFill(confidenceType)}\n />\n </div>\n </Tooltip>\n ) : (\n <AIExtractedIndicator onClick={() => onAiExtractedIndicatorClick?.(displayValue() as string)} />\n ))}\n\n {/* Tooltip */}\n {tooltip && (\n <Tooltip\n placement=\"top\"\n title={tooltip}\n whiteSpace=\"pre-wrap\"\n >\n <div\n className=\"cursor-pointer\"\n role=\"button\"\n tabIndex={0}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n // Tooltip will show on focus\n }\n }}\n >\n <HelpIcon size={14} />\n </div>\n </Tooltip>\n )}\n {copyOnHover && isHovered && (\n <Tooltip title={isCopied ? 'Copied' : `Copy ${label ?? 'value'}`} placement=\"top\" whiteSpace=\"pre-wrap\">\n <button\n type=\"button\"\n onClick={handleCopyValue}\n aria-label={isCopied ? `Copied ${label ?? 'value'}` : `Copy ${label ?? 'value'}`}\n className=\"p-1 flex items-center justify-center rounded text-neutral-500 hover:!text-primary-600 hover:bg-neutral-100 dark:text-primary-400 dark:hover:!text-primary-600 dark:hover:bg-neutral-800 cursor-pointer\"\n >\n <span className=\"relative inline-flex h-4 w-4 items-center justify-center\">\n <ContentCopyIcon\n size={16}\n className={cn(\n 'absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out',\n isCopied ? 'opacity-0 scale-50 rotate-[-90deg]' : 'opacity-100 scale-100 rotate-0'\n )}\n />\n <CheckFilledIcon\n size={16}\n className={cn(\n 'absolute inset-0 text-primary-600 dark:text-primary-500 transition-all duration-200 ease-out',\n isCopied ? 'opacity-100 scale-100 rotate-0' : 'opacity-0 scale-50 rotate-90'\n )}\n />\n </span>\n </button>\n </Tooltip>\n )}\n </Typography>\n\n {/* Value section */}\n <Typography\n variant=\"medium\"\n size={getTypographySize()}\n className={cn(\n 'text-- whitespace-normal break-all flex gap-1 pt-0.5',\n isModified && 'bg-neutral-50 dark:bg-black-700 p-1 rounded',\n isRiskAnalysisOpen && riskDetails?.color &&\n `bg-${riskDetails.color}-50 border-${riskDetails.color}-300 px-0.5 rounded-lg`\n )}\n appearance=\"body\"\n >\n {/* Value display */}\n {showDiff && deletedValue && value ? (\n <div className=\"flex gap-2\">\n <span className=\"line-through\">{decode(deletedValue)}</span>\n <span>{displayValue()}</span>\n </div>\n ) : isChanged || isHighlighted ? (\n <mark className={cn('rounded-md py-0.5 px-1', getHighlightClasses())}>\n {displayValue()}\n </mark>\n ) : (\n displayValue()\n )}\n\n {/* Delta change indicator for currency fields */}\n {type?.toLowerCase() === 'currency' && deltaChange !== 0 && deltaChange !== undefined && deltaChange !== null && (\n <motion.span\n initial={{ opacity: 0, y: 2 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.25 }}\n className={cn(\n 'inline-flex items-center gap-1 ml-1.5 text-xs font-medium',\n deltaChange > 0 ? 'text-emerald-600 dark:text-emerald-400' : 'text-red-600 dark:text-red-400'\n )}\n >\n <span className=\"flex items-center justify-center w-4 h-4\">\n {deltaChange > 0 ? (\n <ArrowUpwardRounded sx={{ fontSize: 16 }} className=\"text-emerald-600 dark:text-emerald-400\" />\n ) : (\n <ArrowDownwardRounded sx={{ fontSize: 16 }} className=\"text-red-600 dark:text-red-400\" />\n )}\n </span>\n <span>{formatCurrency(Math.abs(deltaChange), items?.currency_code || 'USD')}</span>\n </motion.span>\n )}\n\n {/* Master data search icon */}\n {items?.is_master_data && items?.reference && value && (\n <button\n onClick={() => handleMasterDataClick(items)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleMasterDataClick(items);\n }\n }}\n aria-label={`Search master data for ${label}`}\n type=\"button\"\n className=\"cursor-pointer\"\n >\n <SearchIcon width={20} height={20} />\n </button>\n )}\n\n {/* File upload input */}\n {acceptsUpload && (\n <input\n type=\"file\"\n onChange={handleFileUpload}\n className=\"absolute inset-0 w-full h-full opacity-0 cursor-pointer\"\n aria-label={`Upload file for ${label}`}\n />\n )}\n </Typography>\n\n {/* Deleted value display */}\n {deletedValue && !showDiff && (\n <Typography\n variant=\"medium\"\n size=\"extra-small\"\n className=\"pt-0.5\"\n appearance=\"body\"\n >\n <mark className=\"rounded-md py-0.5 px-1 bg-error-100\">\n <del>\n {deletedValue || (type?.toLowerCase() === 'boolean' && deletedValue === '0') ? (\n deletedValue === 'True' && (type?.toLowerCase() !== 'choice') ? (\n 'Yes'\n ) : deletedValue === 'False' && (type?.toLowerCase() !== 'choice') ? (\n 'No'\n ) : type?.toLowerCase() === 'boolean' ? (\n formatBooleanValue(deletedValue)\n ) : type?.toLowerCase() === 'currency' ? (\n formatCurrency(deletedValue, items?.currency_code)\n ) : type?.toLowerCase() === 'date' ? (\n formatDate(deletedValue, {\n skipTimezone: true,\n withTime: false,\n })\n ) : type?.toLowerCase() === 'datetime' ? (\n formatDate(deletedValue, {\n skipTimezone: true,\n withTime: true,\n })\n ) : type?.toLowerCase() === 'percentage' ? (\n `${deletedValue}%`\n ) : type?.toLowerCase() === 'url' ? (\n renderUrlValue(deletedValue)\n ) : deletedValue.length > COLLAPSE_CHAR_LIMIT ? (\n <p>\n {decode(deletedValue).slice(0, collapseValue ? COLLAPSE_CHAR_LIMIT : decode(deletedValue).length)}\n {collapseValue ? '... ' : ' '}\n {renderCollapseToggle()}\n </p>\n ) : (\n decode(deletedValue)\n )\n ) : (\n '-'\n )}\n </del>\n </mark>\n </Typography>\n )}\n\n {/* Master data modal */}\n {MasterDataModal && (\n <MasterDataModal\n isVisible={isOpenMasterDataModal}\n onClose={handleMasterDataClose}\n masterdataInfo={masterdataModalInfo}\n />\n )}\n\n {/* Risk details tooltip */}\n {isHovered && riskDetails && isRiskAnalysisOpen && (\n <div\n className=\"absolute left-0 right-0 top-[95%] mt-1 z-50 bg-white dark:bg-black-600 rounded-xl\"\n onClick={(e) => e.stopPropagation()}\n onMouseDown={(e) => e.preventDefault()}\n onKeyDown={(e) => {\n if (e.key === 'Escape') {\n setIsHovered(false);\n }\n }}\n role=\"tooltip\"\n aria-label=\"Risk analysis details\"\n tabIndex={0}\n >\n {RiskDetailsCard ? (\n <RiskDetailsCard riskDetails={riskDetails} />\n ) : (\n <div className=\"shadow-lg p-4\">\n <div className=\"text-sm\">\n <h4 className=\"font-semibold mb-2\">Risk Details</h4>\n <p className=\"text-neutral-600 dark:text-neutral-300\">\n {riskDetails.description || 'Risk analysis information'}\n </p>\n </div>\n </div>\n )}\n </div>\n )}\n </div>\n );\n }\n);\n\nLabelValue.displayName = 'LabelValue';\n"],"names":["TYPE_TO_DATA_TYPE","APP_DATA_TYPES","LabelValue","forwardRef","id","label","value","className","type","tags","tooltip","items","isModified","isChanged","size","isHighlighted","deletedValue","highlightColor","isSearchActive","originalValue","showDiff","isLiveField","isAiExtracted","confidenceScore","confidenceType","confidenceTooltip","sourceMeta","onConfidenceScoreClick","deltaChange","_theme","onUpload","acceptsUpload","MasterDataModal","riskDetails","isRiskAnalysisOpen","RiskDetailsCard","ariaLabel","decodeEntities","onAiExtractedIndicatorClick","copyOnHover","urlAlias","showTypeIcon","dataType","allowTimezoneConversion","ref","collapseValue","setCollapseValue","useState","isOpenMasterDataModal","setIsOpenMasterDataModal","masterdataModalInfo","setMasterdataModalInfo","isHovered","setIsHovered","isCopied","setIsCopied","copyResetTimer","useRef","useEffect","decode","text","decodeHTMLEntities","COLLAPSE_CHAR_LIMIT","typeIcon","typeIconSize","handleCollapse","renderCollapseToggle","jsx","e","renderUrlValue","href","jsxs","OpenInNew","decoded","handleMasterDataClick","item","handleMasterDataClose","handleCopyValue","textToCopy","handleFileUpload","event","file","displayValue","isISODate","isISODateString","formatBooleanValue","formatted","formatCurrency","currencyName","CURRENCIES","c","tooltipTitle","Tooltip","dateValue","formatDate","parsed","dayjs","getTypographySize","getHighlightClasses","cn","Typography","LabelValueDataTypeIcon","Label","tag","BoltOutlined","shouldShowConfidenceScore","getConfidenceScoreBadgeHoverClass","AIStarIcon","getConfidenceScoreBadgeColor","getConfidenceScoreBadgeFill","AIExtractedIndicator","HelpIcon","ContentCopyIcon","CheckFilledIcon","motion","ArrowUpwardRounded","ArrowDownwardRounded","SearchIcon"],"mappings":"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"}
|
|
@@ -158,6 +158,10 @@ export interface LabelValueProps {
|
|
|
158
158
|
copyOnHover?: boolean;
|
|
159
159
|
/** Display alias text for URL type — shown instead of the raw URL, with an external link icon */
|
|
160
160
|
urlAlias?: string;
|
|
161
|
+
/** Whether to show the data type icon next to the label */
|
|
162
|
+
showTypeIcon?: boolean;
|
|
163
|
+
/** Explicit data type for the icon (one of `APP_DATA_TYPES`) — overrides the mapping from `type` */
|
|
164
|
+
dataType?: string;
|
|
161
165
|
/**
|
|
162
166
|
* Whether a `datetime` value is an instant that should be converted to the viewer's timezone.
|
|
163
167
|
* Field values are wall clock — what the user typed — so this is off by default; turn it on for
|