@driveflux/beam 2.0.9 → 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.
- package/dist/accordion/Accordion.js +7 -133
- package/dist/accordion/Accordion.stories.js +11 -31
- package/dist/alert/Alert.js +14 -110
- package/dist/alert/Alert.stories.js +15 -50
- package/dist/animations/LoadingAnimation.js +21 -34
- package/dist/badge/Badge.js +7 -96
- package/dist/badge/Badge.stories.js +7 -28
- package/dist/base-styles.css +264 -96
- package/dist/box/Box.d.ts.map +1 -1
- package/dist/box/Box.js +3 -87
- package/dist/box/Box.stories.js +7 -8
- package/dist/breadcrumbs/Breadcrumbs.js +28 -288
- package/dist/breadcrumbs/Breadcrumbs.stories.js +27 -51
- package/dist/button/Button.js +12 -124
- package/dist/button/Button.stories.js +7 -35
- package/dist/card/Card.js +7 -109
- package/dist/card/Card.stories.js +7 -10
- package/dist/carousel/Carousel.js +58 -281
- package/dist/carousel/Carousel.js.map +1 -1
- package/dist/carousel/Carousel.stories.js +7 -39
- package/dist/carousel/CarouselButton.js +7 -68
- package/dist/center/Center.js +3 -63
- package/dist/center/Center.stories.js +7 -19
- package/dist/checkbox/Checkbox.js +4 -124
- package/dist/checkbox/Checkbox.stories.js +8 -10
- package/dist/chip/Chip.js +3 -104
- package/dist/chip/Chip.stories.js +7 -19
- package/dist/circular-progress/CircularProgress.js +11 -150
- package/dist/circular-progress/CircularProgress.stories.js +14 -54
- package/dist/command/command.js +13 -170
- package/dist/command/command.js.map +1 -1
- package/dist/datepicker/DatePicker.d.ts +2 -2
- package/dist/datepicker/DatePicker.d.ts.map +1 -1
- package/dist/datepicker/DatePicker.js +27 -127
- package/dist/datepicker/DatePicker.js.map +1 -1
- package/dist/datepicker/DatePicker.stories.js +58 -163
- package/dist/datepicker/DatePickerDrawer.js +14 -110
- package/dist/datepicker/DatePickerPopover.js +35 -207
- package/dist/datepicker/DatePickerPopover.js.map +1 -1
- package/dist/datepicker/constants.js +4 -3
- package/dist/datepicker/root-calendar.css +58 -58
- package/dist/datepicker/utils.js +11 -4
- package/dist/dialog/index.js +12 -144
- package/dist/divider/Divider.js +3 -63
- package/dist/divider/Divider.js.map +1 -1
- package/dist/divider/Divider.stories.js +7 -13
- package/dist/drawer/index.js +12 -157
- package/dist/drawer/index.js.map +1 -1
- package/dist/dropdown/Dropdown.js +26 -212
- package/dist/dropdown/Dropdown.js.map +1 -1
- package/dist/dropdown/Dropdown.stories.js +22 -109
- package/dist/field-wrapper/FieldWrapper.js +3 -139
- package/dist/field-wrapper/FieldWrapper.js.map +1 -1
- package/dist/field-wrapper/FieldWrapper.stories.js +28 -124
- package/dist/flex/Flex.js +3 -63
- package/dist/flex/Flex.stories.js +7 -19
- package/dist/grid/Grid.js +3 -63
- package/dist/grid/Grid.stories.js +7 -28
- package/dist/hooks/use-breakpoint-value.js +14 -77
- package/dist/hooks/use-media-query.js +12 -61
- package/dist/hstack/HStack.js +3 -63
- package/dist/hstack/HStack.stories.js +7 -19
- package/dist/icons/FluxLogo.js +9 -213
- package/dist/icons/FluxLogoTable.js +5 -109
- package/dist/icons/Icon.js +7 -108
- package/dist/icons/Icon.stories.js +7 -12
- package/dist/icons/Icon24Hours.js +5 -83
- package/dist/icons/IconAcceleration.js +4 -72
- package/dist/icons/IconAccount.js +4 -72
- package/dist/icons/IconApplicant.js +5 -78
- package/dist/icons/IconArrow.js +6 -78
- package/dist/icons/IconArrowBack.js +4 -72
- package/dist/icons/IconArrowForward.js +4 -72
- package/dist/icons/IconArrowTopLeft.js +4 -70
- package/dist/icons/IconBluesharkProductGuide.js +5 -80
- package/dist/icons/IconBolt.js +4 -72
- package/dist/icons/IconBriefcase.js +4 -72
- package/dist/icons/IconBulb.js +4 -72
- package/dist/icons/IconCalendar.js +4 -72
- package/dist/icons/IconCalendarArrowBack.js +4 -72
- package/dist/icons/IconCalendarArrowForward.js +4 -72
- package/dist/icons/IconCalendarDoubleArrowBack.js +4 -72
- package/dist/icons/IconCalendarDoubleArrowForward.js +4 -72
- package/dist/icons/IconCancel.js +6 -85
- package/dist/icons/IconCancelMark.js +4 -72
- package/dist/icons/IconCarSUV.js +4 -72
- package/dist/icons/IconCarSedan.js +7 -147
- package/dist/icons/IconChain.js +5 -79
- package/dist/icons/IconCheckmark.js +4 -72
- package/dist/icons/IconChevronRight.js +4 -72
- package/dist/icons/IconCircle.js +11 -114
- package/dist/icons/IconCircleCheckmark.js +5 -77
- package/dist/icons/IconCircleError.js +4 -72
- package/dist/icons/IconCircleExclamation.js +6 -104
- package/dist/icons/IconCircleMark.js +5 -78
- package/dist/icons/IconCircleOutline.js +5 -140
- package/dist/icons/IconClock.js +5 -80
- package/dist/icons/IconClose.js +4 -72
- package/dist/icons/IconConcierge.js +5 -79
- package/dist/icons/IconConciergeService.js +5 -87
- package/dist/icons/IconCreditCard.js +5 -78
- package/dist/icons/IconDash.js +4 -72
- package/dist/icons/IconDeliver.js +4 -72
- package/dist/icons/IconDelivery.js +5 -87
- package/dist/icons/IconDetails.js +4 -72
- package/dist/icons/IconDot.js +6 -87
- package/dist/icons/IconDot.js.map +1 -1
- package/dist/icons/IconEVCharging.js +5 -79
- package/dist/icons/IconElectricCarFuel.js +5 -80
- package/dist/icons/IconEllipsis.js +5 -78
- package/dist/icons/IconEnvelope.js +4 -72
- package/dist/icons/IconEye.js +5 -79
- package/dist/icons/IconFacebook.js +6 -94
- package/dist/icons/IconFilter.js +5 -83
- package/dist/icons/IconFlagMalaysia.js +5 -141
- package/dist/icons/IconGiveKey.js +5 -79
- package/dist/icons/IconGlobe.js +4 -70
- package/dist/icons/IconGoogle.js +5 -87
- package/dist/icons/IconHome.js +5 -78
- package/dist/icons/IconHostAdvertise.js +4 -72
- package/dist/icons/IconHostCar.js +4 -75
- package/dist/icons/IconHostCash.js +5 -91
- package/dist/icons/IconHostHandle.js +4 -70
- package/dist/icons/IconHostLocation.js +4 -70
- package/dist/icons/IconHostPayment.js +5 -91
- package/dist/icons/IconHostService.js +5 -79
- package/dist/icons/IconHotDeals.js +4 -72
- package/dist/icons/IconInfo.js +5 -77
- package/dist/icons/IconInstagram.js +4 -72
- package/dist/icons/IconInsurance.js +5 -99
- package/dist/icons/IconInternet.js +4 -73
- package/dist/icons/IconInventory.js +5 -78
- package/dist/icons/IconLaurel.js +5 -101
- package/dist/icons/IconLinkedIn.js +4 -72
- package/dist/icons/IconLoading.js +4 -78
- package/dist/icons/IconLocation.js +5 -80
- package/dist/icons/IconLock.js +4 -73
- package/dist/icons/IconLogistics.js +4 -72
- package/dist/icons/IconMail.js +5 -94
- package/dist/icons/IconMember.js +5 -78
- package/dist/icons/IconMobilePen.js +5 -83
- package/dist/icons/IconMotorcycleMoped.js +5 -78
- package/dist/icons/IconNoCost.js +5 -92
- package/dist/icons/IconPDF.js +5 -80
- package/dist/icons/IconPencil.js +4 -70
- package/dist/icons/IconPhone.js +4 -70
- package/dist/icons/IconPlus.js +4 -72
- package/dist/icons/IconPricing.js +4 -72
- package/dist/icons/IconProtected.js +4 -71
- package/dist/icons/IconPsychology.js +4 -72
- package/dist/icons/IconQuestionTooltip.js +4 -73
- package/dist/icons/IconQuote.js +4 -72
- package/dist/icons/IconRate.js +4 -71
- package/dist/icons/IconRegister.js +5 -99
- package/dist/icons/IconReturn.js +4 -72
- package/dist/icons/IconSearch.js +4 -70
- package/dist/icons/IconSecure.js +4 -71
- package/dist/icons/IconSecurity.js +4 -73
- package/dist/icons/IconSedanOutline.js +5 -159
- package/dist/icons/IconSelectArrow.js +6 -78
- package/dist/icons/IconSort.js +5 -79
- package/dist/icons/IconSortListed.js +5 -95
- package/dist/icons/IconSortPriceAscending.js +5 -83
- package/dist/icons/IconSortPriceDescending.js +5 -83
- package/dist/icons/IconSortYear.js +5 -79
- package/dist/icons/IconSpan.js +4 -71
- package/dist/icons/IconSpeaker.js +4 -79
- package/dist/icons/IconSpecialCar.js +5 -95
- package/dist/icons/IconStar.js +7 -92
- package/dist/icons/IconStockPhoto.js +5 -95
- package/dist/icons/IconSubscription.js +6 -113
- package/dist/icons/IconSubscriptions.js +6 -113
- package/dist/icons/IconSwap.js +5 -79
- package/dist/icons/IconTax.js +4 -72
- package/dist/icons/IconThinArrow.js +6 -78
- package/dist/icons/IconThumbsdown.js +5 -78
- package/dist/icons/IconThumbsup.js +5 -78
- package/dist/icons/IconTool.js +4 -72
- package/dist/icons/IconTooltip.js +4 -73
- package/dist/icons/IconTrash.js +4 -72
- package/dist/icons/IconTriangleExclamation.js +4 -72
- package/dist/icons/IconTyersBrakes.js +5 -83
- package/dist/icons/IconTyre.js +5 -83
- package/dist/icons/IconVacancy.js +5 -78
- package/dist/icons/IconVolunteer.js +4 -72
- package/dist/icons/IconWhatsapp.js +4 -73
- package/dist/icons/IconXPlatform.js +4 -72
- package/dist/icons/IconZeroEffort.js +5 -77
- package/dist/icons/Logo.js +3 -99
- package/dist/input/Input.js +11 -125
- package/dist/input/Input.stories.js +18 -17
- package/dist/input-mask/InputMask.js +11 -149
- package/dist/input-mask/InputMask.stories.js +6 -5
- package/dist/input-mask/mask-trackers.js +5 -4
- package/dist/input-select/InputSelect.js +68 -357
- package/dist/input-select/InputSelect.js.map +1 -1
- package/dist/input-select/InputSelect.stories.d.ts.map +1 -1
- package/dist/input-select/InputSelect.stories.js +25 -98
- package/dist/popover/popover.js +4 -72
- package/dist/popover/popover.js.map +1 -1
- package/dist/progress/Progress.js +2 -96
- package/dist/progress/Progress.stories.js +14 -13
- package/dist/radio/Radio.js +4 -163
- package/dist/scroll-area/scroll-area.js +5 -113
- package/dist/scroll-area/scroll-area.js.map +1 -1
- package/dist/search-input-select/SearchInputSelect.js +69 -346
- package/dist/search-input-select/SearchInputSelect.js.map +1 -1
- package/dist/select/Select.js +29 -315
- package/dist/select/Select.js.map +1 -1
- package/dist/select/Select.stories.d.ts.map +1 -1
- package/dist/select/Select.stories.js +19 -55
- package/dist/skeleton/Skeleton.js +3 -62
- package/dist/skeleton/Skeleton.stories.js +7 -8
- package/dist/slider/Slider.js +5 -106
- package/dist/slider/Slider.stories.js +11 -12
- package/dist/stack/Stack.js +3 -63
- package/dist/stack/Stack.stories.js +7 -19
- package/dist/styles.css +2787 -3282
- package/dist/table/Table.js +10 -131
- package/dist/table/Table.stories.js +8 -84
- package/dist/tabs/Tabs.js +9 -128
- package/dist/tabs/Tabs.js.map +1 -1
- package/dist/tabs/Tabs.stories.js +13 -46
- package/dist/text/Text.d.ts.map +1 -1
- package/dist/text/Text.js +6 -88
- package/dist/text/Text.stories.js +7 -44
- package/dist/toast/Toast.stories.js +14 -66
- package/dist/toast/ToastBox.js +24 -71
- package/dist/toast/index.js +1 -0
- package/dist/toast/sonner.js +11 -70
- package/dist/toggle/Toggle.js +7 -116
- package/dist/toggle/Toggle.stories.js +8 -10
- package/dist/tooltip/Tooltip.js +12 -151
- package/dist/tooltip/Tooltip.stories.js +13 -71
- package/dist/utils.js +2 -4
- package/dist/vstack/VStack.js +3 -63
- package/dist/vstack/VStack.stories.js +7 -19
- package/package.json +4 -4
- package/dist/icons/IconCollapseAll.d.ts +0 -8
- package/dist/icons/IconCollapseAll.d.ts.map +0 -1
- package/dist/icons/IconCollapseAll.js +0 -97
- package/dist/icons/IconCollapseAll.js.map +0 -1
- package/dist/icons/IconDownload.d.ts +0 -8
- package/dist/icons/IconDownload.d.ts.map +0 -1
- package/dist/icons/IconDownload.js +0 -82
- package/dist/icons/IconExpandAll.d.ts +0 -8
- package/dist/icons/IconExpandAll.d.ts.map +0 -1
- package/dist/icons/IconExpandAll.js +0 -97
- package/dist/icons/IconExpandAll.js.map +0 -1
- package/dist/icons/IconReport.d.ts +0 -9
- package/dist/icons/IconReport.d.ts.map +0 -1
- package/dist/icons/IconReport.js +0 -92
- package/dist/icons/IconReport.js.map +0 -1
|
@@ -1,76 +1,15 @@
|
|
|
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 _object_without_properties(source, excluded) {
|
|
30
|
-
if (source == null) return {};
|
|
31
|
-
var target = _object_without_properties_loose(source, excluded);
|
|
32
|
-
var key, i;
|
|
33
|
-
if (Object.getOwnPropertySymbols) {
|
|
34
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
35
|
-
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
36
|
-
key = sourceSymbolKeys[i];
|
|
37
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
39
|
-
target[key] = source[key];
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
return target;
|
|
43
|
-
}
|
|
44
|
-
function _object_without_properties_loose(source, excluded) {
|
|
45
|
-
if (source == null) return {};
|
|
46
|
-
var target = {};
|
|
47
|
-
var sourceKeys = Object.keys(source);
|
|
48
|
-
var key, i;
|
|
49
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
50
|
-
key = sourceKeys[i];
|
|
51
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
52
|
-
target[key] = source[key];
|
|
53
|
-
}
|
|
54
|
-
return target;
|
|
55
|
-
}
|
|
56
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
57
2
|
import { Slot } from '@radix-ui/react-slot';
|
|
58
3
|
import { cva } from 'class-variance-authority';
|
|
59
4
|
import * as React from 'react';
|
|
60
5
|
import { cn } from '../utils.js';
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
var Comp = asChild ? Slot : 'button';
|
|
68
|
-
return /*#__PURE__*/ _jsx(Comp, _object_spread({
|
|
69
|
-
className: cn(carouselButtonVariants({
|
|
70
|
-
className: className
|
|
71
|
-
})),
|
|
72
|
-
ref: ref
|
|
73
|
-
}, props));
|
|
6
|
+
const carouselButtonVariants = cva(`inline-flex items-center justify-center whitespace-nowrap text-white font-medium disabled:pointer-events-none disabled:opacity-50
|
|
7
|
+
h-10 sm:h-9 lg:h-11
|
|
8
|
+
`);
|
|
9
|
+
const CarouselButton = React.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
10
|
+
const Comp = asChild ? Slot : 'button';
|
|
11
|
+
return (_jsx(Comp, { className: cn(carouselButtonVariants({ className })), ref: ref, ...props }));
|
|
74
12
|
});
|
|
75
13
|
CarouselButton.displayName = 'CarouselButton';
|
|
76
14
|
export { CarouselButton, carouselButtonVariants };
|
|
15
|
+
//# sourceMappingURL=CarouselButton.js.map
|
package/dist/center/Center.js
CHANGED
|
@@ -1,70 +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 _object_without_properties(source, excluded) {
|
|
30
|
-
if (source == null) return {};
|
|
31
|
-
var target = _object_without_properties_loose(source, excluded);
|
|
32
|
-
var key, i;
|
|
33
|
-
if (Object.getOwnPropertySymbols) {
|
|
34
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
35
|
-
for(i = 0; i < sourceSymbolKeys.length; i++){
|
|
36
|
-
key = sourceSymbolKeys[i];
|
|
37
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
39
|
-
target[key] = source[key];
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
return target;
|
|
43
|
-
}
|
|
44
|
-
function _object_without_properties_loose(source, excluded) {
|
|
45
|
-
if (source == null) return {};
|
|
46
|
-
var target = {};
|
|
47
|
-
var sourceKeys = Object.keys(source);
|
|
48
|
-
var key, i;
|
|
49
|
-
for(i = 0; i < sourceKeys.length; i++){
|
|
50
|
-
key = sourceKeys[i];
|
|
51
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
52
|
-
target[key] = source[key];
|
|
53
|
-
}
|
|
54
|
-
return target;
|
|
55
|
-
}
|
|
56
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
57
2
|
import * as React from 'react';
|
|
58
3
|
import Box from '../box/Box';
|
|
59
4
|
import { cn } from '../utils';
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
"className"
|
|
63
|
-
]);
|
|
64
|
-
return /*#__PURE__*/ _jsx(Box, _object_spread({
|
|
65
|
-
className: cn('flex gap-4 justify-center items-center', className),
|
|
66
|
-
ref: ref
|
|
67
|
-
}, props));
|
|
5
|
+
const Center = React.forwardRef(({ className, ...props }, ref) => {
|
|
6
|
+
return (_jsx(Box, { className: cn('flex gap-4 justify-center items-center', className), ref: ref, ...props }));
|
|
68
7
|
});
|
|
69
8
|
Center.displayName = 'Center';
|
|
70
9
|
export default Center;
|
|
10
|
+
//# sourceMappingURL=Center.js.map
|
|
@@ -1,25 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Box from '../box/Box.js';
|
|
3
3
|
import Center from './Center.js';
|
|
4
|
-
|
|
5
|
-
component: Center
|
|
4
|
+
const meta = {
|
|
5
|
+
component: Center,
|
|
6
6
|
};
|
|
7
7
|
export default meta;
|
|
8
|
-
export
|
|
9
|
-
render:
|
|
10
|
-
return
|
|
11
|
-
|
|
12
|
-
children: [
|
|
13
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
14
|
-
className: "h-16 w-16 border border-primary2"
|
|
15
|
-
}),
|
|
16
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
17
|
-
className: "h-16 w-16 border border-primary2"
|
|
18
|
-
}),
|
|
19
|
-
/*#__PURE__*/ _jsx(Box, {
|
|
20
|
-
className: "h-16 w-16 border border-primary2"
|
|
21
|
-
})
|
|
22
|
-
]
|
|
23
|
-
});
|
|
24
|
-
}
|
|
8
|
+
export const FirstStory = {
|
|
9
|
+
render: () => {
|
|
10
|
+
return (_jsxs(Center, { className: "h-64 w-64 border border-black p-4", children: [_jsx(Box, { className: "h-16 w-16 border border-primary2" }), _jsx(Box, { className: "h-16 w-16 border border-primary2" }), _jsx(Box, { className: "h-16 w-16 border border-primary2" })] }));
|
|
11
|
+
},
|
|
25
12
|
};
|
|
13
|
+
//# sourceMappingURL=Center.stories.js.map
|
|
@@ -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
|
-
|
|
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
|
-
|
|
106
|
-
|
|
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
|
-
|
|
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
|
|
11
|
-
render:
|
|
12
|
-
return
|
|
13
|
-
|
|
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
|
-
|
|
86
|
-
|
|
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
|
-
|
|
5
|
-
component: Chip
|
|
4
|
+
const meta = {
|
|
5
|
+
component: Chip,
|
|
6
6
|
};
|
|
7
7
|
export default meta;
|
|
8
|
-
export
|
|
9
|
-
render:
|
|
10
|
-
return
|
|
11
|
-
|
|
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
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
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
|
|
104
|
-
|
|
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
|
-
|
|
119
|
-
|
|
120
|
-
|
|
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
|