@driveflux/beam 2.0.8 → 2.0.10

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 (215) 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 +14 -110
  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.d.ts +1 -1
  13. package/dist/button/Button.js +12 -124
  14. package/dist/button/Button.stories.js +7 -35
  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.js +27 -127
  30. package/dist/datepicker/DatePicker.stories.js +58 -163
  31. package/dist/datepicker/DatePickerDrawer.js +14 -110
  32. package/dist/datepicker/DatePickerPopover.js +35 -207
  33. package/dist/datepicker/constants.js +4 -3
  34. package/dist/datepicker/utils.js +11 -4
  35. package/dist/dialog/index.js +12 -144
  36. package/dist/divider/Divider.js +3 -63
  37. package/dist/divider/Divider.stories.js +7 -13
  38. package/dist/drawer/index.js +12 -157
  39. package/dist/dropdown/Dropdown.js +26 -212
  40. package/dist/dropdown/Dropdown.stories.js +22 -109
  41. package/dist/field-wrapper/FieldWrapper.js +3 -139
  42. package/dist/field-wrapper/FieldWrapper.stories.js +28 -124
  43. package/dist/flex/Flex.js +3 -63
  44. package/dist/flex/Flex.stories.js +7 -19
  45. package/dist/grid/Grid.js +3 -63
  46. package/dist/grid/Grid.stories.js +7 -28
  47. package/dist/hooks/use-breakpoint-value.js +14 -77
  48. package/dist/hooks/use-media-query.js +12 -61
  49. package/dist/hstack/HStack.js +3 -63
  50. package/dist/hstack/HStack.stories.js +7 -19
  51. package/dist/icons/FluxLogo.js +9 -213
  52. package/dist/icons/FluxLogoTable.js +5 -109
  53. package/dist/icons/Icon.js +7 -108
  54. package/dist/icons/Icon.stories.js +7 -12
  55. package/dist/icons/Icon24Hours.js +5 -83
  56. package/dist/icons/IconAcceleration.js +4 -72
  57. package/dist/icons/IconAccount.js +4 -72
  58. package/dist/icons/IconApplicant.js +5 -78
  59. package/dist/icons/IconArrow.js +6 -78
  60. package/dist/icons/IconArrowBack.js +4 -72
  61. package/dist/icons/IconArrowForward.js +4 -72
  62. package/dist/icons/IconArrowTopLeft.js +4 -70
  63. package/dist/icons/IconBluesharkProductGuide.js +5 -80
  64. package/dist/icons/IconBolt.js +4 -72
  65. package/dist/icons/IconBriefcase.js +4 -72
  66. package/dist/icons/IconBulb.js +4 -72
  67. package/dist/icons/IconCalendar.js +4 -72
  68. package/dist/icons/IconCalendarArrowBack.js +4 -72
  69. package/dist/icons/IconCalendarArrowForward.js +4 -72
  70. package/dist/icons/IconCalendarDoubleArrowBack.js +4 -72
  71. package/dist/icons/IconCalendarDoubleArrowForward.js +4 -72
  72. package/dist/icons/IconCancel.js +6 -85
  73. package/dist/icons/IconCancelMark.js +4 -72
  74. package/dist/icons/IconCarSUV.js +4 -72
  75. package/dist/icons/IconCarSedan.js +7 -147
  76. package/dist/icons/IconChain.js +5 -79
  77. package/dist/icons/IconCheckmark.js +4 -72
  78. package/dist/icons/IconChevronRight.js +4 -72
  79. package/dist/icons/IconCircle.js +11 -114
  80. package/dist/icons/IconCircleCheckmark.js +5 -77
  81. package/dist/icons/IconCircleError.js +4 -72
  82. package/dist/icons/IconCircleExclamation.js +6 -104
  83. package/dist/icons/IconCircleMark.js +5 -78
  84. package/dist/icons/IconCircleOutline.js +5 -140
  85. package/dist/icons/IconClock.js +5 -80
  86. package/dist/icons/IconClose.js +4 -72
  87. package/dist/icons/IconConcierge.js +5 -79
  88. package/dist/icons/IconConciergeService.js +5 -87
  89. package/dist/icons/IconCreditCard.js +5 -78
  90. package/dist/icons/IconDash.js +4 -72
  91. package/dist/icons/IconDeliver.js +4 -72
  92. package/dist/icons/IconDelivery.js +5 -87
  93. package/dist/icons/IconDetails.js +4 -72
  94. package/dist/icons/IconDot.js +6 -87
  95. package/dist/icons/IconEVCharging.js +5 -79
  96. package/dist/icons/IconElectricCarFuel.js +5 -80
  97. package/dist/icons/IconEllipsis.js +5 -78
  98. package/dist/icons/IconEnvelope.js +4 -72
  99. package/dist/icons/IconEye.js +5 -79
  100. package/dist/icons/IconFacebook.js +6 -94
  101. package/dist/icons/IconFilter.js +5 -83
  102. package/dist/icons/IconFlagMalaysia.js +5 -141
  103. package/dist/icons/IconGiveKey.js +5 -79
  104. package/dist/icons/IconGlobe.js +4 -70
  105. package/dist/icons/IconGoogle.js +5 -87
  106. package/dist/icons/IconHome.js +5 -78
  107. package/dist/icons/IconHostAdvertise.js +4 -72
  108. package/dist/icons/IconHostCar.js +4 -75
  109. package/dist/icons/IconHostCash.js +5 -91
  110. package/dist/icons/IconHostHandle.js +4 -70
  111. package/dist/icons/IconHostLocation.js +4 -70
  112. package/dist/icons/IconHostPayment.js +5 -91
  113. package/dist/icons/IconHostService.js +5 -79
  114. package/dist/icons/IconHotDeals.js +4 -72
  115. package/dist/icons/IconInfo.js +5 -77
  116. package/dist/icons/IconInstagram.js +4 -72
  117. package/dist/icons/IconInsurance.js +5 -99
  118. package/dist/icons/IconInternet.js +4 -73
  119. package/dist/icons/IconInventory.js +5 -78
  120. package/dist/icons/IconLaurel.js +5 -101
  121. package/dist/icons/IconLinkedIn.js +4 -72
  122. package/dist/icons/IconLoading.js +4 -78
  123. package/dist/icons/IconLocation.js +5 -80
  124. package/dist/icons/IconLock.js +4 -73
  125. package/dist/icons/IconLogistics.js +4 -72
  126. package/dist/icons/IconMail.js +5 -94
  127. package/dist/icons/IconMember.js +5 -78
  128. package/dist/icons/IconMobilePen.js +5 -83
  129. package/dist/icons/IconMotorcycleMoped.js +5 -78
  130. package/dist/icons/IconNoCost.js +5 -92
  131. package/dist/icons/IconPDF.js +5 -80
  132. package/dist/icons/IconPencil.js +4 -70
  133. package/dist/icons/IconPhone.js +4 -70
  134. package/dist/icons/IconPlus.js +4 -72
  135. package/dist/icons/IconPricing.js +4 -72
  136. package/dist/icons/IconProtected.js +4 -71
  137. package/dist/icons/IconPsychology.js +4 -72
  138. package/dist/icons/IconQuestionTooltip.js +4 -73
  139. package/dist/icons/IconQuote.js +4 -72
  140. package/dist/icons/IconRate.js +4 -71
  141. package/dist/icons/IconRegister.js +5 -99
  142. package/dist/icons/IconReturn.js +4 -72
  143. package/dist/icons/IconSearch.js +4 -70
  144. package/dist/icons/IconSecure.js +4 -71
  145. package/dist/icons/IconSecurity.js +4 -73
  146. package/dist/icons/IconSedanOutline.js +5 -159
  147. package/dist/icons/IconSelectArrow.js +6 -78
  148. package/dist/icons/IconSort.js +5 -79
  149. package/dist/icons/IconSortListed.js +5 -95
  150. package/dist/icons/IconSortPriceAscending.js +5 -83
  151. package/dist/icons/IconSortPriceDescending.js +5 -83
  152. package/dist/icons/IconSortYear.js +5 -79
  153. package/dist/icons/IconSpan.js +4 -71
  154. package/dist/icons/IconSpeaker.js +4 -79
  155. package/dist/icons/IconSpecialCar.js +5 -95
  156. package/dist/icons/IconStar.js +7 -92
  157. package/dist/icons/IconStockPhoto.js +5 -95
  158. package/dist/icons/IconSubscription.js +6 -113
  159. package/dist/icons/IconSubscriptions.js +6 -113
  160. package/dist/icons/IconSwap.js +5 -79
  161. package/dist/icons/IconTax.js +4 -72
  162. package/dist/icons/IconThinArrow.js +6 -78
  163. package/dist/icons/IconThumbsdown.js +5 -78
  164. package/dist/icons/IconThumbsup.js +5 -78
  165. package/dist/icons/IconTool.js +4 -72
  166. package/dist/icons/IconTooltip.js +4 -73
  167. package/dist/icons/IconTrash.js +4 -72
  168. package/dist/icons/IconTriangleExclamation.js +4 -72
  169. package/dist/icons/IconTyersBrakes.js +5 -83
  170. package/dist/icons/IconTyre.js +5 -83
  171. package/dist/icons/IconVacancy.js +5 -78
  172. package/dist/icons/IconVolunteer.js +4 -72
  173. package/dist/icons/IconWhatsapp.js +4 -73
  174. package/dist/icons/IconXPlatform.js +4 -72
  175. package/dist/icons/IconZeroEffort.js +5 -77
  176. package/dist/icons/Logo.js +3 -99
  177. package/dist/input/Input.js +11 -125
  178. package/dist/input/Input.stories.js +18 -17
  179. package/dist/input-mask/InputMask.js +11 -149
  180. package/dist/input-mask/InputMask.stories.js +6 -5
  181. package/dist/input-mask/mask-trackers.js +5 -4
  182. package/dist/input-select/InputSelect.js +68 -357
  183. package/dist/input-select/InputSelect.stories.js +25 -98
  184. package/dist/popover/popover.js +4 -72
  185. package/dist/progress/Progress.js +2 -96
  186. package/dist/progress/Progress.stories.js +14 -13
  187. package/dist/radio/Radio.js +4 -163
  188. package/dist/scroll-area/scroll-area.js +5 -113
  189. package/dist/search-input-select/SearchInputSelect.js +69 -346
  190. package/dist/select/Select.js +29 -315
  191. package/dist/select/Select.stories.js +19 -55
  192. package/dist/skeleton/Skeleton.js +3 -62
  193. package/dist/skeleton/Skeleton.stories.js +7 -8
  194. package/dist/slider/Slider.js +5 -106
  195. package/dist/slider/Slider.stories.js +11 -12
  196. package/dist/stack/Stack.js +3 -63
  197. package/dist/stack/Stack.stories.js +7 -19
  198. package/dist/table/Table.js +10 -131
  199. package/dist/table/Table.stories.js +8 -84
  200. package/dist/tabs/Tabs.js +9 -128
  201. package/dist/tabs/Tabs.stories.js +13 -46
  202. package/dist/text/Text.js +6 -88
  203. package/dist/text/Text.stories.js +7 -44
  204. package/dist/toast/Toast.stories.js +14 -66
  205. package/dist/toast/ToastBox.js +24 -71
  206. package/dist/toast/index.js +1 -0
  207. package/dist/toast/sonner.js +11 -70
  208. package/dist/toggle/Toggle.js +7 -116
  209. package/dist/toggle/Toggle.stories.js +8 -10
  210. package/dist/tooltip/Tooltip.js +12 -151
  211. package/dist/tooltip/Tooltip.stories.js +13 -71
  212. package/dist/utils.js +2 -4
  213. package/dist/vstack/VStack.js +3 -63
  214. package/dist/vstack/VStack.stories.js +7 -19
  215. package/package.json +4 -4
@@ -1,82 +1,3 @@
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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
81
2
  import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
82
3
  import * as React from 'react';
@@ -84,51 +5,10 @@ import Center from '../center/Center';
84
5
  import Flex from '../flex/Flex';
85
6
  import IconCheckMark from '../icons/IconCheckmark';
86
7
  import { cn } from '../utils';
87
- var CheckboxRoot = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
88
- var className = _param.className, props = _object_without_properties(_param, [
89
- "className"
90
- ]);
91
- return /*#__PURE__*/ _jsx(CheckboxPrimitive.Root, _object_spread_props(_object_spread({
92
- ref: ref,
93
- className: cn('peer h-4 w-4 border-2 border-primary3 ring-offset-white disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-white data-[state=checked]:border-none data-[state=checked]:bg-black', className)
94
- }, props), {
95
- children: /*#__PURE__*/ _jsx(CheckboxPrimitive.Indicator, {
96
- className: "flex items-center justify-center text-current",
97
- children: /*#__PURE__*/ _jsx(IconCheckMark, {
98
- size: '12px',
99
- stroke: '2px'
100
- })
101
- })
102
- }));
103
- });
8
+ const CheckboxRoot = React.forwardRef(({ className, ...props }, ref) => (_jsx(CheckboxPrimitive.Root, { ref: ref, className: cn('peer h-4 w-4 border-2 border-primary3 ring-offset-white disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-white data-[state=checked]:border-none data-[state=checked]:bg-black', className), ...props, children: _jsx(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: _jsx(IconCheckMark, { size: '12px', stroke: '2px' }) }) })));
104
9
  CheckboxRoot.displayName = CheckboxPrimitive.Root.displayName;
105
- var Checkbox = function(_param) {
106
- var children = _param.children, htmlFor = _param.htmlFor, props = _object_without_properties(_param, [
107
- "children",
108
- "htmlFor"
109
- ]);
110
- return /*#__PURE__*/ _jsxs(Flex, {
111
- className: "gap-2",
112
- children: [
113
- /*#__PURE__*/ _jsx(Center, {
114
- className: "size-6",
115
- children: /*#__PURE__*/ _jsx(CheckboxRoot, _object_spread({}, props))
116
- }),
117
- /*#__PURE__*/ _jsxs("label", {
118
- htmlFor: htmlFor,
119
- className: "flex-1",
120
- children: [
121
- children,
122
- props.error && /*#__PURE__*/ _jsxs("span", {
123
- className: "text-alert4 text-xs",
124
- children: [
125
- "⚠ ",
126
- props.error
127
- ]
128
- })
129
- ]
130
- })
131
- ]
132
- });
10
+ const Checkbox = ({ children, htmlFor, ...props }) => {
11
+ return (_jsxs(Flex, { className: "gap-2", children: [_jsx(Center, { className: "size-6", children: _jsx(CheckboxRoot, { ...props }) }), _jsxs("label", { htmlFor: htmlFor, className: "flex-1", children: [children, props.error && (_jsxs("span", { className: "text-alert4 text-xs", children: ["\u26A0 ", props.error] }))] })] }));
133
12
  };
134
13
  export default Checkbox;
14
+ //# sourceMappingURL=Checkbox.js.map
@@ -1,17 +1,15 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import Checkbox from './Checkbox.js';
3
- var meta = {
3
+ const meta = {
4
4
  component: Checkbox,
5
5
  args: {
6
- htmlFor: ''
7
- }
6
+ htmlFor: '',
7
+ },
8
8
  };
9
9
  export default meta;
10
- export var FirstStory = {
11
- render: function() {
12
- return /*#__PURE__*/ _jsx(Checkbox, {
13
- htmlFor: "tnc",
14
- children: "I accept the terms and conditions."
15
- });
16
- }
10
+ export const FirstStory = {
11
+ render: () => {
12
+ return _jsx(Checkbox, { htmlFor: "tnc", children: "I accept the terms and conditions." });
13
+ },
17
14
  };
15
+ //# sourceMappingURL=Checkbox.stories.js.map
package/dist/chip/Chip.js CHANGED
@@ -1,111 +1,10 @@
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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
81
2
  import * as React from 'react';
82
3
  import HStack from '../hstack/HStack';
83
4
  import IconClose from '../icons/IconClose';
84
5
  import { cn } from '../utils';
85
- var Chip = /*#__PURE__*/ React.forwardRef(function(_param, ref) {
86
- var className = _param.className, variant = _param.variant, onClick = _param.onClick, value = _param.value, _param_isRemovable = _param.isRemovable, isRemovable = _param_isRemovable === void 0 ? false : _param_isRemovable, props = _object_without_properties(_param, [
87
- "className",
88
- "variant",
89
- "onClick",
90
- "value",
91
- "isRemovable"
92
- ]);
93
- return /*#__PURE__*/ _jsxs(HStack, _object_spread_props(_object_spread({
94
- as: "button",
95
- type: "button",
96
- className: cn('flex p-3 text-sm text-primary3 tracking-normal min-w-max h-8 justify-center items-center gap-2 bg-[#F7F7F7] hover:border-black hover:border-[0.5px] hover:transition-all duration-200 ease-in-out transform active:scale-90 transition-transform', variant === 'outline' && 'border border-black', isRemovable && 'bg-primary1 p-3 hover:border-none hover:transition-none', className),
97
- ref: ref,
98
- onClick: onClick
99
- }, props), {
100
- children: [
101
- props.children,
102
- isRemovable && /*#__PURE__*/ _jsx(IconClose, {
103
- title: "Close",
104
- size: '12px',
105
- className: "text-primary3"
106
- })
107
- ]
108
- }));
109
- });
6
+ const Chip = React.forwardRef(({ className, variant, onClick, value, isRemovable = false, ...props }, ref) => (_jsxs(HStack, { as: "button", type: "button", className: cn('flex p-3 text-sm text-primary3 tracking-normal min-w-max h-8 justify-center items-center gap-2 bg-[#F7F7F7] hover:border-black hover:border-[0.5px] hover:transition-all duration-200 ease-in-out transform active:scale-90 transition-transform', variant === 'outline' && 'border border-black', isRemovable &&
7
+ 'bg-primary1 p-3 hover:border-none hover:transition-none', className), ref: ref, onClick: onClick, ...props, children: [props.children, isRemovable && (_jsx(IconClose, { title: "Close", size: '12px', className: "text-primary3" }))] })));
110
8
  Chip.displayName = 'Chip';
111
9
  export default Chip;
10
+ //# sourceMappingURL=Chip.js.map
@@ -1,25 +1,13 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import HStack from '../hstack/HStack';
3
3
  import Chip from './Chip';
4
- var meta = {
5
- component: Chip
4
+ const meta = {
5
+ component: Chip,
6
6
  };
7
7
  export default meta;
8
- export var FirstStory = {
9
- render: function() {
10
- return /*#__PURE__*/ _jsxs(HStack, {
11
- children: [
12
- /*#__PURE__*/ _jsx(Chip, {
13
- isRemovable: true,
14
- children: "api"
15
- }),
16
- /*#__PURE__*/ _jsx(Chip, {
17
- children: "air"
18
- }),
19
- /*#__PURE__*/ _jsx(Chip, {
20
- children: "abu"
21
- })
22
- ]
23
- });
24
- }
8
+ export const FirstStory = {
9
+ render: () => {
10
+ return (_jsxs(HStack, { children: [_jsx(Chip, { isRemovable: true, children: "api" }), _jsx(Chip, { children: "air" }), _jsx(Chip, { children: "abu" })] }));
11
+ },
25
12
  };
13
+ //# sourceMappingURL=Chip.stories.js.map
@@ -1,156 +1,17 @@
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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
81
2
  import { cn } from '../utils';
82
- var Circle = function(_param) {
83
- var size = _param.size, percentage = _param.percentage, _param_thickness = _param.thickness, thickness = _param_thickness === void 0 ? 2 : _param_thickness, className = _param.className, props = _object_without_properties(_param, [
84
- "size",
85
- "percentage",
86
- "thickness",
87
- "className"
88
- ]);
89
- var radius = size / 2 - thickness * 2;
90
- var circumference = 2 * Math.PI * radius;
91
- var arc = (100 - (percentage || 0)) / 100 * circumference;
92
- return /*#__PURE__*/ _jsx("circle", _object_spread({
93
- r: radius,
94
- cx: size / 2,
95
- cy: size / 2,
96
- fill: "transparent",
97
- strokeWidth: thickness,
98
- strokeDasharray: circumference,
99
- strokeDashoffset: arc,
100
- className: cn(percentage !== undefined ? 'stroke-primary4' : 'stroke-primary1', className)
101
- }, props));
3
+ const Circle = ({ size, percentage, thickness = 2, className, ...props }) => {
4
+ const radius = size / 2 - thickness * 2;
5
+ const circumference = 2 * Math.PI * radius;
6
+ const arc = ((100 - (percentage || 0)) / 100) * circumference;
7
+ return (_jsx("circle", { r: radius, cx: size / 2, cy: size / 2, fill: "transparent", strokeWidth: thickness, strokeDasharray: circumference, strokeDashoffset: arc, className: cn(percentage !== undefined ? 'stroke-primary4' : 'stroke-primary1', className), ...props }));
102
8
  };
103
- export var CircularProgressLabel = function(_param) {
104
- var children = _param.children, className = _param.className, props = _object_without_properties(_param, [
105
- "children",
106
- "className"
107
- ]);
108
- return /*#__PURE__*/ _jsx("text", _object_spread_props(_object_spread({
109
- x: "50%",
110
- y: "50%",
111
- dominantBaseline: "central",
112
- textAnchor: "middle",
113
- className: cn('fill-primary4 text-xs', className)
114
- }, props), {
115
- children: children
116
- }));
9
+ export const CircularProgressLabel = ({ children, className, ...props }) => {
10
+ return (_jsx("text", { x: "50%", y: "50%", dominantBaseline: "central", textAnchor: "middle", className: cn('fill-primary4 text-xs', className), ...props, children: children }));
117
11
  };
118
- var CircularProgress = function(_param) {
119
- var value = _param.value, _param_size = _param.size, size = _param_size === void 0 ? 48 : _param_size, fillCircleClassName = _param.fillCircleClassName, trackCircleClassName = _param.trackCircleClassName, children = _param.children, props = _object_without_properties(_param, [
120
- "value",
121
- "size",
122
- "fillCircleClassName",
123
- "trackCircleClassName",
124
- "children"
125
- ]);
126
- var percentage = Math.max(0, Math.min(100, value));
127
- return /*#__PURE__*/ _jsxs("svg", _object_spread_props(_object_spread({
128
- width: size,
129
- height: size
130
- }, props), {
131
- children: [
132
- /*#__PURE__*/ _jsxs("title", {
133
- children: [
134
- percentage,
135
- "%"
136
- ]
137
- }),
138
- /*#__PURE__*/ _jsxs("g", {
139
- transform: "rotate(-90 ".concat(size / 2, " ").concat(size / 2, ")"),
140
- children: [
141
- /*#__PURE__*/ _jsx(Circle, {
142
- size: size,
143
- className: trackCircleClassName
144
- }),
145
- /*#__PURE__*/ _jsx(Circle, {
146
- size: size,
147
- percentage: percentage,
148
- className: fillCircleClassName
149
- })
150
- ]
151
- }),
152
- children
153
- ]
154
- }));
12
+ const CircularProgress = ({ value, size = 48, fillCircleClassName, trackCircleClassName, children, ...props }) => {
13
+ const percentage = Math.max(0, Math.min(100, value));
14
+ return (_jsxs("svg", { width: size, height: size, ...props, children: [_jsxs("title", { children: [percentage, "%"] }), _jsxs("g", { transform: `rotate(-90 ${size / 2} ${size / 2})`, children: [_jsx(Circle, { size: size, className: trackCircleClassName }), _jsx(Circle, { size: size, percentage: percentage, className: fillCircleClassName })] }), children] }));
155
15
  };
156
16
  export default CircularProgress;
17
+ //# sourceMappingURL=CircularProgress.js.map
@@ -1,64 +1,24 @@
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 CircularProgress, { CircularProgressLabel } from './CircularProgress.js';
3
- var meta = {
3
+ const meta = {
4
4
  title: 'Circular Progress',
5
5
  component: CircularProgress,
6
6
  args: {
7
- value: 50
8
- }
7
+ value: 50,
8
+ },
9
9
  };
10
10
  export default meta;
11
- export var Basic = {};
12
- export var Standard = {
13
- render: function() {
14
- return /*#__PURE__*/ _jsx(CircularProgress, {
15
- value: 80,
16
- fillCircleClassName: "stroke-warning4",
17
- children: /*#__PURE__*/ _jsxs(CircularProgressLabel, {
18
- children: [
19
- 80,
20
- "%"
21
- ]
22
- })
23
- });
24
- }
11
+ export const Basic = {};
12
+ export const Standard = {
13
+ render: () => (_jsx(CircularProgress, { value: 80, fillCircleClassName: "stroke-warning4", children: _jsxs(CircularProgressLabel, { children: [80, "%"] }) })),
25
14
  };
26
- export var Zero = {
27
- render: function() {
28
- return /*#__PURE__*/ _jsx(CircularProgress, {
29
- value: 0,
30
- children: /*#__PURE__*/ _jsxs(CircularProgressLabel, {
31
- children: [
32
- 0,
33
- "%"
34
- ]
35
- })
36
- });
37
- }
15
+ export const Zero = {
16
+ render: () => (_jsx(CircularProgress, { value: 0, children: _jsxs(CircularProgressLabel, { children: [0, "%"] }) })),
38
17
  };
39
- export var Hundred = {
40
- render: function() {
41
- return /*#__PURE__*/ _jsx(CircularProgress, {
42
- value: 100,
43
- children: /*#__PURE__*/ _jsxs(CircularProgressLabel, {
44
- children: [
45
- 100,
46
- "%"
47
- ]
48
- })
49
- });
50
- }
18
+ export const Hundred = {
19
+ render: () => (_jsx(CircularProgress, { value: 100, children: _jsxs(CircularProgressLabel, { children: [100, "%"] }) })),
51
20
  };
52
- export var Creative = {
53
- render: function() {
54
- return /*#__PURE__*/ _jsx(CircularProgress, {
55
- value: 100,
56
- size: 200,
57
- fillCircleClassName: "fill-alert-700 stroke-alert4",
58
- children: /*#__PURE__*/ _jsx(CircularProgressLabel, {
59
- className: "text-9xl fill-white",
60
- children: "☪"
61
- })
62
- });
63
- }
21
+ export const Creative = {
22
+ render: () => (_jsx(CircularProgress, { value: 100, size: 200, fillCircleClassName: "fill-alert-700 stroke-alert4", children: _jsx(CircularProgressLabel, { className: "text-9xl fill-white", children: "\u262A" }) })),
64
23
  };
24
+ //# sourceMappingURL=CircularProgress.stories.js.map