@transferwise/components 46.52.3 → 46.54.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (156) hide show
  1. package/build/dateLookup/dateTrigger/DateTrigger.js +8 -4
  2. package/build/dateLookup/dateTrigger/DateTrigger.js.map +1 -1
  3. package/build/dateLookup/dateTrigger/DateTrigger.mjs +8 -4
  4. package/build/dateLookup/dateTrigger/DateTrigger.mjs.map +1 -1
  5. package/build/field/Field.js +36 -8
  6. package/build/field/Field.js.map +1 -1
  7. package/build/field/Field.mjs +37 -9
  8. package/build/field/Field.mjs.map +1 -1
  9. package/build/i18n/en.json +2 -0
  10. package/build/i18n/en.json.js +2 -0
  11. package/build/i18n/en.json.js.map +1 -1
  12. package/build/i18n/en.json.mjs +2 -0
  13. package/build/i18n/en.json.mjs.map +1 -1
  14. package/build/index.js +2 -2
  15. package/build/index.mjs +1 -1
  16. package/build/inlineAlert/InlineAlert.js +13 -6
  17. package/build/inlineAlert/InlineAlert.js.map +1 -1
  18. package/build/inlineAlert/InlineAlert.mjs +13 -6
  19. package/build/inlineAlert/InlineAlert.mjs.map +1 -1
  20. package/build/label/Label.js +35 -4
  21. package/build/label/Label.js.map +1 -1
  22. package/build/label/Label.messages.js +12 -0
  23. package/build/label/Label.messages.js.map +1 -0
  24. package/build/label/Label.messages.mjs +10 -0
  25. package/build/label/Label.messages.mjs.map +1 -0
  26. package/build/label/Label.mjs +36 -5
  27. package/build/label/Label.mjs.map +1 -1
  28. package/build/main.css +14 -8
  29. package/build/styles/dateLookup/dateTrigger/DateTrigger.css +0 -8
  30. package/build/styles/field/Field.css +4 -0
  31. package/build/styles/main.css +14 -8
  32. package/build/styles/upload/Upload.css +10 -0
  33. package/build/tabs/Tab.js +13 -38
  34. package/build/tabs/Tab.js.map +1 -1
  35. package/build/tabs/Tab.mjs +13 -34
  36. package/build/tabs/Tab.mjs.map +1 -1
  37. package/build/tabs/TabList.js +3 -11
  38. package/build/tabs/TabList.js.map +1 -1
  39. package/build/tabs/TabList.mjs +3 -7
  40. package/build/tabs/TabList.mjs.map +1 -1
  41. package/build/tabs/TabPanel.js +3 -16
  42. package/build/tabs/TabPanel.js.map +1 -1
  43. package/build/tabs/TabPanel.mjs +3 -12
  44. package/build/tabs/TabPanel.mjs.map +1 -1
  45. package/build/tabs/Tabs.js +24 -48
  46. package/build/tabs/Tabs.js.map +1 -1
  47. package/build/tabs/Tabs.mjs +24 -47
  48. package/build/tabs/Tabs.mjs.map +1 -1
  49. package/build/tabs/utils.js +0 -1
  50. package/build/tabs/utils.js.map +1 -1
  51. package/build/tabs/utils.mjs +0 -1
  52. package/build/tabs/utils.mjs.map +1 -1
  53. package/build/types/dateLookup/dateTrigger/DateTrigger.d.ts.map +1 -1
  54. package/build/types/field/Field.d.ts +4 -2
  55. package/build/types/field/Field.d.ts.map +1 -1
  56. package/build/types/index.d.ts +2 -1
  57. package/build/types/index.d.ts.map +1 -1
  58. package/build/types/inlineAlert/InlineAlert.d.ts +9 -0
  59. package/build/types/inlineAlert/InlineAlert.d.ts.map +1 -1
  60. package/build/types/label/Label.d.ts +21 -1
  61. package/build/types/label/Label.d.ts.map +1 -1
  62. package/build/types/label/Label.messages.d.ts +8 -0
  63. package/build/types/label/Label.messages.d.ts.map +1 -0
  64. package/build/types/label/index.d.ts +3 -0
  65. package/build/types/label/index.d.ts.map +1 -0
  66. package/build/types/tabs/Tab.d.ts +12 -1
  67. package/build/types/tabs/Tab.d.ts.map +1 -1
  68. package/build/types/tabs/TabList.d.ts +3 -8
  69. package/build/types/tabs/TabList.d.ts.map +1 -1
  70. package/build/types/tabs/TabPanel.d.ts +6 -14
  71. package/build/types/tabs/TabPanel.d.ts.map +1 -1
  72. package/build/types/tabs/Tabs.d.ts +83 -30
  73. package/build/types/tabs/Tabs.d.ts.map +1 -1
  74. package/build/types/tabs/index.d.ts +2 -1
  75. package/build/types/tabs/index.d.ts.map +1 -1
  76. package/build/types/tabs/utils.d.ts +12 -7
  77. package/build/types/tabs/utils.d.ts.map +1 -1
  78. package/build/types/upload/Upload.d.ts +1 -0
  79. package/build/types/upload/Upload.d.ts.map +1 -1
  80. package/build/types/upload/Upload.messages.d.ts +4 -0
  81. package/build/types/upload/Upload.messages.d.ts.map +1 -1
  82. package/build/types/upload/steps/completeStep/completeStep.d.ts +1 -3
  83. package/build/types/upload/steps/completeStep/completeStep.d.ts.map +1 -1
  84. package/build/types/upload/steps/uploadImageStep/uploadImageStep.d.ts +1 -0
  85. package/build/types/upload/steps/uploadImageStep/uploadImageStep.d.ts.map +1 -1
  86. package/build/upload/Upload.js +26 -12
  87. package/build/upload/Upload.js.map +1 -1
  88. package/build/upload/Upload.messages.js +3 -0
  89. package/build/upload/Upload.messages.js.map +1 -1
  90. package/build/upload/Upload.messages.mjs +3 -0
  91. package/build/upload/Upload.messages.mjs.map +1 -1
  92. package/build/upload/Upload.mjs +26 -12
  93. package/build/upload/Upload.mjs.map +1 -1
  94. package/build/upload/steps/completeStep/completeStep.js +15 -30
  95. package/build/upload/steps/completeStep/completeStep.js.map +1 -1
  96. package/build/upload/steps/completeStep/completeStep.mjs +16 -31
  97. package/build/upload/steps/completeStep/completeStep.mjs.map +1 -1
  98. package/build/upload/steps/uploadImageStep/uploadImageStep.js +56 -32
  99. package/build/upload/steps/uploadImageStep/uploadImageStep.js.map +1 -1
  100. package/build/upload/steps/uploadImageStep/uploadImageStep.mjs +56 -32
  101. package/build/upload/steps/uploadImageStep/uploadImageStep.mjs.map +1 -1
  102. package/package.json +2 -2
  103. package/src/dateInput/DateInput.tests.story.tsx +6 -42
  104. package/src/dateLookup/DateLookup.rtl.spec.tsx +1 -1
  105. package/src/dateLookup/dateTrigger/DateTrigger.css +0 -8
  106. package/src/dateLookup/dateTrigger/DateTrigger.less +0 -8
  107. package/src/dateLookup/dateTrigger/DateTrigger.spec.js +1 -1
  108. package/src/dateLookup/dateTrigger/DateTrigger.tsx +9 -4
  109. package/src/field/Field.css +4 -0
  110. package/src/field/Field.less +5 -0
  111. package/src/field/Field.spec.tsx +41 -5
  112. package/src/field/Field.story.tsx +105 -7
  113. package/src/field/Field.tsx +34 -10
  114. package/src/i18n/en.json +2 -0
  115. package/src/index.ts +2 -1
  116. package/src/inlineAlert/InlineAlert.story.tsx +7 -72
  117. package/src/inlineAlert/InlineAlert.tsx +14 -3
  118. package/src/inputWithDisplayFormat/InputWithDisplayFormat.story.js +5 -10
  119. package/src/inputs/InputGroup.spec.tsx +1 -1
  120. package/src/inputs/SearchInput.spec.tsx +1 -1
  121. package/src/inputs/SelectInput.spec.tsx +1 -1
  122. package/src/label/Label.messages.tsx +8 -0
  123. package/src/label/Label.spec.tsx +53 -4
  124. package/src/label/Label.story.tsx +32 -26
  125. package/src/label/Label.tsx +47 -2
  126. package/src/label/index.ts +2 -0
  127. package/src/main.css +14 -8
  128. package/src/main.less +1 -0
  129. package/src/moneyInput/MoneyInput.story.tsx +11 -11
  130. package/src/radioGroup/RadioGroup.rtl.spec.tsx +1 -1
  131. package/src/select/Select.rtl.spec.tsx +1 -1
  132. package/src/switch/Switch.spec.tsx +1 -1
  133. package/src/switch/Switch.story.tsx +19 -21
  134. package/src/tabs/Tab.tsx +72 -0
  135. package/src/tabs/TabList.tsx +11 -0
  136. package/src/tabs/TabPanel.tsx +14 -0
  137. package/src/tabs/{Tabs.story.js → Tabs.story.tsx} +1 -1
  138. package/src/tabs/{Tabs.js → Tabs.tsx} +111 -74
  139. package/src/tabs/index.ts +2 -0
  140. package/src/tabs/{utils.spec.js → utils.spec.ts} +24 -21
  141. package/src/tabs/{utils.js → utils.ts} +15 -9
  142. package/src/upload/Upload.css +10 -0
  143. package/src/upload/Upload.less +9 -0
  144. package/src/upload/Upload.messages.ts +4 -0
  145. package/src/upload/Upload.spec.js +8 -7
  146. package/src/upload/Upload.story.tsx +1 -0
  147. package/src/upload/Upload.tsx +39 -20
  148. package/src/upload/steps/completeStep/completeStep.spec.js +0 -9
  149. package/src/upload/steps/completeStep/completeStep.tsx +14 -29
  150. package/src/upload/steps/uploadImageStep/uploadImageStep.spec.js +12 -0
  151. package/src/upload/steps/uploadImageStep/uploadImageStep.tsx +43 -24
  152. package/src/field/Field.tests.story.tsx +0 -33
  153. package/src/tabs/Tab.js +0 -71
  154. package/src/tabs/TabList.js +0 -15
  155. package/src/tabs/TabPanel.js +0 -20
  156. package/src/tabs/index.js +0 -1
package/build/label/Label.js CHANGED
@@ -1,21 +1,52 @@
1
1
  'use strict';
2
2
 
3
3
  var clsx = require('clsx');
4
+ var Label_messages = require('./Label.messages.js');
5
+ var reactIntl = require('react-intl');
6
+ var Body = require('../body/Body.js');
4
7
  var jsxRuntime = require('react/jsx-runtime');
5
8
 
6
9
  const Label = ({
7
- id,
8
- htmlFor,
9
10
  className,
10
- children
11
+ children,
12
+ htmlFor,
13
+ id
11
14
  }) => {
12
15
  return /*#__PURE__*/jsxRuntime.jsx("label", {
13
16
  id: id,
14
17
  htmlFor: htmlFor,
15
- className: clsx.clsx('control-label d-flex flex-column gap-y-1 m-b-0', className),
18
+ className: clsx.clsx('np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0', className),
16
19
  children: children
17
20
  });
18
21
  };
22
+ // eslint-disable-next-line functional/immutable-data
23
+ Label.Optional = function Optional({
24
+ children,
25
+ className
26
+ }) {
27
+ const {
28
+ formatMessage
29
+ } = reactIntl.useIntl();
30
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
31
+ children: [children, /*#__PURE__*/jsxRuntime.jsx(Body, {
32
+ as: "span",
33
+ className: clsx.clsx('text-secondary', 'm-l-1', className),
34
+ children: formatMessage(Label_messages.optionalLabel)
35
+ })]
36
+ });
37
+ };
38
+ // eslint-disable-next-line functional/immutable-data
39
+ Label.Description = function Description({
40
+ id,
41
+ children,
42
+ className
43
+ }) {
44
+ return children ? /*#__PURE__*/jsxRuntime.jsx(Body, {
45
+ id: id,
46
+ className: clsx.clsx('text-secondary', className),
47
+ children: children
48
+ }) : null;
49
+ };
19
50
 
20
51
  exports.Label = Label;
21
52
  //# sourceMappingURL=Label.js.map
package/build/label/Label.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Label.js","sources":["../../src/label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type LabelProps = {\n id?: string;\n htmlFor?: string;\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Label = ({ id, htmlFor, className, children }: LabelProps) => {\n return (\n <label\n id={id}\n htmlFor={htmlFor}\n className={clsx('control-label d-flex flex-column gap-y-1 m-b-0', className)}\n >\n {children}\n </label>\n );\n};\n"],"names":["Label","id","htmlFor","className","children","_jsx","clsx"],"mappings":";;;;;AASO,MAAMA,KAAK,GAAGA,CAAC;EAAEC,EAAE;EAAEC,OAAO;EAAEC,SAAS;AAAEC,EAAAA,QAAAA;AAAQ,CAAc,KAAI;AACxE,EAAA,oBACEC,cAAA,CAAA,OAAA,EAAA;AACEJ,IAAAA,EAAE,EAAEA,EAAG;AACPC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,SAAS,EAAEG,SAAI,CAAC,gDAAgD,EAAEH,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAE5EA,QAAAA;AAAQ,GACJ,CAAC,CAAA;AAEZ;;;;"}
1
+ {"version":3,"file":"Label.js","sources":["../../src/label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../body';\nimport { CommonProps } from '../common';\nimport { PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n id?: string;\n htmlFor?: string;\n className?: string;\n children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = ({ className, children, htmlFor, id }: LabelProps) => {\n return (\n <label\n id={id}\n htmlFor={htmlFor}\n className={clsx(\n 'np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0',\n className,\n )}\n >\n {children}\n </label>\n );\n};\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\n// eslint-disable-next-line functional/immutable-data\nLabel.Optional = function Optional({ children, className }: LabelOptionalProps) {\n const { formatMessage } = useIntl();\n return (\n <div>\n {children}\n <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n {formatMessage(messages.optionalLabel)}\n </Body>\n </div>\n );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\n// eslint-disable-next-line functional/immutable-data\nLabel.Description = function Description({ id, children, className }: LabelDescriptionProps) {\n return children ? (\n <Body id={id} className={clsx('text-secondary', className)}>\n {children}\n </Body>\n ) : null;\n};\n\nexport { Label };\n"],"names":["Label","className","children","htmlFor","id","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description"],"mappings":";;;;;;;;AAuBMA,MAAAA,KAAK,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA,EAAAA;AAAE,CAAc,KAAI;AACjE,EAAA,oBACEC,cAAA,CAAA,OAAA,EAAA;AACED,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEK,SAAI,CACb,0EAA0E,EAC1EL,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA,QAAAA;AAAQ,GACJ,CAAC,CAAA;AAEZ,EAAC;AAID;AACAF,KAAK,CAACO,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEL,QAAQ;AAAED,EAAAA,SAAAA;AAA+B,CAAA,EAAA;EAC5E,MAAM;AAAEO,IAAAA,aAAAA;GAAe,GAAGC,iBAAO,EAAE,CAAA;AACnC,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAAR,IAAAA,QAAA,EACGA,CAAAA,QAAQ,eACTG,cAAA,CAACM,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACX,SAAS,EAAEK,SAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEL,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEM,aAAa,CAACK,cAAQ,CAACC,aAAa,CAAA;AAAC,KAClC,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV,CAAC,CAAA;AAID;AACAd,KAAK,CAACe,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEX,EAAE;EAAEF,QAAQ;AAAED,EAAAA,SAAAA;AAAkC,CAAA,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbG,cAAA,CAACM,IAAI,EAAA;AAACP,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEK,SAAI,CAAC,gBAAgB,EAAEL,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA,QAAAA;GACG,CAAC,GACL,IAAI,CAAA;AACV,CAAC;;;;"}
package/build/label/Label.messages.js ADDED
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var reactIntl = require('react-intl');
4
+
5
+ var messages = reactIntl.defineMessages({
6
+ optionalLabel: {
7
+ id: "neptune.Label.optional"
8
+ }
9
+ });
10
+
11
+ module.exports = messages;
12
+ //# sourceMappingURL=Label.messages.js.map
package/build/label/Label.messages.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Label.messages.js","sources":["../../src/label/Label.messages.tsx"],"sourcesContent":["import { defineMessages } from 'react-intl';\n\nexport default defineMessages({\n optionalLabel: {\n id: 'neptune.Label.optional',\n defaultMessage: '(Optional)',\n },\n});\n"],"names":["defineMessages","optionalLabel","id"],"mappings":";;;;AAEA,eAAeA,wBAAc,CAAC;AAC5BC,EAAAA,aAAa,EAAE;IACbC,EAAE,EAAA,wBAAA;AAEH,GAAA;AACF,CAAA,CAAC;;;;"}
package/build/label/Label.messages.mjs ADDED
@@ -0,0 +1,10 @@
1
+ import { defineMessages } from 'react-intl';
2
+
3
+ var messages = defineMessages({
4
+ optionalLabel: {
5
+ id: "neptune.Label.optional"
6
+ }
7
+ });
8
+
9
+ export { messages as default };
10
+ //# sourceMappingURL=Label.messages.mjs.map
package/build/label/Label.messages.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Label.messages.mjs","sources":["../../src/label/Label.messages.tsx"],"sourcesContent":["import { defineMessages } from 'react-intl';\n\nexport default defineMessages({\n optionalLabel: {\n id: 'neptune.Label.optional',\n defaultMessage: '(Optional)',\n },\n});\n"],"names":["defineMessages","optionalLabel","id"],"mappings":";;AAEA,eAAeA,cAAc,CAAC;AAC5BC,EAAAA,aAAa,EAAE;IACbC,EAAE,EAAA,wBAAA;AAEH,GAAA;AACF,CAAA,CAAC;;;;"}
package/build/label/Label.mjs CHANGED
@@ -1,19 +1,50 @@
1
1
  import { clsx } from 'clsx';
2
- import { jsx } from 'react/jsx-runtime';
2
+ import messages from './Label.messages.mjs';
3
+ import { useIntl } from 'react-intl';
4
+ import Body from '../body/Body.mjs';
5
+ import { jsx, jsxs } from 'react/jsx-runtime';
3
6
 
4
7
  const Label = ({
5
- id,
6
- htmlFor,
7
8
  className,
8
- children
9
+ children,
10
+ htmlFor,
11
+ id
9
12
  }) => {
10
13
  return /*#__PURE__*/jsx("label", {
11
14
  id: id,
12
15
  htmlFor: htmlFor,
13
- className: clsx('control-label d-flex flex-column gap-y-1 m-b-0', className),
16
+ className: clsx('np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0', className),
14
17
  children: children
15
18
  });
16
19
  };
20
+ // eslint-disable-next-line functional/immutable-data
21
+ Label.Optional = function Optional({
22
+ children,
23
+ className
24
+ }) {
25
+ const {
26
+ formatMessage
27
+ } = useIntl();
28
+ return /*#__PURE__*/jsxs("div", {
29
+ children: [children, /*#__PURE__*/jsx(Body, {
30
+ as: "span",
31
+ className: clsx('text-secondary', 'm-l-1', className),
32
+ children: formatMessage(messages.optionalLabel)
33
+ })]
34
+ });
35
+ };
36
+ // eslint-disable-next-line functional/immutable-data
37
+ Label.Description = function Description({
38
+ id,
39
+ children,
40
+ className
41
+ }) {
42
+ return children ? /*#__PURE__*/jsx(Body, {
43
+ id: id,
44
+ className: clsx('text-secondary', className),
45
+ children: children
46
+ }) : null;
47
+ };
17
48
 
18
49
  export { Label };
19
50
  //# sourceMappingURL=Label.mjs.map
package/build/label/Label.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Label.mjs","sources":["../../src/label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type LabelProps = {\n id?: string;\n htmlFor?: string;\n className?: string;\n children?: React.ReactNode;\n};\n\nexport const Label = ({ id, htmlFor, className, children }: LabelProps) => {\n return (\n <label\n id={id}\n htmlFor={htmlFor}\n className={clsx('control-label d-flex flex-column gap-y-1 m-b-0', className)}\n >\n {children}\n </label>\n );\n};\n"],"names":["Label","id","htmlFor","className","children","_jsx","clsx"],"mappings":";;;AASO,MAAMA,KAAK,GAAGA,CAAC;EAAEC,EAAE;EAAEC,OAAO;EAAEC,SAAS;AAAEC,EAAAA,QAAAA;AAAQ,CAAc,KAAI;AACxE,EAAA,oBACEC,GAAA,CAAA,OAAA,EAAA;AACEJ,IAAAA,EAAE,EAAEA,EAAG;AACPC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,SAAS,EAAEG,IAAI,CAAC,gDAAgD,EAAEH,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAE5EA,QAAAA;AAAQ,GACJ,CAAC,CAAA;AAEZ;;;;"}
1
+ {"version":3,"file":"Label.mjs","sources":["../../src/label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../body';\nimport { CommonProps } from '../common';\nimport { PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n id?: string;\n htmlFor?: string;\n className?: string;\n children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = ({ className, children, htmlFor, id }: LabelProps) => {\n return (\n <label\n id={id}\n htmlFor={htmlFor}\n className={clsx(\n 'np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0',\n className,\n )}\n >\n {children}\n </label>\n );\n};\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\n// eslint-disable-next-line functional/immutable-data\nLabel.Optional = function Optional({ children, className }: LabelOptionalProps) {\n const { formatMessage } = useIntl();\n return (\n <div>\n {children}\n <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n {formatMessage(messages.optionalLabel)}\n </Body>\n </div>\n );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\n// eslint-disable-next-line functional/immutable-data\nLabel.Description = function Description({ id, children, className }: LabelDescriptionProps) {\n return children ? (\n <Body id={id} className={clsx('text-secondary', className)}>\n {children}\n </Body>\n ) : null;\n};\n\nexport { Label };\n"],"names":["Label","className","children","htmlFor","id","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description"],"mappings":";;;;;;AAuBMA,MAAAA,KAAK,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA,EAAAA;AAAE,CAAc,KAAI;AACjE,EAAA,oBACEC,GAAA,CAAA,OAAA,EAAA;AACED,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEK,IAAI,CACb,0EAA0E,EAC1EL,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA,QAAAA;AAAQ,GACJ,CAAC,CAAA;AAEZ,EAAC;AAID;AACAF,KAAK,CAACO,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEL,QAAQ;AAAED,EAAAA,SAAAA;AAA+B,CAAA,EAAA;EAC5E,MAAM;AAAEO,IAAAA,aAAAA;GAAe,GAAGC,OAAO,EAAE,CAAA;AACnC,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAAR,IAAAA,QAAA,EACGA,CAAAA,QAAQ,eACTG,GAAA,CAACM,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACX,SAAS,EAAEK,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEL,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEM,aAAa,CAACK,QAAQ,CAACC,aAAa,CAAA;AAAC,KAClC,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV,CAAC,CAAA;AAID;AACAd,KAAK,CAACe,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEX,EAAE;EAAEF,QAAQ;AAAED,EAAAA,SAAAA;AAAkC,CAAA,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbG,GAAA,CAACM,IAAI,EAAA;AAACP,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEK,IAAI,CAAC,gBAAgB,EAAEL,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA,QAAAA;GACG,CAAC,GACL,IAAI,CAAA;AACV,CAAC;;;;"}
package/build/main.css CHANGED
@@ -1719,18 +1719,10 @@ button.np-option {
1719
1719
  white-space: nowrap;
1720
1720
  width: 100%;
1721
1721
  }
1722
- .np-date-trigger .control-label {
1723
- font-weight: 400;
1724
- font-weight: var(--font-weight-regular);
1725
- }
1726
1722
  .np-theme-personal .np-date-trigger {
1727
1723
  padding-left: 16px;
1728
1724
  padding-left: var(--size-16);
1729
1725
  }
1730
- .np-theme-personal .np-date-trigger .control-label + span {
1731
- font-weight: 400;
1732
- font-weight: var(--font-weight-regular);
1733
- }
1734
1726
  .clear-btn {
1735
1727
  transition: color 0.15s ease-in-out;
1736
1728
  color: #c9cbce;
@@ -2385,6 +2377,10 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2385
2377
  border-radius: 9999px !important;
2386
2378
  border-radius: var(--radius-full) !important;
2387
2379
  }
2380
+ .np-field-control {
2381
+ margin-top: 4px;
2382
+ margin-top: var(--size-4);
2383
+ }
2388
2384
  .np-input-group {
2389
2385
  display: inline-grid;
2390
2386
  width: 100%;
@@ -5444,6 +5440,16 @@ html:not([dir="rtl"]) .np-navigation-option {
5444
5440
  .tw-droppable-sm {
5445
5441
  min-height: 245px;
5446
5442
  }
5443
+ .upload-error-message {
5444
+ margin-top: 24px;
5445
+ margin-top: var(--padding-medium);
5446
+ border-top: 1px solid rgba(0,0,0,0.10196);
5447
+ border-top: 1px solid var(--color-border-neutral);
5448
+ text-align: start;
5449
+ }
5450
+ .upload-error-message .alert {
5451
+ min-width: 100px;
5452
+ }
5447
5453
  .np-upload-button-container {
5448
5454
  border-style: solid;
5449
5455
  }
package/build/styles/dateLookup/dateTrigger/DateTrigger.css CHANGED
@@ -4,18 +4,10 @@
4
4
  white-space: nowrap;
5
5
  width: 100%;
6
6
  }
7
- .np-date-trigger .control-label {
8
- font-weight: 400;
9
- font-weight: var(--font-weight-regular);
10
- }
11
7
  .np-theme-personal .np-date-trigger {
12
8
  padding-left: 16px;
13
9
  padding-left: var(--size-16);
14
10
  }
15
- .np-theme-personal .np-date-trigger .control-label + span {
16
- font-weight: 400;
17
- font-weight: var(--font-weight-regular);
18
- }
19
11
  .clear-btn {
20
12
  transition: color 0.15s ease-in-out;
21
13
  color: #c9cbce;
package/build/styles/field/Field.css ADDED
@@ -0,0 +1,4 @@
1
+ .np-field-control {
2
+ margin-top: 4px;
3
+ margin-top: var(--size-4);
4
+ }
package/build/styles/main.css CHANGED
@@ -1719,18 +1719,10 @@ button.np-option {
1719
1719
  white-space: nowrap;
1720
1720
  width: 100%;
1721
1721
  }
1722
- .np-date-trigger .control-label {
1723
- font-weight: 400;
1724
- font-weight: var(--font-weight-regular);
1725
- }
1726
1722
  .np-theme-personal .np-date-trigger {
1727
1723
  padding-left: 16px;
1728
1724
  padding-left: var(--size-16);
1729
1725
  }
1730
- .np-theme-personal .np-date-trigger .control-label + span {
1731
- font-weight: 400;
1732
- font-weight: var(--font-weight-regular);
1733
- }
1734
1726
  .clear-btn {
1735
1727
  transition: color 0.15s ease-in-out;
1736
1728
  color: #c9cbce;
@@ -2385,6 +2377,10 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2385
2377
  border-radius: 9999px !important;
2386
2378
  border-radius: var(--radius-full) !important;
2387
2379
  }
2380
+ .np-field-control {
2381
+ margin-top: 4px;
2382
+ margin-top: var(--size-4);
2383
+ }
2388
2384
  .np-input-group {
2389
2385
  display: inline-grid;
2390
2386
  width: 100%;
@@ -5444,6 +5440,16 @@ html:not([dir="rtl"]) .np-navigation-option {
5444
5440
  .tw-droppable-sm {
5445
5441
  min-height: 245px;
5446
5442
  }
5443
+ .upload-error-message {
5444
+ margin-top: 24px;
5445
+ margin-top: var(--padding-medium);
5446
+ border-top: 1px solid rgba(0,0,0,0.10196);
5447
+ border-top: 1px solid var(--color-border-neutral);
5448
+ text-align: start;
5449
+ }
5450
+ .upload-error-message .alert {
5451
+ min-width: 100px;
5452
+ }
5447
5453
  .np-upload-button-container {
5448
5454
  border-style: solid;
5449
5455
  }
package/build/styles/upload/Upload.css CHANGED
@@ -13,3 +13,13 @@
13
13
  .tw-droppable-sm {
14
14
  min-height: 245px;
15
15
  }
16
+ .upload-error-message {
17
+ margin-top: 24px;
18
+ margin-top: var(--padding-medium);
19
+ border-top: 1px solid rgba(0,0,0,0.10196);
20
+ border-top: 1px solid var(--color-border-neutral);
21
+ text-align: start;
22
+ }
23
+ .upload-error-message .alert {
24
+ min-width: 100px;
25
+ }
package/build/tabs/Tab.js CHANGED
@@ -1,15 +1,12 @@
1
1
  'use strict';
2
2
 
3
3
  var clsx = require('clsx');
4
- var PropTypes = require('prop-types');
5
4
  var React = require('react');
5
+ var useEffectEvent = require('../common/hooks/useEffectEvent.js');
6
6
  var jsxRuntime = require('react/jsx-runtime');
7
7
 
8
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
9
-
10
- var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
11
-
12
- const Tab = /*#__PURE__*/React.forwardRef(({
8
+ const noop = () => {};
9
+ const Tab = /*#__PURE__*/React.forwardRef(function Tab({
13
10
  children,
14
11
  id,
15
12
  disabled,
@@ -18,21 +15,19 @@ const Tab = /*#__PURE__*/React.forwardRef(({
18
15
  onKeyDown,
19
16
  onClick,
20
17
  style,
21
- focusTab
22
- }, reference) => {
18
+ focusTab = noop
19
+ }, reference) {
20
+ const handleFocusTab = useEffectEvent.useEffectEvent(focusTab);
23
21
  const firstUpdate = React.useRef(true);
24
- const checkFocus = () => {
22
+ React.useEffect(function checkFocus() {
25
23
  if (firstUpdate.current) {
26
24
  firstUpdate.current = false;
27
25
  return;
28
26
  }
29
- if (selected && focusTab) {
30
- focusTab();
27
+ if (selected) {
28
+ handleFocusTab();
31
29
  }
32
- };
33
- React.useEffect(() => {
34
- checkFocus();
35
- }, [selected]);
30
+ }, [handleFocusTab, selected]);
36
31
  return /*#__PURE__*/jsxRuntime.jsx("li", {
37
32
  ref: reference,
38
33
  className: clsx.clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {
@@ -44,10 +39,10 @@ const Tab = /*#__PURE__*/React.forwardRef(({
44
39
  id: id,
45
40
  "aria-selected": selected ? 'true' : 'false',
46
41
  "aria-disabled": disabled ? 'true' : 'false',
47
- "aria-controls": disabled ? null : panelId,
48
- tabIndex: "0",
42
+ "aria-controls": disabled ? undefined : panelId,
43
+ tabIndex: 0,
49
44
  style: style,
50
- onKeyDown: disabled ? null : onKeyDown,
45
+ onKeyDown: disabled ? undefined : onKeyDown,
51
46
  onClick: onClick,
52
47
  children: /*#__PURE__*/jsxRuntime.jsx("span", {
53
48
  className: "tabs__tab__content",
@@ -55,26 +50,6 @@ const Tab = /*#__PURE__*/React.forwardRef(({
55
50
  })
56
51
  });
57
52
  });
58
- Tab.defaultProps = {
59
- disabled: false,
60
- selected: false,
61
- onClick: null,
62
- style: null,
63
- focusTab: null
64
- };
65
- Tab.propTypes = {
66
- children: PropTypes__default.default.node.isRequired,
67
- disabled: PropTypes__default.default.bool,
68
- selected: PropTypes__default.default.bool,
69
- id: PropTypes__default.default.string.isRequired,
70
- panelId: PropTypes__default.default.string.isRequired,
71
- style: PropTypes__default.default.shape({
72
- width: PropTypes__default.default.string
73
- }),
74
- focusTab: PropTypes__default.default.func,
75
- onKeyDown: PropTypes__default.default.func.isRequired,
76
- onClick: PropTypes__default.default.func
77
- };
78
53
 
79
54
  module.exports = Tab;
80
55
  //# sourceMappingURL=Tab.js.map
package/build/tabs/Tab.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.js","sources":["../../src/tabs/Tab.js"],"sourcesContent":["import { clsx } from 'clsx';\nimport PropTypes from 'prop-types';\nimport { forwardRef, useEffect, useRef } from 'react';\n\nconst Tab = forwardRef(\n (\n { children, id, disabled, panelId, selected, onKeyDown, onClick, style, focusTab },\n reference,\n ) => {\n const firstUpdate = useRef(true);\n\n const checkFocus = () => {\n if (firstUpdate.current) {\n firstUpdate.current = false;\n return;\n }\n\n if (selected && focusTab) {\n focusTab();\n }\n };\n\n useEffect(() => {\n checkFocus();\n }, [selected]);\n\n return (\n <li\n ref={reference}\n className={clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {\n 'tabs__tab--selected': selected,\n clickable: !disabled,\n disabled,\n })}\n role=\"tab\"\n id={id}\n aria-selected={selected ? 'true' : 'false'}\n aria-disabled={disabled ? 'true' : 'false'}\n aria-controls={disabled ? null : panelId}\n tabIndex=\"0\"\n style={style}\n onKeyDown={disabled ? null : onKeyDown}\n onClick={onClick}\n >\n <span className=\"tabs__tab__content\">{children}</span>\n </li>\n );\n },\n);\n\nTab.defaultProps = {\n disabled: false,\n selected: false,\n onClick: null,\n style: null,\n focusTab: null,\n};\n\nTab.propTypes = {\n children: PropTypes.node.isRequired,\n disabled: PropTypes.bool,\n selected: PropTypes.bool,\n id: PropTypes.string.isRequired,\n panelId: PropTypes.string.isRequired,\n style: PropTypes.shape({ width: PropTypes.string }),\n focusTab: PropTypes.func,\n onKeyDown: PropTypes.func.isRequired,\n onClick: PropTypes.func,\n};\n\nexport default Tab;\n"],"names":["Tab","forwardRef","children","id","disabled","panelId","selected","onKeyDown","onClick","style","focusTab","reference","firstUpdate","useRef","checkFocus","current","useEffect","_jsx","ref","className","clsx","clickable","role","tabIndex","defaultProps","propTypes","PropTypes","node","isRequired","bool","string","shape","width","func"],"mappings":";;;;;;;;;;;AAIA,MAAMA,GAAG,gBAAGC,gBAAU,CACpB,CACE;EAAEC,QAAQ;EAAEC,EAAE;EAAEC,QAAQ;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,SAAS;EAAEC,OAAO;EAAEC,KAAK;AAAEC,EAAAA,QAAAA;AAAS,CAAC,EAClFC,SAAS,KACN;AACH,EAAA,MAAMC,WAAW,GAAGC,YAAM,CAAC,IAAI,CAAC,CAAA;EAEhC,MAAMC,UAAU,GAAGA,MAAM;IACvB,IAAIF,WAAW,CAACG,OAAO,EAAE;MACvBH,WAAW,CAACG,OAAO,GAAG,KAAK,CAAA;AAC3B,MAAA,OAAA;AACF,KAAA;IAEA,IAAIT,QAAQ,IAAII,QAAQ,EAAE;AACxBA,MAAAA,QAAQ,EAAE,CAAA;AACZ,KAAA;GACD,CAAA;AAEDM,EAAAA,eAAS,CAAC,MAAM;AACdF,IAAAA,UAAU,EAAE,CAAA;AACd,GAAC,EAAE,CAACR,QAAQ,CAAC,CAAC,CAAA;AAEd,EAAA,oBACEW,cAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,GAAG,EAAEP,SAAU;IACfQ,SAAS,EAAEC,SAAI,CAAC,WAAW,EAAEd,QAAQ,GAAG,yBAAyB,GAAG,oBAAoB,EAAE;AACxF,MAAA,qBAAqB,EAAEA,QAAQ;MAC/Be,SAAS,EAAE,CAACjB,QAAQ;AACpBA,MAAAA,QAAAA;AACF,KAAC,CAAE;AACHkB,IAAAA,IAAI,EAAC,KAAK;AACVnB,IAAAA,EAAE,EAAEA,EAAG;AACP,IAAA,eAAA,EAAeG,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeF,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeA,QAAQ,GAAG,IAAI,GAAGC,OAAQ;AACzCkB,IAAAA,QAAQ,EAAC,GAAG;AACZd,IAAAA,KAAK,EAAEA,KAAM;AACbF,IAAAA,SAAS,EAAEH,QAAQ,GAAG,IAAI,GAAGG,SAAU;AACvCC,IAAAA,OAAO,EAAEA,OAAQ;AAAAN,IAAAA,QAAA,eAEjBe,cAAA,CAAA,MAAA,EAAA;AAAME,MAAAA,SAAS,EAAC,oBAAoB;AAAAjB,MAAAA,QAAA,EAAEA,QAAAA;KAAe,CAAA;AAAC,GACpD,CAAC,CAAA;AAET,CACF,EAAC;AAEDF,GAAG,CAACwB,YAAY,GAAG;AACjBpB,EAAAA,QAAQ,EAAE,KAAK;AACfE,EAAAA,QAAQ,EAAE,KAAK;AACfE,EAAAA,OAAO,EAAE,IAAI;AACbC,EAAAA,KAAK,EAAE,IAAI;AACXC,EAAAA,QAAQ,EAAE,IAAA;AACZ,CAAC,CAAA;AAEDV,GAAG,CAACyB,SAAS,GAAG;AACdvB,EAAAA,QAAQ,EAAEwB,0BAAS,CAACC,IAAI,CAACC,UAAU;EACnCxB,QAAQ,EAAEsB,0BAAS,CAACG,IAAI;EACxBvB,QAAQ,EAAEoB,0BAAS,CAACG,IAAI;AACxB1B,EAAAA,EAAE,EAAEuB,0BAAS,CAACI,MAAM,CAACF,UAAU;AAC/BvB,EAAAA,OAAO,EAAEqB,0BAAS,CAACI,MAAM,CAACF,UAAU;AACpCnB,EAAAA,KAAK,EAAEiB,0BAAS,CAACK,KAAK,CAAC;IAAEC,KAAK,EAAEN,0BAAS,CAACI,MAAAA;AAAO,GAAC,CAAC;EACnDpB,QAAQ,EAAEgB,0BAAS,CAACO,IAAI;AACxB1B,EAAAA,SAAS,EAAEmB,0BAAS,CAACO,IAAI,CAACL,UAAU;EACpCpB,OAAO,EAAEkB,0BAAS,CAACO,IAAAA;AACrB,CAAC;;;;"}
1
+ {"version":3,"file":"Tab.js","sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { useEffectEvent } from '../common/hooks/useEffectEvent';\n\nexport interface TabProps {\n children?: React.ReactNode;\n disabled?: boolean;\n selected?: boolean;\n id: string;\n panelId: string;\n style?: React.CSSProperties;\n focusTab?: () => void;\n onKeyDown: React.KeyboardEventHandler<HTMLLIElement>;\n onClick?: React.MouseEventHandler<HTMLLIElement>;\n}\n\nconst noop = () => {};\n\nconst Tab = forwardRef(function Tab(\n {\n children,\n id,\n disabled,\n panelId,\n selected,\n onKeyDown,\n onClick,\n style,\n focusTab = noop,\n }: TabProps,\n reference: React.ForwardedRef<HTMLLIElement>,\n) {\n const handleFocusTab = useEffectEvent(focusTab);\n const firstUpdate = useRef(true);\n useEffect(\n function checkFocus() {\n if (firstUpdate.current) {\n firstUpdate.current = false;\n return;\n }\n\n if (selected) {\n handleFocusTab();\n }\n },\n [handleFocusTab, selected],\n );\n\n return (\n <li\n ref={reference}\n className={clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {\n 'tabs__tab--selected': selected,\n clickable: !disabled,\n disabled,\n })}\n role=\"tab\"\n id={id}\n aria-selected={selected ? 'true' : 'false'}\n aria-disabled={disabled ? 'true' : 'false'}\n aria-controls={disabled ? undefined : panelId}\n tabIndex={0}\n style={style}\n onKeyDown={disabled ? undefined : onKeyDown}\n onClick={onClick}\n >\n <span className=\"tabs__tab__content\">{children}</span>\n </li>\n );\n});\n\nexport default Tab;\n"],"names":["noop","Tab","forwardRef","children","id","disabled","panelId","selected","onKeyDown","onClick","style","focusTab","reference","handleFocusTab","useEffectEvent","firstUpdate","useRef","useEffect","checkFocus","current","_jsx","ref","className","clsx","clickable","role","undefined","tabIndex"],"mappings":";;;;;;;AAgBA,MAAMA,IAAI,GAAGA,MAAK,EAAG,CAAA;AAErB,MAAMC,GAAG,gBAAGC,gBAAU,CAAC,SAASD,GAAGA,CACjC;EACEE,QAAQ;EACRC,EAAE;EACFC,QAAQ;EACRC,OAAO;EACPC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,KAAK;AACLC,EAAAA,QAAQ,GAAGX,IAAAA;AAAI,CACN,EACXY,SAA4C,EAAA;AAE5C,EAAA,MAAMC,cAAc,GAAGC,6BAAc,CAACH,QAAQ,CAAC,CAAA;AAC/C,EAAA,MAAMI,WAAW,GAAGC,YAAM,CAAC,IAAI,CAAC,CAAA;AAChCC,EAAAA,eAAS,CACP,SAASC,UAAUA,GAAA;IACjB,IAAIH,WAAW,CAACI,OAAO,EAAE;MACvBJ,WAAW,CAACI,OAAO,GAAG,KAAK,CAAA;AAC3B,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAIZ,QAAQ,EAAE;AACZM,MAAAA,cAAc,EAAE,CAAA;AAClB,KAAA;AACF,GAAC,EACD,CAACA,cAAc,EAAEN,QAAQ,CAAC,CAC3B,CAAA;AAED,EAAA,oBACEa,cAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,GAAG,EAAET,SAAU;IACfU,SAAS,EAAEC,SAAI,CAAC,WAAW,EAAEhB,QAAQ,GAAG,yBAAyB,GAAG,oBAAoB,EAAE;AACxF,MAAA,qBAAqB,EAAEA,QAAQ;MAC/BiB,SAAS,EAAE,CAACnB,QAAQ;AACpBA,MAAAA,QAAAA;AACD,KAAA,CAAE;AACHoB,IAAAA,IAAI,EAAC,KAAK;AACVrB,IAAAA,EAAE,EAAEA,EAAG;AACP,IAAA,eAAA,EAAeG,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeF,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeA,QAAQ,GAAGqB,SAAS,GAAGpB,OAAQ;AAC9CqB,IAAAA,QAAQ,EAAE,CAAE;AACZjB,IAAAA,KAAK,EAAEA,KAAM;AACbF,IAAAA,SAAS,EAAEH,QAAQ,GAAGqB,SAAS,GAAGlB,SAAU;AAC5CC,IAAAA,OAAO,EAAEA,OAAQ;AAAAN,IAAAA,QAAA,eAEjBiB,cAAA,CAAA,MAAA,EAAA;AAAME,MAAAA,SAAS,EAAC,oBAAoB;AAAAnB,MAAAA,QAAA,EAAEA,QAAAA;KAAe,CAAA;AACvD,GAAI,CAAC,CAAA;AAET,CAAC;;;;"}
package/build/tabs/Tab.mjs CHANGED
@@ -1,9 +1,10 @@
1
1
  import { clsx } from 'clsx';
2
- import PropTypes from 'prop-types';
3
2
  import { forwardRef, useRef, useEffect } from 'react';
3
+ import { useEffectEvent } from '../common/hooks/useEffectEvent.mjs';
4
4
  import { jsx } from 'react/jsx-runtime';
5
5
 
6
- const Tab = /*#__PURE__*/forwardRef(({
6
+ const noop = () => {};
7
+ const Tab = /*#__PURE__*/forwardRef(function Tab({
7
8
  children,
8
9
  id,
9
10
  disabled,
@@ -12,21 +13,19 @@ const Tab = /*#__PURE__*/forwardRef(({
12
13
  onKeyDown,
13
14
  onClick,
14
15
  style,
15
- focusTab
16
- }, reference) => {
16
+ focusTab = noop
17
+ }, reference) {
18
+ const handleFocusTab = useEffectEvent(focusTab);
17
19
  const firstUpdate = useRef(true);
18
- const checkFocus = () => {
20
+ useEffect(function checkFocus() {
19
21
  if (firstUpdate.current) {
20
22
  firstUpdate.current = false;
21
23
  return;
22
24
  }
23
- if (selected && focusTab) {
24
- focusTab();
25
+ if (selected) {
26
+ handleFocusTab();
25
27
  }
26
- };
27
- useEffect(() => {
28
- checkFocus();
29
- }, [selected]);
28
+ }, [handleFocusTab, selected]);
30
29
  return /*#__PURE__*/jsx("li", {
31
30
  ref: reference,
32
31
  className: clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {
@@ -38,10 +37,10 @@ const Tab = /*#__PURE__*/forwardRef(({
38
37
  id: id,
39
38
  "aria-selected": selected ? 'true' : 'false',
40
39
  "aria-disabled": disabled ? 'true' : 'false',
41
- "aria-controls": disabled ? null : panelId,
42
- tabIndex: "0",
40
+ "aria-controls": disabled ? undefined : panelId,
41
+ tabIndex: 0,
43
42
  style: style,
44
- onKeyDown: disabled ? null : onKeyDown,
43
+ onKeyDown: disabled ? undefined : onKeyDown,
45
44
  onClick: onClick,
46
45
  children: /*#__PURE__*/jsx("span", {
47
46
  className: "tabs__tab__content",
@@ -49,26 +48,6 @@ const Tab = /*#__PURE__*/forwardRef(({
49
48
  })
50
49
  });
51
50
  });
52
- Tab.defaultProps = {
53
- disabled: false,
54
- selected: false,
55
- onClick: null,
56
- style: null,
57
- focusTab: null
58
- };
59
- Tab.propTypes = {
60
- children: PropTypes.node.isRequired,
61
- disabled: PropTypes.bool,
62
- selected: PropTypes.bool,
63
- id: PropTypes.string.isRequired,
64
- panelId: PropTypes.string.isRequired,
65
- style: PropTypes.shape({
66
- width: PropTypes.string
67
- }),
68
- focusTab: PropTypes.func,
69
- onKeyDown: PropTypes.func.isRequired,
70
- onClick: PropTypes.func
71
- };
72
51
 
73
52
  export { Tab as default };
74
53
  //# sourceMappingURL=Tab.mjs.map
package/build/tabs/Tab.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tab.mjs","sources":["../../src/tabs/Tab.js"],"sourcesContent":["import { clsx } from 'clsx';\nimport PropTypes from 'prop-types';\nimport { forwardRef, useEffect, useRef } from 'react';\n\nconst Tab = forwardRef(\n (\n { children, id, disabled, panelId, selected, onKeyDown, onClick, style, focusTab },\n reference,\n ) => {\n const firstUpdate = useRef(true);\n\n const checkFocus = () => {\n if (firstUpdate.current) {\n firstUpdate.current = false;\n return;\n }\n\n if (selected && focusTab) {\n focusTab();\n }\n };\n\n useEffect(() => {\n checkFocus();\n }, [selected]);\n\n return (\n <li\n ref={reference}\n className={clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {\n 'tabs__tab--selected': selected,\n clickable: !disabled,\n disabled,\n })}\n role=\"tab\"\n id={id}\n aria-selected={selected ? 'true' : 'false'}\n aria-disabled={disabled ? 'true' : 'false'}\n aria-controls={disabled ? null : panelId}\n tabIndex=\"0\"\n style={style}\n onKeyDown={disabled ? null : onKeyDown}\n onClick={onClick}\n >\n <span className=\"tabs__tab__content\">{children}</span>\n </li>\n );\n },\n);\n\nTab.defaultProps = {\n disabled: false,\n selected: false,\n onClick: null,\n style: null,\n focusTab: null,\n};\n\nTab.propTypes = {\n children: PropTypes.node.isRequired,\n disabled: PropTypes.bool,\n selected: PropTypes.bool,\n id: PropTypes.string.isRequired,\n panelId: PropTypes.string.isRequired,\n style: PropTypes.shape({ width: PropTypes.string }),\n focusTab: PropTypes.func,\n onKeyDown: PropTypes.func.isRequired,\n onClick: PropTypes.func,\n};\n\nexport default Tab;\n"],"names":["Tab","forwardRef","children","id","disabled","panelId","selected","onKeyDown","onClick","style","focusTab","reference","firstUpdate","useRef","checkFocus","current","useEffect","_jsx","ref","className","clsx","clickable","role","tabIndex","defaultProps","propTypes","PropTypes","node","isRequired","bool","string","shape","width","func"],"mappings":";;;;;AAIA,MAAMA,GAAG,gBAAGC,UAAU,CACpB,CACE;EAAEC,QAAQ;EAAEC,EAAE;EAAEC,QAAQ;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,SAAS;EAAEC,OAAO;EAAEC,KAAK;AAAEC,EAAAA,QAAAA;AAAS,CAAC,EAClFC,SAAS,KACN;AACH,EAAA,MAAMC,WAAW,GAAGC,MAAM,CAAC,IAAI,CAAC,CAAA;EAEhC,MAAMC,UAAU,GAAGA,MAAM;IACvB,IAAIF,WAAW,CAACG,OAAO,EAAE;MACvBH,WAAW,CAACG,OAAO,GAAG,KAAK,CAAA;AAC3B,MAAA,OAAA;AACF,KAAA;IAEA,IAAIT,QAAQ,IAAII,QAAQ,EAAE;AACxBA,MAAAA,QAAQ,EAAE,CAAA;AACZ,KAAA;GACD,CAAA;AAEDM,EAAAA,SAAS,CAAC,MAAM;AACdF,IAAAA,UAAU,EAAE,CAAA;AACd,GAAC,EAAE,CAACR,QAAQ,CAAC,CAAC,CAAA;AAEd,EAAA,oBACEW,GAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,GAAG,EAAEP,SAAU;IACfQ,SAAS,EAAEC,IAAI,CAAC,WAAW,EAAEd,QAAQ,GAAG,yBAAyB,GAAG,oBAAoB,EAAE;AACxF,MAAA,qBAAqB,EAAEA,QAAQ;MAC/Be,SAAS,EAAE,CAACjB,QAAQ;AACpBA,MAAAA,QAAAA;AACF,KAAC,CAAE;AACHkB,IAAAA,IAAI,EAAC,KAAK;AACVnB,IAAAA,EAAE,EAAEA,EAAG;AACP,IAAA,eAAA,EAAeG,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeF,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeA,QAAQ,GAAG,IAAI,GAAGC,OAAQ;AACzCkB,IAAAA,QAAQ,EAAC,GAAG;AACZd,IAAAA,KAAK,EAAEA,KAAM;AACbF,IAAAA,SAAS,EAAEH,QAAQ,GAAG,IAAI,GAAGG,SAAU;AACvCC,IAAAA,OAAO,EAAEA,OAAQ;AAAAN,IAAAA,QAAA,eAEjBe,GAAA,CAAA,MAAA,EAAA;AAAME,MAAAA,SAAS,EAAC,oBAAoB;AAAAjB,MAAAA,QAAA,EAAEA,QAAAA;KAAe,CAAA;AAAC,GACpD,CAAC,CAAA;AAET,CACF,EAAC;AAEDF,GAAG,CAACwB,YAAY,GAAG;AACjBpB,EAAAA,QAAQ,EAAE,KAAK;AACfE,EAAAA,QAAQ,EAAE,KAAK;AACfE,EAAAA,OAAO,EAAE,IAAI;AACbC,EAAAA,KAAK,EAAE,IAAI;AACXC,EAAAA,QAAQ,EAAE,IAAA;AACZ,CAAC,CAAA;AAEDV,GAAG,CAACyB,SAAS,GAAG;AACdvB,EAAAA,QAAQ,EAAEwB,SAAS,CAACC,IAAI,CAACC,UAAU;EACnCxB,QAAQ,EAAEsB,SAAS,CAACG,IAAI;EACxBvB,QAAQ,EAAEoB,SAAS,CAACG,IAAI;AACxB1B,EAAAA,EAAE,EAAEuB,SAAS,CAACI,MAAM,CAACF,UAAU;AAC/BvB,EAAAA,OAAO,EAAEqB,SAAS,CAACI,MAAM,CAACF,UAAU;AACpCnB,EAAAA,KAAK,EAAEiB,SAAS,CAACK,KAAK,CAAC;IAAEC,KAAK,EAAEN,SAAS,CAACI,MAAAA;AAAO,GAAC,CAAC;EACnDpB,QAAQ,EAAEgB,SAAS,CAACO,IAAI;AACxB1B,EAAAA,SAAS,EAAEmB,SAAS,CAACO,IAAI,CAACL,UAAU;EACpCpB,OAAO,EAAEkB,SAAS,CAACO,IAAAA;AACrB,CAAC;;;;"}
1
+ {"version":3,"file":"Tab.mjs","sources":["../../src/tabs/Tab.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { useEffectEvent } from '../common/hooks/useEffectEvent';\n\nexport interface TabProps {\n children?: React.ReactNode;\n disabled?: boolean;\n selected?: boolean;\n id: string;\n panelId: string;\n style?: React.CSSProperties;\n focusTab?: () => void;\n onKeyDown: React.KeyboardEventHandler<HTMLLIElement>;\n onClick?: React.MouseEventHandler<HTMLLIElement>;\n}\n\nconst noop = () => {};\n\nconst Tab = forwardRef(function Tab(\n {\n children,\n id,\n disabled,\n panelId,\n selected,\n onKeyDown,\n onClick,\n style,\n focusTab = noop,\n }: TabProps,\n reference: React.ForwardedRef<HTMLLIElement>,\n) {\n const handleFocusTab = useEffectEvent(focusTab);\n const firstUpdate = useRef(true);\n useEffect(\n function checkFocus() {\n if (firstUpdate.current) {\n firstUpdate.current = false;\n return;\n }\n\n if (selected) {\n handleFocusTab();\n }\n },\n [handleFocusTab, selected],\n );\n\n return (\n <li\n ref={reference}\n className={clsx('tabs__tab', selected ? 'np-text-body-large-bold' : 'np-text-body-large', {\n 'tabs__tab--selected': selected,\n clickable: !disabled,\n disabled,\n })}\n role=\"tab\"\n id={id}\n aria-selected={selected ? 'true' : 'false'}\n aria-disabled={disabled ? 'true' : 'false'}\n aria-controls={disabled ? undefined : panelId}\n tabIndex={0}\n style={style}\n onKeyDown={disabled ? undefined : onKeyDown}\n onClick={onClick}\n >\n <span className=\"tabs__tab__content\">{children}</span>\n </li>\n );\n});\n\nexport default Tab;\n"],"names":["noop","Tab","forwardRef","children","id","disabled","panelId","selected","onKeyDown","onClick","style","focusTab","reference","handleFocusTab","useEffectEvent","firstUpdate","useRef","useEffect","checkFocus","current","_jsx","ref","className","clsx","clickable","role","undefined","tabIndex"],"mappings":";;;;;AAgBA,MAAMA,IAAI,GAAGA,MAAK,EAAG,CAAA;AAErB,MAAMC,GAAG,gBAAGC,UAAU,CAAC,SAASD,GAAGA,CACjC;EACEE,QAAQ;EACRC,EAAE;EACFC,QAAQ;EACRC,OAAO;EACPC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,KAAK;AACLC,EAAAA,QAAQ,GAAGX,IAAAA;AAAI,CACN,EACXY,SAA4C,EAAA;AAE5C,EAAA,MAAMC,cAAc,GAAGC,cAAc,CAACH,QAAQ,CAAC,CAAA;AAC/C,EAAA,MAAMI,WAAW,GAAGC,MAAM,CAAC,IAAI,CAAC,CAAA;AAChCC,EAAAA,SAAS,CACP,SAASC,UAAUA,GAAA;IACjB,IAAIH,WAAW,CAACI,OAAO,EAAE;MACvBJ,WAAW,CAACI,OAAO,GAAG,KAAK,CAAA;AAC3B,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAIZ,QAAQ,EAAE;AACZM,MAAAA,cAAc,EAAE,CAAA;AAClB,KAAA;AACF,GAAC,EACD,CAACA,cAAc,EAAEN,QAAQ,CAAC,CAC3B,CAAA;AAED,EAAA,oBACEa,GAAA,CAAA,IAAA,EAAA;AACEC,IAAAA,GAAG,EAAET,SAAU;IACfU,SAAS,EAAEC,IAAI,CAAC,WAAW,EAAEhB,QAAQ,GAAG,yBAAyB,GAAG,oBAAoB,EAAE;AACxF,MAAA,qBAAqB,EAAEA,QAAQ;MAC/BiB,SAAS,EAAE,CAACnB,QAAQ;AACpBA,MAAAA,QAAAA;AACD,KAAA,CAAE;AACHoB,IAAAA,IAAI,EAAC,KAAK;AACVrB,IAAAA,EAAE,EAAEA,EAAG;AACP,IAAA,eAAA,EAAeG,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeF,QAAQ,GAAG,MAAM,GAAG,OAAQ;AAC3C,IAAA,eAAA,EAAeA,QAAQ,GAAGqB,SAAS,GAAGpB,OAAQ;AAC9CqB,IAAAA,QAAQ,EAAE,CAAE;AACZjB,IAAAA,KAAK,EAAEA,KAAM;AACbF,IAAAA,SAAS,EAAEH,QAAQ,GAAGqB,SAAS,GAAGlB,SAAU;AAC5CC,IAAAA,OAAO,EAAEA,OAAQ;AAAAN,IAAAA,QAAA,eAEjBiB,GAAA,CAAA,MAAA,EAAA;AAAME,MAAAA,SAAS,EAAC,oBAAoB;AAAAnB,MAAAA,QAAA,EAAEA,QAAAA;KAAe,CAAA;AACvD,GAAI,CAAC,CAAA;AAET,CAAC;;;;"}
package/build/tabs/TabList.js CHANGED
@@ -1,24 +1,16 @@
1
1
  'use strict';
2
2
 
3
- var PropTypes = require('prop-types');
4
3
  var jsxRuntime = require('react/jsx-runtime');
5
4
 
6
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
-
8
- var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
9
-
10
- const TabList = ({
5
+ function TabList({
11
6
  children
12
- }) => {
7
+ }) {
13
8
  return /*#__PURE__*/jsxRuntime.jsx("ul", {
14
9
  className: "tabs__tab-list",
15
10
  role: "tablist",
16
11
  children: children
17
12
  });
18
- };
19
- TabList.propTypes = {
20
- children: PropTypes__default.default.oneOfType([PropTypes__default.default.object, PropTypes__default.default.array]).isRequired
21
- };
13
+ }
22
14
 
23
15
  module.exports = TabList;
24
16
  //# sourceMappingURL=TabList.js.map
package/build/tabs/TabList.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TabList.js","sources":["../../src/tabs/TabList.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst TabList = ({ children }) => {\n return (\n <ul className=\"tabs__tab-list\" role=\"tablist\">\n {children}\n </ul>\n );\n};\n\nTabList.propTypes = {\n children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired,\n};\n\nexport default TabList;\n"],"names":["TabList","children","_jsx","className","role","propTypes","PropTypes","oneOfType","object","array","isRequired"],"mappings":";;;;;;;;;AAEMA,MAAAA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,QAAAA;AAAS,CAAC,KAAK;AAChC,EAAA,oBACEC,cAAA,CAAA,IAAA,EAAA;AAAIC,IAAAA,SAAS,EAAC,gBAAgB;AAACC,IAAAA,IAAI,EAAC,SAAS;AAAAH,IAAAA,QAAA,EAC1CA,QAAAA;AAAQ,GACP,CAAC,CAAA;AAET,EAAC;AAEDD,OAAO,CAACK,SAAS,GAAG;AAClBJ,EAAAA,QAAQ,EAAEK,0BAAS,CAACC,SAAS,CAAC,CAACD,0BAAS,CAACE,MAAM,EAAEF,0BAAS,CAACG,KAAK,CAAC,CAAC,CAACC,UAAAA;AACrE,CAAC;;;;"}
1
+ {"version":3,"file":"TabList.js","sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["export interface TabListProps {\n children?: React.ReactNode;\n}\n\nexport default function TabList({ children }: TabListProps) {\n return (\n <ul className=\"tabs__tab-list\" role=\"tablist\">\n {children}\n </ul>\n );\n}\n"],"names":["TabList","children","_jsx","className","role"],"mappings":";;;;AAIc,SAAUA,OAAOA,CAAC;AAAEC,EAAAA,QAAAA;AAAwB,CAAA,EAAA;AACxD,EAAA,oBACEC,cAAA,CAAA,IAAA,EAAA;AAAIC,IAAAA,SAAS,EAAC,gBAAgB;AAACC,IAAAA,IAAI,EAAC,SAAS;AAAAH,IAAAA,QAAA,EAC1CA,QAAAA;AAAQ,GACP,CAAC,CAAA;AAET;;;;"}
package/build/tabs/TabList.mjs CHANGED
@@ -1,18 +1,14 @@
1
- import PropTypes from 'prop-types';
2
1
  import { jsx } from 'react/jsx-runtime';
3
2
 
4
- const TabList = ({
3
+ function TabList({
5
4
  children
6
- }) => {
5
+ }) {
7
6
  return /*#__PURE__*/jsx("ul", {
8
7
  className: "tabs__tab-list",
9
8
  role: "tablist",
10
9
  children: children
11
10
  });
12
- };
13
- TabList.propTypes = {
14
- children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired
15
- };
11
+ }
16
12
 
17
13
  export { TabList as default };
18
14
  //# sourceMappingURL=TabList.mjs.map
package/build/tabs/TabList.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TabList.mjs","sources":["../../src/tabs/TabList.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst TabList = ({ children }) => {\n return (\n <ul className=\"tabs__tab-list\" role=\"tablist\">\n {children}\n </ul>\n );\n};\n\nTabList.propTypes = {\n children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired,\n};\n\nexport default TabList;\n"],"names":["TabList","children","_jsx","className","role","propTypes","PropTypes","oneOfType","object","array","isRequired"],"mappings":";;;AAEMA,MAAAA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,QAAAA;AAAS,CAAC,KAAK;AAChC,EAAA,oBACEC,GAAA,CAAA,IAAA,EAAA;AAAIC,IAAAA,SAAS,EAAC,gBAAgB;AAACC,IAAAA,IAAI,EAAC,SAAS;AAAAH,IAAAA,QAAA,EAC1CA,QAAAA;AAAQ,GACP,CAAC,CAAA;AAET,EAAC;AAEDD,OAAO,CAACK,SAAS,GAAG;AAClBJ,EAAAA,QAAQ,EAAEK,SAAS,CAACC,SAAS,CAAC,CAACD,SAAS,CAACE,MAAM,EAAEF,SAAS,CAACG,KAAK,CAAC,CAAC,CAACC,UAAAA;AACrE,CAAC;;;;"}
1
+ {"version":3,"file":"TabList.mjs","sources":["../../src/tabs/TabList.tsx"],"sourcesContent":["export interface TabListProps {\n children?: React.ReactNode;\n}\n\nexport default function TabList({ children }: TabListProps) {\n return (\n <ul className=\"tabs__tab-list\" role=\"tablist\">\n {children}\n </ul>\n );\n}\n"],"names":["TabList","children","_jsx","className","role"],"mappings":";;AAIc,SAAUA,OAAOA,CAAC;AAAEC,EAAAA,QAAAA;AAAwB,CAAA,EAAA;AACxD,EAAA,oBACEC,GAAA,CAAA,IAAA,EAAA;AAAIC,IAAAA,SAAS,EAAC,gBAAgB;AAACC,IAAAA,IAAI,EAAC,SAAS;AAAAH,IAAAA,QAAA,EAC1CA,QAAAA;AAAQ,GACP,CAAC,CAAA;AAET;;;;"}
package/build/tabs/TabPanel.js CHANGED
@@ -1,18 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var PropTypes = require('prop-types');
4
3
  var jsxRuntime = require('react/jsx-runtime');
5
4
 
6
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
7
-
8
- var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
9
-
10
- const TabPanel = ({
5
+ function TabPanel({
11
6
  children,
12
7
  id,
13
8
  tabId,
14
9
  style
15
- }) => {
10
+ }) {
16
11
  return /*#__PURE__*/jsxRuntime.jsx("div", {
17
12
  className: "tabs__panel",
18
13
  role: "tabpanel",
@@ -21,15 +16,7 @@ const TabPanel = ({
21
16
  style: style,
22
17
  children: children
23
18
  });
24
- };
25
- TabPanel.propTypes = {
26
- children: PropTypes__default.default.node.isRequired,
27
- id: PropTypes__default.default.string.isRequired,
28
- tabId: PropTypes__default.default.string.isRequired,
29
- style: PropTypes__default.default.shape({
30
- width: PropTypes__default.default.string.isRequired
31
- }).isRequired
32
- };
19
+ }
33
20
 
34
21
  module.exports = TabPanel;
35
22
  //# sourceMappingURL=TabPanel.js.map
package/build/tabs/TabPanel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TabPanel.js","sources":["../../src/tabs/TabPanel.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst TabPanel = ({ children, id, tabId, style }) => {\n return (\n <div className=\"tabs__panel\" role=\"tabpanel\" id={id} aria-labelledby={tabId} style={style}>\n {children}\n </div>\n );\n};\n\nTabPanel.propTypes = {\n children: PropTypes.node.isRequired,\n id: PropTypes.string.isRequired,\n tabId: PropTypes.string.isRequired,\n style: PropTypes.shape({\n width: PropTypes.string.isRequired,\n }).isRequired,\n};\n\nexport default TabPanel;\n"],"names":["TabPanel","children","id","tabId","style","_jsx","className","role","propTypes","PropTypes","node","isRequired","string","shape","width"],"mappings":";;;;;;;;;AAEMA,MAAAA,QAAQ,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,EAAE;EAAEC,KAAK;AAAEC,EAAAA,KAAAA;AAAM,CAAC,KAAK;AACnD,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,aAAa;AAACC,IAAAA,IAAI,EAAC,UAAU;AAACL,IAAAA,EAAE,EAAEA,EAAG;AAAC,IAAA,iBAAA,EAAiBC,KAAM;AAACC,IAAAA,KAAK,EAAEA,KAAM;AAAAH,IAAAA,QAAA,EACvFA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEV,EAAC;AAEDD,QAAQ,CAACQ,SAAS,GAAG;AACnBP,EAAAA,QAAQ,EAAEQ,0BAAS,CAACC,IAAI,CAACC,UAAU;AACnCT,EAAAA,EAAE,EAAEO,0BAAS,CAACG,MAAM,CAACD,UAAU;AAC/BR,EAAAA,KAAK,EAAEM,0BAAS,CAACG,MAAM,CAACD,UAAU;AAClCP,EAAAA,KAAK,EAAEK,0BAAS,CAACI,KAAK,CAAC;AACrBC,IAAAA,KAAK,EAAEL,0BAAS,CAACG,MAAM,CAACD,UAAAA;AAC1B,GAAC,CAAC,CAACA,UAAAA;AACL,CAAC;;;;"}
1
+ {"version":3,"file":"TabPanel.js","sources":["../../src/tabs/TabPanel.tsx"],"sourcesContent":["export interface TabPanelProps {\n children?: React.ReactNode;\n id: string;\n tabId: string;\n style: React.CSSProperties;\n}\n\nexport default function TabPanel({ children, id, tabId, style }: TabPanelProps) {\n return (\n <div className=\"tabs__panel\" role=\"tabpanel\" id={id} aria-labelledby={tabId} style={style}>\n {children}\n </div>\n );\n}\n"],"names":["TabPanel","children","id","tabId","style","_jsx","className","role"],"mappings":";;;;AAOwB,SAAAA,QAAQA,CAAC;EAAEC,QAAQ;EAAEC,EAAE;EAAEC,KAAK;AAAEC,EAAAA,KAAAA;AAAsB,CAAA,EAAA;AAC5E,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,aAAa;AAACC,IAAAA,IAAI,EAAC,UAAU;AAACL,IAAAA,EAAE,EAAEA,EAAG;AAAC,IAAA,iBAAA,EAAiBC,KAAM;AAACC,IAAAA,KAAK,EAAEA,KAAM;AAAAH,IAAAA,QAAA,EACvFA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEV;;;;"}