linkedunion-design-kit 1.11.6 → 1.11.8
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/app/layout.d.ts +1 -1
- package/dist/app/{layout.js → layout.jsx} +3 -2
- package/dist/app/page.d.ts +1 -1
- package/dist/app/page.jsx +5 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +3 -0
- package/dist/src/components/Accordion/Accordion.stories.jsx +33 -0
- package/dist/src/components/Accordion/accordion.d.ts +4 -4
- package/dist/src/components/Accordion/{accordion.js → accordion.jsx} +11 -16
- package/dist/src/components/Alerts/Alert/alert.d.ts +7 -7
- package/dist/src/components/Alerts/Alert/{alert.js → alert.jsx} +21 -25
- package/dist/src/components/Alerts/Alert/alert.stories.d.ts +8 -8
- package/dist/src/components/Alerts/Alert/alert.stories.jsx +344 -0
- package/dist/src/components/Alerts/AlertDialog/alert-dialog.d.ts +11 -11
- package/dist/src/components/Alerts/AlertDialog/{alert-dialog.js → alert-dialog.jsx} +26 -24
- package/dist/src/components/Alerts/AlertDialog/alert-dialog.stories.d.ts +10 -10
- package/dist/src/components/Alerts/AlertDialog/alert-dialog.stories.jsx +552 -0
- package/dist/src/components/AppIcons/AndroidIcon.jsx +24 -0
- package/dist/src/components/AppIcons/{AppIcon.js → AppIcon.jsx} +4 -15
- package/dist/src/components/AppIcons/AppleIcon.jsx +31 -0
- package/dist/src/components/AppIcons/PlayStoreIcon.jsx +29 -0
- package/dist/src/components/Avatar/Avatar/{Avatar.js → Avatar.jsx} +13 -18
- package/dist/src/components/Avatar/Avatar/Avatar.stories.d.ts +7 -7
- package/dist/src/components/Avatar/Avatar/Avatar.stories.jsx +95 -0
- package/dist/src/components/Avatar/Avatar/{Avatar.test.js → Avatar.test.jsx} +1 -2
- package/dist/src/components/Avatar/AvatarGroup/AvatarGroup.d.ts +1 -1
- package/dist/src/components/Avatar/AvatarGroup/AvatarGroup.jsx +17 -0
- package/dist/src/components/Avatar/AvatarGroup/AvatarGroup.stories.jsx +32 -0
- package/dist/src/components/Avatar/StatusIndicator/StatusIndicator.jsx +20 -0
- package/dist/src/components/Avatar/StatusIndicator/StatusIndicator.stories.d.ts +2 -2
- package/dist/src/components/Avatar/StatusIndicator/{StatusIndicator.stories.js → StatusIndicator.stories.jsx} +12 -3
- package/dist/src/components/Badge/Badge.d.ts +1 -1
- package/dist/src/components/Badge/{Badge.js → Badge.jsx} +8 -13
- package/dist/src/components/Badge/Badge.stories.d.ts +10 -10
- package/dist/src/components/Badge/Badge.stories.jsx +201 -0
- package/dist/src/components/Button/Button/Button.d.ts +3 -2
- package/dist/src/components/Button/Button/{Button.js → Button.jsx} +24 -8
- package/dist/src/components/Button/Button/Button.stories.d.ts +5 -3
- package/dist/src/components/Button/Button/{Button.stories.js → Button.stories.jsx} +1 -13
- package/dist/src/components/Button/Button/Button.test.jsx +73 -0
- package/dist/src/components/Button/IconButton/IconButton.d.ts +1 -1
- package/dist/src/components/Button/IconButton/{IconButton.js → IconButton.jsx} +4 -13
- package/dist/src/components/Button/IconButton/IconButton.stories.d.ts +1 -1
- package/dist/src/components/Button/IconButton/{IconButton.stories.js → IconButton.stories.jsx} +1 -13
- package/dist/src/components/Button/IconButton/{IconButton.test.js → IconButton.test.jsx} +5 -6
- package/dist/src/components/Button/index.d.ts +1 -0
- package/dist/src/components/Button/index.js +3 -2
- package/dist/src/components/Card/MultipleNews/MultiNews.d.ts +1 -1
- package/dist/src/components/Card/MultipleNews/MultiNews.jsx +71 -0
- package/dist/src/components/Card/MultipleNews/{MultiNews.stories.js → MultiNews.stories.jsx} +1 -2
- package/dist/src/components/Card/PostByCategory/PostByCategory.d.ts +1 -1
- package/dist/src/components/Card/PostByCategory/PostByCategory.jsx +57 -0
- package/dist/src/components/Card/PostByCategory/{PostByCategory.stories.js → PostByCategory.stories.jsx} +1 -2
- package/dist/src/components/Card/SinglePost/SinglePost.d.ts +1 -1
- package/dist/src/components/Card/SinglePost/SinglePost.jsx +26 -0
- package/dist/src/components/Card/card.d.ts +2 -1
- package/dist/src/components/Card/{card.js → card.jsx} +2 -13
- package/dist/src/components/Card/contactProfile/ContactProfile.d.ts +1 -1
- package/dist/src/components/Card/contactProfile/ContactProfile.jsx +76 -0
- package/dist/src/components/Card/contactProfile/{ContactProfile.stories.js → ContactProfile.stories.jsx} +1 -2
- package/dist/src/components/Card/photoAlbum/PhotoAlbum.d.ts +1 -1
- package/dist/src/components/Card/photoAlbum/PhotoAlbum.jsx +41 -0
- package/dist/src/components/Card/photoAlbum/{PhotoAlbum.stories.js → PhotoAlbum.stories.jsx} +1 -13
- package/dist/src/components/Card/photoGallery/PhotoGallery.d.ts +1 -1
- package/dist/src/components/Card/photoGallery/PhotoGallery.jsx +17 -0
- package/dist/src/components/Card/photoGallery/{PhotoGallery.stories.js → PhotoGallery.stories.jsx} +1 -13
- package/dist/src/components/Checkbox/checkbox.d.ts +1 -1
- package/dist/src/components/Checkbox/{checkbox.js → checkbox.jsx} +6 -13
- package/dist/src/components/Checkbox/checkbox.stories.jsx +113 -0
- package/dist/src/components/ColorPicker/ColorPicker.d.ts +1 -1
- package/dist/src/components/ColorPicker/{ColorPicker.js → ColorPicker.jsx} +6 -13
- package/dist/src/components/ColorPicker/ColorPicker.stories.d.ts +5 -5
- package/dist/src/components/ColorPicker/ColorPicker.stories.jsx +138 -0
- package/dist/src/components/Colors/color.d.ts +1 -1
- package/dist/src/components/Colors/{color.js → color.jsx} +1 -2
- package/dist/src/components/Colors/color.stories.jsx +20 -0
- package/dist/src/components/Colors/{color.test.js → color.test.jsx} +3 -4
- package/dist/src/components/DatePicker/DatePicker.d.ts +1 -1
- package/dist/src/components/DatePicker/DatePicker.jsx +67 -0
- package/dist/src/components/DatePicker/DatePicker.stories.d.ts +9 -9
- package/dist/src/components/DatePicker/DatePicker.stories.jsx +291 -0
- package/dist/src/components/DateRangePicker/DateRangePicker.d.ts +1 -1
- package/dist/src/components/DateRangePicker/{DateRangePicker.js → DateRangePicker.jsx} +92 -44
- package/dist/src/components/DateRangePicker/DateRangePicker.stories.d.ts +19 -19
- package/dist/src/components/DateRangePicker/DateRangePicker.stories.jsx +582 -0
- package/dist/src/components/Dropdown/Combobox/Combobox.d.ts +1 -1
- package/dist/src/components/Dropdown/Combobox/{Combobox.js → Combobox.jsx} +67 -29
- package/dist/src/components/Dropdown/Combobox/Combobox.stories.d.ts +8 -8
- package/dist/src/components/Dropdown/Combobox/Combobox.stories.jsx +289 -0
- package/dist/src/components/Dropdown/Combobox/dialog.d.ts +10 -10
- package/dist/src/components/Dropdown/Combobox/dialog.jsx +66 -0
- package/dist/src/components/Dropdown/Combobox/utils/renderBadge.jsx +7 -0
- package/dist/src/components/Dropdown/DropdownMenu/DropdownMenu.d.ts +7 -3
- package/dist/src/components/Dropdown/DropdownMenu/{DropdownMenu.js → DropdownMenu.jsx} +29 -22
- package/dist/src/components/Dropdown/DropdownMenu/DropdownMenu.stories.d.ts +19 -12
- package/dist/src/components/Dropdown/DropdownMenu/DropdownMenu.stories.jsx +552 -0
- package/dist/src/components/Dropdown/DropdownMenu/SelectAllSection.jsx +19 -0
- package/dist/src/components/Dropdown/DropdownMenu/index.d.ts +5 -0
- package/dist/src/components/Dropdown/DropdownMenu/index.js +5 -0
- package/dist/src/components/Dropdown/Select.stories.d.ts +7 -6
- package/dist/src/components/Dropdown/{Select.stories.js → Select.stories.jsx} +71 -8
- package/dist/src/components/Dropdown/select.d.ts +10 -10
- package/dist/src/components/Dropdown/select.jsx +94 -0
- package/dist/src/components/Icons/LUIcon.d.ts +1 -1
- package/dist/src/components/Icons/{LUIcon.js → LUIcon.jsx} +10 -13
- package/dist/src/components/Icons/stories/IconDropdown.jsx +67 -0
- package/dist/src/components/Icons/stories/IconGallery.jsx +77 -0
- package/dist/src/components/Icons/stories/InteractiveIconSelector.jsx +86 -0
- package/dist/src/components/Icons/stories/LUIcon.stories.d.ts +5 -5
- package/dist/src/components/Icons/stories/{LUIcon.stories.js → LUIcon.stories.jsx} +23 -8
- package/dist/src/components/ImageUploader/imageUploader.d.ts +1 -1
- package/dist/src/components/ImageUploader/{imageUploader.js → imageUploader.jsx} +28 -13
- package/dist/src/components/Images/LuImage.d.ts +1 -1
- package/dist/src/components/Images/{LuImage.js → LuImage.jsx} +1 -13
- package/dist/src/components/Images/{LuImage.stories.js → LuImage.stories.jsx} +1 -13
- package/dist/src/components/Images/{LuImage.test.js → LuImage.test.jsx} +6 -18
- package/dist/src/components/Input/Input.stories.d.ts +9 -8
- package/dist/src/components/Input/Input.stories.jsx +250 -0
- package/dist/src/components/Input/input.d.ts +1 -1
- package/dist/src/components/Input/{input.js → input.jsx} +10 -13
- package/dist/src/components/Label/Label.d.ts +1 -1
- package/dist/src/components/Label/{Label.js → Label.jsx} +2 -13
- package/dist/src/components/Label/{Label.stories.js → Label.stories.jsx} +1 -13
- package/dist/src/components/Modal/Modal.d.ts +3 -3
- package/dist/src/components/Modal/{Modal.js → Modal.jsx} +20 -19
- package/dist/src/components/Modal/Modal.stories.d.ts +15 -15
- package/dist/src/components/Modal/Modal.stories.jsx +487 -0
- package/dist/src/components/Pagination/pagination.d.ts +5 -5
- package/dist/src/components/Pagination/{pagination.js → pagination.jsx} +18 -21
- package/dist/src/components/Pagination/pagination.stories.d.ts +6 -6
- package/dist/src/components/Pagination/pagination.stories.jsx +301 -0
- package/dist/src/components/RadioGroup/{RadioGroup.stories.js → RadioGroup.stories.jsx} +52 -22
- package/dist/src/components/RadioGroup/radio-group.d.ts +1 -1
- package/dist/src/components/RadioGroup/{radio-group.js → radio-group.jsx} +6 -14
- package/dist/src/components/Separator/Separator.stories.d.ts +15 -0
- package/dist/src/components/Separator/Separator.stories.jsx +94 -0
- package/dist/src/components/Separator/index.d.ts +1 -0
- package/dist/src/components/Separator/index.js +1 -0
- package/dist/src/components/Separator/separator.d.ts +4 -0
- package/dist/src/components/Separator/separator.jsx +20 -0
- package/dist/src/components/Sheet/index.d.ts +1 -0
- package/dist/src/components/Sheet/index.js +1 -0
- package/dist/src/components/Sheet/sheet.d.ts +25 -0
- package/dist/src/components/Sheet/sheet.jsx +73 -0
- package/dist/src/components/Sheet/sheet.stories.d.ts +4 -0
- package/dist/src/components/Sheet/sheet.stories.jsx +34 -0
- package/dist/src/components/Skeleton/skeleton.d.ts +14 -14
- package/dist/src/components/Skeleton/{skeleton.js → skeleton.jsx} +23 -27
- package/dist/src/components/Skeleton/skeleton.stories.d.ts +14 -14
- package/dist/src/components/Skeleton/skeleton.stories.jsx +734 -0
- package/dist/src/components/Slider/slider.d.ts +1 -1
- package/dist/src/components/Slider/slider.jsx +31 -0
- package/dist/src/components/SweetAlert/SweetAlert.d.ts +9 -9
- package/dist/src/components/SweetAlert/{SweetAlert.js → SweetAlert.jsx} +18 -21
- package/dist/src/components/SweetAlert/SweetAlert.stories.d.ts +7 -7
- package/dist/src/components/SweetAlert/{SweetAlert.stories.js → SweetAlert.stories.jsx} +215 -15
- package/dist/src/components/Switch/{Switch.stories.js → Switch.stories.jsx} +1 -13
- package/dist/src/components/Switch/switch.d.ts +1 -1
- package/dist/src/components/Switch/{switch.js → switch.jsx} +4 -13
- package/dist/src/components/Table/{Table.js → Table.jsx} +111 -58
- package/dist/src/components/Table/Table.stories.d.ts +13 -13
- package/dist/src/components/Table/{Table.stories.js → Table.stories.jsx} +299 -45
- package/dist/src/components/Table/{Table.test.js → Table.test.jsx} +39 -7
- package/dist/src/components/Tabs/{Tabs.stories.js → Tabs.stories.jsx} +10 -3
- package/dist/src/components/Tabs/tabs.d.ts +4 -4
- package/dist/src/components/Tabs/tabs.jsx +32 -0
- package/dist/src/components/TimePicker/TimePicker.d.ts +1 -1
- package/dist/src/components/TimePicker/{TimePicker.js → TimePicker.jsx} +54 -30
- package/dist/src/components/TimePicker/TimePicker.stories.d.ts +10 -10
- package/dist/src/components/TimePicker/TimePicker.stories.jsx +298 -0
- package/dist/src/components/Title/Title.d.ts +1 -1
- package/dist/src/components/Title/{Title.js → Title.jsx} +2 -2
- package/dist/src/components/Title/{Title.stories.js → Title.stories.jsx} +1 -13
- package/dist/src/components/Title/{Title.test.js → Title.test.jsx} +4 -5
- package/dist/src/components/ToolTip/Tooltip.d.ts +1 -1
- package/dist/src/components/ToolTip/Tooltip.jsx +18 -0
- package/dist/src/components/ToolTip/{Tooltip.stories.js → Tooltip.stories.jsx} +2 -14
- package/dist/src/components/Typography/Body/{Body.stories.js → Body.stories.jsx} +1 -13
- package/dist/src/components/Typography/Body/body.d.ts +1 -1
- package/dist/src/components/Typography/Body/{body.js → body.jsx} +4 -13
- package/dist/src/components/Typography/Caption/{Caption.stories.js → Caption.stories.jsx} +1 -13
- package/dist/src/components/Typography/Caption/caption.d.ts +1 -1
- package/dist/src/components/Typography/Caption/{caption.js → caption.jsx} +4 -13
- package/dist/src/components/Typography/Display/{Display.stories.js → Display.stories.jsx} +1 -13
- package/dist/src/components/Typography/Display/display.d.ts +1 -1
- package/dist/src/components/Typography/Display/{display.js → display.jsx} +4 -13
- package/dist/src/components/Typography/Heading/Heading.stories.d.ts +6 -6
- package/dist/src/components/Typography/Heading/Heading.stories.jsx +85 -0
- package/dist/src/components/Typography/Heading/{heading.js → heading.jsx} +5 -14
- package/dist/src/components/VerticalTabs/{VerticalTabs.js → VerticalTabs.jsx} +9 -17
- package/dist/src/components/VerticalTabs/VerticalTabs.stories.jsx +154 -0
- package/dist/src/components/VerticalTabs/VerticalTabs.test.jsx +97 -0
- package/dist/src/components/ui/calendar.d.ts +2 -2
- package/dist/src/components/ui/{calendar.js → calendar.jsx} +36 -22
- package/dist/src/components/ui/command.d.ts +9 -9
- package/dist/src/components/ui/command.jsx +67 -0
- package/dist/src/components/ui/popover.d.ts +4 -4
- package/dist/src/components/ui/popover.jsx +33 -0
- package/dist/src/components/ui/tooltip.d.ts +4 -4
- package/dist/src/components/ui/tooltip.jsx +38 -0
- package/dist/src/components/ui/typography.d.ts +1 -1
- package/dist/src/components/ui/{typography.js → typography.jsx} +4 -13
- package/dist/styles/global.css +107 -5
- package/package.json +4 -3
- package/dist/app/page.js +0 -4
- package/dist/src/components/Accordion/Accordion.stories.js +0 -32
- package/dist/src/components/Alerts/Alert/alert.stories.js +0 -166
- package/dist/src/components/Alerts/AlertDialog/alert-dialog.stories.js +0 -213
- package/dist/src/components/AppIcons/AndroidIcon.js +0 -28
- package/dist/src/components/AppIcons/AppleIcon.js +0 -28
- package/dist/src/components/AppIcons/PlayStoreIcon.js +0 -28
- package/dist/src/components/Avatar/Avatar/Avatar.stories.js +0 -69
- package/dist/src/components/Avatar/AvatarGroup/AvatarGroup.js +0 -8
- package/dist/src/components/Avatar/AvatarGroup/AvatarGroup.stories.js +0 -14
- package/dist/src/components/Avatar/StatusIndicator/StatusIndicator.js +0 -18
- package/dist/src/components/Badge/Badge.stories.js +0 -145
- package/dist/src/components/Button/Button/Button.test.js +0 -10
- package/dist/src/components/Card/MultipleNews/MultiNews.js +0 -46
- package/dist/src/components/Card/PostByCategory/PostByCategory.js +0 -37
- package/dist/src/components/Card/SinglePost/SinglePost.js +0 -10
- package/dist/src/components/Card/contactProfile/ContactProfile.js +0 -39
- package/dist/src/components/Card/photoAlbum/PhotoAlbum.js +0 -16
- package/dist/src/components/Card/photoGallery/PhotoGallery.js +0 -8
- package/dist/src/components/Checkbox/checkbox.stories.js +0 -78
- package/dist/src/components/ColorPicker/ColorPicker.stories.js +0 -77
- package/dist/src/components/Colors/color.stories.js +0 -32
- package/dist/src/components/DatePicker/DatePicker.js +0 -64
- package/dist/src/components/DatePicker/DatePicker.stories.js +0 -171
- package/dist/src/components/DateRangePicker/DateRangePicker.stories.js +0 -318
- package/dist/src/components/Dropdown/Combobox/Combobox.stories.js +0 -225
- package/dist/src/components/Dropdown/Combobox/dialog.js +0 -68
- package/dist/src/components/Dropdown/Combobox/utils/renderBadge.js +0 -5
- package/dist/src/components/Dropdown/DropdownMenu/DropdownMenu.stories.js +0 -253
- package/dist/src/components/Dropdown/DropdownMenu/SelectAllSection.js +0 -9
- package/dist/src/components/Dropdown/select.js +0 -87
- package/dist/src/components/Icons/stories/IconDropdown.js +0 -38
- package/dist/src/components/Icons/stories/IconGallery.js +0 -31
- package/dist/src/components/Icons/stories/InteractiveIconSelector.js +0 -26
- package/dist/src/components/Input/Input.stories.js +0 -133
- package/dist/src/components/Modal/Modal.stories.js +0 -115
- package/dist/src/components/Pagination/pagination.stories.js +0 -168
- package/dist/src/components/Skeleton/skeleton.stories.js +0 -414
- package/dist/src/components/Slider/slider.js +0 -38
- package/dist/src/components/Tabs/tabs.js +0 -43
- package/dist/src/components/TimePicker/TimePicker.stories.js +0 -176
- package/dist/src/components/ToolTip/Tooltip.js +0 -8
- package/dist/src/components/Typography/Heading/Heading.stories.js +0 -67
- package/dist/src/components/VerticalTabs/VerticalTabs.stories.js +0 -100
- package/dist/src/components/VerticalTabs/VerticalTabs.test.js +0 -48
- package/dist/src/components/ui/command.js +0 -65
- package/dist/src/components/ui/popover.js +0 -42
- package/dist/src/components/ui/tooltip.js +0 -42
- /package/dist/src/components/AppIcons/{AppIcon.stories.js → AppIcon.stories.jsx} +0 -0
- /package/dist/src/components/Card/SinglePost/{SinglePost.stories.js → SinglePost.stories.jsx} +0 -0
- /package/dist/src/components/Icons/{LUIcon.test.js → LUIcon.test.jsx} +0 -0
- /package/dist/src/components/ImageUploader/{ImageUploader.stories.js → ImageUploader.stories.jsx} +0 -0
- /package/dist/src/components/Slider/{Slider.stories.js → Slider.stories.jsx} +0 -0
- /package/dist/src/components/ui/{collapsible.js → collapsible.jsx} +0 -0
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
-
var t = {};
|
|
14
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
-
t[p] = s[p];
|
|
16
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
-
t[p[i]] = s[p[i]];
|
|
20
|
-
}
|
|
21
|
-
return t;
|
|
22
|
-
};
|
|
23
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
|
-
var PlayStoreIcon = function (_a) {
|
|
25
|
-
var _b = _a.width, width = _b === void 0 ? "177" : _b, _c = _a.height, height = _c === void 0 ? "60" : _c, _d = _a.fill, fill = _d === void 0 ? "#000000" : _d, _e = _a.textFill, textFill = _e === void 0 ? "#ffffff" : _e, _f = _a.iconFill, iconFill = _f === void 0 ? textFill : _f, className = _a.className, _g = _a.stroke, stroke = _g === void 0 ? textFill : _g, props = __rest(_a, ["width", "height", "fill", "textFill", "iconFill", "className", "stroke"]);
|
|
26
|
-
return (_jsxs("svg", __assign({ width: width, height: height, viewBox: "0 0 177 60", fill: fill, xmlns: "http://www.w3.org/2000/svg", className: className }, props, { children: [_jsx("path", { d: "M2 0.757324H175C175.828 0.757324 176.5 1.4289 176.5 2.25732V57.2573C176.5 58.0858 175.828 58.7573 175 58.7573H2C1.17157 58.7573 0.5 58.0858 0.5 57.2573V2.25732C0.5 1.4289 1.17157 0.757324 2 0.757324Z", stroke: stroke }), _jsx("g", { clipPath: "url(#clip0_5713_34595)", children: _jsx("path", { d: "M28.3308 28.4039L14.5344 14.57L32.0878 24.647L28.3308 28.4039ZM10.9337 13.7573C10.121 14.1824 9.57715 14.9576 9.57715 15.964V43.5506C9.57715 44.5571 10.121 45.3322 10.9337 45.7573L26.9743 29.7542L10.9337 13.7573ZM37.5139 27.8601L33.8319 25.7284L29.7248 29.7605L33.8319 33.7925L37.5889 31.6608C38.7141 30.7669 38.7141 28.754 37.5139 27.8601ZM14.5344 44.9509L32.0878 34.8739L28.3308 31.117L14.5344 44.9509Z", fill: iconFill }) }), _jsx("path", { d: "M56.47 12.3273C56.1993 11.758 55.8073 11.3193 55.294 11.0113C54.7807 10.694 54.1833 10.5353 53.502 10.5353C52.8207 10.5353 52.2047 10.694 51.654 11.0113C51.1127 11.3193 50.6833 11.7673 50.366 12.3553C50.058 12.934 49.904 13.606 49.904 14.3713C49.904 15.1367 50.058 15.8087 50.366 16.3873C50.6833 16.966 51.1127 17.414 51.654 17.7313C52.2047 18.0393 52.8207 18.1933 53.502 18.1933C54.454 18.1933 55.238 17.9087 55.854 17.3393C56.47 16.77 56.8293 16 56.932 15.0293H53.04V13.9933H58.29V14.9733C58.2153 15.776 57.9633 16.5133 57.534 17.1853C57.1047 17.848 56.54 18.3753 55.84 18.7673C55.14 19.15 54.3607 19.3413 53.502 19.3413C52.5967 19.3413 51.7707 19.1313 51.024 18.7113C50.2773 18.282 49.6847 17.6893 49.246 16.9333C48.8167 16.1773 48.602 15.3233 48.602 14.3713C48.602 13.4193 48.8167 12.5653 49.246 11.8093C49.6847 11.044 50.2773 10.4513 51.024 10.0313C51.7707 9.60199 52.5967 9.38732 53.502 9.38732C54.538 9.38732 55.4527 9.64399 56.246 10.1573C57.0487 10.6707 57.632 11.394 57.996 12.3273H56.47ZM66.9745 15.1273C66.9745 15.37 66.9605 15.6267 66.9325 15.8973H60.8005C60.8472 16.6533 61.1038 17.246 61.5705 17.6753C62.0465 18.0953 62.6205 18.3053 63.2925 18.3053C63.8432 18.3053 64.3005 18.1793 64.6645 17.9273C65.0378 17.666 65.2992 17.3207 65.4485 16.8913H66.8205C66.6152 17.6287 66.2045 18.2307 65.5885 18.6973C64.9725 19.1547 64.2072 19.3833 63.2925 19.3833C62.5645 19.3833 61.9112 19.22 61.3325 18.8933C60.7632 18.5667 60.3152 18.1047 59.9885 17.5073C59.6618 16.9007 59.4985 16.2007 59.4985 15.4073C59.4985 14.614 59.6572 13.9187 59.9745 13.3213C60.2918 12.724 60.7352 12.2667 61.3045 11.9493C61.8832 11.6227 62.5458 11.4593 63.2925 11.4593C64.0205 11.4593 64.6645 11.618 65.2245 11.9353C65.7845 12.2527 66.2138 12.6913 66.5125 13.2513C66.8205 13.802 66.9745 14.4273 66.9745 15.1273ZM65.6585 14.8613C65.6585 14.376 65.5512 13.9607 65.3365 13.6153C65.1218 13.2607 64.8278 12.9947 64.4545 12.8173C64.0905 12.6307 63.6845 12.5373 63.2365 12.5373C62.5925 12.5373 62.0418 12.7427 61.5845 13.1533C61.1365 13.564 60.8798 14.1333 60.8145 14.8613H65.6585ZM70.2101 12.6353V17.1573C70.2101 17.5307 70.2895 17.7967 70.4481 17.9553C70.6068 18.1047 70.8821 18.1793 71.2741 18.1793H72.2121V19.2573H71.0641C70.3548 19.2573 69.8228 19.094 69.4681 18.7673C69.1135 18.4407 68.9361 17.904 68.9361 17.1573V12.6353H67.9421V11.5853H68.9361V9.65332H70.2101V11.5853H72.2121V12.6353H70.2101ZM78.1462 10.3393C77.9035 10.3393 77.6982 10.2553 77.5302 10.0873C77.3622 9.91932 77.2782 9.71399 77.2782 9.47132C77.2782 9.22866 77.3622 9.02332 77.5302 8.85532C77.6982 8.68732 77.9035 8.60332 78.1462 8.60332C78.3795 8.60332 78.5755 8.68732 78.7342 8.85532C78.9022 9.02332 78.9862 9.22866 78.9862 9.47132C78.9862 9.71399 78.9022 9.91932 78.7342 10.0873C78.5755 10.2553 78.3795 10.3393 78.1462 10.3393ZM78.7622 11.5853V19.2573H77.4882V11.5853H78.7622ZM82.4875 12.6353V17.1573C82.4875 17.5307 82.5668 17.7967 82.7255 17.9553C82.8841 18.1047 83.1595 18.1793 83.5515 18.1793H84.4895V19.2573H83.3415C82.6321 19.2573 82.1001 19.094 81.7455 18.7673C81.3908 18.4407 81.2135 17.904 81.2135 17.1573V12.6353H80.2195V11.5853H81.2135V9.65332H82.4875V11.5853H84.4895V12.6353H82.4875ZM93.1115 19.3833C92.3928 19.3833 91.7395 19.22 91.1515 18.8933C90.5728 18.5667 90.1155 18.1047 89.7795 17.5073C89.4528 16.9007 89.2895 16.2007 89.2895 15.4073C89.2895 14.6233 89.4575 13.9327 89.7935 13.3353C90.1388 12.7287 90.6055 12.2667 91.1935 11.9493C91.7815 11.6227 92.4395 11.4593 93.1675 11.4593C93.8955 11.4593 94.5535 11.6227 95.1415 11.9493C95.7295 12.2667 96.1915 12.724 96.5275 13.3213C96.8728 13.9187 97.0455 14.614 97.0455 15.4073C97.0455 16.2007 96.8682 16.9007 96.5135 17.5073C96.1682 18.1047 95.6968 18.5667 95.0995 18.8933C94.5022 19.22 93.8395 19.3833 93.1115 19.3833ZM93.1115 18.2633C93.5688 18.2633 93.9982 18.156 94.3995 17.9413C94.8008 17.7267 95.1228 17.4047 95.3655 16.9753C95.6175 16.546 95.7435 16.0233 95.7435 15.4073C95.7435 14.7913 95.6222 14.2687 95.3795 13.8393C95.1368 13.41 94.8195 13.0927 94.4275 12.8873C94.0355 12.6727 93.6108 12.5653 93.1535 12.5653C92.6868 12.5653 92.2575 12.6727 91.8655 12.8873C91.4828 13.0927 91.1748 13.41 90.9415 13.8393C90.7082 14.2687 90.5915 14.7913 90.5915 15.4073C90.5915 16.0327 90.7035 16.56 90.9275 16.9893C91.1608 17.4187 91.4688 17.7407 91.8515 17.9553C92.2342 18.1607 92.6542 18.2633 93.1115 18.2633ZM102.459 11.4453C103.392 11.4453 104.148 11.73 104.727 12.2993C105.305 12.8593 105.595 13.6713 105.595 14.7353V19.2573H104.335V14.9173C104.335 14.152 104.143 13.5687 103.761 13.1673C103.378 12.7567 102.855 12.5513 102.193 12.5513C101.521 12.5513 100.984 12.7613 100.583 13.1813C100.191 13.6013 99.9946 14.2127 99.9946 15.0153V19.2573H98.7206V11.5853H99.9946V12.6773C100.247 12.2853 100.587 11.982 101.017 11.7673C101.455 11.5527 101.936 11.4453 102.459 11.4453Z", fill: textFill }), _jsx("path", { d: "M59.56 37.3573C59.2 36.664 58.7 36.144 58.06 35.7973C57.42 35.4373 56.68 35.2573 55.84 35.2573C54.92 35.2573 54.1 35.464 53.38 35.8773C52.66 36.2907 52.0933 36.8773 51.68 37.6373C51.28 38.3973 51.08 39.2773 51.08 40.2773C51.08 41.2773 51.28 42.164 51.68 42.9373C52.0933 43.6973 52.66 44.284 53.38 44.6973C54.1 45.1107 54.92 45.3173 55.84 45.3173C57.08 45.3173 58.0867 44.9707 58.86 44.2773C59.6333 43.584 60.1067 42.644 60.28 41.4573H55.06V39.6373H62.72V41.4173C62.5733 42.4973 62.1867 43.4907 61.56 44.3973C60.9467 45.304 60.14 46.0307 59.14 46.5773C58.1533 47.1107 57.0533 47.3773 55.84 47.3773C54.5333 47.3773 53.34 47.0773 52.26 46.4773C51.18 45.864 50.32 45.0173 49.68 43.9373C49.0533 42.8573 48.74 41.6373 48.74 40.2773C48.74 38.9173 49.0533 37.6973 49.68 36.6173C50.32 35.5373 51.18 34.6973 52.26 34.0973C53.3533 33.484 54.5467 33.1773 55.84 33.1773C57.32 33.1773 58.6333 33.544 59.78 34.2773C60.94 34.9973 61.78 36.024 62.3 37.3573H59.56ZM69.7488 47.4373C68.7088 47.4373 67.7688 47.204 66.9288 46.7373C66.0888 46.2573 65.4288 45.5907 64.9488 44.7373C64.4688 43.8707 64.2288 42.8707 64.2288 41.7373C64.2288 40.6173 64.4754 39.624 64.9688 38.7573C65.4621 37.8907 66.1354 37.224 66.9888 36.7573C67.8421 36.2907 68.7954 36.0573 69.8488 36.0573C70.9021 36.0573 71.8554 36.2907 72.7088 36.7573C73.5621 37.224 74.2354 37.8907 74.7288 38.7573C75.2221 39.624 75.4688 40.6173 75.4688 41.7373C75.4688 42.8573 75.2154 43.8507 74.7088 44.7173C74.2021 45.584 73.5088 46.2573 72.6288 46.7373C71.7621 47.204 70.8021 47.4373 69.7488 47.4373ZM69.7488 45.4573C70.3354 45.4573 70.8821 45.3173 71.3888 45.0373C71.9088 44.7573 72.3288 44.3373 72.6488 43.7773C72.9688 43.2173 73.1288 42.5373 73.1288 41.7373C73.1288 40.9373 72.9754 40.264 72.6688 39.7173C72.3621 39.1573 71.9554 38.7373 71.4488 38.4573C70.9421 38.1773 70.3954 38.0373 69.8088 38.0373C69.2221 38.0373 68.6754 38.1773 68.1688 38.4573C67.6754 38.7373 67.2821 39.1573 66.9888 39.7173C66.6954 40.264 66.5488 40.9373 66.5488 41.7373C66.5488 42.924 66.8488 43.844 67.4488 44.4973C68.0621 45.1373 68.8288 45.4573 69.7488 45.4573ZM82.5027 47.4373C81.4627 47.4373 80.5227 47.204 79.6827 46.7373C78.8427 46.2573 78.1827 45.5907 77.7027 44.7373C77.2227 43.8707 76.9827 42.8707 76.9827 41.7373C76.9827 40.6173 77.2293 39.624 77.7227 38.7573C78.216 37.8907 78.8893 37.224 79.7427 36.7573C80.596 36.2907 81.5493 36.0573 82.6027 36.0573C83.656 36.0573 84.6093 36.2907 85.4627 36.7573C86.316 37.224 86.9893 37.8907 87.4827 38.7573C87.976 39.624 88.2227 40.6173 88.2227 41.7373C88.2227 42.8573 87.9693 43.8507 87.4627 44.7173C86.956 45.584 86.2627 46.2573 85.3827 46.7373C84.516 47.204 83.556 47.4373 82.5027 47.4373ZM82.5027 45.4573C83.0893 45.4573 83.636 45.3173 84.1427 45.0373C84.6627 44.7573 85.0827 44.3373 85.4027 43.7773C85.7227 43.2173 85.8827 42.5373 85.8827 41.7373C85.8827 40.9373 85.7293 40.264 85.4227 39.7173C85.116 39.1573 84.7093 38.7373 84.2027 38.4573C83.696 38.1773 83.1493 38.0373 82.5627 38.0373C81.976 38.0373 81.4293 38.1773 80.9227 38.4573C80.4293 38.7373 80.036 39.1573 79.7427 39.7173C79.4493 40.264 79.3027 40.9373 79.3027 41.7373C79.3027 42.924 79.6027 43.844 80.2027 44.4973C80.816 45.1373 81.5827 45.4573 82.5027 45.4573ZM94.9166 36.0573C95.7699 36.0573 96.5232 36.2307 97.1766 36.5773C97.8432 36.9107 98.3632 37.3307 98.7366 37.8373V36.2373H101.037V47.4373C101.037 48.4507 100.823 49.3507 100.397 50.1373C99.9699 50.9373 99.3499 51.564 98.5366 52.0173C97.7366 52.4707 96.7766 52.6973 95.6566 52.6973C94.1632 52.6973 92.9232 52.344 91.9366 51.6373C90.9499 50.944 90.3899 49.9973 90.2566 48.7973H92.5166C92.6899 49.3707 93.0566 49.8307 93.6166 50.1773C94.1899 50.5373 94.8699 50.7173 95.6566 50.7173C96.5766 50.7173 97.3166 50.4373 97.8766 49.8773C98.4499 49.3173 98.7366 48.504 98.7366 47.4373V45.5973C98.3499 46.1173 97.8232 46.5573 97.1566 46.9173C96.5032 47.264 95.7566 47.4373 94.9166 47.4373C93.9566 47.4373 93.0766 47.1973 92.2766 46.7173C91.4899 46.224 90.8632 45.544 90.3966 44.6773C89.9432 43.7973 89.7166 42.804 89.7166 41.6973C89.7166 40.5907 89.9432 39.6107 90.3966 38.7573C90.8632 37.904 91.4899 37.244 92.2766 36.7773C93.0766 36.2973 93.9566 36.0573 94.9166 36.0573ZM98.7366 41.7373C98.7366 40.9773 98.5766 40.3173 98.2566 39.7573C97.9499 39.1973 97.5432 38.7707 97.0366 38.4773C96.5299 38.184 95.9832 38.0373 95.3966 38.0373C94.8099 38.0373 94.2632 38.184 93.7566 38.4773C93.2499 38.7573 92.8366 39.1773 92.5166 39.7373C92.2099 40.284 92.0566 40.9373 92.0566 41.6973C92.0566 42.4573 92.2099 43.124 92.5166 43.6973C92.8366 44.2707 93.2499 44.7107 93.7566 45.0173C94.2766 45.3107 94.8232 45.4573 95.3966 45.4573C95.9832 45.4573 96.5299 45.3107 97.0366 45.0173C97.5432 44.724 97.9499 44.2973 98.2566 43.7373C98.5766 43.164 98.7366 42.4973 98.7366 41.7373ZM106.311 32.4573V47.2573H104.031V32.4573H106.311ZM119.405 41.4773C119.405 41.8907 119.378 42.264 119.325 42.5973H110.905C110.971 43.4773 111.298 44.184 111.885 44.7173C112.471 45.2507 113.191 45.5173 114.045 45.5173C115.271 45.5173 116.138 45.004 116.645 43.9773H119.105C118.771 44.9907 118.165 45.824 117.285 46.4773C116.418 47.1173 115.338 47.4373 114.045 47.4373C112.991 47.4373 112.045 47.204 111.205 46.7373C110.378 46.2573 109.725 45.5907 109.245 44.7373C108.778 43.8707 108.545 42.8707 108.545 41.7373C108.545 40.604 108.771 39.6107 109.225 38.7573C109.691 37.8907 110.338 37.224 111.165 36.7573C112.005 36.2907 112.965 36.0573 114.045 36.0573C115.085 36.0573 116.011 36.284 116.825 36.7373C117.638 37.1907 118.271 37.8307 118.725 38.6573C119.178 39.4707 119.405 40.4107 119.405 41.4773ZM117.025 40.7573C117.011 39.9173 116.711 39.244 116.125 38.7373C115.538 38.2307 114.811 37.9773 113.945 37.9773C113.158 37.9773 112.485 38.2307 111.925 38.7373C111.365 39.2307 111.031 39.904 110.925 40.7573H117.025ZM136.564 37.4973C136.564 38.204 136.397 38.8707 136.064 39.4973C135.73 40.124 135.197 40.6373 134.464 41.0373C133.73 41.424 132.79 41.6173 131.644 41.6173H129.124V47.2573H126.844V33.3573H131.644C132.71 33.3573 133.61 33.544 134.344 33.9173C135.09 34.2773 135.644 34.7707 136.004 35.3973C136.377 36.024 136.564 36.724 136.564 37.4973ZM131.644 39.7573C132.51 39.7573 133.157 39.564 133.584 39.1773C134.01 38.7773 134.224 38.2173 134.224 37.4973C134.224 35.9773 133.364 35.2173 131.644 35.2173H129.124V39.7573H131.644ZM141.018 32.4573V47.2573H138.738V32.4573H141.018ZM143.252 41.6973C143.252 40.5907 143.478 39.6107 143.932 38.7573C144.398 37.904 145.025 37.244 145.812 36.7773C146.612 36.2973 147.492 36.0573 148.452 36.0573C149.318 36.0573 150.072 36.2307 150.712 36.5773C151.365 36.9107 151.885 37.3307 152.272 37.8373V36.2373H154.572V47.2573H152.272V45.6173C151.885 46.1373 151.358 46.5707 150.692 46.9173C150.025 47.264 149.265 47.4373 148.412 47.4373C147.465 47.4373 146.598 47.1973 145.812 46.7173C145.025 46.224 144.398 45.544 143.932 44.6773C143.478 43.7973 143.252 42.804 143.252 41.6973ZM152.272 41.7373C152.272 40.9773 152.112 40.3173 151.792 39.7573C151.485 39.1973 151.078 38.7707 150.572 38.4773C150.065 38.184 149.518 38.0373 148.932 38.0373C148.345 38.0373 147.798 38.184 147.292 38.4773C146.785 38.7573 146.372 39.1773 146.052 39.7373C145.745 40.284 145.592 40.9373 145.592 41.6973C145.592 42.4573 145.745 43.124 146.052 43.6973C146.372 44.2707 146.785 44.7107 147.292 45.0173C147.812 45.3107 148.358 45.4573 148.932 45.4573C149.518 45.4573 150.065 45.3107 150.572 45.0173C151.078 44.724 151.485 44.2973 151.792 43.7373C152.112 43.164 152.272 42.4973 152.272 41.7373ZM167.486 36.2373L160.726 52.4373H158.366L160.606 47.0773L156.266 36.2373H158.806L161.906 44.6373L165.126 36.2373H167.486Z", fill: textFill }), _jsx("defs", { children: _jsx("clipPath", { id: "clip0_5713_34595", children: _jsx("rect", { width: "32", height: "32", fill: iconFill, transform: "translate(8 13.7573)" }) }) })] })));
|
|
27
|
-
};
|
|
28
|
-
export default PlayStoreIcon;
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { avatarShape, avatarSize } from ".";
|
|
14
|
-
import { Avatar, AvatarFallback, AvatarImage } from "./Avatar";
|
|
15
|
-
import { statusIndicator } from "../StatusIndicator";
|
|
16
|
-
export default {
|
|
17
|
-
title: "Components/Avatar/Avatar",
|
|
18
|
-
component: Avatar,
|
|
19
|
-
argTypes: {
|
|
20
|
-
size: {
|
|
21
|
-
control: {
|
|
22
|
-
type: "select",
|
|
23
|
-
options: Object.keys(avatarSize),
|
|
24
|
-
},
|
|
25
|
-
description: "The size of the avatar.",
|
|
26
|
-
table: {
|
|
27
|
-
type: { summary: "string" },
|
|
28
|
-
defaultValue: { summary: "md" },
|
|
29
|
-
},
|
|
30
|
-
},
|
|
31
|
-
shape: {
|
|
32
|
-
control: {
|
|
33
|
-
type: "select",
|
|
34
|
-
options: Object.keys(avatarShape),
|
|
35
|
-
},
|
|
36
|
-
description: "The shape of the avatar.",
|
|
37
|
-
table: {
|
|
38
|
-
type: { summary: "string" },
|
|
39
|
-
defaultValue: { summary: "rounded" },
|
|
40
|
-
},
|
|
41
|
-
},
|
|
42
|
-
status: {
|
|
43
|
-
control: {
|
|
44
|
-
type: "select",
|
|
45
|
-
options: Object.keys(statusIndicator),
|
|
46
|
-
},
|
|
47
|
-
description: "The status of the avatar.",
|
|
48
|
-
table: {
|
|
49
|
-
type: { summary: "string" },
|
|
50
|
-
},
|
|
51
|
-
},
|
|
52
|
-
},
|
|
53
|
-
};
|
|
54
|
-
var Template = function (args) {
|
|
55
|
-
return (_jsxs(Avatar, __assign({}, args, { children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] })));
|
|
56
|
-
};
|
|
57
|
-
export var Default = Template.bind({});
|
|
58
|
-
export var AvatarSize = function () { return (_jsx("div", { className: "flex flex-row space-x-2", children: Object.keys(avatarSize).map(function (size) { return (_jsxs(Avatar, { size: size, children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, size)); }) })); };
|
|
59
|
-
export var AvatarFallBackValue = function () { return (_jsx("div", { className: "flex flex-row space-x-2", children: Object.keys(avatarSize).map(function (size) { return (_jsxs(Avatar, { size: size, children: [_jsx(AvatarImage, { src: "", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, size)); }) })); };
|
|
60
|
-
export var AvatarShape = function () { return (_jsx("div", { className: "flex flex-row space-x-2", children: Object.keys(avatarShape).map(function (shape) { return (_jsxs(Avatar, { shape: shape, size: "massive", status: "online", children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, shape)); }) })); };
|
|
61
|
-
export var AvatarWithNoImageAndFallBackValue = function () {
|
|
62
|
-
var user = { name: "Ali", image: null };
|
|
63
|
-
return (_jsx("div", { className: "flex flex-row space-x-2", children: _jsxs(Avatar, { size: "md", children: [_jsx(AvatarImage, { src: "", alt: "User avatar" }), _jsx(AvatarFallback, { children: (user === null || user === void 0 ? void 0 : user.name) && user.name.charAt(0) })] }) }));
|
|
64
|
-
};
|
|
65
|
-
export var AvatarShapeSizeCombination = function () { return (_jsx("div", { className: "flex flex-col space-y-2", children: Object.keys(avatarShape).map(function (shape) {
|
|
66
|
-
return Object.keys(avatarSize).map(function (size) { return (_jsxs(Avatar, { shape: shape, size: size, children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, "".concat(shape, "-").concat(size))); });
|
|
67
|
-
}) })); };
|
|
68
|
-
export var AvatarStatusIndicator = function () { return (_jsx("div", { className: "flex flex-row space-x-2", children: Object.keys(statusIndicator).map(function (status) { return (_jsxs(Avatar, { size: "massive", shape: "square", status: status, children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, status)); }) })); };
|
|
69
|
-
export var RoundedAvatarStatusIndicatorSize = function () { return (_jsx("div", { className: "flex flex-row space-x-2", children: Object.keys(avatarSize).map(function (size) { return (_jsxs(Avatar, { size: size, shape: "rounded", status: "online", children: [_jsx(AvatarImage, { src: "/images/avatar.png", alt: "Avatar" }), _jsx(AvatarFallback, { children: "AB" })] }, size)); }) })); };
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Avatar, AvatarFallback, AvatarImage } from "../Avatar/Avatar";
|
|
3
|
-
export var AvatarGroup = function (_a) {
|
|
4
|
-
var images = _a.images;
|
|
5
|
-
var visibleImages = images.slice(0, 2);
|
|
6
|
-
var remainingCount = images.length - visibleImages.length;
|
|
7
|
-
return (_jsxs("div", { className: "flex -space-x-5", children: [visibleImages.map(function (img) { return (_jsx(Avatar, { className: "size-9 !border !border-white !bg-black !shadow-sm", children: _jsx(AvatarImage, { src: img.image, alt: img.name || "Avatar image" }) }, img.id)); }), remainingCount > 0 && (_jsx(Avatar, { className: "size-9 !border !border-white", children: _jsxs(AvatarFallback, { className: "!text-black text-xs font-semibold !bg-white !shadow-sm", children: ["+", remainingCount] }) }))] }));
|
|
8
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { avatars } from ".";
|
|
3
|
-
import { Avatar, AvatarFallback, AvatarImage } from "../Avatar/Avatar";
|
|
4
|
-
export default {
|
|
5
|
-
title: "Components/Avatar/AvatarGroup",
|
|
6
|
-
component: Avatar,
|
|
7
|
-
tags: ["autodocs"],
|
|
8
|
-
};
|
|
9
|
-
var Template = function () { return (_jsx("div", { className: "flex gap-2", children: avatars.map(function (avatar, idx) { return (_jsxs(Avatar, { children: [_jsx(AvatarImage, { src: avatar.src, alt: avatar.alt }), _jsx(AvatarFallback, { children: avatar.fallback })] }, idx)); }) })); };
|
|
10
|
-
export var Default = Template.bind({});
|
|
11
|
-
Default.storyName = "Avatar Group (Images & Fallbacks)";
|
|
12
|
-
export var WithFallbacksOnly = function () { return (_jsx("div", { className: "*:data-[slot=avatar]:ring-background flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:grayscale", children: ["AA", "BB", "CC", "DD"].map(function (initials, idx) { return (_jsx(Avatar, { children: _jsx(AvatarFallback, { children: initials }) }, idx)); }) })); };
|
|
13
|
-
export var CustomSize = function () { return (_jsx("div", { className: "*:data-[slot=avatar]:ring-background flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:grayscale", children: avatars.slice(0, 3).map(function (avatar, idx) { return (_jsxs(Avatar, { className: "size-12", children: [_jsx(AvatarImage, { src: avatar.src, alt: avatar.alt }), _jsx(AvatarFallback, { children: avatar.fallback })] }, idx)); }) })); };
|
|
14
|
-
export var WithBackgroundBlack = function () { return (_jsx("div", { className: "flex -space-x-2", children: avatars.slice(0, 3).map(function (avatar, idx) { return (_jsxs(Avatar, { className: "size-12 bg-black shadow-sm border-2 border-white", children: [_jsx(AvatarImage, { src: avatar.src, alt: avatar.alt }), _jsx(AvatarFallback, { children: avatar.fallback })] }, idx)); }) })); };
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { cn } from "../../../lib/utils";
|
|
3
|
-
import { statusIndicatorOuterSize, awayIndicatorInnerSize, statusIndicatorBorder, } from ".";
|
|
4
|
-
export var StatusIndicator = function (_a) {
|
|
5
|
-
var status = _a.status, _b = _a.size, size = _b === void 0 ? "md" : _b, className = _a.className;
|
|
6
|
-
var baseClasses = cn("relative inline-flex items-center justify-center rounded-full", statusIndicatorOuterSize[size], className);
|
|
7
|
-
if (status === "online") {
|
|
8
|
-
return (_jsx("span", { className: cn(baseClasses, "border-green-100 bg-green-600", statusIndicatorBorder[size]) }));
|
|
9
|
-
}
|
|
10
|
-
if (status === "offline") {
|
|
11
|
-
return (_jsx("span", { className: cn(baseClasses, "bg-gray-100 border-gray-300", statusIndicatorBorder[size]) }));
|
|
12
|
-
}
|
|
13
|
-
if (status === "busy") {
|
|
14
|
-
return (_jsx("span", { className: cn(baseClasses, "bg-red-100 border-red-600", statusIndicatorBorder[size]) }));
|
|
15
|
-
}
|
|
16
|
-
// away
|
|
17
|
-
return (_jsx("span", { className: cn(baseClasses, "bg-yellow-500"), children: _jsx("span", { className: cn(awayIndicatorInnerSize[size], "rounded-full bg-yellow-100 block", "absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2") }) }));
|
|
18
|
-
};
|
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { Badge } from "./Badge";
|
|
14
|
-
import { badgeStyles } from ".";
|
|
15
|
-
import { iconList } from "../../utils/iconList";
|
|
16
|
-
var meta = {
|
|
17
|
-
title: "Components/Badge",
|
|
18
|
-
component: Badge,
|
|
19
|
-
tags: ["autodocs"],
|
|
20
|
-
argTypes: {
|
|
21
|
-
type: {
|
|
22
|
-
control: {
|
|
23
|
-
type: "select",
|
|
24
|
-
options: Object.keys(badgeStyles.type),
|
|
25
|
-
},
|
|
26
|
-
description: "The type of the badge.",
|
|
27
|
-
table: {
|
|
28
|
-
type: { summary: "string" },
|
|
29
|
-
defaultValue: { summary: "fill" },
|
|
30
|
-
},
|
|
31
|
-
},
|
|
32
|
-
color: {
|
|
33
|
-
control: {
|
|
34
|
-
type: "select",
|
|
35
|
-
},
|
|
36
|
-
options: Object.keys(badgeStyles.fillColor),
|
|
37
|
-
description: "The color of the badge.",
|
|
38
|
-
table: {
|
|
39
|
-
type: { summary: "string" },
|
|
40
|
-
defaultValue: { summary: "blue" },
|
|
41
|
-
},
|
|
42
|
-
},
|
|
43
|
-
size: {
|
|
44
|
-
control: {
|
|
45
|
-
type: "select",
|
|
46
|
-
options: Object.keys(badgeStyles.size),
|
|
47
|
-
},
|
|
48
|
-
description: "The size of the badge.",
|
|
49
|
-
table: {
|
|
50
|
-
type: { summary: "string" },
|
|
51
|
-
defaultValue: { summary: "md" },
|
|
52
|
-
},
|
|
53
|
-
},
|
|
54
|
-
shape: {
|
|
55
|
-
control: {
|
|
56
|
-
type: "select",
|
|
57
|
-
},
|
|
58
|
-
options: Object.keys(badgeStyles.shape),
|
|
59
|
-
description: "The shape of the badge.",
|
|
60
|
-
table: {
|
|
61
|
-
type: { summary: "string" },
|
|
62
|
-
defaultValue: { summary: "rounded" },
|
|
63
|
-
},
|
|
64
|
-
},
|
|
65
|
-
startIcon: {
|
|
66
|
-
control: {
|
|
67
|
-
type: "select",
|
|
68
|
-
options: Object.keys(iconList),
|
|
69
|
-
},
|
|
70
|
-
description: "The icon to display at the start of the badge.",
|
|
71
|
-
table: {
|
|
72
|
-
type: { summary: "string" },
|
|
73
|
-
},
|
|
74
|
-
},
|
|
75
|
-
endIcon: {
|
|
76
|
-
control: {
|
|
77
|
-
type: "select",
|
|
78
|
-
options: Object.keys(iconList),
|
|
79
|
-
},
|
|
80
|
-
description: "The icon to display at the end of the badge.",
|
|
81
|
-
table: {
|
|
82
|
-
type: { summary: "string" },
|
|
83
|
-
},
|
|
84
|
-
},
|
|
85
|
-
disabled: {
|
|
86
|
-
control: {
|
|
87
|
-
type: "boolean",
|
|
88
|
-
},
|
|
89
|
-
description: "Whether the badge is disabled.",
|
|
90
|
-
table: {
|
|
91
|
-
type: { summary: "boolean" },
|
|
92
|
-
defaultValue: { summary: "false" },
|
|
93
|
-
},
|
|
94
|
-
},
|
|
95
|
-
onRemove: {
|
|
96
|
-
description: "When provided, displays a close icon that calls this function when clicked. The close icon is only shown when this prop is present.",
|
|
97
|
-
table: {
|
|
98
|
-
type: { summary: "() => void" },
|
|
99
|
-
defaultValue: { summary: "undefined" },
|
|
100
|
-
},
|
|
101
|
-
control: false,
|
|
102
|
-
},
|
|
103
|
-
},
|
|
104
|
-
decorators: [
|
|
105
|
-
function (Story, context) {
|
|
106
|
-
// Use type, not color, to determine color options
|
|
107
|
-
var currentType = context.args.type;
|
|
108
|
-
if (context.argTypes && context.argTypes.color) {
|
|
109
|
-
context.argTypes.color.options =
|
|
110
|
-
currentType === "fill"
|
|
111
|
-
? Object.keys(badgeStyles.fillColor)
|
|
112
|
-
: Object.keys(badgeStyles.outlineColor);
|
|
113
|
-
}
|
|
114
|
-
return _jsx(Story, __assign({}, context));
|
|
115
|
-
},
|
|
116
|
-
],
|
|
117
|
-
};
|
|
118
|
-
export default meta;
|
|
119
|
-
export var Default = {
|
|
120
|
-
args: {
|
|
121
|
-
children: "Default Badge",
|
|
122
|
-
onRemove: undefined,
|
|
123
|
-
},
|
|
124
|
-
parameters: {
|
|
125
|
-
docs: {
|
|
126
|
-
description: {
|
|
127
|
-
story: "Default badge without a close icon. The close icon is only shown when the onRemove prop is provided.",
|
|
128
|
-
},
|
|
129
|
-
},
|
|
130
|
-
},
|
|
131
|
-
};
|
|
132
|
-
export var BadgeSize = function () { return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { size: "sm", children: "Small Badge" }), _jsx(Badge, { size: "md", children: "Medium Badge" }), _jsx(Badge, { size: "lg", children: "Large Badge" })] })); };
|
|
133
|
-
export var WithIcons = function () { return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { startIcon: "check", children: "Left Icon Only" }), _jsx(Badge, { endIcon: "check", children: "Right Icon Only" }), _jsx(Badge, { startIcon: "check", endIcon: "star", children: "Both Icons" }), _jsx("p", { className: "text-sm mt-2 text-gray-500", children: "Note: None of these have an onRemove handler, so no close icon is shown" })] })); };
|
|
134
|
-
export var BadgeType = function () { return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { type: "fill", children: "Fill Badge" }), _jsx(Badge, { type: "outline", children: "Outline Badge" })] })); };
|
|
135
|
-
export var BadgeShape = function () { return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { shape: "rounded", children: "Rounded Badge" }), _jsx(Badge, { shape: "square", children: "Square Badge" })] })); };
|
|
136
|
-
export var BadgeFillColors = function () { return (_jsxs("div", { className: "flex flex-row space-x-2", children: [_jsx(Badge, { color: "blue", children: "Blue" }), _jsx(Badge, { color: "light-blue", children: "Light Blue" }), _jsx(Badge, { color: "red", children: "Red" }), _jsx(Badge, { color: "light-red", children: "Light Red" }), _jsx(Badge, { color: "indigo", children: "Indigo" }), _jsx(Badge, { color: "light-indigo", children: "Light Indigo" }), _jsx(Badge, { color: "green", children: "Green" }), _jsx(Badge, { color: "light-green", children: "Light Green" }), _jsx(Badge, { color: "yellow", children: "Yellow" }), _jsx(Badge, { color: "light-yellow", children: "Light Yellow" }), _jsx(Badge, { color: "gray", children: "Gray" }), _jsx(Badge, { color: "light-gray", children: "Light Gray" })] })); };
|
|
137
|
-
export var BadgeOutlineColors = function () { return (_jsxs("div", { className: "flex flex-row space-x-2", children: [_jsx(Badge, { color: "blue", type: "outline", children: "Blue" }), _jsx(Badge, { color: "red", type: "outline", children: "Red" }), _jsx(Badge, { color: "indigo", type: "outline", children: "Indigo" }), _jsx(Badge, { color: "green", type: "outline", children: "Green" }), _jsx(Badge, { color: "yellow", type: "outline", children: "Yellow" }), _jsx(Badge, { color: "gray", type: "outline", children: "Gray" })] })); };
|
|
138
|
-
export var DisabledBadge = function () { return (_jsx("div", { className: "flex flex-col space-y-2", children: _jsx(Badge, { disabled: true, children: "Disabled Badge" }) })); };
|
|
139
|
-
export var BadgeWithCounter = function () { return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { children: "3" }), _jsx(Badge, { color: "red", children: "+3" })] })); };
|
|
140
|
-
export var BadgeWithRemoveHandler = function () {
|
|
141
|
-
var handleRemove = function () {
|
|
142
|
-
alert("Badge removed!");
|
|
143
|
-
};
|
|
144
|
-
return (_jsxs("div", { className: "flex flex-col space-y-2", children: [_jsx(Badge, { startIcon: "plus", onRemove: handleRemove, color: "green", children: "Badge with Close Icon" }), _jsx(Badge, { onRemove: handleRemove, children: "Removable Badge" }), _jsx(Badge, { startIcon: "check", onRemove: handleRemove, children: "Check with Remove" }), _jsx(Badge, { type: "outline", onRemove: handleRemove, children: "Outline Removable" })] }));
|
|
145
|
-
};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { render, screen } from "@testing-library/react";
|
|
3
|
-
import { Dummy_label } from "../../../utils/constants";
|
|
4
|
-
import { Button } from "./Button";
|
|
5
|
-
describe("Button Component", function () {
|
|
6
|
-
it("renders default button component", function () {
|
|
7
|
-
render(_jsx(Button, { children: Dummy_label }));
|
|
8
|
-
expect(screen.getByRole("button")).toBeInTheDocument();
|
|
9
|
-
});
|
|
10
|
-
});
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import LuImage from "../../Images/LuImage";
|
|
14
|
-
import { Button } from "../../Button/Button/Button";
|
|
15
|
-
import { Body } from "../../Typography/Body/body";
|
|
16
|
-
import { Heading } from "../../Typography/Heading/heading";
|
|
17
|
-
export var MultipleNewsCard = function (props) {
|
|
18
|
-
var item = props.item, image = props.image, btnLabel = props.btnLabel, editor = props.editor, _a = props.mediaPosition, mediaPosition = _a === void 0 ? "right" : _a, orientation = props.orientation, onButtonClick = props.onButtonClick;
|
|
19
|
-
// Common card media component
|
|
20
|
-
var CardMedia = function (_a) {
|
|
21
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
22
|
-
return (_jsx(LuImage, { src: image, width: 240, height: 240, className: "object-cover w-full ".concat(className, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), alt: "Image" }));
|
|
23
|
-
};
|
|
24
|
-
// Common content section
|
|
25
|
-
var CardContent = function (_a) {
|
|
26
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
27
|
-
return (_jsxs("div", { className: "flex flex-col !gap-2 ".concat(className), children: [_jsx(Heading, { variant: "h4-600", className: "line-clamp-1 capitalize ".concat(editor === null || editor === void 0 ? void 0 : editor.cardTitle), children: item === null || item === void 0 ? void 0 : item.title }), (item === null || item === void 0 ? void 0 : item.short_description) && (_jsx(Body, { variant: "body-xl", className: "".concat(item.description ? "line-clamp-1 text-gray-900" : "line-clamp-2 text-gray-600", " ").concat(editor === null || editor === void 0 ? void 0 : editor.shortDescription), children: item === null || item === void 0 ? void 0 : item.short_description })), _jsx(Body, { variant: "body-lg", className: "text-gray-600 line-clamp-2 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), dangerouslySetInnerHTML: {
|
|
28
|
-
__html: item.description || "",
|
|
29
|
-
} })] }));
|
|
30
|
-
};
|
|
31
|
-
// Common button component with conditional shape
|
|
32
|
-
var ActionButton = function (_a) {
|
|
33
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
34
|
-
return (_jsx("div", { children: btnLabel && (_jsx(Button, __assign({ endIcon: "angle-right", size: "sm" }, (mediaPosition === "middle" && { shape: "rounded-full" }), { className: "".concat(mediaPosition === "middle" && "shadow-md !font-semibold", " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardBtn, " ").concat(className), onClick: onButtonClick, children: btnLabel }))) }));
|
|
35
|
-
};
|
|
36
|
-
// Horizontal layout
|
|
37
|
-
if (orientation === "horizontal") {
|
|
38
|
-
return (_jsxs("div", { className: "!p-5 bg-white rounded-2xl flex max-sm:flex-col ".concat(mediaPosition === "right" ? "flex-row-reverse" : "", " !gap-5 items-center shadow-lg ").concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsx(CardMedia, { className: "w-full sm:max-w-48 aspect-square rounded-lg" }), _jsxs("div", { className: "flex flex-col !gap-5 w-full", children: [_jsx(CardContent, {}), _jsx(ActionButton, {})] })] }));
|
|
39
|
-
}
|
|
40
|
-
// Vertical layout
|
|
41
|
-
return (_jsxs("div", { className: "!p-4 bg-white rounded-2xl flex flex-col !gap-5 max-w-md shadow-lg ".concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsxs("div", { className: "flex ".concat(mediaPosition === "top" ? "flex-col" : "flex-col-reverse", " !gap-4"), children: [mediaPosition === "middle" && (_jsx(Body, { variant: "body-lg", className: "text-gray-600 line-clamp-2 h-14 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), dangerouslySetInnerHTML: {
|
|
42
|
-
__html: item.description || "",
|
|
43
|
-
} })), _jsx(CardMedia, { className: "aspect-16/10" }), _jsxs("div", { className: "flex flex-col !gap-1", children: [_jsx(Heading, { variant: "h4-700", className: "line-clamp-1 capitalize ".concat(editor === null || editor === void 0 ? void 0 : editor.cardTitle), children: item === null || item === void 0 ? void 0 : item.title }), _jsx(Body, { "aria-description": "short-Description", variant: mediaPosition === "middle" ? "body-lg-500" : "body-xl", className: "".concat(item.description || mediaPosition === "middle" ? "line-clamp-1 text-gray-600" : "line-clamp-2 h-14 text-gray-600", " ").concat(editor === null || editor === void 0 ? void 0 : editor.shortDescription), children: item === null || item === void 0 ? void 0 : item.short_description }), mediaPosition !== "middle" && (_jsx(Body, { variant: "body-lg", className: "text-gray-600 line-clamp-2 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), dangerouslySetInnerHTML: {
|
|
44
|
-
__html: item.description || "",
|
|
45
|
-
} }))] })] }), _jsx(ActionButton, {})] }));
|
|
46
|
-
};
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import LuImage from "../../Images/LuImage";
|
|
3
|
-
import { Heading } from "../../Typography/Heading/heading";
|
|
4
|
-
import { Body } from "../../Typography/Body/body";
|
|
5
|
-
import { Button } from "../../Button/Button/Button";
|
|
6
|
-
export var PostByCategory = function (_a) {
|
|
7
|
-
var item = _a.item, image = _a.image, btnLabel = _a.btnLabel, onButtonClick = _a.onButtonClick, editor = _a.editor, mediaPosition = _a.mediaPosition, orientation = _a.orientation;
|
|
8
|
-
// Normalize mediaPosition based on orientation
|
|
9
|
-
var safeMediaPosition = orientation === "horizontal"
|
|
10
|
-
? mediaPosition === "left" || mediaPosition === "right"
|
|
11
|
-
? mediaPosition
|
|
12
|
-
: "right"
|
|
13
|
-
: mediaPosition === "top" || mediaPosition === "bottom"
|
|
14
|
-
? mediaPosition
|
|
15
|
-
: "top";
|
|
16
|
-
// Common card media component to avoid duplication
|
|
17
|
-
var CardMedia = function (_a) {
|
|
18
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
19
|
-
return (_jsx(LuImage, { src: image, width: 240, height: 240, className: "!rounded-lg ".concat(className, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), alt: "Image" }));
|
|
20
|
-
};
|
|
21
|
-
// Common content section component
|
|
22
|
-
var CardContent = function (_a) {
|
|
23
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
24
|
-
return (_jsxs("div", { className: "flex flex-col !gap-1 ".concat(className, " "), children: [_jsx(Heading, { variant: "h4-600", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardTitle, " capitalize line-clamp-1 !m-0"), children: item === null || item === void 0 ? void 0 : item.title }), _jsx(Body, { variant: "body-md", className: " ".concat(orientation === "horizontal" ? "line-clamp-1" : "line-clamp-2", " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardText), children: item === null || item === void 0 ? void 0 : item.description })] }));
|
|
25
|
-
};
|
|
26
|
-
// Common button component
|
|
27
|
-
var CardButton = function (_a) {
|
|
28
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
29
|
-
return (_jsx(Button, { endIcon: "angle-right", size: "sm", className: "w-fit ".concat(className, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardBtn), onClick: onButtonClick, children: btnLabel }));
|
|
30
|
-
};
|
|
31
|
-
// Horizontal layout
|
|
32
|
-
if (orientation === "horizontal") {
|
|
33
|
-
return (_jsxs("div", { className: "!p-5 rounded-xl grid grid-cols-1 sm:grid-cols-3 max-w-5xl !gap-5 items-center shadow-lg ".concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsx(CardMedia, { className: "".concat(safeMediaPosition === "right" && " order-last", " w-full aspect-5/4 sm:aspect-square object-cover") }), _jsxs("div", { className: "flex flex-col !gap-2 md:!gap-5 sm:col-span-2 h-full justify-center", children: [_jsx(CardContent, {}), _jsx(CardButton, {})] })] }));
|
|
34
|
-
}
|
|
35
|
-
// Vertical layout
|
|
36
|
-
return (_jsxs("div", { className: "!p-5 sm:p-8 rounded-xl flex flex-col !gap-5 max-w-[480px] shadow-lg ".concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsxs("div", { className: "flex w-full ".concat(safeMediaPosition === "top" ? "flex-col" : "flex-col-reverse", " items-center !gap-5 "), children: [_jsx(CardMedia, { className: "w-full h-full aspect-5/4 object-cover" }), _jsx(CardContent, { className: "h-20" })] }), _jsx(CardButton, {})] }));
|
|
37
|
-
};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import LuImage from "../../Images/LuImage";
|
|
3
|
-
import Link from "next/link";
|
|
4
|
-
import { Heading } from "../../Typography/Heading/heading";
|
|
5
|
-
import { Body } from "../../Typography/Body/body";
|
|
6
|
-
import { Button } from "../../Button/Button/Button";
|
|
7
|
-
export var SinglePost = function (_a) {
|
|
8
|
-
var item = _a.item, image = _a.image, _b = _a.href, href = _b === void 0 ? "https://www.google.com/" : _b, _c = _a.btnLabel, btnLabel = _c === void 0 ? "View More" : _c, editor = _a.editor, _d = _a.mediaPosition, mediaPosition = _d === void 0 ? "right" : _d;
|
|
9
|
-
return (_jsxs("div", { className: " bg-white rounded-3xl grid grid-cols-1 sm:grid-cols-2 overflow-hidden items-stretch shadow-lg ".concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsx(LuImage, { src: image, width: 240, height: 240, className: "w-full h-full ".concat(mediaPosition === "right" ? "order-1" : "", " aspect-5/4 object-cover ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), alt: "Image" }), _jsxs("div", { className: "p-9 grid grid-rows-[1fr] items-center !gap-2 ", children: [_jsxs("div", { className: "flex flex-col !gap-3 ", children: [_jsx(Heading, { variant: "h2-500", className: "line-clamp-1 md:line-clamp-2 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardTitle), children: item === null || item === void 0 ? void 0 : item.title }), _jsx(Body, { variant: "body-xl", className: "line-clamp-2 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText, " "), children: item === null || item === void 0 ? void 0 : item.description })] }), _jsx(Link, { href: href, passHref: true, children: _jsx(Button, { endIcon: "angle-right", size: "lg", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardBtn), children: btnLabel }) })] })] }));
|
|
10
|
-
};
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import Link from "next/link";
|
|
3
|
-
import LuImage from "../../Images/LuImage";
|
|
4
|
-
import { Heading } from "../../Typography/Heading/heading";
|
|
5
|
-
import { Body } from "../../Typography/Body/body";
|
|
6
|
-
import { Button } from "../../Button/Button/Button";
|
|
7
|
-
import LUIcon from "../../../components/Icons/LUIcon";
|
|
8
|
-
export var ContactProfile = function (_a) {
|
|
9
|
-
var item = _a.item, image = _a.image, href = _a.href, btnLabel = _a.btnLabel, editor = _a.editor, mediaPosition = _a.mediaPosition, orientation = _a.orientation;
|
|
10
|
-
// Normalize mediaPosition based on orientation
|
|
11
|
-
var safeMediaPosition = orientation === "horizontal"
|
|
12
|
-
? mediaPosition === "left" || mediaPosition === "right"
|
|
13
|
-
? mediaPosition
|
|
14
|
-
: "right"
|
|
15
|
-
: mediaPosition === "top" || mediaPosition === "bottom"
|
|
16
|
-
? mediaPosition
|
|
17
|
-
: "top";
|
|
18
|
-
// Common card media component to avoid duplication
|
|
19
|
-
var CardMedia = function (_a) {
|
|
20
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
21
|
-
return (_jsx(LuImage, { src: image, width: 240, height: 240, className: "w-full h-full rounded-full max-w-40 mx-auto aspect-square object-cover ".concat(className, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), alt: "Image" }));
|
|
22
|
-
};
|
|
23
|
-
// Common content section component
|
|
24
|
-
var CardContent = function (_a) {
|
|
25
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
26
|
-
return (_jsxs("div", { className: "flex flex-col !gap-1 ".concat(className, " min-w-0"), children: [(item === null || item === void 0 ? void 0 : item.designation) && (_jsx(Body, { variant: "body-md", className: "text-gray-600 capitalize truncate min-w-0", children: item === null || item === void 0 ? void 0 : item.designation })), _jsx(Heading, { variant: "h5-600", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardTitle, " capitalize truncate min-w-0"), children: item === null || item === void 0 ? void 0 : item.title }), _jsx(Body, { variant: "body-md", className: " ".concat(orientation === "horizontal" ? "line-clamp-1" : "line-clamp-2", " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardText), children: item === null || item === void 0 ? void 0 : item.description }), (item === null || item === void 0 ? void 0 : item.email) && (_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx(LUIcon, { icon: "envelope", size: "lg" }), _jsx(Body, { variant: "body-md", className: "text-gray-600 truncate min-w-0", children: item === null || item === void 0 ? void 0 : item.email })] })), (item === null || item === void 0 ? void 0 : item.phone) && (_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx(LUIcon, { icon: "phone", size: "lg" }), _jsx(Body, { variant: "body-md", className: "text-gray-600 truncate min-w-0", children: item === null || item === void 0 ? void 0 : item.phone })] }))] }));
|
|
27
|
-
};
|
|
28
|
-
// Common button component
|
|
29
|
-
var CardButton = function (_a) {
|
|
30
|
-
var _b = _a.className, className = _b === void 0 ? "" : _b;
|
|
31
|
-
return btnLabel ? (_jsx(Link, { href: href || "#", passHref: true, children: _jsx(Button, { endIcon: "angle-right", size: "sm", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardBtn, " ").concat(className), children: btnLabel }) })) : null;
|
|
32
|
-
};
|
|
33
|
-
// Horizontal layout
|
|
34
|
-
if (orientation === "horizontal") {
|
|
35
|
-
return (_jsxs("div", { className: "!p-5 bg-white rounded-xl flex ".concat(safeMediaPosition === "left" ? "sm:flex-row" : "sm:flex-row-reverse", " max-w-5xl !gap-5 items-center shadow-lg ").concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsx(CardMedia, { className: "".concat(safeMediaPosition === "right" ? "order-3" : "order-1", " w-full max-w-40 aspect-square object-cover") }), _jsxs("div", { className: "flex-1 flex flex-col !gap-1 md:!gap-2.5 sm:!text-left h-full justify-center min-w-0 ".concat(safeMediaPosition === "right" ? "order-1" : "order-2"), children: [_jsx(CardContent, {}), _jsx(CardButton, {})] })] }));
|
|
36
|
-
}
|
|
37
|
-
// Vertical layout
|
|
38
|
-
return (_jsxs("div", { className: "p-8 bg-white rounded-xl flex flex-col gap-6 max-w-md items-center shadow-lg ".concat(editor === null || editor === void 0 ? void 0 : editor.card), children: [_jsxs("div", { className: "flex w-full ".concat(safeMediaPosition === "top" ? "flex-col" : "flex-col-reverse", " items-center !gap-5 text-center"), children: [_jsx(CardMedia, { className: "w-full h-full aspect-5/4 object-cover" }), _jsx(CardContent, { className: "h-20" })] }), _jsx(CardButton, {})] }));
|
|
39
|
-
};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import LuImage from "../../../components/Images/LuImage";
|
|
3
|
-
import { Heading } from "../../../components/Typography/Heading/heading";
|
|
4
|
-
import LUIcon from "../../../components/Icons/LUIcon";
|
|
5
|
-
import { AvatarGroup } from "../../Avatar/AvatarGroup/AvatarGroup";
|
|
6
|
-
export var PhotoAlbum = function (_a) {
|
|
7
|
-
var image = _a.image, item = _a.item, _b = _a.altText, altText = _b === void 0 ? "Photo Album" : _b, editor = _a.editor, _c = _a.theme, theme = _c === void 0 ? "theme1" : _c;
|
|
8
|
-
var hasImages = Array.isArray(item === null || item === void 0 ? void 0 : item.images) && item.images.length > 0;
|
|
9
|
-
return (_jsxs("div", { className: "group relative max-w-md cursor-pointer ".concat(editor === null || editor === void 0 ? void 0 : editor.card, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), children: [_jsx(LuImage, { src: image, width: 448, height: 448, alt: altText, className: "aspect-square object-cover transition-transform" }), _jsx("div", { className: "absolute inset-0 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardOverlay, " bg-linear-to-t from-black to-transparent") }), theme === "theme2" ? (_jsxs("div", { className: "absolute bottom-0 right-0 w-full bg-black/75 !px-5 !py-3 flex items-center justify-between duration-300\n group-hover:bg-transparent", children: [_jsx(Heading, { variant: "h4-700", className: "line-clamp-1 text-white uppercase ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), children: item === null || item === void 0 ? void 0 : item.title }), hasImages && (_jsx("div", { children: _jsx(AvatarGroup, { images: ((item === null || item === void 0 ? void 0 : item.images) || []).map(function (img) { return ({
|
|
10
|
-
id: img.gallery_id,
|
|
11
|
-
image: img.gallery_image,
|
|
12
|
-
}); }) }) }))] })) : (_jsxs(_Fragment, { children: [hasImages && (_jsx("div", { className: "absolute top-0 right-0 !px-5 !py-3", children: _jsx(AvatarGroup, { images: ((item === null || item === void 0 ? void 0 : item.images) || []).map(function (img) { return ({
|
|
13
|
-
id: img.gallery_id,
|
|
14
|
-
image: img.gallery_image,
|
|
15
|
-
}); }) }) })), _jsx("div", { className: "absolute !px-5 !py-3 bottom-0", children: _jsx(Heading, { variant: "h4-700", className: "line-clamp-1 text-white uppercase ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), children: item === null || item === void 0 ? void 0 : item.title }) })] })), _jsx("div", { className: "absolute inset-0 flex items-center justify-center opacity-0 group-hover:!opacity-100 duration-300 ease-out ".concat(theme === "theme2" ? "bg-black/75 origin-bottom scale-y-0 transition-all group-hover:scale-y-100" : "bg-black/30"), children: _jsx(LUIcon, { icon: "magnifying-glass", size: "4xl", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardText, " text-gray-100") }) })] }));
|
|
16
|
-
};
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import LuImage from "../../../components/Images/LuImage";
|
|
3
|
-
import { Heading } from "../../../components/Typography/Heading/heading";
|
|
4
|
-
import LUIcon from "../../../components/Icons/LUIcon";
|
|
5
|
-
export var PhotoGallery = function (_a) {
|
|
6
|
-
var image = _a.image, item = _a.item, _b = _a.altText, altText = _b === void 0 ? "Photo Gallery" : _b, editor = _a.editor;
|
|
7
|
-
return (_jsxs("div", { className: "group relative max-w-md cursor-pointer ".concat(editor === null || editor === void 0 ? void 0 : editor.card, " ").concat(editor === null || editor === void 0 ? void 0 : editor.cardImage), children: [_jsx(LuImage, { src: image, width: 448, height: 448, alt: altText, className: "aspect-square object-cover transition-transform" }), _jsx("div", { className: "absolute ".concat(editor === null || editor === void 0 ? void 0 : editor.cardOverlay, " inset-0 bg-linear-to-t from-black to-transparent") }), _jsx(Heading, { variant: "h4-700", className: "absolute line-clamp-1 text-white bottom-4 uppercase !px-5 ".concat(editor === null || editor === void 0 ? void 0 : editor.cardText), children: item === null || item === void 0 ? void 0 : item.title }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-black/30 opacity-0 group-hover:!opacity-100 transition-opacity duration-300 ease-out", children: _jsx(LUIcon, { icon: "magnifying-glass", size: "4xl", className: "".concat(editor === null || editor === void 0 ? void 0 : editor.cardText, " text-gray-100") }) })] }));
|
|
8
|
-
};
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { Checkbox, checkboxSize } from "./checkbox";
|
|
14
|
-
import { Label } from "../Label/Label";
|
|
15
|
-
import { Button } from "../Button/Button/Button";
|
|
16
|
-
var meta = {
|
|
17
|
-
title: "components/Checkbox",
|
|
18
|
-
component: Checkbox,
|
|
19
|
-
parameters: {
|
|
20
|
-
layout: "centered",
|
|
21
|
-
},
|
|
22
|
-
tags: ["autodocs"],
|
|
23
|
-
argTypes: {
|
|
24
|
-
checked: { control: "boolean" },
|
|
25
|
-
defaultChecked: { control: "boolean" },
|
|
26
|
-
disabled: { control: "boolean" },
|
|
27
|
-
onCheckedChange: { action: "checked changed" },
|
|
28
|
-
size: {
|
|
29
|
-
control: { type: "select" },
|
|
30
|
-
options: Object.keys(checkboxSize),
|
|
31
|
-
description: "Checkbox size",
|
|
32
|
-
table: {
|
|
33
|
-
defaultValue: { summary: "md" },
|
|
34
|
-
type: { summary: Object.keys(checkboxSize).join(" | ") },
|
|
35
|
-
},
|
|
36
|
-
},
|
|
37
|
-
},
|
|
38
|
-
};
|
|
39
|
-
export default meta;
|
|
40
|
-
export var Default = {
|
|
41
|
-
args: {
|
|
42
|
-
id: "default",
|
|
43
|
-
},
|
|
44
|
-
render: function (args) { return (_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, __assign({}, args)), _jsx(Label, { htmlFor: "default", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "Accept terms and conditions" })] })); },
|
|
45
|
-
};
|
|
46
|
-
export var Checked = {
|
|
47
|
-
args: {
|
|
48
|
-
id: "checked",
|
|
49
|
-
defaultChecked: true,
|
|
50
|
-
},
|
|
51
|
-
render: function (args) { return (_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, __assign({}, args)), _jsx(Label, { htmlFor: "checked", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "Checked option" })] })); },
|
|
52
|
-
};
|
|
53
|
-
export var Disabled = {
|
|
54
|
-
args: {
|
|
55
|
-
id: "disabled",
|
|
56
|
-
disabled: true,
|
|
57
|
-
},
|
|
58
|
-
render: function (args) { return (_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, __assign({}, args)), _jsx(Label, { htmlFor: "disabled", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "Disabled option" })] })); },
|
|
59
|
-
};
|
|
60
|
-
export var DisabledChecked = {
|
|
61
|
-
args: {
|
|
62
|
-
id: "disabled-checked",
|
|
63
|
-
disabled: true,
|
|
64
|
-
defaultChecked: true,
|
|
65
|
-
},
|
|
66
|
-
render: function (args) { return (_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, __assign({}, args)), _jsx(Label, { htmlFor: "disabled-checked", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "Disabled checked option" })] })); },
|
|
67
|
-
};
|
|
68
|
-
export var Form = {
|
|
69
|
-
render: function () { return (_jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-lg font-medium", children: "Terms of Service" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Please read and accept our terms of service to continue." }), _jsxs("form", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, { id: "terms1" }), _jsx("label", { htmlFor: "terms1", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "I accept the terms and conditions" })] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, { id: "terms2" }), _jsx(Label, { htmlFor: "terms2", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "I agree to receive marketing emails" })] }), _jsx(Button, { type: "submit", className: "mt-4 rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700", children: "Submit" })] })] })); },
|
|
70
|
-
};
|
|
71
|
-
export var WithAlert = {
|
|
72
|
-
args: {
|
|
73
|
-
id: "alert-checkbox",
|
|
74
|
-
},
|
|
75
|
-
render: function (args) { return (_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Checkbox, __assign({}, args, { onCheckedChange: function (checked) {
|
|
76
|
-
window.alert("Checkbox is now ".concat(checked ? "checked" : "unchecked"));
|
|
77
|
-
} })), _jsx(Label, { htmlFor: "alert-checkbox", className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: "Click to show alert" })] })); },
|
|
78
|
-
};
|