@transferwise/components 0.0.0-experimental-70cb6d1 → 0.0.0-experimental-8bfed24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/build/field/Field.js +5 -4
  2. package/build/field/Field.js.map +1 -1
  3. package/build/field/Field.mjs +5 -4
  4. package/build/field/Field.mjs.map +1 -1
  5. package/build/i18n/en.json +2 -0
  6. package/build/i18n/en.json.js +2 -0
  7. package/build/i18n/en.json.js.map +1 -1
  8. package/build/i18n/en.json.mjs +2 -0
  9. package/build/i18n/en.json.mjs.map +1 -1
  10. package/build/index.js +2 -0
  11. package/build/index.js.map +1 -1
  12. package/build/index.mjs +1 -0
  13. package/build/index.mjs.map +1 -1
  14. package/build/listItem/Prompt/ListItemPrompt.js +5 -4
  15. package/build/listItem/Prompt/ListItemPrompt.js.map +1 -1
  16. package/build/listItem/Prompt/ListItemPrompt.mjs +5 -4
  17. package/build/listItem/Prompt/ListItemPrompt.mjs.map +1 -1
  18. package/build/main.css +107 -51
  19. package/build/moneyInput/MoneyInput.js +12 -28
  20. package/build/moneyInput/MoneyInput.js.map +1 -1
  21. package/build/moneyInput/MoneyInput.mjs +14 -30
  22. package/build/moneyInput/MoneyInput.mjs.map +1 -1
  23. package/build/moneyInput/currencyFormatting.js +2 -8
  24. package/build/moneyInput/currencyFormatting.js.map +1 -1
  25. package/build/moneyInput/currencyFormatting.mjs +4 -5
  26. package/build/moneyInput/currencyFormatting.mjs.map +1 -1
  27. package/build/prompt/ActionPrompt/ActionPrompt.js +8 -40
  28. package/build/prompt/ActionPrompt/ActionPrompt.js.map +1 -1
  29. package/build/prompt/ActionPrompt/ActionPrompt.mjs +8 -40
  30. package/build/prompt/ActionPrompt/ActionPrompt.mjs.map +1 -1
  31. package/build/prompt/CriticalBanner/CriticalBanner.js +145 -0
  32. package/build/prompt/CriticalBanner/CriticalBanner.js.map +1 -0
  33. package/build/prompt/CriticalBanner/CriticalBanner.mjs +143 -0
  34. package/build/prompt/CriticalBanner/CriticalBanner.mjs.map +1 -0
  35. package/build/prompt/CriticalBanner/helpers.js +29 -0
  36. package/build/prompt/CriticalBanner/helpers.js.map +1 -0
  37. package/build/prompt/CriticalBanner/helpers.mjs +26 -0
  38. package/build/prompt/CriticalBanner/helpers.mjs.map +1 -0
  39. package/build/prompt/PrimitivePrompt/PrimitivePrompt.js +2 -0
  40. package/build/prompt/PrimitivePrompt/PrimitivePrompt.js.map +1 -1
  41. package/build/prompt/PrimitivePrompt/PrimitivePrompt.mjs +2 -0
  42. package/build/prompt/PrimitivePrompt/PrimitivePrompt.mjs.map +1 -1
  43. package/build/prompt/common/Expander/Expander.js +47 -0
  44. package/build/prompt/common/Expander/Expander.js.map +1 -0
  45. package/build/prompt/common/Expander/Expander.messages.js +17 -0
  46. package/build/prompt/common/Expander/Expander.messages.js.map +1 -0
  47. package/build/prompt/common/Expander/Expander.messages.mjs +13 -0
  48. package/build/prompt/common/Expander/Expander.messages.mjs.map +1 -0
  49. package/build/prompt/common/Expander/Expander.mjs +44 -0
  50. package/build/prompt/common/Expander/Expander.mjs.map +1 -0
  51. package/build/prompt/helpers/promptMedia.js +52 -0
  52. package/build/prompt/helpers/promptMedia.js.map +1 -0
  53. package/build/prompt/helpers/promptMedia.mjs +50 -0
  54. package/build/prompt/helpers/promptMedia.mjs.map +1 -0
  55. package/build/styles/css/neptune.css +22 -22
  56. package/build/styles/less/neptune-tokens.less +4 -4
  57. package/build/styles/main.css +107 -51
  58. package/build/styles/prompt/CriticalBanner/CriticalBanner.css +39 -0
  59. package/build/styles/prompt/common/Expander/Expander.css +8 -0
  60. package/build/styles/props/neptune-tokens.css +2 -2
  61. package/build/styles/styles/less/neptune.css +22 -22
  62. package/build/typeahead/Typeahead.js +5 -4
  63. package/build/typeahead/Typeahead.js.map +1 -1
  64. package/build/typeahead/Typeahead.mjs +5 -4
  65. package/build/typeahead/Typeahead.mjs.map +1 -1
  66. package/build/types/index.d.ts +2 -2
  67. package/build/types/index.d.ts.map +1 -1
  68. package/build/types/moneyInput/MoneyInput.d.ts +0 -6
  69. package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
  70. package/build/types/moneyInput/currencyFormatting.d.ts +3 -4
  71. package/build/types/moneyInput/currencyFormatting.d.ts.map +1 -1
  72. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts +2 -11
  73. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts.map +1 -1
  74. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts +40 -0
  75. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts.map +1 -0
  76. package/build/types/prompt/CriticalBanner/helpers.d.ts +18 -0
  77. package/build/types/prompt/CriticalBanner/helpers.d.ts.map +1 -0
  78. package/build/types/prompt/CriticalBanner/index.d.ts +3 -0
  79. package/build/types/prompt/CriticalBanner/index.d.ts.map +1 -0
  80. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts +8 -3
  81. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts.map +1 -1
  82. package/build/types/prompt/common/Expander/Expander.d.ts +20 -0
  83. package/build/types/prompt/common/Expander/Expander.d.ts.map +1 -0
  84. package/build/types/prompt/common/Expander/Expander.messages.d.ts +14 -0
  85. package/build/types/prompt/common/Expander/Expander.messages.d.ts.map +1 -0
  86. package/build/types/prompt/helpers/promptMedia.d.ts +22 -0
  87. package/build/types/prompt/helpers/promptMedia.d.ts.map +1 -0
  88. package/build/types/prompt/index.d.ts +2 -0
  89. package/build/types/prompt/index.d.ts.map +1 -1
  90. package/build/types/test-utils/index.d.ts +4 -0
  91. package/build/types/test-utils/index.d.ts.map +1 -1
  92. package/package.json +16 -16
  93. package/src/i18n/en.json +2 -0
  94. package/src/index.ts +2 -2
  95. package/src/main.css +107 -51
  96. package/src/main.less +3 -1
  97. package/src/moneyInput/MoneyInput.story.tsx +1 -10
  98. package/src/moneyInput/MoneyInput.test.story.tsx +1 -141
  99. package/src/moneyInput/MoneyInput.test.tsx +0 -45
  100. package/src/moneyInput/MoneyInput.tsx +3 -27
  101. package/src/moneyInput/currencyFormatting.ts +5 -11
  102. package/src/prompt/ActionPrompt/ActionPrompt.tsx +9 -62
  103. package/src/prompt/CriticalBanner/CriticalBanner.accessibility.docs.mdx +131 -0
  104. package/src/prompt/CriticalBanner/CriticalBanner.css +39 -0
  105. package/src/prompt/CriticalBanner/CriticalBanner.less +45 -0
  106. package/src/prompt/CriticalBanner/CriticalBanner.story.tsx +645 -0
  107. package/src/prompt/CriticalBanner/CriticalBanner.test.story.tsx +304 -0
  108. package/src/prompt/CriticalBanner/CriticalBanner.tsx +185 -0
  109. package/src/prompt/CriticalBanner/helpers.ts +39 -0
  110. package/src/prompt/CriticalBanner/index.ts +2 -0
  111. package/src/prompt/PrimitivePrompt/PrimitivePrompt.tsx +9 -2
  112. package/src/prompt/common/Expander/Expander.css +8 -0
  113. package/src/prompt/common/Expander/Expander.less +9 -0
  114. package/src/prompt/common/Expander/Expander.messages.ts +14 -0
  115. package/src/prompt/common/Expander/Expander.test.tsx +167 -0
  116. package/src/prompt/common/Expander/Expander.tsx +83 -0
  117. package/src/prompt/helpers/promptMedia.tsx +79 -0
  118. package/src/prompt/index.ts +4 -0
  119. package/src/sentimentSurface/SentimentSurface.story.tsx +43 -17
  120. package/src/styles/less/neptune.css +22 -22
@@ -26,17 +26,18 @@ require('react-intl');
26
26
  require('../common/closeButton/CloseButton.messages.js');
27
27
  var jsxRuntime = require('react/jsx-runtime');
28
28
  var InlinePrompt = require('../prompt/InlinePrompt/InlinePrompt.js');
29
- require('../statusIcon/StatusIcon.js');
30
29
  require('../body/Body.js');
31
30
  require('../button/Button.resolver.js');
31
+ require('../sentimentSurface/SentimentSurface.js');
32
+ require('../primitives/PrimitiveButton/PrimitiveButton.js');
33
+ require('../primitives/PrimitiveAnchor/PrimitiveAnchor.js');
32
34
  require('../badge/Badge.js');
33
35
  require('@wise/art');
36
+ require('../statusIcon/StatusIcon.js');
34
37
  require('@transferwise/neptune-validation');
35
38
  require('../provider/direction/DirectionProvider.js');
36
- require('../sentimentSurface/SentimentSurface.js');
37
- require('../primitives/PrimitiveButton/PrimitiveButton.js');
38
- require('../primitives/PrimitiveAnchor/PrimitiveAnchor.js');
39
39
  require('../link/Link.messages.js');
40
+ require('../prompt/common/Expander/Expander.messages.js');
40
41
  var contexts = require('../inputs/contexts.js');
41
42
  var Label = require('../label/Label.js');
42
43
 
@@ -1 +1 @@
1
- {"version":3,"file":"Field.js","sources":["../../src/field/Field.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId, useRef } from 'react';\n\nimport { Sentiment } from '../common';\nimport { InlinePrompt, type InlinePromptProps } from '../prompt';\nimport {\n FieldLabelContextProvider,\n InputDescribedByProvider,\n InputIdContextProvider,\n InputInvalidProvider,\n} from '../inputs/contexts';\nimport { Label } from '../label';\n\nexport type FieldProps = {\n /** `null` disables auto-generating the `id` attribute, falling back to nesting-based label association over setting `htmlFor` explicitly. */\n id?: string | null;\n /** Should be specified unless the wrapped control has its own labeling mechanism, e.g. `Checkbox`. */\n label?: React.ReactNode;\n /** @default true */\n required?: boolean;\n /** @deprecated Use `description` prop instead. */\n hint?: React.ReactNode;\n message?: React.ReactNode;\n /**\n * Override for the [InlinePrompt icon's default, accessible name](/?path=/docs/other-statusicon-accessibility--docs)\n * announced by the screen readers\n * */\n messageIconLabel?: string;\n /**\n * If true, shows a loading spinner in place of the message icon of the InlinePrompt\n * @default false\n */\n messageLoading?: boolean;\n description?: React.ReactNode;\n /** @deprecated Use `message` and `type={Sentiment.NEGATIVE}` prop instead. */\n error?: React.ReactNode;\n /** @default Sentiment.NEUTRAL */\n sentiment?: InlinePromptProps['sentiment'];\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Field = ({\n id,\n label,\n required = true,\n message: propMessage,\n messageIconLabel,\n messageLoading,\n hint,\n description = hint,\n sentiment: propType = Sentiment.NEUTRAL,\n className,\n children,\n ...props\n}: FieldProps) => {\n const labelRef = useRef<HTMLLabelElement>(null);\n const sentiment = props.error ? Sentiment.NEGATIVE : propType;\n const message = propMessage || props.error;\n const hasError = sentiment === Sentiment.NEGATIVE;\n\n const labelId = useId();\n\n const fallbackInputId = useId();\n const inputId = id !== null ? (id ?? fallbackInputId) : undefined;\n\n const messageId = useId();\n const descriptionId = useId();\n\n /**\n * form control can have multiple messages to describe it,\n * e.g the description underneath the label and inline alert\n */\n function ariaDescribedbyByIds() {\n const messageIds = [];\n if (description) {\n messageIds.push(descriptionId);\n }\n if (message) {\n messageIds.push(messageId);\n }\n return messageIds.length > 0 ? messageIds.join(' ') : undefined;\n }\n\n return (\n <FieldLabelContextProvider value={{ id: labelId, ref: labelRef }}>\n <InputIdContextProvider value={inputId}>\n <InputDescribedByProvider value={ariaDescribedbyByIds()}>\n <InputInvalidProvider value={hasError}>\n <div\n className={clsx(\n 'np-field form-group d-block',\n {\n 'has-success': sentiment === Sentiment.POSITIVE,\n 'has-warning': sentiment === Sentiment.WARNING,\n 'has-error': hasError,\n 'has-info': sentiment === Sentiment.NEUTRAL,\n },\n className,\n )}\n >\n {label != null ? (\n <>\n <Label ref={labelRef} id={labelId} htmlFor={inputId}>\n {required ? label : <Label.Optional>{label}</Label.Optional>}\n </Label>\n <Label.Description id={descriptionId}>{description}</Label.Description>\n <div className=\"np-field-control\">{children}</div>\n </>\n ) : (\n children\n )}\n\n {message && (\n <InlinePrompt\n sentiment={sentiment}\n id={messageId}\n mediaLabel={messageIconLabel}\n className=\"np-field__prompt\"\n loading={messageLoading}\n width=\"full\"\n >\n {message}\n </InlinePrompt>\n )}\n </div>\n </InputInvalidProvider>\n </InputDescribedByProvider>\n </InputIdContextProvider>\n </FieldLabelContextProvider>\n );\n};\n"],"names":["Field","id","label","required","message","propMessage","messageIconLabel","messageLoading","hint","description","sentiment","propType","Sentiment","NEUTRAL","className","children","props","labelRef","useRef","error","NEGATIVE","hasError","labelId","useId","fallbackInputId","inputId","undefined","messageId","descriptionId","ariaDescribedbyByIds","messageIds","push","length","join","_jsx","FieldLabelContextProvider","value","ref","InputIdContextProvider","InputDescribedByProvider","InputInvalidProvider","_jsxs","clsx","POSITIVE","WARNING","_Fragment","Label","htmlFor","Optional","Description","InlinePrompt","mediaLabel","loading","width"],"mappings":"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"}
1
+ {"version":3,"file":"Field.js","sources":["../../src/field/Field.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId, useRef } from 'react';\n\nimport { Sentiment } from '../common';\nimport { InlinePrompt, type InlinePromptProps } from '../prompt';\nimport {\n FieldLabelContextProvider,\n InputDescribedByProvider,\n InputIdContextProvider,\n InputInvalidProvider,\n} from '../inputs/contexts';\nimport { Label } from '../label';\n\nexport type FieldProps = {\n /** `null` disables auto-generating the `id` attribute, falling back to nesting-based label association over setting `htmlFor` explicitly. */\n id?: string | null;\n /** Should be specified unless the wrapped control has its own labeling mechanism, e.g. `Checkbox`. */\n label?: React.ReactNode;\n /** @default true */\n required?: boolean;\n /** @deprecated Use `description` prop instead. */\n hint?: React.ReactNode;\n message?: React.ReactNode;\n /**\n * Override for the [InlinePrompt icon's default, accessible name](/?path=/docs/other-statusicon-accessibility--docs)\n * announced by the screen readers\n * */\n messageIconLabel?: string;\n /**\n * If true, shows a loading spinner in place of the message icon of the InlinePrompt\n * @default false\n */\n messageLoading?: boolean;\n description?: React.ReactNode;\n /** @deprecated Use `message` and `type={Sentiment.NEGATIVE}` prop instead. */\n error?: React.ReactNode;\n /** @default Sentiment.NEUTRAL */\n sentiment?: InlinePromptProps['sentiment'];\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Field = ({\n id,\n label,\n required = true,\n message: propMessage,\n messageIconLabel,\n messageLoading,\n hint,\n description = hint,\n sentiment: propType = Sentiment.NEUTRAL,\n className,\n children,\n ...props\n}: FieldProps) => {\n const labelRef = useRef<HTMLLabelElement>(null);\n const sentiment = props.error ? Sentiment.NEGATIVE : propType;\n const message = propMessage || props.error;\n const hasError = sentiment === Sentiment.NEGATIVE;\n\n const labelId = useId();\n\n const fallbackInputId = useId();\n const inputId = id !== null ? (id ?? fallbackInputId) : undefined;\n\n const messageId = useId();\n const descriptionId = useId();\n\n /**\n * form control can have multiple messages to describe it,\n * e.g the description underneath the label and inline alert\n */\n function ariaDescribedbyByIds() {\n const messageIds = [];\n if (description) {\n messageIds.push(descriptionId);\n }\n if (message) {\n messageIds.push(messageId);\n }\n return messageIds.length > 0 ? messageIds.join(' ') : undefined;\n }\n\n return (\n <FieldLabelContextProvider value={{ id: labelId, ref: labelRef }}>\n <InputIdContextProvider value={inputId}>\n <InputDescribedByProvider value={ariaDescribedbyByIds()}>\n <InputInvalidProvider value={hasError}>\n <div\n className={clsx(\n 'np-field form-group d-block',\n {\n 'has-success': sentiment === Sentiment.POSITIVE,\n 'has-warning': sentiment === Sentiment.WARNING,\n 'has-error': hasError,\n 'has-info': sentiment === Sentiment.NEUTRAL,\n },\n className,\n )}\n >\n {label != null ? (\n <>\n <Label ref={labelRef} id={labelId} htmlFor={inputId}>\n {required ? label : <Label.Optional>{label}</Label.Optional>}\n </Label>\n <Label.Description id={descriptionId}>{description}</Label.Description>\n <div className=\"np-field-control\">{children}</div>\n </>\n ) : (\n children\n )}\n\n {message && (\n <InlinePrompt\n sentiment={sentiment}\n id={messageId}\n mediaLabel={messageIconLabel}\n className=\"np-field__prompt\"\n loading={messageLoading}\n width=\"full\"\n >\n {message}\n </InlinePrompt>\n )}\n </div>\n </InputInvalidProvider>\n </InputDescribedByProvider>\n </InputIdContextProvider>\n </FieldLabelContextProvider>\n );\n};\n"],"names":["Field","id","label","required","message","propMessage","messageIconLabel","messageLoading","hint","description","sentiment","propType","Sentiment","NEUTRAL","className","children","props","labelRef","useRef","error","NEGATIVE","hasError","labelId","useId","fallbackInputId","inputId","undefined","messageId","descriptionId","ariaDescribedbyByIds","messageIds","push","length","join","_jsx","FieldLabelContextProvider","value","ref","InputIdContextProvider","InputDescribedByProvider","InputInvalidProvider","_jsxs","clsx","POSITIVE","WARNING","_Fragment","Label","htmlFor","Optional","Description","InlinePrompt","mediaLabel","loading","width"],"mappings":"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"}
@@ -24,17 +24,18 @@ import 'react-intl';
24
24
  import '../common/closeButton/CloseButton.messages.mjs';
25
25
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
26
26
  import { InlinePrompt } from '../prompt/InlinePrompt/InlinePrompt.mjs';
27
- import '../statusIcon/StatusIcon.mjs';
28
27
  import '../body/Body.mjs';
29
28
  import '../button/Button.resolver.mjs';
29
+ import '../sentimentSurface/SentimentSurface.mjs';
30
+ import '../primitives/PrimitiveButton/PrimitiveButton.mjs';
31
+ import '../primitives/PrimitiveAnchor/PrimitiveAnchor.mjs';
30
32
  import '../badge/Badge.mjs';
31
33
  import '@wise/art';
34
+ import '../statusIcon/StatusIcon.mjs';
32
35
  import '@transferwise/neptune-validation';
33
36
  import '../provider/direction/DirectionProvider.mjs';
34
- import '../sentimentSurface/SentimentSurface.mjs';
35
- import '../primitives/PrimitiveButton/PrimitiveButton.mjs';
36
- import '../primitives/PrimitiveAnchor/PrimitiveAnchor.mjs';
37
37
  import '../link/Link.messages.mjs';
38
+ import '../prompt/common/Expander/Expander.messages.mjs';
38
39
  import { FieldLabelContextProvider, InputIdContextProvider, InputDescribedByProvider, InputInvalidProvider } from '../inputs/contexts.mjs';
39
40
  import { Label as LabelNamespace } from '../label/Label.mjs';
40
41
 
@@ -1 +1 @@
1
- {"version":3,"file":"Field.mjs","sources":["../../src/field/Field.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId, useRef } from 'react';\n\nimport { Sentiment } from '../common';\nimport { InlinePrompt, type InlinePromptProps } from '../prompt';\nimport {\n FieldLabelContextProvider,\n InputDescribedByProvider,\n InputIdContextProvider,\n InputInvalidProvider,\n} from '../inputs/contexts';\nimport { Label } from '../label';\n\nexport type FieldProps = {\n /** `null` disables auto-generating the `id` attribute, falling back to nesting-based label association over setting `htmlFor` explicitly. */\n id?: string | null;\n /** Should be specified unless the wrapped control has its own labeling mechanism, e.g. `Checkbox`. */\n label?: React.ReactNode;\n /** @default true */\n required?: boolean;\n /** @deprecated Use `description` prop instead. */\n hint?: React.ReactNode;\n message?: React.ReactNode;\n /**\n * Override for the [InlinePrompt icon's default, accessible name](/?path=/docs/other-statusicon-accessibility--docs)\n * announced by the screen readers\n * */\n messageIconLabel?: string;\n /**\n * If true, shows a loading spinner in place of the message icon of the InlinePrompt\n * @default false\n */\n messageLoading?: boolean;\n description?: React.ReactNode;\n /** @deprecated Use `message` and `type={Sentiment.NEGATIVE}` prop instead. */\n error?: React.ReactNode;\n /** @default Sentiment.NEUTRAL */\n sentiment?: InlinePromptProps['sentiment'];\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Field = ({\n id,\n label,\n required = true,\n message: propMessage,\n messageIconLabel,\n messageLoading,\n hint,\n description = hint,\n sentiment: propType = Sentiment.NEUTRAL,\n className,\n children,\n ...props\n}: FieldProps) => {\n const labelRef = useRef<HTMLLabelElement>(null);\n const sentiment = props.error ? Sentiment.NEGATIVE : propType;\n const message = propMessage || props.error;\n const hasError = sentiment === Sentiment.NEGATIVE;\n\n const labelId = useId();\n\n const fallbackInputId = useId();\n const inputId = id !== null ? (id ?? fallbackInputId) : undefined;\n\n const messageId = useId();\n const descriptionId = useId();\n\n /**\n * form control can have multiple messages to describe it,\n * e.g the description underneath the label and inline alert\n */\n function ariaDescribedbyByIds() {\n const messageIds = [];\n if (description) {\n messageIds.push(descriptionId);\n }\n if (message) {\n messageIds.push(messageId);\n }\n return messageIds.length > 0 ? messageIds.join(' ') : undefined;\n }\n\n return (\n <FieldLabelContextProvider value={{ id: labelId, ref: labelRef }}>\n <InputIdContextProvider value={inputId}>\n <InputDescribedByProvider value={ariaDescribedbyByIds()}>\n <InputInvalidProvider value={hasError}>\n <div\n className={clsx(\n 'np-field form-group d-block',\n {\n 'has-success': sentiment === Sentiment.POSITIVE,\n 'has-warning': sentiment === Sentiment.WARNING,\n 'has-error': hasError,\n 'has-info': sentiment === Sentiment.NEUTRAL,\n },\n className,\n )}\n >\n {label != null ? (\n <>\n <Label ref={labelRef} id={labelId} htmlFor={inputId}>\n {required ? label : <Label.Optional>{label}</Label.Optional>}\n </Label>\n <Label.Description id={descriptionId}>{description}</Label.Description>\n <div className=\"np-field-control\">{children}</div>\n </>\n ) : (\n children\n )}\n\n {message && (\n <InlinePrompt\n sentiment={sentiment}\n id={messageId}\n mediaLabel={messageIconLabel}\n className=\"np-field__prompt\"\n loading={messageLoading}\n width=\"full\"\n >\n {message}\n </InlinePrompt>\n )}\n </div>\n </InputInvalidProvider>\n </InputDescribedByProvider>\n </InputIdContextProvider>\n </FieldLabelContextProvider>\n );\n};\n"],"names":["Field","id","label","required","message","propMessage","messageIconLabel","messageLoading","hint","description","sentiment","propType","Sentiment","NEUTRAL","className","children","props","labelRef","useRef","error","NEGATIVE","hasError","labelId","useId","fallbackInputId","inputId","undefined","messageId","descriptionId","ariaDescribedbyByIds","messageIds","push","length","join","_jsx","FieldLabelContextProvider","value","ref","InputIdContextProvider","InputDescribedByProvider","InputInvalidProvider","_jsxs","clsx","POSITIVE","WARNING","_Fragment","Label","htmlFor","Optional","Description","InlinePrompt","mediaLabel","loading","width"],"mappings":"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"}
1
+ {"version":3,"file":"Field.mjs","sources":["../../src/field/Field.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId, useRef } from 'react';\n\nimport { Sentiment } from '../common';\nimport { InlinePrompt, type InlinePromptProps } from '../prompt';\nimport {\n FieldLabelContextProvider,\n InputDescribedByProvider,\n InputIdContextProvider,\n InputInvalidProvider,\n} from '../inputs/contexts';\nimport { Label } from '../label';\n\nexport type FieldProps = {\n /** `null` disables auto-generating the `id` attribute, falling back to nesting-based label association over setting `htmlFor` explicitly. */\n id?: string | null;\n /** Should be specified unless the wrapped control has its own labeling mechanism, e.g. `Checkbox`. */\n label?: React.ReactNode;\n /** @default true */\n required?: boolean;\n /** @deprecated Use `description` prop instead. */\n hint?: React.ReactNode;\n message?: React.ReactNode;\n /**\n * Override for the [InlinePrompt icon's default, accessible name](/?path=/docs/other-statusicon-accessibility--docs)\n * announced by the screen readers\n * */\n messageIconLabel?: string;\n /**\n * If true, shows a loading spinner in place of the message icon of the InlinePrompt\n * @default false\n */\n messageLoading?: boolean;\n description?: React.ReactNode;\n /** @deprecated Use `message` and `type={Sentiment.NEGATIVE}` prop instead. */\n error?: React.ReactNode;\n /** @default Sentiment.NEUTRAL */\n sentiment?: InlinePromptProps['sentiment'];\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Field = ({\n id,\n label,\n required = true,\n message: propMessage,\n messageIconLabel,\n messageLoading,\n hint,\n description = hint,\n sentiment: propType = Sentiment.NEUTRAL,\n className,\n children,\n ...props\n}: FieldProps) => {\n const labelRef = useRef<HTMLLabelElement>(null);\n const sentiment = props.error ? Sentiment.NEGATIVE : propType;\n const message = propMessage || props.error;\n const hasError = sentiment === Sentiment.NEGATIVE;\n\n const labelId = useId();\n\n const fallbackInputId = useId();\n const inputId = id !== null ? (id ?? fallbackInputId) : undefined;\n\n const messageId = useId();\n const descriptionId = useId();\n\n /**\n * form control can have multiple messages to describe it,\n * e.g the description underneath the label and inline alert\n */\n function ariaDescribedbyByIds() {\n const messageIds = [];\n if (description) {\n messageIds.push(descriptionId);\n }\n if (message) {\n messageIds.push(messageId);\n }\n return messageIds.length > 0 ? messageIds.join(' ') : undefined;\n }\n\n return (\n <FieldLabelContextProvider value={{ id: labelId, ref: labelRef }}>\n <InputIdContextProvider value={inputId}>\n <InputDescribedByProvider value={ariaDescribedbyByIds()}>\n <InputInvalidProvider value={hasError}>\n <div\n className={clsx(\n 'np-field form-group d-block',\n {\n 'has-success': sentiment === Sentiment.POSITIVE,\n 'has-warning': sentiment === Sentiment.WARNING,\n 'has-error': hasError,\n 'has-info': sentiment === Sentiment.NEUTRAL,\n },\n className,\n )}\n >\n {label != null ? (\n <>\n <Label ref={labelRef} id={labelId} htmlFor={inputId}>\n {required ? label : <Label.Optional>{label}</Label.Optional>}\n </Label>\n <Label.Description id={descriptionId}>{description}</Label.Description>\n <div className=\"np-field-control\">{children}</div>\n </>\n ) : (\n children\n )}\n\n {message && (\n <InlinePrompt\n sentiment={sentiment}\n id={messageId}\n mediaLabel={messageIconLabel}\n className=\"np-field__prompt\"\n loading={messageLoading}\n width=\"full\"\n >\n {message}\n </InlinePrompt>\n )}\n </div>\n </InputInvalidProvider>\n </InputDescribedByProvider>\n </InputIdContextProvider>\n </FieldLabelContextProvider>\n );\n};\n"],"names":["Field","id","label","required","message","propMessage","messageIconLabel","messageLoading","hint","description","sentiment","propType","Sentiment","NEUTRAL","className","children","props","labelRef","useRef","error","NEGATIVE","hasError","labelId","useId","fallbackInputId","inputId","undefined","messageId","descriptionId","ariaDescribedbyByIds","messageIds","push","length","join","_jsx","FieldLabelContextProvider","value","ref","InputIdContextProvider","InputDescribedByProvider","InputInvalidProvider","_jsxs","clsx","POSITIVE","WARNING","_Fragment","Label","htmlFor","Optional","Description","InlinePrompt","mediaLabel","loading","width"],"mappings":"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"}
@@ -16,6 +16,8 @@
16
16
  "neptune.DateLookup.selected": "selected",
17
17
  "neptune.DateLookup.twentyYears": "20 years",
18
18
  "neptune.DateLookup.year": "year",
19
+ "neptune.Expander.collapseAriaLabel": "Collapse",
20
+ "neptune.Expander.expandAriaLabel": "Expand",
19
21
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Type a currency / country",
20
22
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Select currency",
21
23
  "neptune.FlowNavigation.back": "back to previous step",
@@ -20,6 +20,8 @@ var en = {
20
20
  "neptune.DateLookup.selected": "selected",
21
21
  "neptune.DateLookup.twentyYears": "20 years",
22
22
  "neptune.DateLookup.year": "year",
23
+ "neptune.Expander.collapseAriaLabel": "Collapse",
24
+ "neptune.Expander.expandAriaLabel": "Expand",
23
25
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Type a currency / country",
24
26
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Select currency",
25
27
  "neptune.FlowNavigation.back": "back to previous step",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -16,6 +16,8 @@ var en = {
16
16
  "neptune.DateLookup.selected": "selected",
17
17
  "neptune.DateLookup.twentyYears": "20 years",
18
18
  "neptune.DateLookup.year": "year",
19
+ "neptune.Expander.collapseAriaLabel": "Collapse",
20
+ "neptune.Expander.expandAriaLabel": "Expand",
19
21
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Type a currency / country",
20
22
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Select currency",
21
23
  "neptune.FlowNavigation.back": "back to previous step",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/index.js CHANGED
@@ -54,6 +54,7 @@ var InlineAlert = require('./inlineAlert/InlineAlert.js');
54
54
  var InlinePrompt = require('./prompt/InlinePrompt/InlinePrompt.js');
55
55
  var ActionPrompt = require('./prompt/ActionPrompt/ActionPrompt.js');
56
56
  var InfoPrompt = require('./prompt/InfoPrompt/InfoPrompt.js');
57
+ var CriticalBanner = require('./prompt/CriticalBanner/CriticalBanner.js');
57
58
  var InputWithDisplayFormat = require('./inputWithDisplayFormat/InputWithDisplayFormat.js');
58
59
  var Input = require('./inputs/Input.js');
59
60
  var InputGroup = require('./inputs/InputGroup.js');
@@ -221,6 +222,7 @@ exports.InlineAlert = InlineAlert.default;
221
222
  exports.InlinePrompt = InlinePrompt.InlinePrompt;
222
223
  exports.ActionPrompt = ActionPrompt.ActionPrompt;
223
224
  exports.InfoPrompt = InfoPrompt.InfoPrompt;
225
+ exports.CriticalBanner = CriticalBanner.CriticalBanner;
224
226
  exports.InputWithDisplayFormat = InputWithDisplayFormat.default;
225
227
  exports.Input = Input.Input;
226
228
  exports.InputGroup = InputGroup.InputGroup;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/index.mjs CHANGED
@@ -52,6 +52,7 @@ export { default as InlineAlert } from './inlineAlert/InlineAlert.mjs';
52
52
  export { InlinePrompt } from './prompt/InlinePrompt/InlinePrompt.mjs';
53
53
  export { ActionPrompt } from './prompt/ActionPrompt/ActionPrompt.mjs';
54
54
  export { InfoPrompt } from './prompt/InfoPrompt/InfoPrompt.mjs';
55
+ export { CriticalBanner } from './prompt/CriticalBanner/CriticalBanner.mjs';
55
56
  export { default as InputWithDisplayFormat } from './inputWithDisplayFormat/InputWithDisplayFormat.mjs';
56
57
  export { Input } from './inputs/Input.mjs';
57
58
  export { InputGroup } from './inputs/InputGroup.mjs';
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -27,17 +27,18 @@ require('../../common/closeButton/CloseButton.messages.js');
27
27
  var jsxRuntime = require('react/jsx-runtime');
28
28
  var ListItemContext = require('../ListItemContext.js');
29
29
  var InlinePrompt = require('../../prompt/InlinePrompt/InlinePrompt.js');
30
- require('../../statusIcon/StatusIcon.js');
31
30
  require('../../body/Body.js');
32
31
  require('../../button/Button.resolver.js');
32
+ require('../../sentimentSurface/SentimentSurface.js');
33
+ require('../../primitives/PrimitiveButton/PrimitiveButton.js');
34
+ require('../../primitives/PrimitiveAnchor/PrimitiveAnchor.js');
33
35
  require('../../badge/Badge.js');
34
36
  require('@wise/art');
37
+ require('../../statusIcon/StatusIcon.js');
35
38
  require('@transferwise/neptune-validation');
36
39
  require('../../provider/direction/DirectionProvider.js');
37
- require('../../sentimentSurface/SentimentSurface.js');
38
- require('../../primitives/PrimitiveButton/PrimitiveButton.js');
39
- require('../../primitives/PrimitiveAnchor/PrimitiveAnchor.js');
40
40
  require('../../link/Link.messages.js');
41
+ require('../../prompt/common/Expander/Expander.messages.js');
41
42
 
42
43
  const Prompt = ({
43
44
  sentiment: sentiment$1 = sentiment.Sentiment.NEUTRAL,
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemPrompt.js","sources":["../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' | 'sentiment' | 'mediaLabel' | 'media' | 'loading'\n>;\n\n/**\n * This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;aACrBC,WAAS,GAAGC,mBAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,cAAA,CAACC,yBAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,WAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
1
+ {"version":3,"file":"ListItemPrompt.js","sources":["../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' | 'sentiment' | 'mediaLabel' | 'media' | 'loading'\n>;\n\n/**\n * This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;aACrBC,WAAS,GAAGC,mBAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,cAAA,CAACC,yBAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,WAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
@@ -25,17 +25,18 @@ import '../../common/closeButton/CloseButton.messages.mjs';
25
25
  import { jsx } from 'react/jsx-runtime';
26
26
  import { ListItemContext } from '../ListItemContext.mjs';
27
27
  import { InlinePrompt } from '../../prompt/InlinePrompt/InlinePrompt.mjs';
28
- import '../../statusIcon/StatusIcon.mjs';
29
28
  import '../../body/Body.mjs';
30
29
  import '../../button/Button.resolver.mjs';
30
+ import '../../sentimentSurface/SentimentSurface.mjs';
31
+ import '../../primitives/PrimitiveButton/PrimitiveButton.mjs';
32
+ import '../../primitives/PrimitiveAnchor/PrimitiveAnchor.mjs';
31
33
  import '../../badge/Badge.mjs';
32
34
  import '@wise/art';
35
+ import '../../statusIcon/StatusIcon.mjs';
33
36
  import '@transferwise/neptune-validation';
34
37
  import '../../provider/direction/DirectionProvider.mjs';
35
- import '../../sentimentSurface/SentimentSurface.mjs';
36
- import '../../primitives/PrimitiveButton/PrimitiveButton.mjs';
37
- import '../../primitives/PrimitiveAnchor/PrimitiveAnchor.mjs';
38
38
  import '../../link/Link.messages.mjs';
39
+ import '../../prompt/common/Expander/Expander.messages.mjs';
39
40
 
40
41
  const Prompt = ({
41
42
  sentiment = Sentiment.NEUTRAL,
@@ -1 +1 @@
1
- {"version":3,"file":"ListItemPrompt.mjs","sources":["../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' | 'sentiment' | 'mediaLabel' | 'media' | 'loading'\n>;\n\n/**\n * This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;EACrBC,SAAS,GAAGC,SAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,GAAA,CAACC,YAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,SAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
1
+ {"version":3,"file":"ListItemPrompt.mjs","sources":["../../../src/listItem/Prompt/ListItemPrompt.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport { Sentiment } from '../../common';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport { InlinePrompt, type InlinePromptProps } from '../../prompt';\n\nexport type ListItemPromptProps = Pick<\n InlinePromptProps,\n 'children' | 'sentiment' | 'mediaLabel' | 'media' | 'loading'\n>;\n\n/**\n * This component allows for rendering an Inline Prompt. <br />\n * In the future it will be a thin wrapper around a standalone component.<br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item#prompt) for details.\n */\nexport const Prompt = ({\n sentiment = Sentiment.NEUTRAL,\n mediaLabel,\n children,\n media,\n loading,\n}: ListItemPromptProps) => {\n const { ids, props } = useContext<ListItemContextData>(ListItemContext);\n const isLongLivedMuted = props.disabled && Boolean(props.disabledPromptMessage);\n\n return (\n <InlinePrompt\n id={ids.prompt}\n sentiment={sentiment}\n media={media}\n loading={loading}\n mediaLabel={mediaLabel}\n muted={isLongLivedMuted}\n className=\"wds-list-item-prompt\"\n >\n {isLongLivedMuted ? props.disabledPromptMessage : children}\n </InlinePrompt>\n );\n};\n\nPrompt.displayName = 'ListItem.Prompt';\n"],"names":["Prompt","sentiment","Sentiment","NEUTRAL","mediaLabel","children","media","loading","ids","props","useContext","ListItemContext","isLongLivedMuted","disabled","Boolean","disabledPromptMessage","_jsx","InlinePrompt","id","prompt","muted","className","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBO,MAAMA,MAAM,GAAGA,CAAC;EACrBC,SAAS,GAAGC,SAAS,CAACC,OAAO;EAC7BC,UAAU;EACVC,QAAQ;EACRC,KAAK;AACLC,EAAAA;AAAO,CACa,KAAI;EACxB,MAAM;IAAEC,GAAG;AAAEC,IAAAA;AAAK,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EACvE,MAAMC,gBAAgB,GAAGH,KAAK,CAACI,QAAQ,IAAIC,OAAO,CAACL,KAAK,CAACM,qBAAqB,CAAC;EAE/E,oBACEC,GAAA,CAACC,YAAY,EAAA;IACXC,EAAE,EAAEV,GAAG,CAACW,MAAO;AACflB,IAAAA,SAAS,EAAEA,SAAU;AACrBK,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,OAAO,EAAEA,OAAQ;AACjBH,IAAAA,UAAU,EAAEA,UAAW;AACvBgB,IAAAA,KAAK,EAAER,gBAAiB;AACxBS,IAAAA,SAAS,EAAC,sBAAsB;AAAAhB,IAAAA,QAAA,EAE/BO,gBAAgB,GAAGH,KAAK,CAACM,qBAAqB,GAAGV;AAAQ,GAC9C,CAAC;AAEnB;AAEAL,MAAM,CAACsB,WAAW,GAAG,iBAAiB;;;;"}
package/build/main.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
- * Do not edit directly, this file was auto-generated.
3
- * Generated on Tue, 31 Mar 2026 13:02:10 GMT
2
+ * Do not edit directly
3
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -142,8 +142,8 @@
142
142
  }
143
143
 
144
144
  /**
145
- * Do not edit directly, this file was auto-generated.
146
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
145
+ * Do not edit directly
146
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
147
147
  */
148
148
 
149
149
  .np-theme-personal {
@@ -391,8 +391,8 @@
391
391
  }
392
392
 
393
393
  /**
394
- * Do not edit directly, this file was auto-generated.
395
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
394
+ * Do not edit directly
395
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
396
396
  */
397
397
 
398
398
  .np-theme-personal--forest-green {
@@ -640,8 +640,8 @@
640
640
  }
641
641
 
642
642
  /**
643
- * Do not edit directly, this file was auto-generated.
644
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
643
+ * Do not edit directly
644
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
645
645
  */
646
646
 
647
647
  .np-theme-personal--bright-green {
@@ -889,8 +889,8 @@
889
889
  }
890
890
 
891
891
  /**
892
- * Do not edit directly, this file was auto-generated.
893
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
892
+ * Do not edit directly
893
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
894
894
  */
895
895
 
896
896
  .np-theme-personal--dark {
@@ -1138,8 +1138,8 @@
1138
1138
  }
1139
1139
 
1140
1140
  /**
1141
- * Do not edit directly, this file was auto-generated.
1142
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
1141
+ * Do not edit directly
1142
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
1143
1143
  */
1144
1144
 
1145
1145
  .np-theme-platform {
@@ -1321,8 +1321,8 @@
1321
1321
  }
1322
1322
 
1323
1323
  /**
1324
- * Do not edit directly, this file was auto-generated.
1325
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
1324
+ * Do not edit directly
1325
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
1326
1326
  */
1327
1327
 
1328
1328
  .np-theme-platform--forest-green {
@@ -1504,8 +1504,8 @@
1504
1504
  }
1505
1505
 
1506
1506
  /**
1507
- * Do not edit directly, this file was auto-generated.
1508
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
1507
+ * Do not edit directly
1508
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
1509
1509
  */
1510
1510
 
1511
1511
  .np-theme-business {
@@ -1688,8 +1688,8 @@
1688
1688
  }
1689
1689
 
1690
1690
  /**
1691
- * Do not edit directly, this file was auto-generated.
1692
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
1691
+ * Do not edit directly
1692
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
1693
1693
  */
1694
1694
 
1695
1695
  .np-theme-business--dark {
@@ -1872,8 +1872,8 @@
1872
1872
  }
1873
1873
 
1874
1874
  /**
1875
- * Do not edit directly, this file was auto-generated.
1876
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
1875
+ * Do not edit directly
1876
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
1877
1877
  */
1878
1878
 
1879
1879
  .np-theme-business--forest-green {
@@ -2056,8 +2056,8 @@
2056
2056
  }
2057
2057
 
2058
2058
  /**
2059
- * Do not edit directly, this file was auto-generated.
2060
- * Generated on Tue, 31 Mar 2026 13:02:11 GMT
2059
+ * Do not edit directly
2060
+ * Generated on Wed, 07 Jan 2026 11:56:15 GMT
2061
2061
  */
2062
2062
 
2063
2063
  .np-theme-business--bright-green {
@@ -32176,6 +32176,91 @@ html:not([dir="rtl"]) .np-navigation-option {
32176
32176
  padding: 0;
32177
32177
  }
32178
32178
 
32179
+ .wds-action-prompt {
32180
+ --Prompt-padding: var(--size-16);
32181
+ --Prompt-actions-gap: var(--size-8);
32182
+ --Prompt-gap: var(--size-10) var(--size-16);
32183
+ --Prompt-border-radius: var(--radius-large);
32184
+ }
32185
+
32186
+ .wds-action-prompt--media-image {
32187
+ width: 48px;
32188
+ width: var(--size-48);
32189
+ height: 48px;
32190
+ height: var(--size-48);
32191
+ -o-object-fit: contain;
32192
+ object-fit: contain;
32193
+ }
32194
+
32195
+ @media (max-width: 767px) {
32196
+ .wds-action-prompt--with-two-actions .wds-prompt__actions-wrapper .wds-Button {
32197
+ flex: 1 1 calc(50% - (var(--Prompt-actions-gap) / 2));
32198
+ min-width: -moz-fit-content;
32199
+ min-width: fit-content;
32200
+ }
32201
+ }
32202
+
32203
+ .wds-action-prompt__content {
32204
+ max-width: calc(48px * 10);
32205
+ max-width: calc(var(--size-48) * 10);
32206
+ }
32207
+
32208
+ .wds-critical-banner {
32209
+ --Prompt-padding: var(--size-16);
32210
+ --Prompt-actions-gap: var(--size-8);
32211
+ --Prompt-gap: var(--size-10) var(--size-16);
32212
+ --Prompt-border-radius: 0;
32213
+ }
32214
+
32215
+ .wds-critical-banner--media-image {
32216
+ width: 48px;
32217
+ width: var(--size-48);
32218
+ height: 48px;
32219
+ height: var(--size-48);
32220
+ -o-object-fit: contain;
32221
+ object-fit: contain;
32222
+ }
32223
+
32224
+ @media (max-width: 767px) {
32225
+ .wds-critical-banner--with-two-actions .wds-prompt__actions-wrapper .wds-Button {
32226
+ flex: 1 1 calc(50% - (var(--Prompt-actions-gap) / 2));
32227
+ min-width: -moz-fit-content;
32228
+ min-width: fit-content;
32229
+ }
32230
+ }
32231
+
32232
+ .wds-critical-banner__description--collapsed {
32233
+ display: -webkit-box;
32234
+ -webkit-line-clamp: 2;
32235
+ -webkit-box-orient: vertical;
32236
+ overflow: hidden;
32237
+ }
32238
+
32239
+ .wds-critical-banner .wds-prompt__content-wrapper {
32240
+ grid-template-columns: auto 1fr auto;
32241
+ align-items: flex-start;
32242
+ }
32243
+
32244
+ .wds-critical-banner__text-wrapper {
32245
+ min-width: 0;
32246
+ }
32247
+
32248
+ @media (max-width: 767px) {
32249
+ .wds-critical-banner .wds-prompt__actions-wrapper {
32250
+ grid-column: span 3;
32251
+ }
32252
+ }
32253
+
32254
+ .wds-expander-toggle {
32255
+ align-self: flex-start;
32256
+ flex-shrink: 0;
32257
+ transition: transform 0.2s ease-in-out;
32258
+ }
32259
+
32260
+ .wds-expander-toggle--collapsed {
32261
+ transform: rotate(180deg);
32262
+ }
32263
+
32179
32264
  .wds-radio-group .np-radio:last-child label {
32180
32265
  margin-bottom: 0;
32181
32266
  }
@@ -34600,32 +34685,3 @@ html:not([dir="rtl"]) .np-navigation-option {
34600
34685
  .np-list-item__action {
34601
34686
  flex-shrink: 0;
34602
34687
  }
34603
-
34604
- .wds-action-prompt {
34605
- --Prompt-padding: var(--size-16);
34606
- --Prompt-actions-gap: var(--size-8);
34607
- --Prompt-gap: var(--size-10) var(--size-16);
34608
- --Prompt-border-radius: var(--radius-large);
34609
- }
34610
-
34611
- .wds-action-prompt--media-image {
34612
- width: 48px;
34613
- width: var(--size-48);
34614
- height: 48px;
34615
- height: var(--size-48);
34616
- -o-object-fit: contain;
34617
- object-fit: contain;
34618
- }
34619
-
34620
- @media (max-width: 767px) {
34621
- .wds-action-prompt--with-two-actions .wds-prompt__actions-wrapper .wds-Button {
34622
- flex: 1 1 calc(50% - (var(--Prompt-actions-gap) / 2));
34623
- min-width: -moz-fit-content;
34624
- min-width: fit-content;
34625
- }
34626
- }
34627
-
34628
- .wds-action-prompt__content {
34629
- max-width: calc(48px * 10);
34630
- max-width: calc(var(--size-48) * 10);
34631
- }
@@ -50,24 +50,16 @@ const isNumberOrNull = v => neptuneValidation.isNumber(v) || neptuneValidation.i
50
50
  const formatAmountIfSet = ({
51
51
  amount,
52
52
  currency,
53
- locale,
54
- decimals
53
+ locale
55
54
  }) => {
56
- if (typeof amount !== 'number') {
57
- return '';
58
- }
59
- if (decimals != null && currencyFormatting.getCurrencyDecimals(currency) !== 0) {
60
- return formatting.formatNumber(amount, locale, decimals);
61
- }
62
- return formatting.formatAmount(amount, currency, locale);
55
+ return typeof amount === 'number' ? formatting.formatAmount(amount, currency, locale) : '';
63
56
  };
64
57
  const parseNumber = ({
65
58
  amount,
66
59
  currency,
67
- locale,
68
- decimals
60
+ locale
69
61
  }) => {
70
- return currencyFormatting.parseAmount(amount, currency, locale, decimals);
62
+ return currencyFormatting.parseAmount(amount, currency, locale);
71
63
  };
72
64
  const allowedInputKeys = new Set(['Backspace', 'Delete', ',', '.', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight', 'Enter', 'Escape', 'Tab']);
73
65
  class MoneyInput extends React.Component {
@@ -84,8 +76,7 @@ class MoneyInput extends React.Component {
84
76
  formattedAmount: formatAmountIfSet({
85
77
  amount: props.amount,
86
78
  currency: props.selectedCurrency.currency,
87
- locale: props.intl.locale,
88
- decimals: props.decimals
79
+ locale: props.intl.locale
89
80
  }),
90
81
  locale: props.intl.locale
91
82
  };
@@ -99,8 +90,7 @@ class MoneyInput extends React.Component {
99
90
  formattedAmount: formatAmountIfSet({
100
91
  amount: nextProps.amount,
101
92
  currency: nextProps.selectedCurrency.currency,
102
- locale: nextProps.intl.locale,
103
- decimals: nextProps.decimals
93
+ locale: nextProps.intl.locale
104
94
  })
105
95
  });
106
96
  }
@@ -127,16 +117,14 @@ class MoneyInput extends React.Component {
127
117
  const parsed = neptuneValidation.isEmpty(paste) ? null : parseNumber({
128
118
  amount: paste,
129
119
  currency: this.props.selectedCurrency.currency,
130
- locale,
131
- decimals: this.props.decimals
120
+ locale
132
121
  });
133
122
  if (isNumberOrNull(parsed)) {
134
123
  this.setState({
135
124
  formattedAmount: formatAmountIfSet({
136
125
  amount: parsed,
137
126
  currency: this.props.selectedCurrency.currency,
138
- locale,
139
- decimals: this.props.decimals
127
+ locale
140
128
  })
141
129
  });
142
130
  this.props.onAmountChange?.(parsed);
@@ -153,8 +141,7 @@ class MoneyInput extends React.Component {
153
141
  const parsed = neptuneValidation.isEmpty(value) ? null : parseNumber({
154
142
  amount: value,
155
143
  currency: this.props.selectedCurrency.currency,
156
- locale: this.state.locale,
157
- decimals: this.props.decimals
144
+ locale: this.state.locale
158
145
  });
159
146
  if (isNumberOrNull(parsed)) {
160
147
  this.props.onAmountChange?.(parsed);
@@ -194,8 +181,7 @@ class MoneyInput extends React.Component {
194
181
  const parsed = parseNumber({
195
182
  amount: previousState.formattedAmount,
196
183
  currency: this.props.selectedCurrency.currency,
197
- locale: previousState.locale,
198
- decimals: this.props.decimals
184
+ locale: previousState.locale
199
185
  });
200
186
  if (!isNumberOrNull(parsed)) {
201
187
  return {
@@ -206,8 +192,7 @@ class MoneyInput extends React.Component {
206
192
  formattedAmount: formatAmountIfSet({
207
193
  amount: parsed,
208
194
  currency: this.props.selectedCurrency.currency,
209
- locale: previousState.locale,
210
- decimals: this.props.decimals
195
+ locale: previousState.locale
211
196
  })
212
197
  };
213
198
  });
@@ -272,8 +257,7 @@ class MoneyInput extends React.Component {
272
257
  placeholder: formatAmountIfSet({
273
258
  amount: this.props.placeholder,
274
259
  currency: this.props.selectedCurrency.currency,
275
- locale: this.state.locale,
276
- decimals: this.props.decimals
260
+ locale: this.state.locale
277
261
  }),
278
262
  autoComplete: "off",
279
263
  "aria-describedby": selectedCurrencyElementId,