@veeqo/ui 15.5.0 → 15.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -24,8 +24,9 @@ const ToastsLayout = ({ className, e2eClassName, toasts, minWidth = '50vw', max
24
24
  onCloseRef.current = onClose;
25
25
  }, [onClose]);
26
26
  React.useEffect(() => {
27
- if (typeof max === 'number' && toasts.length > max)
27
+ if (typeof max === 'number' && toasts.length > max && onCloseRef.current) {
28
28
  onCloseRef.current(toasts[0].key);
29
+ }
29
30
  }, [toasts, max]);
30
31
  // Clean up refs only after exit animation completes (via onExited callback)
31
32
  const handleExited = React.useCallback((key) => {
@@ -53,7 +54,7 @@ const ToastsLayout = ({ className, e2eClassName, toasts, minWidth = '50vw', max
53
54
  exit: Toast_module.exit,
54
55
  exitActive: Toast_module.exitActive,
55
56
  }, onExited: () => handleExited(toast.key) },
56
- React__default.default.createElement(Toast.Toast, { ref: nodeRef, className: className, e2eClassName: e2eClassName, minWidth: resolvedMinWidth, last: index === toasts.length - 1, onClose: () => onClose(toast.key), ...toast })));
57
+ React__default.default.createElement(Toast.Toast, { ref: nodeRef, className: className, e2eClassName: e2eClassName, minWidth: resolvedMinWidth, last: index === toasts.length - 1, onClose: onClose ? () => onClose(toast.key) : undefined, ...toast })));
57
58
  }))), document.body);
58
59
  };
59
60
 
@@ -1 +1 @@
1
- {"version":3,"file":"ToastsLayout.cjs","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Toast } from './components/Toast';\nimport toastStyles from './components/Toast.module.scss';\nimport styles from './ToastsLayout.module.scss';\nimport { ToastsLayoutPropTypes } from './types';\n\n/**\n * A fixed-position container that manages stacking, animating, and dismissing toast notifications.\n * Renders into a portal on `document.body`. Only one instance should exist per application.\n */\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n const nodeRefs = useRef(new Map<string, { current: HTMLDivElement | null }>());\n\n // Stable ref to avoid re-triggering the dismiss effect when onClose identity changes\n const onCloseRef = useRef(onClose);\n useEffect(() => {\n onCloseRef.current = onClose;\n }, [onClose]);\n\n useEffect(() => {\n if (typeof max === 'number' && toasts.length > max) onCloseRef.current(toasts[0].key);\n }, [toasts, max]);\n\n // Clean up refs only after exit animation completes (via onExited callback)\n const handleExited = useCallback((key: string) => {\n nodeRefs.current.delete(key);\n }, []);\n\n let resolvedMinWidth: string | undefined;\n if (!minWidth && minWidth !== 0) {\n resolvedMinWidth = undefined;\n } else if (typeof minWidth === 'number' || !isNaN(Number(minWidth))) {\n resolvedMinWidth = `${minWidth}px`;\n } else {\n resolvedMinWidth = String(minWidth);\n }\n\n return createPortal(\n <FlexCol\n alignItems=\"center\"\n gap=\"base\"\n className={styles.ToastsLayoutContainer}\n aria-live=\"polite\"\n aria-atomic=\"false\"\n >\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => {\n if (!nodeRefs.current.has(toast.key)) {\n nodeRefs.current.set(toast.key, { current: null });\n }\n const nodeRef = nodeRefs.current.get(toast.key)!;\n\n return (\n <CSSTransition\n nodeRef={nodeRef}\n key={toast.key}\n timeout={500}\n classNames={{\n enter: toastStyles.enter,\n enterActive: toastStyles.enterActive,\n exit: toastStyles.exit,\n exitActive: toastStyles.exitActive,\n }}\n onExited={() => handleExited(toast.key)}\n >\n <Toast\n ref={nodeRef}\n className={className}\n e2eClassName={e2eClassName}\n minWidth={resolvedMinWidth}\n last={index === toasts.length - 1}\n onClose={() => onClose(toast.key)}\n {...toast}\n />\n </CSSTransition>\n );\n })}\n </TransitionGroup>\n </FlexCol>,\n document.body,\n );\n};\n"],"names":["useRef","useEffect","useCallback","createPortal","React","FlexCol","styles","TransitionGroup","CSSTransition","toastStyles","Toast"],"mappings":";;;;;;;;;;;;;;AASA;;;AAGG;MACU,YAAY,GAA8B,CAAC,EACtD,SAAS,EACT,YAAY,EACZ,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,GAAG,GAAG,CAAC,EACP,OAAO,GACR,KAAI;IACH,MAAM,QAAQ,GAAGA,YAAM,CAAC,IAAI,GAAG,EAA8C,CAAC;;AAG9E,IAAA,MAAM,UAAU,GAAGA,YAAM,CAAC,OAAO,CAAC;IAClCC,eAAS,CAAC,MAAK;AACb,QAAA,UAAU,CAAC,OAAO,GAAG,OAAO;AAC9B,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;IAEbA,eAAS,CAAC,MAAK;QACb,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,MAAM,CAAC,MAAM,GAAG,GAAG;YAAE,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;AACvF,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;;AAGjB,IAAA,MAAM,YAAY,GAAGC,iBAAW,CAAC,CAAC,GAAW,KAAI;AAC/C,QAAA,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC;IAC9B,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,gBAAoC;AACxC,IAAA,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,CAAC,EAAE;QAC/B,gBAAgB,GAAG,SAAS;AAC7B,IAAA;AAAM,SAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE;AACnE,QAAA,gBAAgB,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI;AACnC,IAAA;AAAM,SAAA;AACL,QAAA,gBAAgB,GAAG,MAAM,CAAC,QAAQ,CAAC;AACpC,IAAA;IAED,OAAOC,qBAAY,CACjBC,sBAAA,CAAA,aAAA,CAACC,eAAO,IACN,UAAU,EAAC,QAAQ,EACnB,GAAG,EAAC,MAAM,EACV,SAAS,EAAEC,mBAAM,CAAC,qBAAqB,EAAA,WAAA,EAC7B,QAAQ,EAAA,aAAA,EACN,OAAO,EAAA;QAEnBF,sBAAA,CAAA,aAAA,CAACG,oCAAe,IAAC,SAAS,EAAE,IAAI,EAAA,EAC7B,CAAC,GAAG,MAAM,CAAC,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAAI;YAC1C,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;AACpC,gBAAA,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACnD,YAAA;AACD,YAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAE;AAEhD,YAAA,QACEH,sBAAA,CAAA,aAAA,CAACI,kCAAa,IACZ,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,OAAO,EAAE,GAAG,EACZ,UAAU,EAAE;oBACV,KAAK,EAAEC,YAAW,CAAC,KAAK;oBACxB,WAAW,EAAEA,YAAW,CAAC,WAAW;oBACpC,IAAI,EAAEA,YAAW,CAAC,IAAI;oBACtB,UAAU,EAAEA,YAAW,CAAC,UAAU;iBACnC,EACD,QAAQ,EAAE,MAAM,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,EAAA;gBAEvCL,sBAAA,CAAA,aAAA,CAACM,WAAK,IACJ,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,gBAAgB,EAC1B,IAAI,EAAE,KAAK,KAAK,MAAM,CAAC,MAAM,GAAG,CAAC,EACjC,OAAO,EAAE,MAAM,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EAAA,GAC7B,KAAK,EAAA,CACT,CACY;QAEpB,CAAC,CAAC,CACc,CACV,EACV,QAAQ,CAAC,IAAI,CACd;AACH;;;;"}
1
+ {"version":3,"file":"ToastsLayout.cjs","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Toast } from './components/Toast';\nimport toastStyles from './components/Toast.module.scss';\nimport styles from './ToastsLayout.module.scss';\nimport { ToastsLayoutPropTypes } from './types';\n\n/**\n * A fixed-position container that manages stacking, animating, and dismissing toast notifications.\n * Renders into a portal on `document.body`. Only one instance should exist per application.\n */\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n const nodeRefs = useRef(new Map<string, { current: HTMLDivElement | null }>());\n\n // Stable ref to avoid re-triggering the dismiss effect when onClose identity changes\n const onCloseRef = useRef(onClose);\n useEffect(() => {\n onCloseRef.current = onClose;\n }, [onClose]);\n\n useEffect(() => {\n if (typeof max === 'number' && toasts.length > max && onCloseRef.current) {\n onCloseRef.current(toasts[0].key);\n }\n }, [toasts, max]);\n\n // Clean up refs only after exit animation completes (via onExited callback)\n const handleExited = useCallback((key: string) => {\n nodeRefs.current.delete(key);\n }, []);\n\n let resolvedMinWidth: string | undefined;\n if (!minWidth && minWidth !== 0) {\n resolvedMinWidth = undefined;\n } else if (typeof minWidth === 'number' || !isNaN(Number(minWidth))) {\n resolvedMinWidth = `${minWidth}px`;\n } else {\n resolvedMinWidth = String(minWidth);\n }\n\n return createPortal(\n <FlexCol\n alignItems=\"center\"\n gap=\"base\"\n className={styles.ToastsLayoutContainer}\n aria-live=\"polite\"\n aria-atomic=\"false\"\n >\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => {\n if (!nodeRefs.current.has(toast.key)) {\n nodeRefs.current.set(toast.key, { current: null });\n }\n const nodeRef = nodeRefs.current.get(toast.key)!;\n\n return (\n <CSSTransition\n nodeRef={nodeRef}\n key={toast.key}\n timeout={500}\n classNames={{\n enter: toastStyles.enter,\n enterActive: toastStyles.enterActive,\n exit: toastStyles.exit,\n exitActive: toastStyles.exitActive,\n }}\n onExited={() => handleExited(toast.key)}\n >\n <Toast\n ref={nodeRef}\n className={className}\n e2eClassName={e2eClassName}\n minWidth={resolvedMinWidth}\n last={index === toasts.length - 1}\n onClose={onClose ? () => onClose(toast.key) : undefined}\n {...toast}\n />\n </CSSTransition>\n );\n })}\n </TransitionGroup>\n </FlexCol>,\n document.body,\n );\n};\n"],"names":["useRef","useEffect","useCallback","createPortal","React","FlexCol","styles","TransitionGroup","CSSTransition","toastStyles","Toast"],"mappings":"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"}
@@ -18,8 +18,9 @@ const ToastsLayout = ({ className, e2eClassName, toasts, minWidth = '50vw', max
18
18
  onCloseRef.current = onClose;
19
19
  }, [onClose]);
20
20
  useEffect(() => {
21
- if (typeof max === 'number' && toasts.length > max)
21
+ if (typeof max === 'number' && toasts.length > max && onCloseRef.current) {
22
22
  onCloseRef.current(toasts[0].key);
23
+ }
23
24
  }, [toasts, max]);
24
25
  // Clean up refs only after exit animation completes (via onExited callback)
25
26
  const handleExited = useCallback((key) => {
@@ -47,7 +48,7 @@ const ToastsLayout = ({ className, e2eClassName, toasts, minWidth = '50vw', max
47
48
  exit: toastStyles.exit,
48
49
  exitActive: toastStyles.exitActive,
49
50
  }, onExited: () => handleExited(toast.key) },
50
- React__default.createElement(Toast, { ref: nodeRef, className: className, e2eClassName: e2eClassName, minWidth: resolvedMinWidth, last: index === toasts.length - 1, onClose: () => onClose(toast.key), ...toast })));
51
+ React__default.createElement(Toast, { ref: nodeRef, className: className, e2eClassName: e2eClassName, minWidth: resolvedMinWidth, last: index === toasts.length - 1, onClose: onClose ? () => onClose(toast.key) : undefined, ...toast })));
51
52
  }))), document.body);
52
53
  };
53
54
 
@@ -1 +1 @@
1
- {"version":3,"file":"ToastsLayout.js","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Toast } from './components/Toast';\nimport toastStyles from './components/Toast.module.scss';\nimport styles from './ToastsLayout.module.scss';\nimport { ToastsLayoutPropTypes } from './types';\n\n/**\n * A fixed-position container that manages stacking, animating, and dismissing toast notifications.\n * Renders into a portal on `document.body`. Only one instance should exist per application.\n */\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n const nodeRefs = useRef(new Map<string, { current: HTMLDivElement | null }>());\n\n // Stable ref to avoid re-triggering the dismiss effect when onClose identity changes\n const onCloseRef = useRef(onClose);\n useEffect(() => {\n onCloseRef.current = onClose;\n }, [onClose]);\n\n useEffect(() => {\n if (typeof max === 'number' && toasts.length > max) onCloseRef.current(toasts[0].key);\n }, [toasts, max]);\n\n // Clean up refs only after exit animation completes (via onExited callback)\n const handleExited = useCallback((key: string) => {\n nodeRefs.current.delete(key);\n }, []);\n\n let resolvedMinWidth: string | undefined;\n if (!minWidth && minWidth !== 0) {\n resolvedMinWidth = undefined;\n } else if (typeof minWidth === 'number' || !isNaN(Number(minWidth))) {\n resolvedMinWidth = `${minWidth}px`;\n } else {\n resolvedMinWidth = String(minWidth);\n }\n\n return createPortal(\n <FlexCol\n alignItems=\"center\"\n gap=\"base\"\n className={styles.ToastsLayoutContainer}\n aria-live=\"polite\"\n aria-atomic=\"false\"\n >\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => {\n if (!nodeRefs.current.has(toast.key)) {\n nodeRefs.current.set(toast.key, { current: null });\n }\n const nodeRef = nodeRefs.current.get(toast.key)!;\n\n return (\n <CSSTransition\n nodeRef={nodeRef}\n key={toast.key}\n timeout={500}\n classNames={{\n enter: toastStyles.enter,\n enterActive: toastStyles.enterActive,\n exit: toastStyles.exit,\n exitActive: toastStyles.exitActive,\n }}\n onExited={() => handleExited(toast.key)}\n >\n <Toast\n ref={nodeRef}\n className={className}\n e2eClassName={e2eClassName}\n minWidth={resolvedMinWidth}\n last={index === toasts.length - 1}\n onClose={() => onClose(toast.key)}\n {...toast}\n />\n </CSSTransition>\n );\n })}\n </TransitionGroup>\n </FlexCol>,\n document.body,\n );\n};\n"],"names":["React"],"mappings":"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"}
1
+ {"version":3,"file":"ToastsLayout.js","sources":["../../../src/components/ToastsLayout/ToastsLayout.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Toast } from './components/Toast';\nimport toastStyles from './components/Toast.module.scss';\nimport styles from './ToastsLayout.module.scss';\nimport { ToastsLayoutPropTypes } from './types';\n\n/**\n * A fixed-position container that manages stacking, animating, and dismissing toast notifications.\n * Renders into a portal on `document.body`. Only one instance should exist per application.\n */\nexport const ToastsLayout: FC<ToastsLayoutPropTypes> = ({\n className,\n e2eClassName,\n toasts,\n minWidth = '50vw',\n max = 3,\n onClose,\n}) => {\n const nodeRefs = useRef(new Map<string, { current: HTMLDivElement | null }>());\n\n // Stable ref to avoid re-triggering the dismiss effect when onClose identity changes\n const onCloseRef = useRef(onClose);\n useEffect(() => {\n onCloseRef.current = onClose;\n }, [onClose]);\n\n useEffect(() => {\n if (typeof max === 'number' && toasts.length > max && onCloseRef.current) {\n onCloseRef.current(toasts[0].key);\n }\n }, [toasts, max]);\n\n // Clean up refs only after exit animation completes (via onExited callback)\n const handleExited = useCallback((key: string) => {\n nodeRefs.current.delete(key);\n }, []);\n\n let resolvedMinWidth: string | undefined;\n if (!minWidth && minWidth !== 0) {\n resolvedMinWidth = undefined;\n } else if (typeof minWidth === 'number' || !isNaN(Number(minWidth))) {\n resolvedMinWidth = `${minWidth}px`;\n } else {\n resolvedMinWidth = String(minWidth);\n }\n\n return createPortal(\n <FlexCol\n alignItems=\"center\"\n gap=\"base\"\n className={styles.ToastsLayoutContainer}\n aria-live=\"polite\"\n aria-atomic=\"false\"\n >\n <TransitionGroup component={null}>\n {[...toasts].reverse().map((toast, index) => {\n if (!nodeRefs.current.has(toast.key)) {\n nodeRefs.current.set(toast.key, { current: null });\n }\n const nodeRef = nodeRefs.current.get(toast.key)!;\n\n return (\n <CSSTransition\n nodeRef={nodeRef}\n key={toast.key}\n timeout={500}\n classNames={{\n enter: toastStyles.enter,\n enterActive: toastStyles.enterActive,\n exit: toastStyles.exit,\n exitActive: toastStyles.exitActive,\n }}\n onExited={() => handleExited(toast.key)}\n >\n <Toast\n ref={nodeRef}\n className={className}\n e2eClassName={e2eClassName}\n minWidth={resolvedMinWidth}\n last={index === toasts.length - 1}\n onClose={onClose ? () => onClose(toast.key) : undefined}\n {...toast}\n />\n </CSSTransition>\n );\n })}\n </TransitionGroup>\n </FlexCol>,\n document.body,\n );\n};\n"],"names":["React"],"mappings":"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"}
@@ -38,10 +38,10 @@ const generateClassNames = (prefix) => ({
38
38
  closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,
39
39
  });
40
40
  /**
41
- * A dismissible notification bar with a coloured icon, message text, and optional call-to-action.
42
- * Rendered internally by `ToastsLayout` not intended for standalone use.
41
+ * A notification bar with a coloured icon, message text, and optional call-to-action.
42
+ * Supports an optional close button via `onClose`. Used by `ToastsLayout` or standalone.
43
43
  */
44
- const Toast = React__default.default.forwardRef(({ className, e2eClassName, type, iconSlot, text, last, minWidth, cta, onClose }, ref) => {
44
+ const Toast = React__default.default.forwardRef(({ className, e2eClassName, type, iconSlot, text, last = false, minWidth, cta, onClose }, ref) => {
45
45
  const classNames = generateClassNames(className);
46
46
  const e2eClassNames = generateClassNames(e2eClassName);
47
47
  return (React__default.default.createElement(FlexRow.FlexRow, { ref: ref, alignItems: "center", flexWrap: "nowrap", className: buildClassnames.buildClassnames([
@@ -55,13 +55,13 @@ const Toast = React__default.default.forwardRef(({ className, e2eClassName, type
55
55
  React__default.default.createElement(FlexRow.FlexRow, { alignItems: "center", justifyContent: "space-between", flexGrow: 1, flexWrap: "nowrap" },
56
56
  React__default.default.createElement(Text.Text, { variant: "subheadingMedium", className: Toast_module.text }, text),
57
57
  cta),
58
- React__default.default.createElement(Action.Action, { variant: "flat",
58
+ onClose && (React__default.default.createElement(Action.Action, { variant: "flat",
59
59
  // Always white on dark toast background
60
60
  iconSlot: React__default.default.createElement(CrossIcon.ReactComponent, { color: "white" }), onClick: onClose, "aria-label": "Close", className: buildClassnames.buildClassnames([
61
61
  classNames.closeIcon,
62
62
  e2eClassNames.closeIcon,
63
63
  Toast_module.closeAction,
64
- ]) })));
64
+ ]) }))));
65
65
  });
66
66
  Toast.displayName = 'Toast';
67
67
 
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.cjs","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { AttentionIcon, CrossIcon, InfoIcon, MergeIcon, SuccessIcon } from '../../../icons';\nimport { assignCssVars } from '../../../utils';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Action } from '../../Action';\nimport { FlexRow } from '../../Flex/FlexRow';\nimport { Text } from '../../Text';\nimport { ClassNamesReturnPayload, ToastPropTypes, ToastType } from '../types';\nimport styles from './Toast.module.scss';\n\nconst toastTypes: ToastType = {\n info: {\n icon: <InfoIcon />,\n },\n success: {\n icon: <SuccessIcon />,\n },\n error: {\n icon: <AttentionIcon />,\n },\n merge: {\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\n/**\n * A dismissible notification bar with a coloured icon, message text, and optional call-to-action.\n * Rendered internally by `ToastsLayout` not intended for standalone use.\n */\nexport const Toast = React.forwardRef<HTMLDivElement, ToastPropTypes>(\n ({ className, e2eClassName, type, iconSlot, text, last, minWidth, cta, onClose }, ref) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <FlexRow\n ref={ref}\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([\n styles['toast-container'],\n styles[`${type}-variant`],\n last && styles.last,\n classNames.container,\n e2eClassNames.container,\n ])}\n justifyContent=\"space-between\"\n style={assignCssVars({ minWidth })}\n gap=\"base\"\n >\n <FlexRow\n justifyContent=\"center\"\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([classNames.icon, e2eClassNames.icon, styles['icon-wrap']])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </FlexRow>\n <FlexRow alignItems=\"center\" justifyContent=\"space-between\" flexGrow={1} flexWrap=\"nowrap\">\n <Text variant=\"subheadingMedium\" className={styles.text}>\n {text}\n </Text>\n {cta}\n </FlexRow>\n <Action\n variant=\"flat\"\n // Always white on dark toast background\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n className={buildClassnames([\n classNames.closeIcon,\n e2eClassNames.closeIcon,\n styles.closeAction,\n ])}\n />\n </FlexRow>\n );\n },\n);\n\nToast.displayName = 'Toast';\n"],"names":["React","InfoIcon","SuccessIcon","AttentionIcon","MergeIcon","FlexRow","buildClassnames","styles","assignCssVars","Text","Action","CrossIcon"],"mappings":"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"}
1
+ {"version":3,"file":"Toast.cjs","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { AttentionIcon, CrossIcon, InfoIcon, MergeIcon, SuccessIcon } from '../../../icons';\nimport { assignCssVars } from '../../../utils';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Action } from '../../Action';\nimport { FlexRow } from '../../Flex/FlexRow';\nimport { Text } from '../../Text';\nimport { ClassNamesReturnPayload, ToastPropTypes, ToastType } from '../types';\nimport styles from './Toast.module.scss';\n\nconst toastTypes: ToastType = {\n info: {\n icon: <InfoIcon />,\n },\n success: {\n icon: <SuccessIcon />,\n },\n error: {\n icon: <AttentionIcon />,\n },\n merge: {\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\n/**\n * A notification bar with a coloured icon, message text, and optional call-to-action.\n * Supports an optional close button via `onClose`. Used by `ToastsLayout` or standalone.\n */\nexport const Toast = React.forwardRef<HTMLDivElement, ToastPropTypes>(\n ({ className, e2eClassName, type, iconSlot, text, last = false, minWidth, cta, onClose }, ref) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <FlexRow\n ref={ref}\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([\n styles['toast-container'],\n styles[`${type}-variant`],\n last && styles.last,\n classNames.container,\n e2eClassNames.container,\n ])}\n justifyContent=\"space-between\"\n style={assignCssVars({ minWidth })}\n gap=\"base\"\n >\n <FlexRow\n justifyContent=\"center\"\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([classNames.icon, e2eClassNames.icon, styles['icon-wrap']])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </FlexRow>\n <FlexRow alignItems=\"center\" justifyContent=\"space-between\" flexGrow={1} flexWrap=\"nowrap\">\n <Text variant=\"subheadingMedium\" className={styles.text}>\n {text}\n </Text>\n {cta}\n </FlexRow>\n {onClose && (\n <Action\n variant=\"flat\"\n // Always white on dark toast background\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n className={buildClassnames([\n classNames.closeIcon,\n e2eClassNames.closeIcon,\n styles.closeAction,\n ])}\n />\n )}\n </FlexRow>\n );\n },\n);\n\nToast.displayName = 'Toast';\n"],"names":["React","InfoIcon","SuccessIcon","AttentionIcon","MergeIcon","FlexRow","buildClassnames","styles","assignCssVars","Text","Action","CrossIcon"],"mappings":"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"}
@@ -1,12 +1,12 @@
1
1
  import React from 'react';
2
2
  /**
3
- * A dismissible notification bar with a coloured icon, message text, and optional call-to-action.
4
- * Rendered internally by `ToastsLayout` not intended for standalone use.
3
+ * A notification bar with a coloured icon, message text, and optional call-to-action.
4
+ * Supports an optional close button via `onClose`. Used by `ToastsLayout` or standalone.
5
5
  */
6
6
  export declare const Toast: React.ForwardRefExoticComponent<Omit<import("../types").Notification, "key"> & {
7
7
  className?: string | undefined;
8
8
  e2eClassName?: string | undefined;
9
- last: boolean;
9
+ last?: boolean | undefined;
10
10
  minWidth?: string | undefined;
11
- onClose: () => void;
11
+ onClose?: (() => void) | undefined;
12
12
  } & React.RefAttributes<HTMLDivElement>>;
@@ -32,10 +32,10 @@ const generateClassNames = (prefix) => ({
32
32
  closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,
33
33
  });
34
34
  /**
35
- * A dismissible notification bar with a coloured icon, message text, and optional call-to-action.
36
- * Rendered internally by `ToastsLayout` not intended for standalone use.
35
+ * A notification bar with a coloured icon, message text, and optional call-to-action.
36
+ * Supports an optional close button via `onClose`. Used by `ToastsLayout` or standalone.
37
37
  */
38
- const Toast = React__default.forwardRef(({ className, e2eClassName, type, iconSlot, text, last, minWidth, cta, onClose }, ref) => {
38
+ const Toast = React__default.forwardRef(({ className, e2eClassName, type, iconSlot, text, last = false, minWidth, cta, onClose }, ref) => {
39
39
  const classNames = generateClassNames(className);
40
40
  const e2eClassNames = generateClassNames(e2eClassName);
41
41
  return (React__default.createElement(FlexRow, { ref: ref, alignItems: "center", flexWrap: "nowrap", className: buildClassnames([
@@ -49,13 +49,13 @@ const Toast = React__default.forwardRef(({ className, e2eClassName, type, iconSl
49
49
  React__default.createElement(FlexRow, { alignItems: "center", justifyContent: "space-between", flexGrow: 1, flexWrap: "nowrap" },
50
50
  React__default.createElement(Text, { variant: "subheadingMedium", className: toastStyles.text }, text),
51
51
  cta),
52
- React__default.createElement(Action, { variant: "flat",
52
+ onClose && (React__default.createElement(Action, { variant: "flat",
53
53
  // Always white on dark toast background
54
54
  iconSlot: React__default.createElement(CrossIcon, { color: "white" }), onClick: onClose, "aria-label": "Close", className: buildClassnames([
55
55
  classNames.closeIcon,
56
56
  e2eClassNames.closeIcon,
57
57
  toastStyles.closeAction,
58
- ]) })));
58
+ ]) }))));
59
59
  });
60
60
  Toast.displayName = 'Toast';
61
61
 
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.js","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { AttentionIcon, CrossIcon, InfoIcon, MergeIcon, SuccessIcon } from '../../../icons';\nimport { assignCssVars } from '../../../utils';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Action } from '../../Action';\nimport { FlexRow } from '../../Flex/FlexRow';\nimport { Text } from '../../Text';\nimport { ClassNamesReturnPayload, ToastPropTypes, ToastType } from '../types';\nimport styles from './Toast.module.scss';\n\nconst toastTypes: ToastType = {\n info: {\n icon: <InfoIcon />,\n },\n success: {\n icon: <SuccessIcon />,\n },\n error: {\n icon: <AttentionIcon />,\n },\n merge: {\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\n/**\n * A dismissible notification bar with a coloured icon, message text, and optional call-to-action.\n * Rendered internally by `ToastsLayout` not intended for standalone use.\n */\nexport const Toast = React.forwardRef<HTMLDivElement, ToastPropTypes>(\n ({ className, e2eClassName, type, iconSlot, text, last, minWidth, cta, onClose }, ref) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <FlexRow\n ref={ref}\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([\n styles['toast-container'],\n styles[`${type}-variant`],\n last && styles.last,\n classNames.container,\n e2eClassNames.container,\n ])}\n justifyContent=\"space-between\"\n style={assignCssVars({ minWidth })}\n gap=\"base\"\n >\n <FlexRow\n justifyContent=\"center\"\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([classNames.icon, e2eClassNames.icon, styles['icon-wrap']])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </FlexRow>\n <FlexRow alignItems=\"center\" justifyContent=\"space-between\" flexGrow={1} flexWrap=\"nowrap\">\n <Text variant=\"subheadingMedium\" className={styles.text}>\n {text}\n </Text>\n {cta}\n </FlexRow>\n <Action\n variant=\"flat\"\n // Always white on dark toast background\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n className={buildClassnames([\n classNames.closeIcon,\n e2eClassNames.closeIcon,\n styles.closeAction,\n ])}\n />\n </FlexRow>\n );\n },\n);\n\nToast.displayName = 'Toast';\n"],"names":["React","styles"],"mappings":"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"}
1
+ {"version":3,"file":"Toast.js","sources":["../../../../src/components/ToastsLayout/components/Toast.tsx"],"sourcesContent":["import React from 'react';\nimport { AttentionIcon, CrossIcon, InfoIcon, MergeIcon, SuccessIcon } from '../../../icons';\nimport { assignCssVars } from '../../../utils';\nimport { buildClassnames } from '../../../utils/buildClassnames';\nimport { Action } from '../../Action';\nimport { FlexRow } from '../../Flex/FlexRow';\nimport { Text } from '../../Text';\nimport { ClassNamesReturnPayload, ToastPropTypes, ToastType } from '../types';\nimport styles from './Toast.module.scss';\n\nconst toastTypes: ToastType = {\n info: {\n icon: <InfoIcon />,\n },\n success: {\n icon: <SuccessIcon />,\n },\n error: {\n icon: <AttentionIcon />,\n },\n merge: {\n icon: <MergeIcon />,\n },\n};\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n container: prefix ? `${prefix}-toast-container` : undefined,\n icon: prefix ? `${prefix}-toast-icon` : undefined,\n closeIcon: prefix ? `${prefix}-toast-close-icon` : undefined,\n});\n\n/**\n * A notification bar with a coloured icon, message text, and optional call-to-action.\n * Supports an optional close button via `onClose`. Used by `ToastsLayout` or standalone.\n */\nexport const Toast = React.forwardRef<HTMLDivElement, ToastPropTypes>(\n ({ className, e2eClassName, type, iconSlot, text, last = false, minWidth, cta, onClose }, ref) => {\n const classNames = generateClassNames(className);\n const e2eClassNames = generateClassNames(e2eClassName);\n\n return (\n <FlexRow\n ref={ref}\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([\n styles['toast-container'],\n styles[`${type}-variant`],\n last && styles.last,\n classNames.container,\n e2eClassNames.container,\n ])}\n justifyContent=\"space-between\"\n style={assignCssVars({ minWidth })}\n gap=\"base\"\n >\n <FlexRow\n justifyContent=\"center\"\n alignItems=\"center\"\n flexWrap=\"nowrap\"\n className={buildClassnames([classNames.icon, e2eClassNames.icon, styles['icon-wrap']])}\n >\n {iconSlot ?? toastTypes[type].icon}\n </FlexRow>\n <FlexRow alignItems=\"center\" justifyContent=\"space-between\" flexGrow={1} flexWrap=\"nowrap\">\n <Text variant=\"subheadingMedium\" className={styles.text}>\n {text}\n </Text>\n {cta}\n </FlexRow>\n {onClose && (\n <Action\n variant=\"flat\"\n // Always white on dark toast background\n iconSlot={<CrossIcon color=\"white\" />}\n onClick={onClose}\n aria-label=\"Close\"\n className={buildClassnames([\n classNames.closeIcon,\n e2eClassNames.closeIcon,\n styles.closeAction,\n ])}\n />\n )}\n </FlexRow>\n );\n },\n);\n\nToast.displayName = 'Toast';\n"],"names":["React","styles"],"mappings":"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"}
@@ -1,2 +1,3 @@
1
1
  export { ToastsLayout } from './ToastsLayout';
2
- export type { Notification, ToastsLayoutPropTypes } from './types';
2
+ export { Toast } from './components/Toast';
3
+ export type { Notification, ToastsLayoutPropTypes, ToastProps } from './types';
@@ -11,17 +11,20 @@ export type ToastType = Record<ToastTypes, {
11
11
  export type ToastPropTypes = Omit<Notification, 'key'> & {
12
12
  className?: string;
13
13
  e2eClassName?: string;
14
- last: boolean;
14
+ last?: boolean;
15
15
  minWidth?: string;
16
- onClose: () => void;
16
+ onClose?: () => void;
17
17
  };
18
+ /** Public-facing props for standalone `<Toast>` usage. */
19
+ export type ToastProps = Omit<ToastPropTypes, 'last' | 'minWidth' | 'e2eClassName'>;
18
20
  export type ToastsLayoutPropTypes = {
19
21
  className?: string;
20
22
  e2eClassName?: string;
21
23
  toasts: Notification[];
22
24
  minWidth?: number | string;
25
+ /** Maximum number of visible toasts. Excess toasts are evicted via `onClose`. Has no effect when `onClose` is not provided. */
23
26
  max?: number | null;
24
- onClose: (key: string) => void;
27
+ onClose?: (key: string) => void;
25
28
  };
26
29
  export type ClassNamesReturnPayload = {
27
30
  container?: string;
@@ -63,7 +63,7 @@ export { Tag } from './Tag';
63
63
  export { Text } from './Text';
64
64
  export type { TextProps, TextVariant, ValidTextTag } from './Text';
65
65
  export { TextField, type TextFieldType } from './TextField';
66
- export { ToastsLayout, type Notification, type ToastsLayoutPropTypes } from './ToastsLayout';
66
+ export { Toast, ToastsLayout, type Notification, type ToastProps, type ToastsLayoutPropTypes } from './ToastsLayout';
67
67
  export { Toggle } from './Toggle';
68
68
  export { ToggleButton } from './ToggleButton';
69
69
  export { Tooltip } from './Tooltip';
package/dist/index.cjs CHANGED
@@ -71,6 +71,7 @@ var Tag = require('./components/Tag/Tag.cjs');
71
71
  var Text = require('./components/Text/Text.cjs');
72
72
  var index$3 = require('./components/TextField/index.cjs');
73
73
  var ToastsLayout = require('./components/ToastsLayout/ToastsLayout.cjs');
74
+ var Toast = require('./components/ToastsLayout/components/Toast.cjs');
74
75
  var Toggle = require('./components/Toggle/Toggle.cjs');
75
76
  var ToggleButton = require('./components/ToggleButton/ToggleButton.cjs');
76
77
  var Tooltip = require('./components/Tooltip/Tooltip.cjs');
@@ -429,6 +430,7 @@ exports.Tag = Tag.Tag;
429
430
  exports.Text = Text.Text;
430
431
  exports.TextField = index$3.TextField;
431
432
  exports.ToastsLayout = ToastsLayout.ToastsLayout;
433
+ exports.Toast = Toast.Toast;
432
434
  exports.Toggle = Toggle.Toggle;
433
435
  exports.ToggleButton = ToggleButton.ToggleButton;
434
436
  exports.Tooltip = Tooltip.Tooltip;
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/index.js CHANGED
@@ -69,6 +69,7 @@ export { Tag } from './components/Tag/Tag.js';
69
69
  export { Text } from './components/Text/Text.js';
70
70
  export { TextField } from './components/TextField/index.js';
71
71
  export { ToastsLayout } from './components/ToastsLayout/ToastsLayout.js';
72
+ export { Toast } from './components/ToastsLayout/components/Toast.js';
72
73
  export { Toggle } from './components/Toggle/Toggle.js';
73
74
  export { ToggleButton } from './components/ToggleButton/ToggleButton.js';
74
75
  export { Tooltip } from './components/Tooltip/Tooltip.js';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -12,6 +12,9 @@ const colors = {
12
12
  dark: '#3878A2',
13
13
  darkest: '#1A384B',
14
14
  },
15
+ /**
16
+ * @deprecated
17
+ */
15
18
  peach: {
16
19
  lightest: '#FDECE9',
17
20
  light: '#F8B2A9',
@@ -1 +1 @@
1
- {"version":3,"file":"colors.cjs","sources":["../../../src/theme/modules/colors.ts"],"sourcesContent":["export type ColourPalette = {\n lightest: string;\n light: string;\n base: string;\n dark: string;\n darkest: string;\n};\n\nexport const colors = {\n /**\n * @deprecated\n * Old brand colour scheme for legacy app. Use secondary colours instead */\n brand: {\n blue: {\n lightest: '#E4F0F9',\n light: '#93C6E8',\n base: '#4CA1D9',\n dark: '#3878A2',\n darkest: '#1A384B',\n },\n peach: {\n lightest: '#FDECE9',\n light: '#F8B2A9',\n base: '#F48070',\n dark: '#B65F53',\n darkest: '#562D27',\n },\n },\n neutral: {\n ink: {\n lightest: '#959FA8',\n light: '#637381',\n base: '#37424D',\n dark: '#1B2126',\n },\n grey: {\n lightest: '#FAFAFB',\n light: '#F2F3F5',\n base: '#DFE3E8',\n dark: '#CDD1D5',\n },\n greyBlue: {\n lightest: '#AAC5D8',\n light: '#558BB1',\n base: '#406885',\n dark: '#1E313E',\n },\n },\n secondary: {\n red: {\n lightest: '#FDEEEE',\n light: '#F7BCBC',\n base: '#EB5757',\n dark: '#A53D3D',\n darkest: '#5E2323',\n },\n yellow: {\n lightest: '#FFF6D9',\n light: '#FFE999',\n base: '#FFC900',\n dark: '#BF9600',\n darkest: '#594600',\n },\n green: {\n lightest: '#E9F7EF',\n light: '#BEE7CF',\n base: '#27AE60',\n dark: '#1B7A43',\n darkest: '#104626',\n },\n lime: {\n lightest: '#F6FAEB',\n light: '#DBEBAE',\n base: '#A5CD35',\n dark: '#7B9927',\n darkest: '#394712',\n },\n teal: {\n lightest: '#E5F8F5',\n light: '#99E5D7',\n base: '#00BD9A',\n dark: '#00715C',\n darkest: '#00392E',\n },\n aqua: {\n lightest: '#EEFAFE',\n light: '#BBEBFA',\n base: '#56CCF2',\n dark: '#3C8FA9',\n darkest: '#225261',\n },\n purple: {\n lightest: '#F6EFFC',\n light: '#D9C0F1',\n base: '#A162DD',\n dark: '#694090',\n darkest: '#38224D',\n },\n blue: {\n lightest: '#D9EBF8',\n light: '#80BCE8',\n base: '#0072C6',\n dark: '#005A9C',\n darkest: '#003053',\n },\n pink: {\n lightest: '#FFF1FC',\n light: '#FFC7F3',\n base: '#FFA3EB',\n dark: '#BF7AB0',\n darkest: '#593852',\n },\n orange: {\n lightest: '#FEF5ED',\n light: '#FAD6B7',\n base: '#F2994A',\n dark: '#9D6330',\n darkest: '#613D1E',\n },\n },\n system: {\n scrollbar: {\n thumb: 'rgba(99, 115, 129, .5)',\n background: 'transparent',\n },\n },\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"colors.cjs","sources":["../../../src/theme/modules/colors.ts"],"sourcesContent":["export type ColourPalette = {\n lightest: string;\n light: string;\n base: string;\n dark: string;\n darkest: string;\n};\n\nexport const colors = {\n /**\n * @deprecated\n * Old brand colour scheme for legacy app. Use secondary colours instead */\n brand: {\n blue: {\n lightest: '#E4F0F9',\n light: '#93C6E8',\n base: '#4CA1D9',\n dark: '#3878A2',\n darkest: '#1A384B',\n },\n /**\n * @deprecated\n */\n peach: {\n lightest: '#FDECE9',\n light: '#F8B2A9',\n base: '#F48070',\n dark: '#B65F53',\n darkest: '#562D27',\n },\n },\n neutral: {\n ink: {\n lightest: '#959FA8',\n light: '#637381',\n base: '#37424D',\n dark: '#1B2126',\n },\n grey: {\n lightest: '#FAFAFB',\n light: '#F2F3F5',\n base: '#DFE3E8',\n dark: '#CDD1D5',\n },\n greyBlue: {\n lightest: '#AAC5D8',\n light: '#558BB1',\n base: '#406885',\n dark: '#1E313E',\n },\n },\n secondary: {\n red: {\n lightest: '#FDEEEE',\n light: '#F7BCBC',\n base: '#EB5757',\n dark: '#A53D3D',\n darkest: '#5E2323',\n },\n yellow: {\n lightest: '#FFF6D9',\n light: '#FFE999',\n base: '#FFC900',\n dark: '#BF9600',\n darkest: '#594600',\n },\n green: {\n lightest: '#E9F7EF',\n light: '#BEE7CF',\n base: '#27AE60',\n dark: '#1B7A43',\n darkest: '#104626',\n },\n lime: {\n lightest: '#F6FAEB',\n light: '#DBEBAE',\n base: '#A5CD35',\n dark: '#7B9927',\n darkest: '#394712',\n },\n teal: {\n lightest: '#E5F8F5',\n light: '#99E5D7',\n base: '#00BD9A',\n dark: '#00715C',\n darkest: '#00392E',\n },\n aqua: {\n lightest: '#EEFAFE',\n light: '#BBEBFA',\n base: '#56CCF2',\n dark: '#3C8FA9',\n darkest: '#225261',\n },\n purple: {\n lightest: '#F6EFFC',\n light: '#D9C0F1',\n base: '#A162DD',\n dark: '#694090',\n darkest: '#38224D',\n },\n blue: {\n lightest: '#D9EBF8',\n light: '#80BCE8',\n base: '#0072C6',\n dark: '#005A9C',\n darkest: '#003053',\n },\n pink: {\n lightest: '#FFF1FC',\n light: '#FFC7F3',\n base: '#FFA3EB',\n dark: '#BF7AB0',\n darkest: '#593852',\n },\n orange: {\n lightest: '#FEF5ED',\n light: '#FAD6B7',\n base: '#F2994A',\n dark: '#9D6330',\n darkest: '#613D1E',\n },\n },\n system: {\n scrollbar: {\n thumb: 'rgba(99, 115, 129, .5)',\n background: 'transparent',\n },\n },\n};\n"],"names":[],"mappings":"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"}
@@ -17,6 +17,9 @@ export declare const colors: {
17
17
  dark: string;
18
18
  darkest: string;
19
19
  };
20
+ /**
21
+ * @deprecated
22
+ */
20
23
  peach: {
21
24
  lightest: string;
22
25
  light: string;
@@ -10,6 +10,9 @@ const colors = {
10
10
  dark: '#3878A2',
11
11
  darkest: '#1A384B',
12
12
  },
13
+ /**
14
+ * @deprecated
15
+ */
13
16
  peach: {
14
17
  lightest: '#FDECE9',
15
18
  light: '#F8B2A9',
@@ -1 +1 @@
1
- {"version":3,"file":"colors.js","sources":["../../../src/theme/modules/colors.ts"],"sourcesContent":["export type ColourPalette = {\n lightest: string;\n light: string;\n base: string;\n dark: string;\n darkest: string;\n};\n\nexport const colors = {\n /**\n * @deprecated\n * Old brand colour scheme for legacy app. Use secondary colours instead */\n brand: {\n blue: {\n lightest: '#E4F0F9',\n light: '#93C6E8',\n base: '#4CA1D9',\n dark: '#3878A2',\n darkest: '#1A384B',\n },\n peach: {\n lightest: '#FDECE9',\n light: '#F8B2A9',\n base: '#F48070',\n dark: '#B65F53',\n darkest: '#562D27',\n },\n },\n neutral: {\n ink: {\n lightest: '#959FA8',\n light: '#637381',\n base: '#37424D',\n dark: '#1B2126',\n },\n grey: {\n lightest: '#FAFAFB',\n light: '#F2F3F5',\n base: '#DFE3E8',\n dark: '#CDD1D5',\n },\n greyBlue: {\n lightest: '#AAC5D8',\n light: '#558BB1',\n base: '#406885',\n dark: '#1E313E',\n },\n },\n secondary: {\n red: {\n lightest: '#FDEEEE',\n light: '#F7BCBC',\n base: '#EB5757',\n dark: '#A53D3D',\n darkest: '#5E2323',\n },\n yellow: {\n lightest: '#FFF6D9',\n light: '#FFE999',\n base: '#FFC900',\n dark: '#BF9600',\n darkest: '#594600',\n },\n green: {\n lightest: '#E9F7EF',\n light: '#BEE7CF',\n base: '#27AE60',\n dark: '#1B7A43',\n darkest: '#104626',\n },\n lime: {\n lightest: '#F6FAEB',\n light: '#DBEBAE',\n base: '#A5CD35',\n dark: '#7B9927',\n darkest: '#394712',\n },\n teal: {\n lightest: '#E5F8F5',\n light: '#99E5D7',\n base: '#00BD9A',\n dark: '#00715C',\n darkest: '#00392E',\n },\n aqua: {\n lightest: '#EEFAFE',\n light: '#BBEBFA',\n base: '#56CCF2',\n dark: '#3C8FA9',\n darkest: '#225261',\n },\n purple: {\n lightest: '#F6EFFC',\n light: '#D9C0F1',\n base: '#A162DD',\n dark: '#694090',\n darkest: '#38224D',\n },\n blue: {\n lightest: '#D9EBF8',\n light: '#80BCE8',\n base: '#0072C6',\n dark: '#005A9C',\n darkest: '#003053',\n },\n pink: {\n lightest: '#FFF1FC',\n light: '#FFC7F3',\n base: '#FFA3EB',\n dark: '#BF7AB0',\n darkest: '#593852',\n },\n orange: {\n lightest: '#FEF5ED',\n light: '#FAD6B7',\n base: '#F2994A',\n dark: '#9D6330',\n darkest: '#613D1E',\n },\n },\n system: {\n scrollbar: {\n thumb: 'rgba(99, 115, 129, .5)',\n background: 'transparent',\n },\n },\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"colors.js","sources":["../../../src/theme/modules/colors.ts"],"sourcesContent":["export type ColourPalette = {\n lightest: string;\n light: string;\n base: string;\n dark: string;\n darkest: string;\n};\n\nexport const colors = {\n /**\n * @deprecated\n * Old brand colour scheme for legacy app. Use secondary colours instead */\n brand: {\n blue: {\n lightest: '#E4F0F9',\n light: '#93C6E8',\n base: '#4CA1D9',\n dark: '#3878A2',\n darkest: '#1A384B',\n },\n /**\n * @deprecated\n */\n peach: {\n lightest: '#FDECE9',\n light: '#F8B2A9',\n base: '#F48070',\n dark: '#B65F53',\n darkest: '#562D27',\n },\n },\n neutral: {\n ink: {\n lightest: '#959FA8',\n light: '#637381',\n base: '#37424D',\n dark: '#1B2126',\n },\n grey: {\n lightest: '#FAFAFB',\n light: '#F2F3F5',\n base: '#DFE3E8',\n dark: '#CDD1D5',\n },\n greyBlue: {\n lightest: '#AAC5D8',\n light: '#558BB1',\n base: '#406885',\n dark: '#1E313E',\n },\n },\n secondary: {\n red: {\n lightest: '#FDEEEE',\n light: '#F7BCBC',\n base: '#EB5757',\n dark: '#A53D3D',\n darkest: '#5E2323',\n },\n yellow: {\n lightest: '#FFF6D9',\n light: '#FFE999',\n base: '#FFC900',\n dark: '#BF9600',\n darkest: '#594600',\n },\n green: {\n lightest: '#E9F7EF',\n light: '#BEE7CF',\n base: '#27AE60',\n dark: '#1B7A43',\n darkest: '#104626',\n },\n lime: {\n lightest: '#F6FAEB',\n light: '#DBEBAE',\n base: '#A5CD35',\n dark: '#7B9927',\n darkest: '#394712',\n },\n teal: {\n lightest: '#E5F8F5',\n light: '#99E5D7',\n base: '#00BD9A',\n dark: '#00715C',\n darkest: '#00392E',\n },\n aqua: {\n lightest: '#EEFAFE',\n light: '#BBEBFA',\n base: '#56CCF2',\n dark: '#3C8FA9',\n darkest: '#225261',\n },\n purple: {\n lightest: '#F6EFFC',\n light: '#D9C0F1',\n base: '#A162DD',\n dark: '#694090',\n darkest: '#38224D',\n },\n blue: {\n lightest: '#D9EBF8',\n light: '#80BCE8',\n base: '#0072C6',\n dark: '#005A9C',\n darkest: '#003053',\n },\n pink: {\n lightest: '#FFF1FC',\n light: '#FFC7F3',\n base: '#FFA3EB',\n dark: '#BF7AB0',\n darkest: '#593852',\n },\n orange: {\n lightest: '#FEF5ED',\n light: '#FAD6B7',\n base: '#F2994A',\n dark: '#9D6330',\n darkest: '#613D1E',\n },\n },\n system: {\n scrollbar: {\n thumb: 'rgba(99, 115, 129, .5)',\n background: 'transparent',\n },\n },\n};\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veeqo/ui",
3
- "version": "15.5.0",
3
+ "version": "15.6.0",
4
4
  "description": "New optimised component library for Veeqo.",
5
5
  "author": "Robert Wealthall",
6
6
  "license": "ISC",