@driveflux/beam 3.0.15 → 3.0.17

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 (224) hide show
  1. package/dist/accordion/Accordion.js +7 -133
  2. package/dist/accordion/Accordion.stories.js +11 -31
  3. package/dist/alert/Alert.js +19 -120
  4. package/dist/alert/Alert.stories.js +15 -50
  5. package/dist/animations/LoadingAnimation.js +21 -34
  6. package/dist/badge/Badge.js +7 -96
  7. package/dist/badge/Badge.stories.js +7 -28
  8. package/dist/box/Box.js +3 -87
  9. package/dist/box/Box.stories.js +7 -8
  10. package/dist/breadcrumbs/Breadcrumbs.js +28 -288
  11. package/dist/breadcrumbs/Breadcrumbs.stories.js +27 -51
  12. package/dist/button/Button.js +12 -126
  13. package/dist/button/Button.stories.js +7 -35
  14. package/dist/button/TextButton.js +9 -104
  15. package/dist/card/Card.js +7 -109
  16. package/dist/card/Card.stories.js +7 -10
  17. package/dist/carousel/Carousel.js +58 -281
  18. package/dist/carousel/Carousel.stories.js +7 -39
  19. package/dist/carousel/CarouselButton.js +7 -68
  20. package/dist/center/Center.js +3 -63
  21. package/dist/center/Center.stories.js +7 -19
  22. package/dist/checkbox/Checkbox.js +4 -124
  23. package/dist/checkbox/Checkbox.stories.js +8 -10
  24. package/dist/chip/Chip.js +3 -104
  25. package/dist/chip/Chip.stories.js +7 -19
  26. package/dist/circular-progress/CircularProgress.js +11 -150
  27. package/dist/circular-progress/CircularProgress.stories.js +14 -54
  28. package/dist/command/command.js +13 -170
  29. package/dist/datepicker/DatePicker.d.ts.map +1 -1
  30. package/dist/datepicker/DatePicker.js +91 -235
  31. package/dist/datepicker/DatePicker.js.map +1 -1
  32. package/dist/datepicker/DatePicker.stories.js +58 -163
  33. package/dist/datepicker/DatePicker.stories.js.map +1 -1
  34. package/dist/datepicker/DatePickerDrawer.js +17 -116
  35. package/dist/datepicker/DatePickerDrawer.js.map +1 -1
  36. package/dist/datepicker/DatePickerPopover.js +35 -208
  37. package/dist/datepicker/constants.js +4 -3
  38. package/dist/datepicker/utils.js +11 -4
  39. package/dist/dialog/index.js +33 -180
  40. package/dist/divider/Divider.js +3 -63
  41. package/dist/divider/Divider.stories.js +7 -13
  42. package/dist/drawer/index.js +12 -157
  43. package/dist/dropdown/Dropdown.js +26 -212
  44. package/dist/dropdown/Dropdown.stories.js +22 -109
  45. package/dist/field-wrapper/FieldWrapper.js +3 -139
  46. package/dist/field-wrapper/FieldWrapper.stories.js +28 -124
  47. package/dist/flex/Flex.js +3 -63
  48. package/dist/flex/Flex.stories.js +7 -19
  49. package/dist/grid/Grid.js +3 -63
  50. package/dist/grid/Grid.stories.js +7 -28
  51. package/dist/hooks/use-breakpoint-value.js +14 -77
  52. package/dist/hooks/use-media-query.js +12 -61
  53. package/dist/hstack/HStack.js +3 -63
  54. package/dist/hstack/HStack.stories.js +7 -19
  55. package/dist/icons/FluxLogo.js +9 -213
  56. package/dist/icons/FluxLogoTable.js +5 -109
  57. package/dist/icons/Icon.js +7 -108
  58. package/dist/icons/Icon.stories.js +7 -12
  59. package/dist/icons/Icon24Hours.js +5 -83
  60. package/dist/icons/IconAcceleration.js +4 -72
  61. package/dist/icons/IconAccount.js +4 -72
  62. package/dist/icons/IconApplicant.js +5 -78
  63. package/dist/icons/IconArrow.js +6 -78
  64. package/dist/icons/IconArrowBack.js +4 -72
  65. package/dist/icons/IconArrowForward.js +4 -72
  66. package/dist/icons/IconArrowTopLeft.js +4 -70
  67. package/dist/icons/IconBluesharkProductGuide.js +5 -80
  68. package/dist/icons/IconBolt.js +4 -72
  69. package/dist/icons/IconBriefcase.js +4 -72
  70. package/dist/icons/IconBulb.js +4 -72
  71. package/dist/icons/IconCalendar.js +4 -72
  72. package/dist/icons/IconCalendarArrowBack.js +4 -72
  73. package/dist/icons/IconCalendarArrowForward.js +4 -72
  74. package/dist/icons/IconCalendarDoubleArrowBack.js +4 -72
  75. package/dist/icons/IconCalendarDoubleArrowForward.js +4 -72
  76. package/dist/icons/IconCancel.js +5 -77
  77. package/dist/icons/IconCancelMark.js +4 -72
  78. package/dist/icons/IconCarSUV.js +4 -72
  79. package/dist/icons/IconCarSedan.js +7 -147
  80. package/dist/icons/IconChain.js +5 -79
  81. package/dist/icons/IconCheckmark.js +4 -72
  82. package/dist/icons/IconChevronRight.js +4 -72
  83. package/dist/icons/IconCircle.js +11 -114
  84. package/dist/icons/IconCircleCheckmark.js +5 -77
  85. package/dist/icons/IconCircleError.js +4 -72
  86. package/dist/icons/IconCircleExclamation.js +6 -104
  87. package/dist/icons/IconCircleMark.js +5 -78
  88. package/dist/icons/IconCircleOutline.js +5 -139
  89. package/dist/icons/IconClock.js +5 -80
  90. package/dist/icons/IconClose.js +4 -72
  91. package/dist/icons/IconCollapseAll.js +5 -94
  92. package/dist/icons/IconConcierge.js +5 -79
  93. package/dist/icons/IconConciergeService.js +5 -87
  94. package/dist/icons/IconCreditCard.js +5 -78
  95. package/dist/icons/IconDash.js +4 -72
  96. package/dist/icons/IconDeliver.js +4 -72
  97. package/dist/icons/IconDelivery.js +5 -87
  98. package/dist/icons/IconDetails.js +4 -72
  99. package/dist/icons/IconDot.js +6 -87
  100. package/dist/icons/IconDownload.js +5 -79
  101. package/dist/icons/IconEVCharging.js +5 -79
  102. package/dist/icons/IconElectricCarFuel.js +5 -80
  103. package/dist/icons/IconEllipsis.js +5 -78
  104. package/dist/icons/IconEnvelope.js +4 -72
  105. package/dist/icons/IconExpandAll.js +5 -94
  106. package/dist/icons/IconEye.js +5 -79
  107. package/dist/icons/IconFacebook.js +6 -94
  108. package/dist/icons/IconFilter.js +5 -83
  109. package/dist/icons/IconFlagMalaysia.js +5 -141
  110. package/dist/icons/IconGiveKey.js +5 -79
  111. package/dist/icons/IconGlobe.js +4 -70
  112. package/dist/icons/IconGoogle.js +5 -87
  113. package/dist/icons/IconHome.js +5 -78
  114. package/dist/icons/IconHostAdvertise.js +4 -72
  115. package/dist/icons/IconHostCar.js +4 -75
  116. package/dist/icons/IconHostCash.js +5 -91
  117. package/dist/icons/IconHostHandle.js +4 -70
  118. package/dist/icons/IconHostLocation.js +4 -70
  119. package/dist/icons/IconHostPayment.js +5 -91
  120. package/dist/icons/IconHostService.js +5 -79
  121. package/dist/icons/IconHotDeals.js +4 -72
  122. package/dist/icons/IconInfo.js +5 -77
  123. package/dist/icons/IconInstagram.js +4 -72
  124. package/dist/icons/IconInsurance.js +5 -99
  125. package/dist/icons/IconInternet.js +4 -73
  126. package/dist/icons/IconInventory.js +5 -78
  127. package/dist/icons/IconLaurel.js +5 -101
  128. package/dist/icons/IconLinkedIn.js +4 -72
  129. package/dist/icons/IconLoading.js +4 -78
  130. package/dist/icons/IconLocation.js +5 -80
  131. package/dist/icons/IconLock.js +4 -73
  132. package/dist/icons/IconLogistics.js +4 -72
  133. package/dist/icons/IconMail.js +5 -94
  134. package/dist/icons/IconMember.js +5 -78
  135. package/dist/icons/IconMobilePen.js +5 -83
  136. package/dist/icons/IconMotorcycleMoped.js +5 -78
  137. package/dist/icons/IconNoCost.js +5 -92
  138. package/dist/icons/IconPDF.js +5 -80
  139. package/dist/icons/IconPencil.js +4 -70
  140. package/dist/icons/IconPhone.js +4 -70
  141. package/dist/icons/IconPlus.js +4 -72
  142. package/dist/icons/IconPricing.js +4 -72
  143. package/dist/icons/IconProtected.js +4 -71
  144. package/dist/icons/IconPsychology.js +4 -72
  145. package/dist/icons/IconQuestionTooltip.js +4 -73
  146. package/dist/icons/IconQuote.js +4 -72
  147. package/dist/icons/IconRate.js +4 -71
  148. package/dist/icons/IconRegister.js +5 -99
  149. package/dist/icons/IconReport.js +6 -89
  150. package/dist/icons/IconReturn.js +4 -72
  151. package/dist/icons/IconSearch.js +4 -70
  152. package/dist/icons/IconSecure.js +4 -71
  153. package/dist/icons/IconSecurity.js +4 -73
  154. package/dist/icons/IconSedanOutline.js +5 -159
  155. package/dist/icons/IconSelectArrow.js +6 -78
  156. package/dist/icons/IconSort.js +5 -79
  157. package/dist/icons/IconSortListed.js +5 -95
  158. package/dist/icons/IconSortPriceAscending.js +5 -83
  159. package/dist/icons/IconSortPriceDescending.js +5 -83
  160. package/dist/icons/IconSortYear.js +5 -79
  161. package/dist/icons/IconSpan.js +4 -71
  162. package/dist/icons/IconSpeaker.js +4 -79
  163. package/dist/icons/IconSpecialCar.js +5 -95
  164. package/dist/icons/IconStar.js +7 -92
  165. package/dist/icons/IconStockPhoto.js +5 -95
  166. package/dist/icons/IconSubscription.js +6 -113
  167. package/dist/icons/IconSubscriptions.js +6 -113
  168. package/dist/icons/IconSwap.js +5 -79
  169. package/dist/icons/IconTax.js +4 -72
  170. package/dist/icons/IconThinArrow.js +6 -78
  171. package/dist/icons/IconThumbsdown.js +5 -78
  172. package/dist/icons/IconThumbsup.js +5 -78
  173. package/dist/icons/IconTool.js +4 -72
  174. package/dist/icons/IconTooltip.js +4 -73
  175. package/dist/icons/IconTrash.js +4 -72
  176. package/dist/icons/IconTriangleExclamation.js +4 -72
  177. package/dist/icons/IconTyersBrakes.js +5 -83
  178. package/dist/icons/IconTyre.js +5 -83
  179. package/dist/icons/IconVacancy.js +5 -78
  180. package/dist/icons/IconVolunteer.js +4 -72
  181. package/dist/icons/IconWhatsapp.js +4 -73
  182. package/dist/icons/IconXPlatform.js +4 -72
  183. package/dist/icons/IconZeroEffort.js +5 -77
  184. package/dist/icons/Logo.js +3 -99
  185. package/dist/input/Input.js +11 -125
  186. package/dist/input/Input.stories.js +18 -17
  187. package/dist/input-mask/InputMask.js +11 -149
  188. package/dist/input-mask/InputMask.stories.js +6 -5
  189. package/dist/input-mask/mask-trackers.js +5 -4
  190. package/dist/input-select/InputSelect.js +68 -357
  191. package/dist/input-select/InputSelect.stories.js +25 -98
  192. package/dist/popover/popover.js +4 -72
  193. package/dist/progress/Progress.js +2 -96
  194. package/dist/progress/Progress.stories.js +14 -13
  195. package/dist/radio/Radio.js +4 -163
  196. package/dist/scroll-area/scroll-area.js +5 -113
  197. package/dist/search-input-select/SearchInputSelect.js +69 -346
  198. package/dist/select/Select.js +29 -315
  199. package/dist/select/Select.stories.js +19 -55
  200. package/dist/skeleton/Skeleton.js +3 -62
  201. package/dist/skeleton/Skeleton.stories.js +7 -8
  202. package/dist/slider/Slider.js +5 -106
  203. package/dist/slider/Slider.stories.js +11 -12
  204. package/dist/stack/Stack.js +3 -63
  205. package/dist/stack/Stack.stories.js +7 -19
  206. package/dist/styles.css +1 -1
  207. package/dist/table/Table.js +10 -131
  208. package/dist/table/Table.stories.js +8 -84
  209. package/dist/tabs/Tabs.js +9 -128
  210. package/dist/tabs/Tabs.stories.js +13 -46
  211. package/dist/text/Text.js +6 -88
  212. package/dist/text/Text.stories.js +7 -44
  213. package/dist/toast/Toast.stories.js +14 -66
  214. package/dist/toast/ToastBox.js +29 -77
  215. package/dist/toast/index.js +1 -0
  216. package/dist/toast/sonner.js +6 -66
  217. package/dist/toggle/Toggle.js +7 -116
  218. package/dist/toggle/Toggle.stories.js +8 -10
  219. package/dist/tooltip/Tooltip.js +12 -151
  220. package/dist/tooltip/Tooltip.stories.js +13 -71
  221. package/dist/utils.js +2 -4
  222. package/dist/vstack/VStack.js +3 -63
  223. package/dist/vstack/VStack.stories.js +7 -19
  224. package/package.json +1 -1
@@ -1,62 +1,29 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
2
  import IconSort from '../icons/IconSort.js';
3
3
  import Input from '../input/Input.js';
4
4
  import Stack from '../stack/Stack.js';
5
5
  import Text from '../text/Text.js';
6
6
  import { Tab, Tabs, TabsContent, TabsList } from './Tabs.js';
7
- var meta = {
8
- component: Tabs
7
+ const meta = {
8
+ component: Tabs,
9
9
  };
10
10
  export default meta;
11
- export var TabsTest = {
12
- render: function() {
13
- return /*#__PURE__*/ _jsxs(Tabs, {
14
- children: [
15
- /*#__PURE__*/ _jsx(TabsList, {
16
- children: tabs.map(function(tab) {
17
- return /*#__PURE__*/ _jsxs(Tab, {
18
- value: tab.key,
19
- children: [
20
- tab.icon,
21
- tab.label
22
- ]
23
- }, tab.key);
24
- })
25
- }),
26
- tabs.map(function(tab) {
27
- return /*#__PURE__*/ _jsx(TabsContent, {
28
- value: tab.key,
29
- children: tab.content
30
- }, tab.key);
31
- })
32
- ]
33
- });
34
- }
11
+ export const TabsTest = {
12
+ render: () => {
13
+ return (_jsxs(Tabs, { children: [_jsx(TabsList, { children: tabs.map((tab) => (_jsxs(Tab, { value: tab.key, children: [tab.icon, tab.label] }, tab.key))) }), tabs.map((tab) => (_jsx(TabsContent, { value: tab.key, children: tab.content }, tab.key)))] }));
14
+ },
35
15
  };
36
- var tabs = [
16
+ const tabs = [
37
17
  {
38
- icon: /*#__PURE__*/ _jsx(IconSort, {
39
- size: 16
40
- }),
18
+ icon: _jsx(IconSort, { size: 16 }),
41
19
  key: 'tab1',
42
20
  label: 'tab 1',
43
- content: /*#__PURE__*/ _jsxs(Stack, {
44
- children: [
45
- /*#__PURE__*/ _jsx(Text, {
46
- children: "this is content of tab1"
47
- }),
48
- /*#__PURE__*/ _jsx(Input, {
49
- htmlFor: "firstName",
50
- label: "first name"
51
- })
52
- ]
53
- })
21
+ content: (_jsxs(Stack, { children: [_jsx(Text, { children: "this is content of tab1" }), _jsx(Input, { htmlFor: "firstName", label: "first name" })] })),
54
22
  },
55
23
  {
56
24
  key: 'tab2',
57
25
  label: 'tab 2',
58
- content: /*#__PURE__*/ _jsx(Text, {
59
- children: "this is tab 2 content"
60
- })
61
- }
26
+ content: _jsx(Text, { children: "this is tab 2 content" }),
27
+ },
62
28
  ];
29
+ //# sourceMappingURL=Tabs.stories.js.map
package/dist/text/Text.js CHANGED
@@ -1,94 +1,12 @@
1
- function _define_property(obj, key, value) {
2
- if (key in obj) {
3
- Object.defineProperty(obj, key, {
4
- value: value,
5
- enumerable: true,
6
- configurable: true,
7
- writable: true
8
- });
9
- } else {
10
- obj[key] = value;
11
- }
12
- return obj;
13
- }
14
- function _object_spread(target) {
15
- for(var i = 1; i < arguments.length; i++){
16
- var source = arguments[i] != null ? arguments[i] : {};
17
- var ownKeys = Object.keys(source);
18
- if (typeof Object.getOwnPropertySymbols === "function") {
19
- ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
20
- return Object.getOwnPropertyDescriptor(source, sym).enumerable;
21
- }));
22
- }
23
- ownKeys.forEach(function(key) {
24
- _define_property(target, key, source[key]);
25
- });
26
- }
27
- return target;
28
- }
29
- function ownKeys(object, enumerableOnly) {
30
- var keys = Object.keys(object);
31
- if (Object.getOwnPropertySymbols) {
32
- var symbols = Object.getOwnPropertySymbols(object);
33
- if (enumerableOnly) {
34
- symbols = symbols.filter(function(sym) {
35
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
36
- });
37
- }
38
- keys.push.apply(keys, symbols);
39
- }
40
- return keys;
41
- }
42
- function _object_spread_props(target, source) {
43
- source = source != null ? source : {};
44
- if (Object.getOwnPropertyDescriptors) {
45
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
46
- } else {
47
- ownKeys(Object(source)).forEach(function(key) {
48
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
49
- });
50
- }
51
- return target;
52
- }
53
- function _object_without_properties(source, excluded) {
54
- if (source == null) return {};
55
- var target = _object_without_properties_loose(source, excluded);
56
- var key, i;
57
- if (Object.getOwnPropertySymbols) {
58
- var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
59
- for(i = 0; i < sourceSymbolKeys.length; i++){
60
- key = sourceSymbolKeys[i];
61
- if (excluded.indexOf(key) >= 0) continue;
62
- if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
63
- target[key] = source[key];
64
- }
65
- }
66
- return target;
67
- }
68
- function _object_without_properties_loose(source, excluded) {
69
- if (source == null) return {};
70
- var target = {};
71
- var sourceKeys = Object.keys(source);
72
- var key, i;
73
- for(i = 0; i < sourceKeys.length; i++){
74
- key = sourceKeys[i];
75
- if (excluded.indexOf(key) >= 0) continue;
76
- target[key] = source[key];
77
- }
78
- return target;
79
- }
80
1
  import * as React from 'react';
81
2
  import { cn } from '../utils.js';
82
- var Text = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
83
- var _param_as = _param.as, as = _param_as === void 0 ? 'p' : _param_as, className = _param.className, children = _param.children, props = _object_without_properties(_param, [
84
- "as",
85
- "className",
86
- "children"
87
- ]);
88
- return /*#__PURE__*/ React.createElement(as, _object_spread_props(_object_spread({}, props), {
3
+ const Text = React.forwardRef(({ as = 'p', className, children, ...props }, ref) => {
4
+ return React.createElement(as, {
5
+ ...props,
89
6
  className: cn('text-base leading-[19.6px]', as === 'h3' && 'text-xl tracking-wide', as === 'h2' && 'text-2xl tracking-wider', className),
90
- ref: ref
91
- }), children);
7
+ ref,
8
+ }, children);
92
9
  });
93
10
  Text.displayName = 'Text';
94
11
  export default Text;
12
+ //# sourceMappingURL=Text.js.map
@@ -1,50 +1,13 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import Stack from '../stack/Stack.js';
3
3
  import Text from './Text.js';
4
- var meta = {
5
- component: Text
4
+ const meta = {
5
+ component: Text,
6
6
  };
7
7
  export default meta;
8
- export var FirstStory = {
9
- render: function() {
10
- return /*#__PURE__*/ _jsxs(Stack, {
11
- children: [
12
- /*#__PURE__*/ _jsx(Text, {
13
- as: 'h1',
14
- className: "text-black text-5xl",
15
- children: "This is heading 1"
16
- }),
17
- /*#__PURE__*/ _jsx(Text, {
18
- as: 'h2',
19
- className: "text-primary4 text-4xl",
20
- children: "This is heading 2"
21
- }),
22
- /*#__PURE__*/ _jsx(Text, {
23
- as: 'h3',
24
- className: "text-primary3 text-3xl",
25
- children: "This is heading 3"
26
- }),
27
- /*#__PURE__*/ _jsx(Text, {
28
- as: 'h4',
29
- className: "text-primary2 text-2xl",
30
- children: "This is heading 4"
31
- }),
32
- /*#__PURE__*/ _jsx(Text, {
33
- as: 'h5',
34
- className: "text-primary1 text-xl",
35
- children: "This is heading 5"
36
- }),
37
- /*#__PURE__*/ _jsx(Text, {
38
- as: 'strong',
39
- className: "text-bold",
40
- children: "This is strong"
41
- }),
42
- /*#__PURE__*/ _jsx(Text, {
43
- as: 'i',
44
- className: "text-medium italic",
45
- children: "This is italic"
46
- })
47
- ]
48
- });
49
- }
8
+ export const FirstStory = {
9
+ render: () => {
10
+ return (_jsxs(Stack, { children: [_jsx(Text, { as: 'h1', className: "text-black text-5xl", children: "This is heading 1" }), _jsx(Text, { as: 'h2', className: "text-primary4 text-4xl", children: "This is heading 2" }), _jsx(Text, { as: 'h3', className: "text-primary3 text-3xl", children: "This is heading 3" }), _jsx(Text, { as: 'h4', className: "text-primary2 text-2xl", children: "This is heading 4" }), _jsx(Text, { as: 'h5', className: "text-primary1 text-xl", children: "This is heading 5" }), _jsx(Text, { as: 'strong', className: "text-bold", children: "This is strong" }), _jsx(Text, { as: 'i', className: "text-medium italic", children: "This is italic" })] }));
11
+ },
50
12
  };
13
+ //# sourceMappingURL=Text.stories.js.map
@@ -3,80 +3,28 @@ import Box from '../box/Box.js';
3
3
  import Button from '../button/Button.js';
4
4
  import VStack from '../vstack/VStack.js';
5
5
  import { Toaster, toast } from './sonner.js';
6
- var meta = {
7
- component: Toaster
6
+ const meta = {
7
+ component: Toaster,
8
8
  };
9
9
  export default meta;
10
- export var FirstStory = {
11
- render: function() {
12
- return /*#__PURE__*/ _jsx(Outer, {
13
- children: /*#__PURE__*/ _jsxs(VStack, {
14
- children: [
15
- /*#__PURE__*/ _jsx(ToastButton, {
16
- title: "This is error toast",
17
- description: "This is description of the error toast",
18
- status: "error",
19
- buttonColor: 'accent'
20
- }),
21
- /*#__PURE__*/ _jsx(ToastButton, {
22
- title: "This is warning toast",
23
- description: "This is description of the warning toast",
24
- status: "warning",
25
- buttonColor: "warning"
26
- }),
27
- /*#__PURE__*/ _jsx(ToastButton, {
28
- title: "This is info toast",
29
- description: "This is description of the info toast",
30
- status: "info",
31
- buttonColor: "link"
32
- }),
33
- /*#__PURE__*/ _jsx(ToastButton, {
34
- title: "This is success toast",
35
- description: "This is description of the success toast",
36
- status: "success",
37
- buttonColor: "success"
38
- }),
39
- /*#__PURE__*/ _jsx(ToastButton, {
40
- title: "This is a long toast",
41
- description: "A long toast message provides detailed information or instructions that require more space than usual. It's ideal for conveying extensive updates, lengthy explanations, or step-by-step guidance, ensuring users receive comprehensive information directly within the application's interface.",
42
- status: "success",
43
- buttonColor: "success"
44
- }),
45
- /*#__PURE__*/ _jsx(ToastButton, {
46
- title: "This is a list toast",
47
- description: 'Lists: \nItem 1. \nItem 2. \nItem 3.',
48
- status: "success",
49
- buttonColor: "success",
50
- isClosable: false
51
- })
52
- ]
53
- })
54
- });
55
- }
10
+ export const FirstStory = {
11
+ render: () => {
12
+ return (_jsx(Outer, { children: _jsxs(VStack, { children: [_jsx(ToastButton, { title: "This is error toast", description: "This is description of the error toast", status: "error", buttonColor: 'accent' }), _jsx(ToastButton, { title: "This is warning toast", description: "This is description of the warning toast", status: "warning", buttonColor: "warning" }), _jsx(ToastButton, { title: "This is info toast", description: "This is description of the info toast", status: "info", buttonColor: "link" }), _jsx(ToastButton, { title: "This is success toast", description: "This is description of the success toast", status: "success", buttonColor: "success" }), _jsx(ToastButton, { title: "This is a long toast", description: "A long toast message provides detailed information or instructions that require more space than usual. It's ideal for conveying extensive updates, lengthy explanations, or step-by-step guidance, ensuring users receive comprehensive information directly within the application's interface.", status: "success", buttonColor: "success" }), _jsx(ToastButton, { title: "This is a list toast", description: 'Lists: \nItem 1. \nItem 2. \nItem 3.', status: "success", buttonColor: "success", isClosable: false })] }) }));
13
+ },
56
14
  };
57
- var ToastButton = function(param) {
58
- var title = param.title, description = param.description, status = param.status, buttonColor = param.buttonColor, _param_isClosable = param.isClosable, isClosable = _param_isClosable === void 0 ? true : _param_isClosable;
59
- var showToast = function() {
15
+ const ToastButton = ({ title, description, status, buttonColor, isClosable = true }) => {
16
+ const showToast = () => {
60
17
  toast({
61
18
  title: title,
62
19
  description: description,
63
20
  status: status,
64
- isClosable: isClosable,
65
- isNumbered: true
21
+ isClosable,
22
+ isNumbered: true,
66
23
  });
67
24
  };
68
- return /*#__PURE__*/ _jsx(Button, {
69
- colorScheme: buttonColor,
70
- onClick: showToast,
71
- children: title
72
- });
25
+ return (_jsx(Button, { colorScheme: buttonColor, onClick: showToast, children: title }));
73
26
  };
74
- var Outer = function(param) {
75
- var children = param.children;
76
- return /*#__PURE__*/ _jsxs(Box, {
77
- children: [
78
- children,
79
- /*#__PURE__*/ _jsx(Toaster, {})
80
- ]
81
- });
27
+ const Outer = ({ children }) => {
28
+ return (_jsxs(Box, { children: [children, _jsx(Toaster, {})] }));
82
29
  };
30
+ //# sourceMappingURL=Toast.stories.js.map
@@ -8,115 +8,67 @@ import IconClose from '../icons/IconClose';
8
8
  import IconInfo from '../icons/IconInfo';
9
9
  import IconTriangleExclamation from '../icons/IconTriangleExclamation';
10
10
  import Text from '../text/Text';
11
- var ToastBox = function(options) {
12
- var title = options === null || options === void 0 ? void 0 : options.title;
13
- var description = options === null || options === void 0 ? void 0 : options.description;
14
- var isNumbered = options === null || options === void 0 ? void 0 : options.isNumbered;
15
- var _getStyles = getStyles(options === null || options === void 0 ? void 0 : options.status), icon = _getStyles.icon, titleColor = _getStyles.titleColor, borderColor = _getStyles.borderColor, textColor = _getStyles.textColor, bgColor = _getStyles.bgColor;
16
- return /*#__PURE__*/ _jsxs(HStack, {
17
- className: "flex w-full items-start ".concat(textColor, " ").concat(bgColor, " border-l-8 ").concat(borderColor, " p-3 space-y-3 rounded-lg"),
18
- children: [
19
- /*#__PURE__*/ _jsxs(HStack, {
20
- className: 'space-y-1 w-full',
21
- children: [
22
- /*#__PURE__*/ _jsx(Box, {
23
- className: titleColor,
24
- children: icon
25
- }),
26
- /*#__PURE__*/ _jsxs(Box, {
27
- className: "w-full",
28
- children: [
29
- title && /*#__PURE__*/ _jsx(Text, {
30
- className: "font-bold text-base",
31
- children: title
32
- }),
33
- description && /*#__PURE__*/ _jsx(Box, {
34
- className: "".concat(textColor, " text-base"),
35
- children: typeof description === 'string' ? splitText(description, isNumbered) : description
36
- })
37
- ]
38
- })
39
- ]
40
- }),
41
- (options === null || options === void 0 ? void 0 : options.isClosable) && /*#__PURE__*/ _jsx(Box, {
42
- as: "button",
43
- onClick: function() {
11
+ const ToastBox = (options) => {
12
+ const title = options?.title;
13
+ const description = options?.description;
14
+ const isNumbered = options?.isNumbered;
15
+ const { icon, titleColor, borderColor, textColor, bgColor } = getStyles(options?.status);
16
+ return (_jsxs(HStack, { className: `flex w-full items-start ${textColor} ${bgColor} border-l-8 ${borderColor} p-3 space-y-3 rounded-lg`, children: [_jsxs(HStack, { className: 'space-y-1 w-full', children: [_jsx(Box, { className: titleColor, children: icon }), _jsxs(Box, { className: "w-full", children: [title && _jsx(Text, { className: "font-bold text-base", children: title }), description && (_jsx(Box, { className: `${textColor} text-base`, children: typeof description === 'string'
17
+ ? splitText(description, isNumbered)
18
+ : description }))] })] }), options?.isClosable && (_jsx(Box, { as: "button", onClick: () => {
44
19
  toast.dismiss(options.id);
45
- },
46
- children: /*#__PURE__*/ _jsx(IconClose, {
47
- size: '24px'
48
- })
49
- })
50
- ]
51
- });
20
+ }, children: _jsx(IconClose, { size: '24px' }) }))] }));
52
21
  };
53
- var splitText = function(text, isNumbered) {
54
- var listItems = text.split('\n').map(function(line) {
55
- return /*#__PURE__*/ _jsx("li", {
56
- children: line
57
- }, line);
58
- });
22
+ const splitText = (text, isNumbered) => {
23
+ const listItems = text.split('\n').map((line) => _jsx("li", { children: line }, line));
59
24
  if (isNumbered) {
60
- return /*#__PURE__*/ _jsx("ol", {
61
- children: listItems
62
- });
25
+ return _jsx("ol", { children: listItems });
63
26
  }
64
- return /*#__PURE__*/ _jsx("ul", {
65
- children: listItems
66
- });
27
+ return _jsx("ul", { children: listItems });
67
28
  };
68
- var getStyles = function(status) {
69
- var defaultStyles = {
70
- icon: /*#__PURE__*/ _jsx(IconInfo, {
71
- size: '24px'
72
- }),
29
+ const getStyles = (status) => {
30
+ const defaultStyles = {
31
+ icon: _jsx(IconInfo, { size: '24px' }),
73
32
  bgColor: 'bg-info-50',
74
33
  titleColor: 'text-info-300',
75
34
  textColor: 'text-info-600',
76
- borderColor: 'border-info-300'
35
+ borderColor: 'border-info-300',
77
36
  };
78
37
  if (!status) {
79
38
  return defaultStyles;
80
39
  }
81
- switch(status){
40
+ switch (status) {
82
41
  case 'error':
83
42
  return {
84
- icon: /*#__PURE__*/ _jsx(IconTriangleExclamation, {
85
- size: '24px'
86
- }),
43
+ icon: _jsx(IconTriangleExclamation, { size: '24px' }),
87
44
  bgColor: 'bg-accent-50',
88
45
  titleColor: 'text-accent-300',
89
46
  textColor: 'text-accent-600',
90
- borderColor: 'border-accent-300'
47
+ borderColor: 'border-accent-300',
91
48
  };
92
49
  case 'success':
93
50
  return {
94
- icon: /*#__PURE__*/ _jsx(IconCircleMark, {
95
- variant: "on",
96
- size: '24px'
97
- }),
51
+ icon: _jsx(IconCircleMark, { variant: "on", size: '24px' }),
98
52
  bgColor: 'bg-success-50',
99
53
  titleColor: 'text-success-300',
100
54
  textColor: 'text-success-600',
101
- borderColor: 'border-success-300'
55
+ borderColor: 'border-success-300',
102
56
  };
103
57
  case 'warning':
104
58
  return {
105
- icon: /*#__PURE__*/ _jsx(IconCircleExclamation, {
106
- size: '24px'
107
- }),
59
+ icon: _jsx(IconCircleExclamation, { size: '24px' }),
108
60
  bgColor: 'bg-warning-50',
109
61
  titleColor: 'text-warning-300',
110
62
  textColor: 'text-warning-600',
111
- borderColor: 'border-warning-300'
63
+ borderColor: 'border-warning-300',
112
64
  };
113
65
  case 'info':
114
66
  return defaultStyles;
115
- default:
116
- {
117
- var _exhaustiveCheck = status;
118
- return defaultStyles;
119
- }
67
+ default: {
68
+ const _exhaustiveCheck = status;
69
+ return defaultStyles;
70
+ }
120
71
  }
121
72
  };
122
73
  export default ToastBox;
74
+ //# sourceMappingURL=ToastBox.js.map
@@ -1 +1,2 @@
1
1
  export { Toaster, toast } from './sonner';
2
+ //# sourceMappingURL=index.js.map
@@ -1,74 +1,14 @@
1
1
  'use client';
2
- function _define_property(obj, key, value) {
3
- if (key in obj) {
4
- Object.defineProperty(obj, key, {
5
- value: value,
6
- enumerable: true,
7
- configurable: true,
8
- writable: true
9
- });
10
- } else {
11
- obj[key] = value;
12
- }
13
- return obj;
14
- }
15
- function _extends() {
16
- _extends = Object.assign || function(target) {
17
- for(var i = 1; i < arguments.length; i++){
18
- var source = arguments[i];
19
- for(var key in source){
20
- if (Object.prototype.hasOwnProperty.call(source, key)) {
21
- target[key] = source[key];
22
- }
23
- }
24
- }
25
- return target;
26
- };
27
- return _extends.apply(this, arguments);
28
- }
29
- function _object_destructuring_empty(o) {
30
- if (o === null || o === void 0) throw new TypeError("Cannot destructure " + o);
31
- return o;
32
- }
33
- function _object_spread(target) {
34
- for(var i = 1; i < arguments.length; i++){
35
- var source = arguments[i] != null ? arguments[i] : {};
36
- var ownKeys = Object.keys(source);
37
- if (typeof Object.getOwnPropertySymbols === "function") {
38
- ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
39
- return Object.getOwnPropertyDescriptor(source, sym).enumerable;
40
- }));
41
- }
42
- ownKeys.forEach(function(key) {
43
- _define_property(target, key, source[key]);
44
- });
45
- }
46
- return target;
47
- }
48
2
  import { jsx as _jsx } from "react/jsx-runtime";
49
3
  import { useTheme } from 'next-themes';
50
4
  import { Toaster as Sonner, toast as sonnerToast } from 'sonner';
51
5
  import ToastBox from './ToastBox';
52
- var Toaster = function(_param) {
53
- var props = _extends({}, _object_destructuring_empty(_param));
54
- var _useTheme = useTheme(), _useTheme_theme = _useTheme.theme, theme = _useTheme_theme === void 0 ? 'system' : _useTheme_theme;
55
- return /*#__PURE__*/ _jsx(Sonner, _object_spread({
56
- theme: theme,
57
- className: "group",
58
- position: "bottom-center"
59
- }, props));
6
+ const Toaster = ({ ...props }) => {
7
+ const { theme = 'system' } = useTheme();
8
+ return (_jsx(Sonner, { theme: theme, className: "group", position: "bottom-center", ...props }));
60
9
  };
61
- var toast = function(param) {
62
- var title = param.title, description = param.description, status = param.status, _param_isClosable = param.isClosable, isClosable = _param_isClosable === void 0 ? true : _param_isClosable, isNumbered = param.isNumbered;
63
- sonnerToast.custom(function(toastId) {
64
- return /*#__PURE__*/ _jsx(ToastBox, {
65
- id: toastId,
66
- title: title,
67
- description: description,
68
- status: status,
69
- isClosable: isClosable,
70
- isNumbered: isNumbered
71
- });
72
- });
10
+ const toast = ({ title, description, status, isClosable = true, isNumbered, }) => {
11
+ sonnerToast.custom((toastId) => (_jsx(ToastBox, { id: toastId, title: title, description: description, status: status, isClosable: isClosable, isNumbered: isNumbered })));
73
12
  };
74
13
  export { Toaster, toast };
14
+ //# sourceMappingURL=sonner.js.map