@transferwise/components 0.0.0-experimental-4d90243 → 0.0.0-experimental-a308934

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 (115) 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 +85 -29
  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/main.css +85 -29
  56. package/build/styles/prompt/CriticalBanner/CriticalBanner.css +39 -0
  57. package/build/styles/prompt/common/Expander/Expander.css +8 -0
  58. package/build/typeahead/Typeahead.js +5 -4
  59. package/build/typeahead/Typeahead.js.map +1 -1
  60. package/build/typeahead/Typeahead.mjs +5 -4
  61. package/build/typeahead/Typeahead.mjs.map +1 -1
  62. package/build/types/index.d.ts +2 -2
  63. package/build/types/index.d.ts.map +1 -1
  64. package/build/types/moneyInput/MoneyInput.d.ts +0 -6
  65. package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
  66. package/build/types/moneyInput/currencyFormatting.d.ts +3 -4
  67. package/build/types/moneyInput/currencyFormatting.d.ts.map +1 -1
  68. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts +2 -11
  69. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts.map +1 -1
  70. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts +43 -0
  71. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts.map +1 -0
  72. package/build/types/prompt/CriticalBanner/helpers.d.ts +18 -0
  73. package/build/types/prompt/CriticalBanner/helpers.d.ts.map +1 -0
  74. package/build/types/prompt/CriticalBanner/index.d.ts +3 -0
  75. package/build/types/prompt/CriticalBanner/index.d.ts.map +1 -0
  76. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts +8 -3
  77. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts.map +1 -1
  78. package/build/types/prompt/common/Expander/Expander.d.ts +20 -0
  79. package/build/types/prompt/common/Expander/Expander.d.ts.map +1 -0
  80. package/build/types/prompt/common/Expander/Expander.messages.d.ts +14 -0
  81. package/build/types/prompt/common/Expander/Expander.messages.d.ts.map +1 -0
  82. package/build/types/prompt/helpers/promptMedia.d.ts +22 -0
  83. package/build/types/prompt/helpers/promptMedia.d.ts.map +1 -0
  84. package/build/types/prompt/index.d.ts +2 -0
  85. package/build/types/prompt/index.d.ts.map +1 -1
  86. package/build/types/test-utils/index.d.ts +4 -0
  87. package/build/types/test-utils/index.d.ts.map +1 -1
  88. package/package.json +3 -3
  89. package/src/i18n/en.json +2 -0
  90. package/src/index.ts +2 -2
  91. package/src/main.css +85 -29
  92. package/src/main.less +3 -1
  93. package/src/moneyInput/MoneyInput.story.tsx +1 -10
  94. package/src/moneyInput/MoneyInput.test.story.tsx +1 -141
  95. package/src/moneyInput/MoneyInput.test.tsx +0 -45
  96. package/src/moneyInput/MoneyInput.tsx +3 -27
  97. package/src/moneyInput/currencyFormatting.ts +5 -11
  98. package/src/prompt/ActionPrompt/ActionPrompt.tsx +9 -62
  99. package/src/prompt/CriticalBanner/CriticalBanner.accessibility.docs.mdx +131 -0
  100. package/src/prompt/CriticalBanner/CriticalBanner.css +39 -0
  101. package/src/prompt/CriticalBanner/CriticalBanner.less +45 -0
  102. package/src/prompt/CriticalBanner/CriticalBanner.story.tsx +476 -0
  103. package/src/prompt/CriticalBanner/CriticalBanner.test.story.tsx +67 -0
  104. package/src/prompt/CriticalBanner/CriticalBanner.tsx +188 -0
  105. package/src/prompt/CriticalBanner/helpers.ts +39 -0
  106. package/src/prompt/CriticalBanner/index.ts +2 -0
  107. package/src/prompt/PrimitivePrompt/PrimitivePrompt.tsx +9 -2
  108. package/src/prompt/common/Expander/Expander.css +8 -0
  109. package/src/prompt/common/Expander/Expander.less +9 -0
  110. package/src/prompt/common/Expander/Expander.messages.ts +14 -0
  111. package/src/prompt/common/Expander/Expander.test.tsx +167 -0
  112. package/src/prompt/common/Expander/Expander.tsx +83 -0
  113. package/src/prompt/helpers/promptMedia.tsx +79 -0
  114. package/src/prompt/index.ts +4 -0
  115. package/src/sentimentSurface/SentimentSurface.story.tsx +43 -17
@@ -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
@@ -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,