ods-ant 0.2.0 → 0.4.1

package/dist-lib/feedback/Progress.js

@@ -0,0 +1,199 @@
+import { dsSemanticTokens as e } from "../theme.js";
+import { Tag as t } from "../display/Tag.js";
+import { Progress as n } from "antd";
+import { useEffect as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/ds/feedback/Progress.tsx
+var o = "ds-progress-styles", s = "ds-progress", c = "ds-progress-shell", l = {
+	upload: "processing",
+	completion: "complete",
+	risk: "blocked",
+	workflow: "pending",
+	stepProgress: "processing"
+}, u = {
+	upload: "Upload progress",
+	completion: "Completion",
+	risk: "Risk progress",
+	workflow: "Workflow progress",
+	stepProgress: "Step progress"
+}, d = {
+	complete: "Complete",
+	pending: "Pending",
+	blocked: "Blocked",
+	failed: "Failed",
+	processing: "Processing"
+}, f = {
+	complete: "success",
+	pending: "normal",
+	blocked: "normal",
+	failed: "exception",
+	processing: "active"
+}, p = {
+	complete: "success",
+	pending: "inactive",
+	blocked: "warning",
+	failed: "error",
+	processing: "new"
+}, m = {
+	upload: "line",
+	completion: "circle",
+	risk: "dashboard",
+	workflow: "line",
+	stepProgress: "line"
+};
+function h(...e) {
+	return e.filter(Boolean).join(" ").trim();
+}
+function g() {
+	if (typeof document > "u") return;
+	let { progress: t } = e, n = document.getElementById(o);
+	n || (n = document.createElement("style"), n.id = o, document.head.appendChild(n)), n.textContent = `
+    .${c} {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+      width: 100%;
+      font-family: 'Nunito', sans-serif;
+      color: ${t.text.label};
+    }
+
+    .ds-progress-copy {
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+      min-width: 0;
+    }
+
+    .ds-progress-label-row {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      min-width: 0;
+    }
+
+    .ds-progress-label {
+      min-width: 0;
+      color: ${t.text.label};
+      font-size: ${t.typography.label.fontSize};
+      font-weight: ${t.typography.label.fontWeight};
+      line-height: ${t.typography.label.lineHeight};
+      overflow-wrap: anywhere;
+    }
+
+    .ds-progress-state {
+      flex: 0 0 auto;
+    }
+
+    .ds-progress-description {
+      color: ${t.text.description};
+      font-size: 12px;
+      line-height: 16px;
+      font-weight: 600;
+      overflow-wrap: anywhere;
+    }
+
+    .${s}.ant-progress {
+      width: 100%;
+      font-family: 'Nunito', sans-serif;
+      --ds-progress-track-color: ${t.status.processing.track};
+      --ds-progress-rail-color: ${t.rail};
+    }
+
+    .${s}.ant-progress .ant-progress-track,
+    .${s}.ant-progress .ant-progress-bg,
+    .${s}.ant-progress .ant-progress-steps-item-active {
+      background: var(--ds-progress-track-color) !important;
+    }
+
+    .${s}.ant-progress .ant-progress-rail,
+    .${s}.ant-progress .ant-progress-inner,
+    .${s}.ant-progress .ant-progress-steps-item:not(.ant-progress-steps-item-active) {
+      background: var(--ds-progress-rail-color) !important;
+    }
+
+    .${s}.ant-progress .ant-progress-text,
+    .${s}.ant-progress .ant-progress-indicator {
+      color: ${t.text.value} !important;
+      font-size: ${t.typography.value.fontSize};
+      font-weight: ${t.typography.value.fontWeight};
+      line-height: ${t.typography.value.lineHeight};
+    }
+
+    .${s}.ant-progress-circle .ant-progress-text {
+      color: ${t.text.value} !important;
+    }
+  `;
+}
+function _(e, t) {
+	return e === void 0 ? t === "complete" ? 100 : t === "pending" ? 0 : 50 : e;
+}
+function v(t, n) {
+	let r = e.progress.size[n];
+	return t === "circle" ? r.circle : t === "dashboard" ? r.dashboard : n === "sm" ? "small" : "medium";
+}
+function y(t, n) {
+	let r = e.progress.size[n];
+	return t === "circle" || t === "dashboard" ? Math.max(r.strokeWidth, 6) : r.strokeWidth;
+}
+function b({ dsVariant: o = "workflow", dsState: b, dsSize: x = "md", dsLabel: S, dsDescription: C, dsStateLabel: w, dsShowLabel: T = !0, dsSteps: E = 5, percent: D, showInfo: O = !0, className: k, rootClassName: A, style: j, percentPosition: M, ...N }) {
+	r(() => {
+		g();
+	}, []);
+	let P = b ?? l[o], F = m[o], I = _(D, P), L = e.progress.status[P], R = S ?? u[o], z = w ?? d[P], B = o === "stepProgress" ? E : void 0, V = f[P], H = N["aria-label"] ?? `${R}: ${z}, ${I}%`, U = /* @__PURE__ */ i(n, {
+		...N,
+		"aria-label": H,
+		className: h(s, k),
+		rootClassName: A,
+		percent: I,
+		percentPosition: M ?? (F === "line" && !B ? {
+			align: "end",
+			type: "outer"
+		} : void 0),
+		showInfo: O,
+		size: v(F, x),
+		status: V,
+		steps: B,
+		strokeColor: L.track,
+		railColor: e.progress.rail,
+		strokeLinecap: "butt",
+		strokeWidth: y(F, x),
+		style: {
+			...j,
+			"--ds-progress-track-color": L.track,
+			"--ds-progress-rail-color": e.progress.rail
+		},
+		type: F,
+		format: (e) => `${Math.round(e ?? 0)}%`
+	});
+	return T ? /* @__PURE__ */ a("div", {
+		className: c,
+		"data-ds-progress-variant": o,
+		"data-ds-progress-state": P,
+		"data-ds-progress-size": x,
+		children: [/* @__PURE__ */ a("div", {
+			className: "ds-progress-copy",
+			children: [/* @__PURE__ */ a("div", {
+				className: "ds-progress-label-row",
+				children: [/* @__PURE__ */ i("span", {
+					className: "ds-progress-label",
+					children: R
+				}), /* @__PURE__ */ i(t, {
+					className: "ds-progress-state",
+					dsStatus: p[P],
+					dsVariant: "light",
+					dsSize: "sm",
+					children: z
+				})]
+			}), C ? /* @__PURE__ */ i("span", {
+				className: "ds-progress-description",
+				children: C
+			}) : null]
+		}), U]
+	}) : U;
+}
+b.displayName = "Progress";
+//#endregion
+export { b as Progress };
+
+//# sourceMappingURL=Progress.js.map

package/dist-lib/feedback/Progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Progress.js","names":[],"sources":["../../src/ds/feedback/Progress.tsx"],"sourcesContent":["import { Progress as AntProgress } from 'antd';\nimport type { ProgressProps as AntProgressProps } from 'antd';\nimport type { ReactNode } from 'react';\nimport { useEffect } from 'react';\nimport { Tag } from '../display';\nimport type { DSTagStatus } from '../display';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSProgressVariant = 'upload' | 'completion' | 'risk' | 'workflow' | 'stepProgress';\nexport type DSProgressState = 'complete' | 'pending' | 'blocked' | 'failed' | 'processing';\nexport type DSProgressSize = 'sm' | 'md' | 'lg';\n\ntype RestrictedAntVisualProps = 'status' | 'strokeColor' | 'trailColor' | 'railColor' | 'strokeWidth' | 'strokeLinecap' | 'type' | 'steps' | 'format';\n\nexport type ProgressProps = Omit<AntProgressProps, RestrictedAntVisualProps> & {\n  /** Semantic DS progress variant. */\n  dsVariant?: DSProgressVariant;\n  /** Explicit workflow state. Displayed as text and mapped to DS semantic colors. */\n  dsState?: DSProgressState;\n  /** DS size preset. */\n  dsSize?: DSProgressSize;\n  /** Optional label displayed above the progress indicator. */\n  dsLabel?: ReactNode;\n  /** Optional supporting text displayed below the label/status row. */\n  dsDescription?: ReactNode;\n  /** Override visible state label while preserving semantic color from `dsState`. */\n  dsStateLabel?: ReactNode;\n  /** Show or hide the DS label/status text block. */\n  dsShowLabel?: boolean;\n  /** Number of segments for `stepProgress`. */\n  dsSteps?: number;\n};\n\nconst STYLE_ID = 'ds-progress-styles';\nconst DS_PROGRESS_CLASS = 'ds-progress';\nconst DS_PROGRESS_SHELL_CLASS = 'ds-progress-shell';\n\nconst DEFAULT_STATE_BY_VARIANT: Record<DSProgressVariant, DSProgressState> = {\n  upload: 'processing',\n  completion: 'complete',\n  risk: 'blocked',\n  workflow: 'pending',\n  stepProgress: 'processing',\n};\n\nconst DEFAULT_LABEL_BY_VARIANT: Record<DSProgressVariant, ReactNode> = {\n  upload: 'Upload progress',\n  completion: 'Completion',\n  risk: 'Risk progress',\n  workflow: 'Workflow progress',\n  stepProgress: 'Step progress',\n};\n\nconst STATE_LABEL: Record<DSProgressState, string> = {\n  complete: 'Complete',\n  pending: 'Pending',\n  blocked: 'Blocked',\n  failed: 'Failed',\n  processing: 'Processing',\n};\n\nconst ANT_STATUS_BY_STATE: Record<DSProgressState, AntProgressProps['status']> = {\n  complete: 'success',\n  pending: 'normal',\n  blocked: 'normal',\n  failed: 'exception',\n  processing: 'active',\n};\n\nconst TAG_STATUS_BY_STATE: Record<DSProgressState, DSTagStatus> = {\n  complete: 'success',\n  pending: 'inactive',\n  blocked: 'warning',\n  failed: 'error',\n  processing: 'new',\n};\n\nconst TYPE_BY_VARIANT: Record<DSProgressVariant, AntProgressProps['type']> = {\n  upload: 'line',\n  completion: 'circle',\n  risk: 'dashboard',\n  workflow: 'line',\n  stepProgress: 'line',\n};\n\nfunction mergeClassNames(...classNames: Array<string | undefined>) {\n  return classNames.filter(Boolean).join(' ').trim();\n}\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { progress } = dsSemanticTokens;\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .${DS_PROGRESS_SHELL_CLASS} {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n      width: 100%;\n      font-family: 'Nunito', sans-serif;\n      color: ${progress.text.label};\n    }\n\n    .ds-progress-copy {\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n      min-width: 0;\n    }\n\n    .ds-progress-label-row {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 12px;\n      min-width: 0;\n    }\n\n    .ds-progress-label {\n      min-width: 0;\n      color: ${progress.text.label};\n      font-size: ${progress.typography.label.fontSize};\n      font-weight: ${progress.typography.label.fontWeight};\n      line-height: ${progress.typography.label.lineHeight};\n      overflow-wrap: anywhere;\n    }\n\n    .ds-progress-state {\n      flex: 0 0 auto;\n    }\n\n    .ds-progress-description {\n      color: ${progress.text.description};\n      font-size: 12px;\n      line-height: 16px;\n      font-weight: 600;\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_PROGRESS_CLASS}.ant-progress {\n      width: 100%;\n      font-family: 'Nunito', sans-serif;\n      --ds-progress-track-color: ${progress.status.processing.track};\n      --ds-progress-rail-color: ${progress.rail};\n    }\n\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-track,\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-bg,\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-steps-item-active {\n      background: var(--ds-progress-track-color) !important;\n    }\n\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-rail,\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-inner,\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-steps-item:not(.ant-progress-steps-item-active) {\n      background: var(--ds-progress-rail-color) !important;\n    }\n\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-text,\n    .${DS_PROGRESS_CLASS}.ant-progress .ant-progress-indicator {\n      color: ${progress.text.value} !important;\n      font-size: ${progress.typography.value.fontSize};\n      font-weight: ${progress.typography.value.fontWeight};\n      line-height: ${progress.typography.value.lineHeight};\n    }\n\n    .${DS_PROGRESS_CLASS}.ant-progress-circle .ant-progress-text {\n      color: ${progress.text.value} !important;\n    }\n  `;\n}\n\nfunction getPercent(percent: AntProgressProps['percent'], state: DSProgressState) {\n  if (percent !== undefined) return percent;\n  return state === 'complete' ? 100 : state === 'pending' ? 0 : 50;\n}\n\nfunction getProgressSize(type: AntProgressProps['type'], dsSize: DSProgressSize) {\n  const tokens = dsSemanticTokens.progress.size[dsSize];\n  if (type === 'circle') return tokens.circle;\n  if (type === 'dashboard') return tokens.dashboard;\n  return dsSize === 'sm' ? 'small' : 'medium';\n}\n\nfunction getStrokeWidth(type: AntProgressProps['type'], dsSize: DSProgressSize) {\n  const tokens = dsSemanticTokens.progress.size[dsSize];\n  if (type === 'circle' || type === 'dashboard') return Math.max(tokens.strokeWidth, 6);\n  return tokens.strokeWidth;\n}\n\nexport function Progress({\n  dsVariant = 'workflow',\n  dsState,\n  dsSize = 'md',\n  dsLabel,\n  dsDescription,\n  dsStateLabel,\n  dsShowLabel = true,\n  dsSteps = 5,\n  percent,\n  showInfo = true,\n  className,\n  rootClassName,\n  style,\n  percentPosition,\n  ...props\n}: ProgressProps) {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const resolvedState = dsState ?? DEFAULT_STATE_BY_VARIANT[dsVariant];\n  const resolvedType = TYPE_BY_VARIANT[dsVariant];\n  const resolvedPercent = getPercent(percent, resolvedState);\n  const stateTokens = dsSemanticTokens.progress.status[resolvedState];\n  const label = dsLabel ?? DEFAULT_LABEL_BY_VARIANT[dsVariant];\n  const stateLabel = dsStateLabel ?? STATE_LABEL[resolvedState];\n  const steps = dsVariant === 'stepProgress' ? dsSteps : undefined;\n  const antStatus = ANT_STATUS_BY_STATE[resolvedState];\n  const ariaLabel = props['aria-label'] ?? `${label}: ${stateLabel}, ${resolvedPercent}%`;\n\n  const progress = (\n    <AntProgress\n      {...props}\n      aria-label={ariaLabel}\n      className={mergeClassNames(DS_PROGRESS_CLASS, className)}\n      rootClassName={rootClassName}\n      percent={resolvedPercent}\n      percentPosition={percentPosition ?? (resolvedType === 'line' && !steps ? { align: 'end', type: 'outer' } : undefined)}\n      showInfo={showInfo}\n      size={getProgressSize(resolvedType, dsSize)}\n      status={antStatus}\n      steps={steps}\n      strokeColor={stateTokens.track}\n      railColor={dsSemanticTokens.progress.rail}\n      strokeLinecap=\"butt\"\n      strokeWidth={getStrokeWidth(resolvedType, dsSize)}\n      style={{\n        ...style,\n        ['--ds-progress-track-color' as string]: stateTokens.track,\n        ['--ds-progress-rail-color' as string]: dsSemanticTokens.progress.rail,\n      }}\n      type={resolvedType}\n      format={(value) => `${Math.round(value ?? 0)}%`}\n    />\n  );\n\n  if (!dsShowLabel) {\n    return progress;\n  }\n\n  return (\n    <div\n      className={DS_PROGRESS_SHELL_CLASS}\n      data-ds-progress-variant={dsVariant}\n      data-ds-progress-state={resolvedState}\n      data-ds-progress-size={dsSize}\n    >\n      <div className=\"ds-progress-copy\">\n        <div className=\"ds-progress-label-row\">\n          <span className=\"ds-progress-label\">{label}</span>\n          <Tag className=\"ds-progress-state\" dsStatus={TAG_STATUS_BY_STATE[resolvedState]} dsVariant=\"light\" dsSize=\"sm\">\n            {stateLabel}\n          </Tag>\n        </div>\n        {dsDescription ? <span className=\"ds-progress-description\">{dsDescription}</span> : null}\n      </div>\n      {progress}\n    </div>\n  );\n}\n\nProgress.displayName = 'Progress';"],"mappings":"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"}

package/dist-lib/feedback/Result.cjs

@@ -0,0 +1,95 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`../theme.cjs`),t=require(`../display/Icon.cjs`);let n=require(`antd`),r=require(`react`),i=require(`react/jsx-runtime`);var a=`ds-result-styles`,o=`ds-result`,s={success:{title:`Workflow complete`,subTitle:`The requested workflow has been completed successfully.`},error:{title:`Unable to complete workflow`,subTitle:`Review the details and try again, or contact support if the issue continues.`},warning:{title:`Review required`,subTitle:`Some details need attention before this workflow can continue.`},empty:{title:`No results found`,subTitle:`Adjust your filters or search terms to continue.`},permission:{title:`Permission required`,subTitle:`You do not currently have access to this workflow or record.`},submitted:{title:`Submitted for review`,subTitle:`The request has been submitted and is ready for the next review step.`}},c={success:`success`,error:`error`,warning:`warning`},l={empty:`folderEmpty`,permission:`lock`,submitted:`uploadTop`};function u(...e){return e.filter(Boolean).join(` `).trim()}function d(){if(typeof document>`u`)return;let{result:t}=e.dsSemanticTokens,n=document.getElementById(a);n||(n=document.createElement(`style`),n.id=a,document.head.appendChild(n)),n.textContent=`
+    .${o}.ant-result {
+      width: 100%;
+      padding: ${t.spacing.default};
+      border: 1px solid ${t.border.default};
+      border-radius: ${t.border.radius};
+      background: ${t.surface.default};
+      color: ${t.text.body};
+      font-family: 'Nunito', sans-serif;
+      transition: none !important;
+      animation: none !important;
+    }
+
+    .${o}.ant-result,
+    .${o}.ant-result .ant-result-icon,
+    .${o}.ant-result .ant-result-title,
+    .${o}.ant-result .ant-result-subtitle,
+    .${o}.ant-result .ant-result-extra,
+    .${o}.ant-result .ant-result-content {
+      transition: none !important;
+      animation: none !important;
+    }
+
+    .${o}.ant-result .ant-result-icon {
+      margin-bottom: 14px;
+      line-height: 0;
+    }
+
+    .${o}.ant-result .ant-result-title {
+      color: ${t.text.title};
+      font-size: ${t.typography.title.fontSize};
+      font-weight: ${t.typography.title.fontWeight};
+      line-height: ${t.typography.title.lineHeight};
+      letter-spacing: ${t.typography.title.letterSpacing};
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-result .ant-result-subtitle {
+      max-width: 560px;
+      margin: 8px auto 0;
+      color: ${t.text.subtitle};
+      font-size: ${t.typography.subtitle.fontSize};
+      font-weight: ${t.typography.subtitle.fontWeight};
+      line-height: ${t.typography.subtitle.lineHeight};
+      letter-spacing: ${t.typography.subtitle.letterSpacing};
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-result .ant-result-extra {
+      display: flex;
+      width: 100%;
+      flex-wrap: wrap;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      margin: ${t.spacing.extraGap} 0 0;
+      text-align: center;
+    }
+
+    .${o}.ant-result .ant-result-extra > * {
+      margin-inline-end: 0;
+    }
+
+    .${o}.ant-result .ant-result-content {
+      margin-top: 18px;
+      padding: 14px 16px;
+      border-radius: ${t.border.radius};
+      background: ${t.surface.subtle};
+      color: ${t.text.body};
+      font-size: ${t.typography.body.fontSize};
+      font-weight: ${t.typography.body.fontWeight};
+      line-height: ${t.typography.body.lineHeight};
+      text-align: left;
+    }
+
+    .${o}.ant-result[data-ds-result-variant='empty'] {
+      background: ${t.surface.empty};
+    }
+
+    .${o}.ant-result[data-ds-result-variant='permission'] {
+      background: ${t.surface.permission};
+      border-color: ${t.border.strong};
+    }
+
+    .${o}.ant-result[data-ds-result-variant='submitted'] {
+      background: ${t.surface.submitted};
+    }
+
+    @media (max-width: 640px) {
+      .${o}.ant-result {
+        padding: ${t.spacing.compact};
+      }
+    }
+  `}function f(n){let r=c[n];return r?(0,i.jsx)(t.Icon,{dsStatus:r,dsSize:e.dsSemanticTokens.result.iconSize,"aria-label":`${n} result`}):(0,i.jsx)(t.Icon,{dsGroup:n===`permission`?`action`:n===`empty`?`empty`:`action`,dsName:l[n],dsSize:e.dsSemanticTokens.result.iconSize,dsTone:n===`empty`?`muted`:`brand`,"aria-label":`${n} result`})}var p=({className:e,dsSubTitle:t,dsTitle:a,dsVariant:c=`success`,...l})=>{(0,r.useEffect)(()=>{d()},[]);let p=s[c];return(0,i.jsx)(n.Result,{...l,className:u(o,e),"data-ds-result-variant":c,icon:f(c),subTitle:t??p.subTitle,title:a??p.title})};p.displayName=`Result`,p.PRESENTED_IMAGE_404=n.Result.PRESENTED_IMAGE_404,p.PRESENTED_IMAGE_403=n.Result.PRESENTED_IMAGE_403,p.PRESENTED_IMAGE_500=n.Result.PRESENTED_IMAGE_500,exports.Result=p;
+//# sourceMappingURL=Result.cjs.map

package/dist-lib/feedback/Result.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Result.cjs","names":[],"sources":["../../src/ds/feedback/Result.tsx"],"sourcesContent":["import { Result as AntResult } from 'antd';\nimport type { ResultProps as AntResultProps } from 'antd/es/result';\nimport type { FC, ReactNode } from 'react';\nimport { useEffect } from 'react';\nimport { Icon } from '../display';\nimport type { DSIconName, DSIconStatus } from '../display';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSResultVariant = 'success' | 'error' | 'warning' | 'empty' | 'permission' | 'submitted';\n\nexport type ResultProps = Omit<AntResultProps, 'status' | 'icon' | 'title' | 'subTitle' | 'styles'> & {\n  /** Semantic DS result variant for workflow outcomes. */\n  dsVariant?: DSResultVariant;\n  /** Concise result title. Defaults from `dsVariant` when omitted. */\n  dsTitle?: ReactNode;\n  /** Supporting result copy. Defaults from `dsVariant` when omitted. */\n  dsSubTitle?: ReactNode;\n};\n\ntype DSResultComponent = FC<ResultProps> & {\n  PRESENTED_IMAGE_404: typeof AntResult.PRESENTED_IMAGE_404;\n  PRESENTED_IMAGE_403: typeof AntResult.PRESENTED_IMAGE_403;\n  PRESENTED_IMAGE_500: typeof AntResult.PRESENTED_IMAGE_500;\n};\n\nconst STYLE_ID = 'ds-result-styles';\nconst DS_RESULT_CLASS = 'ds-result';\n\nconst DEFAULT_CONTENT: Record<DSResultVariant, { title: string; subTitle: string }> = {\n  success: {\n    title: 'Workflow complete',\n    subTitle: 'The requested workflow has been completed successfully.',\n  },\n  error: {\n    title: 'Unable to complete workflow',\n    subTitle: 'Review the details and try again, or contact support if the issue continues.',\n  },\n  warning: {\n    title: 'Review required',\n    subTitle: 'Some details need attention before this workflow can continue.',\n  },\n  empty: {\n    title: 'No results found',\n    subTitle: 'Adjust your filters or search terms to continue.',\n  },\n  permission: {\n    title: 'Permission required',\n    subTitle: 'You do not currently have access to this workflow or record.',\n  },\n  submitted: {\n    title: 'Submitted for review',\n    subTitle: 'The request has been submitted and is ready for the next review step.',\n  },\n};\n\nconst ICON_STATUS_BY_VARIANT: Partial<Record<DSResultVariant, DSIconStatus>> = {\n  success: 'success',\n  error: 'error',\n  warning: 'warning',\n};\n\nconst ICON_NAME_BY_VARIANT: Partial<Record<DSResultVariant, DSIconName>> = {\n  empty: 'folderEmpty',\n  permission: 'lock',\n  submitted: 'uploadTop',\n};\n\nfunction mergeClassNames(...classNames: Array<string | undefined>) {\n  return classNames.filter(Boolean).join(' ').trim();\n}\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { result } = dsSemanticTokens;\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .${DS_RESULT_CLASS}.ant-result {\n      width: 100%;\n      padding: ${result.spacing.default};\n      border: 1px solid ${result.border.default};\n      border-radius: ${result.border.radius};\n      background: ${result.surface.default};\n      color: ${result.text.body};\n      font-family: 'Nunito', sans-serif;\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-icon,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-title,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-subtitle,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-content {\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-icon {\n      margin-bottom: 14px;\n      line-height: 0;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-title {\n      color: ${result.text.title};\n      font-size: ${result.typography.title.fontSize};\n      font-weight: ${result.typography.title.fontWeight};\n      line-height: ${result.typography.title.lineHeight};\n      letter-spacing: ${result.typography.title.letterSpacing};\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-subtitle {\n      max-width: 560px;\n      margin: 8px auto 0;\n      color: ${result.text.subtitle};\n      font-size: ${result.typography.subtitle.fontSize};\n      font-weight: ${result.typography.subtitle.fontWeight};\n      line-height: ${result.typography.subtitle.lineHeight};\n      letter-spacing: ${result.typography.subtitle.letterSpacing};\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra {\n      display: flex;\n      width: 100%;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      margin: ${result.spacing.extraGap} 0 0;\n      text-align: center;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra > * {\n      margin-inline-end: 0;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-content {\n      margin-top: 18px;\n      padding: 14px 16px;\n      border-radius: ${result.border.radius};\n      background: ${result.surface.subtle};\n      color: ${result.text.body};\n      font-size: ${result.typography.body.fontSize};\n      font-weight: ${result.typography.body.fontWeight};\n      line-height: ${result.typography.body.lineHeight};\n      text-align: left;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='empty'] {\n      background: ${result.surface.empty};\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='permission'] {\n      background: ${result.surface.permission};\n      border-color: ${result.border.strong};\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='submitted'] {\n      background: ${result.surface.submitted};\n    }\n\n    @media (max-width: 640px) {\n      .${DS_RESULT_CLASS}.ant-result {\n        padding: ${result.spacing.compact};\n      }\n    }\n  `;\n}\n\nfunction getIcon(dsVariant: DSResultVariant) {\n  const status = ICON_STATUS_BY_VARIANT[dsVariant];\n  if (status) {\n    return <Icon dsStatus={status} dsSize={dsSemanticTokens.result.iconSize} aria-label={`${dsVariant} result`} />;\n  }\n\n  return (\n    <Icon\n      dsGroup={dsVariant === 'permission' ? 'action' : dsVariant === 'empty' ? 'empty' : 'action'}\n      dsName={ICON_NAME_BY_VARIANT[dsVariant]}\n      dsSize={dsSemanticTokens.result.iconSize}\n      dsTone={dsVariant === 'empty' ? 'muted' : 'brand'}\n      aria-label={`${dsVariant} result`}\n    />\n  );\n}\n\nexport const Result: DSResultComponent = ({\n  className,\n  dsSubTitle,\n  dsTitle,\n  dsVariant = 'success',\n  ...props\n}: ResultProps) => {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const defaults = DEFAULT_CONTENT[dsVariant];\n\n  return (\n    <AntResult\n      {...props}\n      className={mergeClassNames(DS_RESULT_CLASS, className)}\n      data-ds-result-variant={dsVariant}\n      icon={getIcon(dsVariant)}\n      subTitle={dsSubTitle ?? defaults.subTitle}\n      title={dsTitle ?? defaults.title}\n    />\n  );\n};\n\nResult.displayName = 'Result';\nResult.PRESENTED_IMAGE_404 = AntResult.PRESENTED_IMAGE_404;\nResult.PRESENTED_IMAGE_403 = AntResult.PRESENTED_IMAGE_403;\nResult.PRESENTED_IMAGE_500 = AntResult.PRESENTED_IMAGE_500;\n"],"mappings":"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"}

package/dist-lib/feedback/Result.js

@@ -0,0 +1,174 @@
+import { dsSemanticTokens as e } from "../theme.js";
+import { Icon as t } from "../display/Icon.js";
+import { Result as n } from "antd";
+import { useEffect as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/ds/feedback/Result.tsx
+var a = "ds-result-styles", o = "ds-result", s = {
+	success: {
+		title: "Workflow complete",
+		subTitle: "The requested workflow has been completed successfully."
+	},
+	error: {
+		title: "Unable to complete workflow",
+		subTitle: "Review the details and try again, or contact support if the issue continues."
+	},
+	warning: {
+		title: "Review required",
+		subTitle: "Some details need attention before this workflow can continue."
+	},
+	empty: {
+		title: "No results found",
+		subTitle: "Adjust your filters or search terms to continue."
+	},
+	permission: {
+		title: "Permission required",
+		subTitle: "You do not currently have access to this workflow or record."
+	},
+	submitted: {
+		title: "Submitted for review",
+		subTitle: "The request has been submitted and is ready for the next review step."
+	}
+}, c = {
+	success: "success",
+	error: "error",
+	warning: "warning"
+}, l = {
+	empty: "folderEmpty",
+	permission: "lock",
+	submitted: "uploadTop"
+};
+function u(...e) {
+	return e.filter(Boolean).join(" ").trim();
+}
+function d() {
+	if (typeof document > "u") return;
+	let { result: t } = e, n = document.getElementById(a);
+	n || (n = document.createElement("style"), n.id = a, document.head.appendChild(n)), n.textContent = `
+    .${o}.ant-result {
+      width: 100%;
+      padding: ${t.spacing.default};
+      border: 1px solid ${t.border.default};
+      border-radius: ${t.border.radius};
+      background: ${t.surface.default};
+      color: ${t.text.body};
+      font-family: 'Nunito', sans-serif;
+      transition: none !important;
+      animation: none !important;
+    }
+
+    .${o}.ant-result,
+    .${o}.ant-result .ant-result-icon,
+    .${o}.ant-result .ant-result-title,
+    .${o}.ant-result .ant-result-subtitle,
+    .${o}.ant-result .ant-result-extra,
+    .${o}.ant-result .ant-result-content {
+      transition: none !important;
+      animation: none !important;
+    }
+
+    .${o}.ant-result .ant-result-icon {
+      margin-bottom: 14px;
+      line-height: 0;
+    }
+
+    .${o}.ant-result .ant-result-title {
+      color: ${t.text.title};
+      font-size: ${t.typography.title.fontSize};
+      font-weight: ${t.typography.title.fontWeight};
+      line-height: ${t.typography.title.lineHeight};
+      letter-spacing: ${t.typography.title.letterSpacing};
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-result .ant-result-subtitle {
+      max-width: 560px;
+      margin: 8px auto 0;
+      color: ${t.text.subtitle};
+      font-size: ${t.typography.subtitle.fontSize};
+      font-weight: ${t.typography.subtitle.fontWeight};
+      line-height: ${t.typography.subtitle.lineHeight};
+      letter-spacing: ${t.typography.subtitle.letterSpacing};
+      overflow-wrap: anywhere;
+    }
+
+    .${o}.ant-result .ant-result-extra {
+      display: flex;
+      width: 100%;
+      flex-wrap: wrap;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      margin: ${t.spacing.extraGap} 0 0;
+      text-align: center;
+    }
+
+    .${o}.ant-result .ant-result-extra > * {
+      margin-inline-end: 0;
+    }
+
+    .${o}.ant-result .ant-result-content {
+      margin-top: 18px;
+      padding: 14px 16px;
+      border-radius: ${t.border.radius};
+      background: ${t.surface.subtle};
+      color: ${t.text.body};
+      font-size: ${t.typography.body.fontSize};
+      font-weight: ${t.typography.body.fontWeight};
+      line-height: ${t.typography.body.lineHeight};
+      text-align: left;
+    }
+
+    .${o}.ant-result[data-ds-result-variant='empty'] {
+      background: ${t.surface.empty};
+    }
+
+    .${o}.ant-result[data-ds-result-variant='permission'] {
+      background: ${t.surface.permission};
+      border-color: ${t.border.strong};
+    }
+
+    .${o}.ant-result[data-ds-result-variant='submitted'] {
+      background: ${t.surface.submitted};
+    }
+
+    @media (max-width: 640px) {
+      .${o}.ant-result {
+        padding: ${t.spacing.compact};
+      }
+    }
+  `;
+}
+function f(n) {
+	let r = c[n];
+	return r ? /* @__PURE__ */ i(t, {
+		dsStatus: r,
+		dsSize: e.result.iconSize,
+		"aria-label": `${n} result`
+	}) : /* @__PURE__ */ i(t, {
+		dsGroup: n === "permission" ? "action" : n === "empty" ? "empty" : "action",
+		dsName: l[n],
+		dsSize: e.result.iconSize,
+		dsTone: n === "empty" ? "muted" : "brand",
+		"aria-label": `${n} result`
+	});
+}
+var p = ({ className: e, dsSubTitle: t, dsTitle: a, dsVariant: c = "success", ...l }) => {
+	r(() => {
+		d();
+	}, []);
+	let p = s[c];
+	return /* @__PURE__ */ i(n, {
+		...l,
+		className: u(o, e),
+		"data-ds-result-variant": c,
+		icon: f(c),
+		subTitle: t ?? p.subTitle,
+		title: a ?? p.title
+	});
+};
+p.displayName = "Result", p.PRESENTED_IMAGE_404 = n.PRESENTED_IMAGE_404, p.PRESENTED_IMAGE_403 = n.PRESENTED_IMAGE_403, p.PRESENTED_IMAGE_500 = n.PRESENTED_IMAGE_500;
+//#endregion
+export { p as Result };
+
+//# sourceMappingURL=Result.js.map

package/dist-lib/feedback/Result.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Result.js","names":[],"sources":["../../src/ds/feedback/Result.tsx"],"sourcesContent":["import { Result as AntResult } from 'antd';\nimport type { ResultProps as AntResultProps } from 'antd/es/result';\nimport type { FC, ReactNode } from 'react';\nimport { useEffect } from 'react';\nimport { Icon } from '../display';\nimport type { DSIconName, DSIconStatus } from '../display';\nimport { dsSemanticTokens } from '../../theme/ontadaTheme';\n\nexport type DSResultVariant = 'success' | 'error' | 'warning' | 'empty' | 'permission' | 'submitted';\n\nexport type ResultProps = Omit<AntResultProps, 'status' | 'icon' | 'title' | 'subTitle' | 'styles'> & {\n  /** Semantic DS result variant for workflow outcomes. */\n  dsVariant?: DSResultVariant;\n  /** Concise result title. Defaults from `dsVariant` when omitted. */\n  dsTitle?: ReactNode;\n  /** Supporting result copy. Defaults from `dsVariant` when omitted. */\n  dsSubTitle?: ReactNode;\n};\n\ntype DSResultComponent = FC<ResultProps> & {\n  PRESENTED_IMAGE_404: typeof AntResult.PRESENTED_IMAGE_404;\n  PRESENTED_IMAGE_403: typeof AntResult.PRESENTED_IMAGE_403;\n  PRESENTED_IMAGE_500: typeof AntResult.PRESENTED_IMAGE_500;\n};\n\nconst STYLE_ID = 'ds-result-styles';\nconst DS_RESULT_CLASS = 'ds-result';\n\nconst DEFAULT_CONTENT: Record<DSResultVariant, { title: string; subTitle: string }> = {\n  success: {\n    title: 'Workflow complete',\n    subTitle: 'The requested workflow has been completed successfully.',\n  },\n  error: {\n    title: 'Unable to complete workflow',\n    subTitle: 'Review the details and try again, or contact support if the issue continues.',\n  },\n  warning: {\n    title: 'Review required',\n    subTitle: 'Some details need attention before this workflow can continue.',\n  },\n  empty: {\n    title: 'No results found',\n    subTitle: 'Adjust your filters or search terms to continue.',\n  },\n  permission: {\n    title: 'Permission required',\n    subTitle: 'You do not currently have access to this workflow or record.',\n  },\n  submitted: {\n    title: 'Submitted for review',\n    subTitle: 'The request has been submitted and is ready for the next review step.',\n  },\n};\n\nconst ICON_STATUS_BY_VARIANT: Partial<Record<DSResultVariant, DSIconStatus>> = {\n  success: 'success',\n  error: 'error',\n  warning: 'warning',\n};\n\nconst ICON_NAME_BY_VARIANT: Partial<Record<DSResultVariant, DSIconName>> = {\n  empty: 'folderEmpty',\n  permission: 'lock',\n  submitted: 'uploadTop',\n};\n\nfunction mergeClassNames(...classNames: Array<string | undefined>) {\n  return classNames.filter(Boolean).join(' ').trim();\n}\n\nfunction injectStyles() {\n  if (typeof document === 'undefined') return;\n\n  const { result } = dsSemanticTokens;\n  let style = document.getElementById(STYLE_ID) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement('style');\n    style.id = STYLE_ID;\n    document.head.appendChild(style);\n  }\n\n  style.textContent = `\n    .${DS_RESULT_CLASS}.ant-result {\n      width: 100%;\n      padding: ${result.spacing.default};\n      border: 1px solid ${result.border.default};\n      border-radius: ${result.border.radius};\n      background: ${result.surface.default};\n      color: ${result.text.body};\n      font-family: 'Nunito', sans-serif;\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-icon,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-title,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-subtitle,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra,\n    .${DS_RESULT_CLASS}.ant-result .ant-result-content {\n      transition: none !important;\n      animation: none !important;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-icon {\n      margin-bottom: 14px;\n      line-height: 0;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-title {\n      color: ${result.text.title};\n      font-size: ${result.typography.title.fontSize};\n      font-weight: ${result.typography.title.fontWeight};\n      line-height: ${result.typography.title.lineHeight};\n      letter-spacing: ${result.typography.title.letterSpacing};\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-subtitle {\n      max-width: 560px;\n      margin: 8px auto 0;\n      color: ${result.text.subtitle};\n      font-size: ${result.typography.subtitle.fontSize};\n      font-weight: ${result.typography.subtitle.fontWeight};\n      line-height: ${result.typography.subtitle.lineHeight};\n      letter-spacing: ${result.typography.subtitle.letterSpacing};\n      overflow-wrap: anywhere;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra {\n      display: flex;\n      width: 100%;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      margin: ${result.spacing.extraGap} 0 0;\n      text-align: center;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-extra > * {\n      margin-inline-end: 0;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result .ant-result-content {\n      margin-top: 18px;\n      padding: 14px 16px;\n      border-radius: ${result.border.radius};\n      background: ${result.surface.subtle};\n      color: ${result.text.body};\n      font-size: ${result.typography.body.fontSize};\n      font-weight: ${result.typography.body.fontWeight};\n      line-height: ${result.typography.body.lineHeight};\n      text-align: left;\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='empty'] {\n      background: ${result.surface.empty};\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='permission'] {\n      background: ${result.surface.permission};\n      border-color: ${result.border.strong};\n    }\n\n    .${DS_RESULT_CLASS}.ant-result[data-ds-result-variant='submitted'] {\n      background: ${result.surface.submitted};\n    }\n\n    @media (max-width: 640px) {\n      .${DS_RESULT_CLASS}.ant-result {\n        padding: ${result.spacing.compact};\n      }\n    }\n  `;\n}\n\nfunction getIcon(dsVariant: DSResultVariant) {\n  const status = ICON_STATUS_BY_VARIANT[dsVariant];\n  if (status) {\n    return <Icon dsStatus={status} dsSize={dsSemanticTokens.result.iconSize} aria-label={`${dsVariant} result`} />;\n  }\n\n  return (\n    <Icon\n      dsGroup={dsVariant === 'permission' ? 'action' : dsVariant === 'empty' ? 'empty' : 'action'}\n      dsName={ICON_NAME_BY_VARIANT[dsVariant]}\n      dsSize={dsSemanticTokens.result.iconSize}\n      dsTone={dsVariant === 'empty' ? 'muted' : 'brand'}\n      aria-label={`${dsVariant} result`}\n    />\n  );\n}\n\nexport const Result: DSResultComponent = ({\n  className,\n  dsSubTitle,\n  dsTitle,\n  dsVariant = 'success',\n  ...props\n}: ResultProps) => {\n  useEffect(() => {\n    injectStyles();\n  }, []);\n\n  const defaults = DEFAULT_CONTENT[dsVariant];\n\n  return (\n    <AntResult\n      {...props}\n      className={mergeClassNames(DS_RESULT_CLASS, className)}\n      data-ds-result-variant={dsVariant}\n      icon={getIcon(dsVariant)}\n      subTitle={dsSubTitle ?? defaults.subTitle}\n      title={dsTitle ?? defaults.title}\n    />\n  );\n};\n\nResult.displayName = 'Result';\nResult.PRESENTED_IMAGE_404 = AntResult.PRESENTED_IMAGE_404;\nResult.PRESENTED_IMAGE_403 = AntResult.PRESENTED_IMAGE_403;\nResult.PRESENTED_IMAGE_500 = AntResult.PRESENTED_IMAGE_500;\n"],"mappings":"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"}