@bethinkpl/design-system 25.0.10 → 26.0.1
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/.github/workflows/build-to-review-on-trigger.yml +17 -0
- package/.github/workflows/storybook.yml +1 -0
- package/.storybook/main.ts +42 -0
- package/.storybook/{manager.js → manager.ts} +1 -1
- package/.storybook/preview-head.html +1 -0
- package/.storybook/preview.scss +3 -0
- package/.storybook/{preview.js → preview.ts} +11 -18
- package/.storybook/scss-preview-styles-plugin.ts +43 -0
- package/{lib/styles → .storybook}/storybook.scss +10 -10
- package/deploy_storybook_to_s3.sh +16 -1
- package/dist/design-system.umd.cjs +1032 -0
- package/dist/design-system.umd.cjs.map +1 -0
- package/dist/lib/js/components/BadgeScore/BadgeScore.vue.d.ts +33 -65
- package/dist/lib/js/components/BadgeScore/index.d.ts +2 -1
- package/dist/lib/js/components/Banner/Banner.vue.d.ts +265 -311
- package/dist/lib/js/components/Banner/index.d.ts +2 -1
- package/dist/lib/js/components/Buttons/Button/Button.vue.d.ts +258 -305
- package/dist/lib/js/components/Buttons/Button/index.d.ts +2 -1
- package/dist/lib/js/components/Buttons/IconButton/IconButton.vue.d.ts +274 -320
- package/dist/lib/js/components/Buttons/IconButton/index.d.ts +2 -1
- package/dist/lib/js/components/Cards/Card/Card.consts.d.ts +1 -0
- package/dist/lib/js/components/Cards/Card/Card.vue.d.ts +92 -2
- package/dist/lib/js/components/Cards/Card/index.d.ts +2 -1
- package/dist/lib/js/components/Cards/CardExpandable/CardExpandable.vue.d.ts +274 -258
- package/dist/lib/js/components/Cards/CardExpandable/index.d.ts +2 -1
- package/dist/lib/js/components/Chip/Chip.vue.d.ts +259 -306
- package/dist/lib/js/components/Chip/index.d.ts +2 -1
- package/dist/lib/js/components/DatePickers/DatePicker/DatePicker.consts.d.ts +1 -0
- package/dist/lib/js/components/DatePickers/DatePicker/DatePicker.vue.d.ts +1 -106
- package/dist/lib/js/components/DatePickers/DatePicker/index.d.ts +2 -1
- package/dist/lib/js/components/DatePickers/DatePickerBox/DatePickerBox.vue.d.ts +1 -274
- package/dist/lib/js/components/DatePickers/DatePickerBox/index.d.ts +2 -1
- package/dist/lib/js/components/Divider/Divider.vue.d.ts +40 -26
- package/dist/lib/js/components/Divider/index.d.ts +2 -1
- package/dist/lib/js/components/Drawer/Drawer.vue.d.ts +34 -19
- package/dist/lib/js/components/Drawer/DrawerContent/DrawerContent.vue.d.ts +1 -3
- package/dist/lib/js/components/Drawer/DrawerDivider/DrawerDivider.vue.d.ts +24 -17
- package/dist/lib/js/components/Drawer/DrawerHeader/DrawerHeader.vue.d.ts +2 -3
- package/dist/lib/js/components/Drawer/DrawerListItem/DrawerListItem.vue.d.ts +226 -3
- package/dist/lib/js/components/Drawer/DrawerListItemGroup/DrawerListItemGroup.vue.d.ts +1 -3
- package/dist/lib/js/components/Drawer/DrawerSection/DrawerSection.vue.d.ts +236 -302
- package/dist/lib/js/components/Drawer/DrawerTile/DrawerTile.vue.d.ts +129 -66
- package/dist/lib/js/components/Drawer/index.d.ts +2 -1
- package/dist/lib/js/components/Dropdown/Dropdown.vue.d.ts +2 -66
- package/dist/lib/js/components/Dropdown/index.d.ts +2 -1
- package/dist/lib/js/components/Form/Checkbox/Checkbox.vue.d.ts +219 -239
- package/dist/lib/js/components/Form/RadioButton/RadioButton.vue.d.ts +219 -239
- package/dist/lib/js/components/Form/SelectionControl/SelectionControl.sb.shared.d.ts +2 -1
- package/dist/lib/js/components/Form/SelectionControl/SelectionControl.vue.d.ts +29 -66
- package/dist/lib/js/components/Headers/OverlayHeader/OverlayHeader.vue.d.ts +274 -316
- package/dist/lib/js/components/Headers/OverlayHeader/index.d.ts +2 -1
- package/dist/lib/js/components/Headers/PageHeader/PageHeader.vue.d.ts +12 -32
- package/dist/lib/js/components/Headers/PageHeader/index.d.ts +2 -1
- package/dist/lib/js/components/Headers/SectionHeader/SectionHeader.consts.d.ts +1 -0
- package/dist/lib/js/components/Headers/SectionHeader/SectionHeader.vue.d.ts +255 -333
- package/dist/lib/js/components/Headers/SectionHeader/index.d.ts +2 -1
- package/dist/lib/js/components/IconText/IconText.vue.d.ts +1 -71
- package/dist/lib/js/components/IconText/index.d.ts +2 -1
- package/dist/lib/js/components/Icons/FeatureIcon/FeatureIcon.vue.d.ts +25 -48
- package/dist/lib/js/components/Icons/FeatureIcon/index.d.ts +2 -1
- package/dist/lib/js/components/Icons/Icon/Icon.consts.d.ts +195 -194
- package/dist/lib/js/components/Icons/Icon/Icon.vue.d.ts +76 -44
- package/dist/lib/js/components/Icons/Icon/index.d.ts +2 -1
- package/dist/lib/js/components/Image/Image.vue.d.ts +3 -11
- package/dist/lib/js/components/Image/index.d.ts +2 -1
- package/dist/lib/js/components/Layouts/ThreeColumnLayout/ThreeColumnLayout.vue.d.ts +16 -46
- package/dist/lib/js/components/Layouts/ThreeColumnLayout/index.d.ts +2 -1
- package/dist/lib/js/components/LoadingBar/LoadingBar.consts.d.ts +1 -0
- package/dist/lib/js/components/LoadingBar/LoadingBar.vue.d.ts +37 -26
- package/dist/lib/js/components/LoadingBar/index.d.ts +2 -1
- package/dist/lib/js/components/Modal/Modal.vue.d.ts +235 -230
- package/dist/lib/js/components/Modal/index.d.ts +2 -1
- package/dist/lib/js/components/Modals/Modal/Modal.vue.d.ts +275 -362
- package/dist/lib/js/components/Modals/Modal/index.d.ts +2 -1
- package/dist/lib/js/components/Modals/ModalDialog/ModalDialog.vue.d.ts +20 -74
- package/dist/lib/js/components/Modals/ModalDialog/index.d.ts +2 -1
- package/dist/lib/js/components/NumberInCircle/index.d.ts +2 -1
- package/dist/lib/js/components/Outline/OutlineDivider/OutlineDivider.vue.d.ts +24 -17
- package/dist/lib/js/components/Outline/OutlineDivider/index.d.ts +2 -1
- package/dist/lib/js/components/Outline/OutlineItem/OutlineItem.vue.d.ts +231 -297
- package/dist/lib/js/components/Outline/OutlineItem/index.d.ts +2 -1
- package/dist/lib/js/components/Outline/OutlineSectionHeader/OutlineSectionHeader.vue.d.ts +10 -8
- package/dist/lib/js/components/Outline/OutlineSectionHeader/index.d.ts +2 -1
- package/dist/lib/js/components/Pagination/Pagination.vue.d.ts +259 -288
- package/dist/lib/js/components/Pagination/index.d.ts +2 -1
- package/dist/lib/js/components/PopOver/index.d.ts +2 -1
- package/dist/lib/js/components/ProgressBar/ProgressBar.vue.d.ts +1 -301
- package/dist/lib/js/components/ProgressBar/index.d.ts +2 -1
- package/dist/lib/js/components/ProgressDonutChart/ProgressDonutChart.vue.d.ts +1 -253
- package/dist/lib/js/components/ProgressDonutChart/index.d.ts +2 -1
- package/dist/lib/js/components/RichList/BasicRichListItem/BasicRichListItem.vue.d.ts +21 -135
- package/dist/lib/js/components/RichList/BasicRichListItem/index.d.ts +2 -1
- package/dist/lib/js/components/RichList/GroupRichListItem/GroupRichListItem.consts.d.ts +1 -0
- package/dist/lib/js/components/RichList/GroupRichListItem/GroupRichListItem.vue.d.ts +51 -30
- package/dist/lib/js/components/RichList/GroupRichListItem/index.d.ts +2 -1
- package/dist/lib/js/components/RichList/RichListItem/RichListItem.consts.d.ts +2 -0
- package/dist/lib/js/components/RichList/RichListItem/RichListItem.vue.d.ts +254 -344
- package/dist/lib/js/components/RichList/RichListItem/index.d.ts +2 -1
- package/dist/lib/js/components/SectionTitle/SectionTitle.vue.d.ts +32 -2
- package/dist/lib/js/components/SelectList/SelectList.vue.d.ts +2 -3
- package/dist/lib/js/components/SelectList/SelectListItem/SelectListItem.vue.d.ts +234 -3
- package/dist/lib/js/components/SelectList/SelectListItemDivider/SelectListItemDivider.vue.d.ts +1 -7
- package/dist/lib/js/components/SelectList/SelectListItemTile/SelectListItemTile.vue.d.ts +127 -65
- package/dist/lib/js/components/SelectList/SelectListItemToggle/SelectListItemToggle.vue.d.ts +21 -56
- package/dist/lib/js/components/SelectList/SelectListSectionTitle/SelectListSectionTitle.vue.d.ts +21 -13
- package/dist/lib/js/components/SelectionTile/SelectionTile.vue.d.ts +197 -197
- package/dist/lib/js/components/SelectionTile/index.d.ts +2 -1
- package/dist/lib/js/components/Skeleton/Skeleton.vue.d.ts +42 -2
- package/dist/lib/js/components/Skeleton/index.d.ts +2 -1
- package/dist/lib/js/components/Statuses/AccessStatus/AccessStatus.vue.d.ts +227 -231
- package/dist/lib/js/components/Statuses/AccessStatus/index.d.ts +2 -1
- package/dist/lib/js/components/Statuses/BlockadeStatus/BlockadeStatus.vue.d.ts +227 -231
- package/dist/lib/js/components/Statuses/BlockadeStatus/index.d.ts +2 -1
- package/dist/lib/js/components/SurveyQuestions/SurveyQuestionOpenEnded/SurveyQuestionOpenEnded.vue.d.ts +246 -3
- package/dist/lib/js/components/SurveyQuestions/SurveyQuestionOpenEnded/index.d.ts +2 -1
- package/dist/lib/js/components/SurveyQuestions/SurveyQuestionScale/SurveyQuestionScale.vue.d.ts +2 -3
- package/dist/lib/js/components/SurveyQuestions/SurveyQuestionScale/index.d.ts +2 -1
- package/dist/lib/js/components/SurveyQuestions/SurveyQuestionTextarea.vue.d.ts +31 -21
- package/dist/lib/js/components/SurveyQuestions/index.d.ts +2 -1
- package/dist/lib/js/components/SurveyToggle/SurveyToggle.vue.d.ts +39 -3
- package/dist/lib/js/components/SurveyToggle/index.d.ts +2 -1
- package/dist/lib/js/components/Switch/Switch.consts.d.ts +1 -0
- package/dist/lib/js/components/Switch/Switch.vue.d.ts +246 -296
- package/dist/lib/js/components/Switch/index.d.ts +2 -1
- package/dist/lib/js/components/TabItem/TabItem.vue.d.ts +1 -47
- package/dist/lib/js/components/TabItem/index.d.ts +2 -1
- package/dist/lib/js/components/TextGroup/TextGroup.vue.d.ts +7 -6
- package/dist/lib/js/components/TextGroup/index.d.ts +2 -1
- package/dist/lib/js/components/Tile/Tile.consts.d.ts +1 -0
- package/dist/lib/js/components/Tile/Tile.sb.shared.d.ts +195 -194
- package/dist/lib/js/components/Tile/Tile.shared.d.ts +1 -0
- package/dist/lib/js/components/Tile/Tile.vue.d.ts +342 -282
- package/dist/lib/js/components/Tile/index.d.ts +2 -1
- package/dist/lib/js/components/Toast/Toast.consts.d.ts +1 -0
- package/dist/lib/js/components/Toggles/CounterToggle/CounterToggle.vue.d.ts +21 -47
- package/dist/lib/js/components/Toggles/CounterToggle/index.d.ts +2 -1
- package/dist/lib/js/components/Toggles/ToggleButton/ToggleButton.consts.d.ts +1 -0
- package/dist/lib/js/components/Toggles/ToggleButton/ToggleButton.vue.d.ts +242 -301
- package/dist/lib/js/components/Toggles/ToggleButton/index.d.ts +2 -1
- package/dist/lib/js/components/Tooltip/Tooltip.vue.d.ts +4 -5
- package/dist/lib/js/components/Tooltip/index.d.ts +2 -1
- package/dist/lib/js/components/Well/index.d.ts +2 -1
- package/dist/lib/js/composables/hover-state.d.ts +11 -0
- package/dist/lib/js/icons/fontawesome.d.ts +195 -195
- package/dist/lib/js/index.d.ts +2 -1
- package/dist/lib/js/styles/TokenTypes.d.ts +1 -0
- package/dist/lib/js/utils/device.d.ts +1 -0
- package/docs/.nojekyll +0 -0
- package/docs/assets/AccessStatus-DVtD0BrS.js +1 -0
- package/docs/assets/AccessStatus.stories-CM9qms_d.js +9 -0
- package/docs/assets/BadgeScore-B0MHArlW.js +1 -0
- package/docs/assets/BadgeScore.stories-BsFc_8XV.js +40 -0
- package/docs/assets/Banner-Dkt_I8P3.js +1 -0
- package/docs/assets/Banner.stories-dLLxP9rS.js +62 -0
- package/docs/assets/BasicRichListItem-CCXQ4iJg.js +1 -0
- package/docs/assets/BasicRichListItem.stories-Bh_UBJkl.js +194 -0
- package/docs/assets/BlockadeStatus-9_pI8WM1.js +1 -0
- package/docs/assets/BlockedeStatus.stories-IunhqK0I.js +9 -0
- package/docs/assets/BorderSizes.stories-COOhe637.js +31 -0
- package/docs/assets/Button-CBZkgukP.js +1 -0
- package/docs/assets/Button.stories-BLj-_0Vw.js +47 -0
- package/docs/assets/Card-B7j8o0GU.js +1 -0
- package/docs/assets/Card.stories-KO99dol6.js +49 -0
- package/docs/assets/CardExpandable-XN3wcRwV.js +1 -0
- package/docs/assets/CardExpandable.stories-B9-JtWRG.js +37 -0
- package/docs/assets/Checkbox-D_geau8n.js +1 -0
- package/docs/assets/Checkbox.stories-DLfdA87Q.js +21 -0
- package/docs/assets/Chip-CBqrZ-va.js +1 -0
- package/docs/assets/Chip.stories-DQLbtbRo.js +43 -0
- package/docs/assets/Color-ERTF36HU-B622yQt4.js +1 -0
- package/docs/assets/Colors.stories-CRIOJbgv.js +11 -0
- package/docs/assets/ColorsThemes.stories-BVtVblv7.js +11 -0
- package/docs/assets/ColorsTokensLms.stories-Ds9sWwL0.js +11 -0
- package/docs/assets/ColorsTokensPrimaryBodywork.stories-D9nLEENe.js +11 -0
- package/docs/assets/ColorsTokensPrimaryWnl.stories-Cuz6HvAj.js +11 -0
- package/docs/assets/CounterToggle-BzxnFqH7.js +1 -0
- package/docs/assets/CounterToggle.stories-DdAjSFMr.js +19 -0
- package/docs/assets/DatePicker-CvT_E45n.js +2 -0
- package/docs/assets/DatePicker.stories-Ub_1x6To.js +91 -0
- package/docs/assets/Divider-D2yDhW46.js +1 -0
- package/docs/assets/Divider.stories-f9QUckyE.js +15 -0
- package/docs/assets/DocsRenderer-CFRXHY34-D5Eulb6H.js +639 -0
- package/docs/assets/Drawer-CH5Qyc5B.js +1 -0
- package/docs/assets/Drawer.stories-jrbLBaPT.js +21 -0
- package/docs/assets/DrawerContent-DGzdUSmd.js +1 -0
- package/docs/assets/DrawerContent.stories-CYzQPPIy.js +17 -0
- package/docs/assets/DrawerDivider-DNbYnPjf.js +1 -0
- package/docs/assets/DrawerDivider.stories-BG6MKk49.js +15 -0
- package/docs/assets/DrawerHeader-DOWojdwp.js +1 -0
- package/docs/assets/DrawerHeader.stories-CwaoQykQ.js +54 -0
- package/docs/assets/DrawerListItem-aepUTcTm.js +1 -0
- package/docs/assets/DrawerListItem.stories-vHXkwtyS.js +13 -0
- package/docs/assets/DrawerListItemGroup-CnH532Dv.js +1 -0
- package/docs/assets/DrawerListItemGroup.stories-D0DeZ6IG.js +20 -0
- package/docs/assets/DrawerSection-pMhA5dsS.js +1 -0
- package/docs/assets/DrawerSection.stories-BF7A4VyW.js +67 -0
- package/docs/assets/DrawerTile-W2mt6fAk.js +1 -0
- package/docs/assets/DrawerTile.stories-CUMznN1H.js +10 -0
- package/docs/assets/Dropdown-BfX0EVaK.js +1 -0
- package/docs/assets/Dropdown.stories-DrILA_TR.js +45 -0
- package/docs/assets/FeatureIcon-n65RPvyA.js +1 -0
- package/docs/assets/FeatureIcon.stories-DSUzxIPB.js +14 -0
- package/docs/assets/GroupRichListItem-DMiaeyaS.js +1 -0
- package/docs/assets/GroupRichListItem.stories-DCEq0Kil.js +137 -0
- package/docs/assets/Icon-BiVaixmr.js +762 -0
- package/docs/assets/Icon.stories-BFJuE2aE.js +27 -0
- package/docs/assets/IconButton-COzU-vlz.js +1 -0
- package/docs/assets/IconButton.stories-DGmn7bfg.js +119 -0
- package/docs/assets/IconText-DDrVXWHS.js +1 -0
- package/docs/assets/IconText.stories-CSt7q9Mf.js +32 -0
- package/docs/assets/Image-Drmyqqsn.js +1 -0
- package/docs/assets/Image.stories-DxQ22AFP.js +21 -0
- package/docs/assets/ItemsList-B-vw083o.js +1 -0
- package/docs/assets/LoadingBar-D0iVLCyJ.js +1 -0
- package/docs/assets/LoadingBar.stories-IJRD91mF.js +9 -0
- package/docs/assets/Modal-CJ0d6Je9.js +1 -0
- package/docs/assets/Modal.stories-q_qdiakg.js +53 -0
- package/docs/assets/ModalDialog-CbDAxfV_.js +1 -0
- package/docs/assets/ModalDialog.stories-CKcR8rIW.js +43 -0
- package/docs/assets/NumberInCircle-DV0Qrx8H.js +1 -0
- package/docs/assets/NumberInCircle.stories-DriLGDDl.js +9 -0
- package/docs/assets/OutlineDivider-Cez9NlcH.js +1 -0
- package/docs/assets/OutlineDivider.stories-D0zYoHBw.js +11 -0
- package/docs/assets/OutlineItem-CUHef8Bo.js +1 -0
- package/docs/assets/OutlineItem.stories-BgFzRhaY.js +41 -0
- package/docs/assets/OutlineSectionHeader-DSJ4uxfr.js +1 -0
- package/docs/assets/OutlineSectionHeader.stories-HOf2NwY-.js +9 -0
- package/docs/assets/OverlayHeader-jylszhPO.js +1 -0
- package/docs/assets/OverlayHeader.stories-bjFfL93l.js +67 -0
- package/docs/assets/PageHeader-CTbdU4IG.js +1 -0
- package/docs/assets/PageHeader.stories-DeNf1zoa.js +9 -0
- package/docs/assets/Pagination-dSOJSh7t.js +1 -0
- package/docs/assets/Pagination.stories-CMg8WaRV.js +31 -0
- package/docs/assets/PopOver-BPD1Ttq1.js +1 -0
- package/docs/assets/PopOver.stories-Cl1k59cl.js +15 -0
- package/docs/assets/ProgressBar-4gBRbr7a.js +1 -0
- package/docs/assets/ProgressBar.stories-9xVTh0RH.js +57 -0
- package/docs/assets/ProgressDonutChart-D5uvUZva.js +1 -0
- package/docs/assets/ProgressDonutChart.stories-DBpwl5Vn.js +17 -0
- package/docs/assets/RadioButton-BwCzYjOu.js +1 -0
- package/docs/assets/RadioButton.stories-CLWvDUrd.js +21 -0
- package/docs/assets/RichListItem.stories-DhkQky0J.js +182 -0
- package/docs/assets/SectionHeader-DVwe52kA.js +1 -0
- package/docs/assets/SectionHeader.stories-Dd3li5ER.js +24 -0
- package/docs/assets/SectionTitle-XTc-98O5.js +1 -0
- package/docs/assets/SectionTitle.stories-BFNagAeb.js +9 -0
- package/docs/assets/SelectList-CTXM5G8Z.js +1 -0
- package/docs/assets/SelectList.stories-B2Pq8auf.js +91 -0
- package/docs/assets/SelectListItem-_c4CA-YM.js +1 -0
- package/docs/assets/SelectListItem.stories-PSDnI18x.js +36 -0
- package/docs/assets/SelectListItemDivider-BOgD7wrO.js +1 -0
- package/docs/assets/SelectListItemDivider.stories-DvANKn2s.js +8 -0
- package/docs/assets/SelectListItemTile-BL3qYL_0.js +1 -0
- package/docs/assets/SelectListItemTile.stories-CVYmG0Ta.js +19 -0
- package/docs/assets/SelectListItemToggle-BjjMPWy0.js +1 -0
- package/docs/assets/SelectListItemToggle.stories-D5QL3Gd2.js +51 -0
- package/docs/assets/SelectListSectionTitle-FihJb1eM.js +1 -0
- package/docs/assets/SelectListSectionTitle.stories-DCyB86A1.js +16 -0
- package/docs/assets/SelectionControl-BxCh7N21.js +1 -0
- package/docs/assets/SelectionControl.sb.shared-BWifjoMU.js +2 -0
- package/docs/assets/SelectionTile-T03MPtEm.js +2 -0
- package/docs/assets/SelectionTile.stories-CEufLR64.js +47 -0
- package/docs/assets/Skeleton-BbafKE6W.js +179 -0
- package/docs/assets/Skeleton.stories-B_4TqUB5.js +15 -0
- package/docs/assets/Spacings.stories-DxxukMX7.js +43 -0
- package/docs/assets/SurveyQuestionOpenEnded-DRFBouQB.js +1 -0
- package/docs/assets/SurveyQuestionOpenEnded.stories-DW7tQU04.js +20 -0
- package/docs/assets/SurveyQuestionScale-nNC7H5k0.js +1 -0
- package/docs/assets/SurveyQuestionScale.stories-DC8qXbl8.js +72 -0
- package/docs/assets/SurveyToggle-DzZyc41b.js +1 -0
- package/docs/assets/SurveyToggle.stories-Yf0fJ_p2.js +14 -0
- package/docs/assets/Switch-BWGPo7tP.js +1 -0
- package/docs/assets/Switch.stories-BzeYFsr2.js +48 -0
- package/docs/assets/TabItem-Cx2nQ_YR.js +1 -0
- package/docs/assets/TabItem.stories-C-gV8JMj.js +15 -0
- package/docs/assets/TextGroup-DQmg5luv.js +1 -0
- package/docs/assets/TextGroup.stories-j5MNzn7U.js +48 -0
- package/docs/assets/ThreeColumnLayout-Lm3LIbid.js +1 -0
- package/docs/assets/ThreeColumnLayout.stories-C5cNwOWv.js +47 -0
- package/docs/assets/Tile-DnH9h0Kq.js +1 -0
- package/docs/assets/Tile.sb.shared-2W1FnncR.js +15 -0
- package/docs/assets/Tile.stories-Bj7yp21N.js +14 -0
- package/docs/assets/Toast.stories-Bad7itWi.js +58 -0
- package/docs/assets/ToggleButton-BZ0tVYFv.js +1 -0
- package/docs/assets/ToggleButton.stories-D0YPR0-y.js +42 -0
- package/docs/assets/Tooltip-BxZlo6cR.js +1 -0
- package/docs/assets/Tooltip.stories-CaTsoTim.js +119 -0
- package/docs/assets/TypographyTokensLms.stories-D-CrlX5A.js +11 -0
- package/docs/assets/TypographyVariables.stories-Bmxi44f1.js +11 -0
- package/docs/assets/Well-vFI2CbIA.js +1 -0
- package/docs/assets/Well.stories-Be73GX2h.js +6 -0
- package/docs/assets/_commonjsHelpers-Chg3vePA.js +1 -0
- package/docs/assets/_plugin-vue_export-helper-DlAUqK2U.js +1 -0
- package/docs/assets/decorator-CSnIf-k5.js +1 -0
- package/docs/assets/device-9fgosCm4.js +1 -0
- package/docs/assets/entry-preview-Dw8qwUcN.js +1 -0
- package/docs/assets/entry-preview-docs-BBVW7MF3.js +16 -0
- package/docs/assets/iframe-BosoHOVU.js +63 -0
- package/docs/assets/index-CBmJdl9t.js +5 -0
- package/docs/assets/index-CgF2Ctku.js +1 -0
- package/docs/assets/index-CqU62QSU.js +1 -0
- package/docs/assets/index-vG0co4wr.js +8 -0
- package/docs/assets/pl-Cy1N1vsP.js +1 -0
- package/docs/assets/preview-16ImHjAt.js +64 -0
- package/docs/assets/preview-B_ruAZiw.js +2 -0
- package/docs/assets/preview-DFmD0pui.js +1 -0
- package/docs/assets/preview-DFphXfmq.js +1 -0
- package/docs/assets/string-CxIy_vwz.js +1 -0
- package/docs/assets/user-DY5hg_iu.js +1 -0
- package/docs/assets/v4-BZawosSj.js +1 -0
- package/docs/assets/vue-popper-BJbr8Gin.js +24 -0
- package/docs/assets/vue.esm-bundler-BSCmGRHc.js +7 -0
- package/docs/favicon.svg +1 -0
- package/docs/iframe.html +332 -56
- package/docs/index.html +157 -51
- package/docs/index.json +1 -0
- package/docs/nunito-sans-bold-italic.woff2 +0 -0
- package/docs/nunito-sans-bold.woff2 +0 -0
- package/docs/nunito-sans-italic.woff2 +0 -0
- package/docs/nunito-sans-regular.woff2 +0 -0
- package/docs/preview.css +2993 -0
- package/docs/project.json +1 -1
- package/docs/sb-addons/actions-1/manager-bundle.js +3 -0
- package/docs/sb-addons/actions-1/manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-addons/controls-3/manager-bundle.js +394 -0
- package/docs/sb-addons/controls-3/manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-addons/designs-2/register-panel-bundle.js +665 -0
- package/docs/sb-addons/designs-2/register-panel-bundle.js.LEGAL.txt +127 -0
- package/docs/sb-addons/storybook-6/manager-bundle.js +3 -0
- package/docs/sb-addons/storybook-6/manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js +3 -0
- package/docs/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-addons/storysource-4/manager-bundle.js +3 -0
- package/docs/sb-addons/storysource-4/manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-addons/viewport-5/manager-bundle.js +3 -0
- package/docs/sb-addons/viewport-5/manager-bundle.js.LEGAL.txt +0 -0
- package/docs/sb-common-assets/favicon.svg +1 -0
- package/docs/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
- package/docs/sb-common-assets/nunito-sans-bold.woff2 +0 -0
- package/docs/sb-common-assets/nunito-sans-italic.woff2 +0 -0
- package/docs/sb-common-assets/nunito-sans-regular.woff2 +0 -0
- package/docs/sb-manager/globals-module-info.js +1006 -0
- package/docs/sb-manager/globals-runtime.js +54400 -0
- package/docs/sb-manager/globals.js +48 -0
- package/docs/sb-manager/runtime.js +12089 -0
- package/docs/sb-preview/globals.js +33 -0
- package/docs/sb-preview/runtime.js +9498 -0
- package/jest.config.js +14 -11
- package/lib/js/components/BadgeScore/BadgeScore.stories.ts +13 -10
- package/lib/js/components/BadgeScore/BadgeScore.vue +5 -5
- package/lib/js/components/Banner/Banner.stories.ts +58 -55
- package/lib/js/components/Banner/Banner.vue +3 -3
- package/lib/js/components/Buttons/Button/Button.stories.ts +31 -21
- package/lib/js/components/Buttons/Button/Button.vue +4 -6
- package/lib/js/components/Buttons/IconButton/IconButton.stories.ts +37 -34
- package/lib/js/components/Buttons/IconButton/IconButton.vue +14 -7
- package/lib/js/components/Cards/Card/Card.stories.ts +17 -14
- package/lib/js/components/Cards/Card/Card.vue +4 -3
- package/lib/js/components/Cards/CardExpandable/CardExpandable.stories.ts +8 -7
- package/lib/js/components/Cards/CardExpandable/CardExpandable.vue +3 -2
- package/lib/js/components/Chip/Chip.stories.ts +13 -9
- package/lib/js/components/Chip/Chip.vue +3 -3
- package/lib/js/components/DatePickers/DatePicker/DatePicker.stories.ts +67 -64
- package/lib/js/components/DatePickers/DatePicker/DatePicker.vue +3 -3
- package/lib/js/components/DatePickers/DatePickerBox/DatePickerBox.vue +3 -3
- package/lib/js/components/Divider/Divider.stories.ts +5 -5
- package/lib/js/components/Divider/Divider.vue +4 -2
- package/lib/js/components/Drawer/Drawer.stories.ts +3 -3
- package/lib/js/components/Drawer/Drawer.vue +3 -3
- package/lib/js/components/Drawer/DrawerContent/DrawerContent.stories.ts +1 -1
- package/lib/js/components/Drawer/DrawerContent/DrawerContent.vue +4 -2
- package/lib/js/components/Drawer/DrawerDivider/DrawerDivider.stories.ts +5 -5
- package/lib/js/components/Drawer/DrawerDivider/DrawerDivider.vue +4 -2
- package/lib/js/components/Drawer/DrawerHeader/DrawerHeader.stories.ts +16 -16
- package/lib/js/components/Drawer/DrawerHeader/DrawerHeader.vue +3 -3
- package/lib/js/components/Drawer/DrawerListItem/DrawerListItem.stories.ts +4 -3
- package/lib/js/components/Drawer/DrawerListItem/DrawerListItem.vue +3 -3
- package/lib/js/components/Drawer/DrawerListItemGroup/DrawerListItemGroup.stories.ts +1 -1
- package/lib/js/components/Drawer/DrawerListItemGroup/DrawerListItemGroup.vue +4 -2
- package/lib/js/components/Drawer/DrawerSection/DrawerSection.stories.ts +60 -57
- package/lib/js/components/Drawer/DrawerSection/DrawerSection.vue +3 -3
- package/lib/js/components/Drawer/DrawerTile/DrawerTile.stories.ts +1 -1
- package/lib/js/components/Drawer/DrawerTile/DrawerTile.vue +4 -2
- package/lib/js/components/Dropdown/Dropdown.stories.ts +9 -9
- package/lib/js/components/Dropdown/Dropdown.vue +4 -2
- package/lib/js/components/Form/Checkbox/Checkbox.stories.ts +21 -14
- package/lib/js/components/Form/Checkbox/Checkbox.vue +3 -3
- package/lib/js/components/Form/RadioButton/RadioButton.stories.ts +21 -14
- package/lib/js/components/Form/RadioButton/RadioButton.vue +3 -3
- package/lib/js/components/Form/SelectionControl/SelectionControl.sb.shared.ts +13 -10
- package/lib/js/components/Form/SelectionControl/SelectionControl.vue +3 -3
- package/lib/js/components/Headers/OverlayHeader/OverlayHeader.stories.ts +9 -9
- package/lib/js/components/Headers/OverlayHeader/OverlayHeader.vue +5 -3
- package/lib/js/components/Headers/PageHeader/PageHeader.stories.ts +11 -13
- package/lib/js/components/Headers/PageHeader/PageHeader.vue +4 -2
- package/lib/js/components/Headers/SectionHeader/SectionHeader.stories.ts +65 -63
- package/lib/js/components/Headers/SectionHeader/SectionHeader.vue +6 -6
- package/lib/js/components/IconText/IconText.stories.ts +6 -5
- package/lib/js/components/IconText/IconText.vue +3 -3
- package/lib/js/components/Icons/FeatureIcon/FeatureIcon.stories.ts +15 -11
- package/lib/js/components/Icons/FeatureIcon/FeatureIcon.vue +3 -3
- package/lib/js/components/Icons/Icon/Icon.stories.ts +10 -8
- package/lib/js/components/Icons/Icon/Icon.vue +3 -3
- package/lib/js/components/Image/Image.stories.ts +5 -5
- package/lib/js/components/Image/Image.vue +0 -11
- package/lib/js/components/Layouts/ThreeColumnLayout/ThreeColumnLayout.stories.ts +8 -8
- package/lib/js/components/Layouts/ThreeColumnLayout/ThreeColumnLayout.vue +3 -3
- package/lib/js/components/LoadingBar/LoadingBar.stories.ts +5 -5
- package/lib/js/components/LoadingBar/LoadingBar.vue +3 -3
- package/lib/js/components/Modal/Modal.vue +4 -2
- package/lib/js/components/Modals/Modal/Modal.stories.ts +31 -31
- package/lib/js/components/Modals/Modal/Modal.vue +3 -3
- package/lib/js/components/Modals/ModalDialog/ModalDialog.stories.ts +20 -20
- package/lib/js/components/Modals/ModalDialog/ModalDialog.vue +3 -3
- package/lib/js/components/NumberInCircle/NumberInCircle.stories.ts +5 -5
- package/lib/js/components/NumberInCircle/NumberInCircle.vue +4 -2
- package/lib/js/components/Outline/OutlineDivider/OutlineDivider.stories.ts +12 -7
- package/lib/js/components/Outline/OutlineDivider/OutlineDivider.vue +4 -2
- package/lib/js/components/Outline/OutlineItem/OutlineItem.stories.ts +40 -29
- package/lib/js/components/Outline/OutlineItem/OutlineItem.vue +4 -4
- package/lib/js/components/Outline/OutlineSectionHeader/OutlineSectionHeader.stories.ts +6 -4
- package/lib/js/components/Outline/OutlineSectionHeader/OutlineSectionHeader.vue +4 -2
- package/lib/js/components/Pagination/Pagination.stories.ts +34 -21
- package/lib/js/components/Pagination/Pagination.vue +3 -2
- package/lib/js/components/PopOver/PopOver.stories.ts +9 -9
- package/lib/js/components/PopOver/PopOver.vue +6 -4
- package/lib/js/components/ProgressBar/ProgressBar.stories.ts +48 -41
- package/lib/js/components/ProgressBar/ProgressBar.vue +3 -3
- package/lib/js/components/ProgressDonutChart/ProgressDonutChart.spec.ts +1 -1
- package/lib/js/components/ProgressDonutChart/ProgressDonutChart.stories.ts +28 -24
- package/lib/js/components/ProgressDonutChart/ProgressDonutChart.vue +4 -3
- package/lib/js/components/RichList/BasicRichListItem/BasicRichListItem.stories.ts +82 -73
- package/lib/js/components/RichList/BasicRichListItem/BasicRichListItem.vue +3 -3
- package/lib/js/components/RichList/GroupRichListItem/GroupRichListItem.stories.ts +26 -20
- package/lib/js/components/RichList/GroupRichListItem/GroupRichListItem.vue +3 -3
- package/lib/js/components/RichList/RichListItem/RichListItem.consts.ts +5 -7
- package/lib/js/components/RichList/RichListItem/RichListItem.stories.ts +25 -18
- package/lib/js/components/RichList/RichListItem/RichListItem.vue +9 -5
- package/lib/js/components/SectionTitle/SectionTitle.stories.ts +5 -4
- package/lib/js/components/SectionTitle/SectionTitle.vue +3 -2
- package/lib/js/components/SelectList/SelectList.stories.ts +1 -1
- package/lib/js/components/SelectList/SelectList.vue +4 -2
- package/lib/js/components/SelectList/SelectListItem/SelectListItem.stories.ts +9 -5
- package/lib/js/components/SelectList/SelectListItem/SelectListItem.vue +3 -3
- package/lib/js/components/SelectList/SelectListItemDivider/SelectListItemDivider.vue +4 -2
- package/lib/js/components/SelectList/SelectListItemTile/SelectListItemTile.stories.ts +5 -2
- package/lib/js/components/SelectList/SelectListItemTile/SelectListItemTile.vue +4 -2
- package/lib/js/components/SelectList/SelectListItemToggle/SelectListItemToggle.stories.ts +51 -42
- package/lib/js/components/SelectList/SelectListItemToggle/SelectListItemToggle.vue +3 -3
- package/lib/js/components/SelectList/SelectListSectionTitle/SelectListSectionTitle.stories.ts +11 -9
- package/lib/js/components/SelectList/SelectListSectionTitle/SelectListSectionTitle.vue +4 -2
- package/lib/js/components/SelectionTile/SelectionTile.stories.ts +46 -38
- package/lib/js/components/Skeleton/Skeleton.stories.ts +5 -5
- package/lib/js/components/Statuses/AccessStatus/AccessStatus.stories.ts +3 -3
- package/lib/js/components/Statuses/AccessStatus/AccessStatus.vue +3 -2
- package/lib/js/components/Statuses/BlockadeStatus/BlockadeStatus.vue +4 -2
- package/lib/js/components/Statuses/BlockadeStatus/BlockedeStatus.stories.ts +3 -3
- package/lib/js/components/SurveyQuestions/SurveyQuestionOpenEnded/SurveyQuestionOpenEnded.stories.ts +22 -17
- package/lib/js/components/SurveyQuestions/SurveyQuestionOpenEnded/SurveyQuestionOpenEnded.vue +4 -2
- package/lib/js/components/SurveyQuestions/SurveyQuestionScale/SurveyQuestionScale.stories.ts +73 -55
- package/lib/js/components/SurveyQuestions/SurveyQuestionScale/SurveyQuestionScale.vue +3 -2
- package/lib/js/components/SurveyQuestions/SurveyQuestionTextarea.vue +4 -2
- package/lib/js/components/SurveyToggle/SurveyToggle.stories.ts +19 -12
- package/lib/js/components/SurveyToggle/SurveyToggle.vue +4 -2
- package/lib/js/components/Switch/Switch.stories.ts +16 -14
- package/lib/js/components/Switch/Switch.vue +3 -3
- package/lib/js/components/TabItem/TabItem.stories.ts +12 -11
- package/lib/js/components/TabItem/TabItem.vue +3 -3
- package/lib/js/components/TextGroup/TextGroup.stories.ts +20 -16
- package/lib/js/components/TextGroup/TextGroup.vue +1 -1
- package/lib/js/components/Tile/Tile.sb.shared.ts +9 -8
- package/lib/js/components/Tile/Tile.stories.ts +43 -45
- package/lib/js/components/Tile/Tile.vue +3 -2
- package/lib/js/components/Toast/Toast.stories.ts +10 -12
- package/lib/js/components/Toast/Toast.vue +3 -3
- package/lib/js/components/Toggles/CounterToggle/CounterToggle.stories.ts +10 -10
- package/lib/js/components/Toggles/CounterToggle/CounterToggle.vue +3 -3
- package/lib/js/components/Toggles/ToggleButton/ToggleButton.stories.ts +17 -17
- package/lib/js/components/Toggles/ToggleButton/ToggleButton.vue +3 -3
- package/lib/js/components/Tooltip/Tooltip.stories.ts +9 -9
- package/lib/js/components/Tooltip/Tooltip.vue +2 -10
- package/lib/js/components/Well/Well.stories.ts +36 -29
- package/lib/js/components/Well/Well.vue +4 -2
- package/lib/js/composables/hover-state.ts +39 -0
- package/lib/js/icons/fontawesome.ts +1 -1
- package/lib/js/index.ts +2 -1
- package/lib/js/styles/Colors/Colors.stories.ts +1 -1
- package/lib/js/styles/ColorsThemes/ColorsThemes.stories.ts +1 -1
- package/lib/js/styles/ColorsTokensLms/ColorsTokensLms.stories.ts +1 -1
- package/lib/js/styles/ColorsTokensPrimaryBodywork/ColorsTokensPrimaryBodywork.stories.ts +1 -1
- package/lib/js/styles/ColorsTokensPrimaryWnl/ColorsTokensPrimaryWnl.stories.ts +1 -1
- package/lib/js/styles/ItemsColor.vue +3 -3
- package/lib/js/styles/ItemsList.vue +4 -3
- package/lib/js/styles/ItemsTypography.vue +3 -3
- package/lib/js/styles/TypographyTokensLms/TypographyTokensLms.stories.ts +1 -1
- package/lib/js/styles/TypographyVariables/TypographyVariables.stories.ts +1 -1
- package/lib/js/typings.d.ts +3 -4
- package/lib/js/utils/device.ts +7 -0
- package/package.json +27 -26
- package/tsconfig.json +12 -5
- package/vite.config.ts +38 -0
- package/.storybook/main.js +0 -86
- package/babel.config.json +0 -12
- package/docs/117.1156a7c503a067ad8241.manager.bundle.js +0 -2
- package/docs/117.1156a7c503a067ad8241.manager.bundle.js.LICENSE.txt +0 -8
- package/docs/247.6eaf240e.iframe.bundle.js +0 -1
- package/docs/255.721b3744029f102ac772.manager.bundle.js +0 -2
- package/docs/255.721b3744029f102ac772.manager.bundle.js.LICENSE.txt +0 -12
- package/docs/286.23828fb3.iframe.bundle.js +0 -2
- package/docs/286.23828fb3.iframe.bundle.js.LICENSE.txt +0 -31
- package/docs/295.4e52f65e605e88f7b915.manager.bundle.js +0 -1
- package/docs/315.76786aa14c329ce07ff9.manager.bundle.js +0 -2
- package/docs/315.76786aa14c329ce07ff9.manager.bundle.js.LICENSE.txt +0 -94
- package/docs/317.bb9fa3422a439c11ef07.manager.bundle.js +0 -1
- package/docs/363.5eecfb3735eae61195ab.manager.bundle.js +0 -586
- package/docs/363.5eecfb3735eae61195ab.manager.bundle.js.LICENSE.txt +0 -23
- package/docs/39.0fa13ab1.iframe.bundle.js +0 -2
- package/docs/39.0fa13ab1.iframe.bundle.js.LICENSE.txt +0 -14
- package/docs/407.e7bfe1ea814fec553911.manager.bundle.js +0 -2
- package/docs/407.e7bfe1ea814fec553911.manager.bundle.js.LICENSE.txt +0 -31
- package/docs/594.bb1a9f64.iframe.bundle.js +0 -2
- package/docs/594.bb1a9f64.iframe.bundle.js.LICENSE.txt +0 -12
- package/docs/600.5586e4df861d64de85f8.manager.bundle.js +0 -1
- package/docs/651.3a01b956.iframe.bundle.js +0 -1
- package/docs/690.46a1e07a.iframe.bundle.js +0 -1
- package/docs/701.691b9947.iframe.bundle.js +0 -1
- package/docs/935.19d3d944.iframe.bundle.js +0 -2
- package/docs/935.19d3d944.iframe.bundle.js.LICENSE.txt +0 -17
- package/docs/949.b11a185a.iframe.bundle.js +0 -2
- package/docs/949.b11a185a.iframe.bundle.js.LICENSE.txt +0 -69
- package/docs/962.ec348c19.iframe.bundle.js +0 -2
- package/docs/962.ec348c19.iframe.bundle.js.LICENSE.txt +0 -8
- package/docs/977.a265714880f883237672.manager.bundle.js +0 -1
- package/docs/favicon.ico +0 -0
- package/docs/main.2c610e68.iframe.bundle.js +0 -2
- package/docs/main.2c610e68.iframe.bundle.js.LICENSE.txt +0 -1
- package/docs/main.ec4e5d4f1933fc03f588.manager.bundle.js +0 -1
- package/docs/runtime~main.8a21756dfcf63c109f1d.manager.bundle.js +0 -1
- package/docs/runtime~main.c8f2837a.iframe.bundle.js +0 -1
- package/vue.config.js +0 -67
- /package/{.eslintrc.js → .eslintrc.cjs} +0 -0
- /package/docs/{static/media/lato-ext-300.dd124df8.woff2 → ~design-system/lib/fonts/lato/lato-ext-300.woff2} +0 -0
- /package/docs/{static/media/lato-ext-700.4223b364.woff2 → ~design-system/lib/fonts/lato/lato-ext-700.woff2} +0 -0
- /package/docs/{static/media/lato-ext.b267ec5a.woff2 → ~design-system/lib/fonts/lato/lato-ext.woff2} +0 -0
- /package/docs/{static/media/lato-latin-300.917632e3.woff2 → ~design-system/lib/fonts/lato/lato-latin-300.woff2} +0 -0
- /package/docs/{static/media/lato-latin-700.f1405bd8.woff2 → ~design-system/lib/fonts/lato/lato-latin-700.woff2} +0 -0
- /package/docs/{static/media/lato-latin.65e877e5.woff2 → ~design-system/lib/fonts/lato/lato-latin.woff2} +0 -0
- /package/lib/js/tests/{emptyModule.ts → emptyModule.cjs} +0 -0
- /package/lib/js/tests/{emptyTransformer.ts → emptyTransformer.cjs} +0 -0
- /package/{stylelint.config.js → stylelint.config.cjs} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as n,o as s,c as o,f as t,h as r,a as l,n as d}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as u}from"./_plugin-vue_export-helper-DlAUqK2U.js";const a={LEFT:"left",RIGHT:"right"},i=n({name:"Drawer",props:{position:{type:String,default:a.RIGHT,validator(e){return Object.values(a).includes(e)}},stickyHeader:{type:Boolean,default:!0},stickyFooter:{type:Boolean,default:!0}},computed:{positionClassName(){return this.position===a.LEFT?"-ds-positionLeft":"-ds-positionRight"}}}),c={key:0,class:"ds-drawer__header -ds-sticky"},f={key:0,class:"ds-drawer__header"},p={key:1,class:"ds-drawer__footer"},m={key:1,class:"ds-drawer__footer -ds-sticky"};function y(e,k,h,v,_,w){return s(),o("div",{class:d(["ds-drawer scrollable-container",{[e.positionClassName]:!0}])},[e.$slots.header&&e.stickyHeader?(s(),o("div",c,[t(e.$slots,"header",{},void 0,!0)])):r("",!0),l("div",{class:d(["ds-drawer__content",{"scrollable-container":e.stickyHeader||e.stickyFooter,"-ds-scrollable":e.stickyHeader||e.stickyFooter,"-ds-fullHeight":e.stickyFooter}])},[e.$slots.header&&!e.stickyHeader?(s(),o("div",f,[t(e.$slots,"header",{},void 0,!0)])):r("",!0),t(e.$slots,"default",{},void 0,!0),e.$slots.footer&&!e.stickyFooter?(s(),o("div",p,[t(e.$slots,"footer",{},void 0,!0)])):r("",!0)],2),e.$slots.footer&&e.stickyFooter?(s(),o("div",m,[t(e.$slots,"footer",{},void 0,!0)])):r("",!0)],2)}const H=u(i,[["render",y],["__scopeId","data-v-0cdce0fb"]]);i.__docgenInfo={displayName:"Drawer",exportName:"default",description:"",tags:{},props:[{name:"position",type:{name:"DrawerPosition"},defaultValue:{func:!1,value:"DRAWER_POSITIONS.RIGHT"}},{name:"stickyHeader",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"stickyFooter",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}}],slots:[{name:"header"},{name:"default"},{name:"footer"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/Drawer.vue"]};export{H as D,a};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import{D as o,a}from"./Drawer-CH5Qyc5B.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const l={title:"Components/Drawer",component:o},i=s=>({components:{Drawer:o},setup(){return s},template:`<div style="height: 300px; width: 200px;">
|
|
2
|
+
<drawer :position="position" :sticky-header="stickyHeader" :sticky-footer="stickyFooter">
|
|
3
|
+
<template v-slot:header><div style="background-color: var(--raw-gray-100)">Header<br><br></div></template>
|
|
4
|
+
<div>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br></div>
|
|
5
|
+
<template v-slot:footer><div style="background-color: var(--raw-gray-100)">Footer<br><br></div></template>
|
|
6
|
+
</drawer>
|
|
7
|
+
</div>`}),t=i.bind({}),b={position:a.RIGHT,stickyHeader:!0,stickyFooter:!0},d={position:{control:"select",options:Object.values(a)}};t.argTypes=d;t.args=b;t.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS---Components?node-id=3343%3A61189"}};var e,r,n;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`args => ({
|
|
8
|
+
components: {
|
|
9
|
+
Drawer
|
|
10
|
+
},
|
|
11
|
+
setup() {
|
|
12
|
+
return args;
|
|
13
|
+
},
|
|
14
|
+
template: \`<div style="height: 300px; width: 200px;">
|
|
15
|
+
<drawer :position="position" :sticky-header="stickyHeader" :sticky-footer="stickyFooter">
|
|
16
|
+
<template v-slot:header><div style="background-color: var(--raw-gray-100)">Header<br><br></div></template>
|
|
17
|
+
<div>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br>Content<br></div>
|
|
18
|
+
<template v-slot:footer><div style="background-color: var(--raw-gray-100)">Footer<br><br></div></template>
|
|
19
|
+
</drawer>
|
|
20
|
+
</div>\`
|
|
21
|
+
})`,...(n=(r=t.parameters)==null?void 0:r.docs)==null?void 0:n.source}}};const m=["Interactive"];export{t as Interactive,m as __namedExportsOrder,l as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as o,o as n,c as r,f as s}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as a}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e=o({name:"DrawerContent"}),d={class:"ds-drawerContent"};function c(t,i,m,p,_,l){return n(),r("div",d,[s(t.$slots,"default",{},void 0,!0)])}const w=a(e,[["render",c],["__scopeId","data-v-9823bd75"]]);e.__docgenInfo={displayName:"DrawerContent",exportName:"default",description:"",tags:{},slots:[{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerContent/DrawerContent.vue"]};export{w as D};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import{D as o}from"./DrawerContent-DGzdUSmd.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const m={title:"Components/Drawer/DrawerContent",component:o},s=a=>({components:{DrawerContent:o},setup(){return a},template:`
|
|
2
|
+
<drawer-content>
|
|
3
|
+
<div>One</div>
|
|
4
|
+
<div>Two</div>
|
|
5
|
+
</drawer-content>`}),t=s.bind({});t.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111039&t=ojEtzUKoNdQTh0X8-4"}};var e,n,r;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`args => ({
|
|
6
|
+
components: {
|
|
7
|
+
DrawerContent
|
|
8
|
+
},
|
|
9
|
+
setup() {
|
|
10
|
+
return args;
|
|
11
|
+
},
|
|
12
|
+
template: \`
|
|
13
|
+
<drawer-content>
|
|
14
|
+
<div>One</div>
|
|
15
|
+
<div>Two</div>
|
|
16
|
+
</drawer-content>\`
|
|
17
|
+
})`,...(r=(n=t.parameters)==null?void 0:n.docs)==null?void 0:r.source}}};const c=["Static"];export{t as Static,c as __namedExportsOrder,m as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{D as i,a as r,b as s}from"./Divider-D2yDhW46.js";import{d as o,o as t,c as d,g as c,r as p}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as m}from"./_plugin-vue_export-helper-DlAUqK2U.js";const a=o({name:"DrawerDivider",components:{DsDivider:i},props:{prominence:{type:String,default:r.DEFAULT,validator:e=>Object.values(r).includes(e)},size:{type:String,default:s.S,validator:e=>Object.values(s).includes(e)}}}),D={class:"ds-drawerDivider"};function l(e,u,v,_,f,I){const n=p("ds-divider");return t(),d("div",D,[c(n,{prominence:e.prominence,size:e.size},null,8,["prominence","size"])])}const w=m(a,[["render",l],["__scopeId","data-v-aaea53a2"]]);a.__docgenInfo={displayName:"DrawerDivider",exportName:"default",description:"",tags:{},props:[{name:"prominence",type:{name:"string"},defaultValue:{func:!1,value:"DIVIDER_PROMINENCES.DEFAULT"}},{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"DIVIDER_SIZES.S"}}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerDivider/DrawerDivider.vue"]};export{w as D};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import{D as i}from"./DrawerDivider-DNbYnPjf.js";import{a as s,b as o}from"./Divider-D2yDhW46.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const g={title:"Components/Drawer/DrawerDivider",component:i},p=a=>({components:{DrawerDivider:i},setup(){return a},template:`
|
|
2
|
+
<div style="height: 200px; width: 200px;">
|
|
3
|
+
<drawer-divider :prominence="prominence" :size="size" />
|
|
4
|
+
</div>`}),e=p.bind({}),c={prominence:s.DEFAULT,size:o.S},m={prominence:{control:"select",options:Object.values(s)},size:{control:"select",options:Object.values(o)}};e.argTypes=m;e.args=c;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111032&t=2Z2n2tIHRHEsWjoW-4"}};var r,t,n;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`args => ({
|
|
5
|
+
components: {
|
|
6
|
+
DrawerDivider
|
|
7
|
+
},
|
|
8
|
+
setup() {
|
|
9
|
+
return args;
|
|
10
|
+
},
|
|
11
|
+
template: \`
|
|
12
|
+
<div style="height: 200px; width: 200px;">
|
|
13
|
+
<drawer-divider :prominence="prominence" :size="size" />
|
|
14
|
+
</div>\`
|
|
15
|
+
})`,...(n=(t=e.parameters)==null?void 0:t.docs)==null?void 0:n.source}}};const w=["Interactive"];export{e as Interactive,w as __namedExportsOrder,g as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as b,o as a,c as s,a as i,b as n,e as _,h as l,n as r,k as u,f,r as o,l as v}from"./vue.esm-bundler-BSCmGRHc.js";import{D as S,a as C,I as T}from"./Button-CBZkgukP.js";import{D,b as N,a as O}from"./Divider-D2yDhW46.js";import{I as w}from"./IconButton-COzU-vlz.js";import{C as k}from"./Chip-CBqrZ-va.js";import{a as R,I as L,b as V}from"./Icon-BiVaixmr.js";import{_ as B}from"./_plugin-vue_export-helper-DlAUqK2U.js";const H={NEUTRAL_STRONG:"neutralStrong",NEUTRAL_WEAK:"neutralWeak"},c=b({name:"DrawerHeader",components:{DsButton:S,Divider:D,Icon:R,IconButton:w,Chip:k},props:{eyebrowText:{type:String,default:null},isInteractiveEyebrow:{type:Boolean,default:!1},eyebrowEllipsis:{type:Boolean,default:!1},title:{type:String,default:null},titleEllipsis:{type:Boolean,default:!1},titleColor:{type:String,default:H.NEUTRAL_STRONG},leftIcon:{type:[Object,null],default:null},chipLabel:{type:String,default:null},isClosable:{type:Boolean,default:!0},hasDivider:{type:Boolean,default:!1},isSecondLevel:{type:Boolean,default:!1}},emits:["backClicked","close","eyebrowClicked"],data(){return{BUTTON_TYPES:Object.freeze(C),DIVIDER_SIZES:Object.freeze(N),DIVIDER_PROMINENCES:Object.freeze(O),ICONS:Object.freeze(L),ICON_BUTTON_SIZES:Object.freeze(T),ICON_SIZES:Object.freeze(V)}}}),g={class:"ds-drawerHeader"},h={class:"ds-drawerHeader__titleWrapper"},$={class:"ds-drawerHeader__title"},A=["title"],z={key:3},U={key:1,class:"ds-drawerHeader__actions"};function j(e,t,Z,M,W,P){const p=o("ds-button"),m=o("icon"),E=o("chip"),I=o("icon-button"),y=o("divider");return a(),s("div",g,[i("div",h,[e.isSecondLevel?(a(),n(p,{key:0,"icon-left":e.ICONS.FA_CHEVRON_LEFT,type:e.BUTTON_TYPES.TEXT,class:"ds-drawerHeader__secondLevel",onClick:t[0]||(t[0]=d=>e.$emit("backClicked"))},{default:_(()=>[v(" Wróć ")]),_:1},8,["icon-left","type"])):l("",!0),i("div",{class:r([{"-ds-hidden":e.isSecondLevel},"ds-drawerHeader__firstLevel"])},[e.eyebrowText?(a(),s("span",{key:0,class:r([{"-ds-isInteractive":e.isInteractiveEyebrow,"-ds-ellipsis":e.eyebrowEllipsis},"ds-drawerHeader__eyebrow"]),onClick:t[1]||(t[1]=d=>e.isInteractiveEyebrow&&e.$emit("eyebrowClicked"))},u(e.eyebrowText),3)):l("",!0),i("div",$,[e.leftIcon?(a(),n(m,{key:0,icon:e.leftIcon,size:e.ICON_SIZES.X_SMALL,class:"ds-drawerHeader__leftIcon"},null,8,["icon","size"])):l("",!0),e.title?(a(),s("span",{key:1,class:r(["ds-drawerHeader__titleText",{"-ds-ellipsis":e.titleEllipsis,[`-ds-${e.titleColor}`]:!0}]),title:e.titleEllipsis?e.title:void 0},u(e.title),11,A)):l("",!0),e.chipLabel?(a(),n(E,{key:2,label:e.chipLabel},null,8,["label"])):l("",!0),e.$slots.titleTrailing?(a(),s("div",z,[f(e.$slots,"titleTrailing",{},void 0,!0)])):l("",!0)])],2),e.$slots.actions?(a(),s("div",U,[f(e.$slots,"actions",{},void 0,!0)])):l("",!0),e.isClosable?(a(),n(I,{key:2,icon:e.ICONS.FA_XMARK,size:e.ICON_BUTTON_SIZES.MEDIUM,touchable:!1,onClick:t[2]||(t[2]=d=>e.$emit("close"))},null,8,["icon","size"])):l("",!0)]),e.hasDivider?(a(),n(y,{key:0,size:e.DIVIDER_SIZES.L,prominence:e.DIVIDER_PROMINENCES.WEAK},null,8,["size","prominence"])):l("",!0)])}const Q=B(c,[["render",j],["__scopeId","data-v-0a9b40fd"]]);c.__docgenInfo={displayName:"DrawerHeader",exportName:"default",description:"",tags:{},props:[{name:"eyebrowText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"isInteractiveEyebrow",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"eyebrowEllipsis",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"title",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"titleEllipsis",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"titleColor",type:{name:"DrawerHeaderTitleColor"},defaultValue:{func:!1,value:"DRAWER_HEADER_TITLE_COLORS.NEUTRAL_STRONG"}},{name:"leftIcon",type:{name:"object|null"},defaultValue:{func:!1,value:"null"}},{name:"chipLabel",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"isClosable",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"hasDivider",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isSecondLevel",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],events:[{name:"backClicked"},{name:"eyebrowClicked"},{name:"close"}],slots:[{name:"titleTrailing"},{name:"actions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerHeader/DrawerHeader.vue"]};export{Q as D,H as a};
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import{D as o,a as r}from"./DrawerHeader-DOWojdwp.js";import{I as n}from"./Icon-BiVaixmr.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./Button-CBZkgukP.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Divider-D2yDhW46.js";import"./IconButton-COzU-vlz.js";import"./device-9fgosCm4.js";import"./Chip-CBqrZ-va.js";const I={title:"Components/Drawer/DrawerHeader",component:o},s=a=>({components:{DrawerHeader:o},setup(){return a},data(){return{ICONS:Object.freeze(n)}},template:`
|
|
2
|
+
<drawer-header
|
|
3
|
+
:eyebrow-ellipsis="eyebrowEllipsis"
|
|
4
|
+
:eyebrow-text="eyebrowText"
|
|
5
|
+
:has-divider="hasDivider"
|
|
6
|
+
:is-closable="isClosable"
|
|
7
|
+
:is-interactive-eyebrow="isInteractiveEyebrow"
|
|
8
|
+
:is-second-level="isSecondLevel"
|
|
9
|
+
:left-icon="ICONS[leftIcon]"
|
|
10
|
+
:chip-label="chipLabel"
|
|
11
|
+
:title-color="titleColor"
|
|
12
|
+
:title-ellipsis="titleEllipsis"
|
|
13
|
+
:title="title"
|
|
14
|
+
>
|
|
15
|
+
<template #actions v-if="actions">
|
|
16
|
+
<div v-html="actions" />
|
|
17
|
+
</template>
|
|
18
|
+
<template #titleTrailing v-if="titleTrailing">
|
|
19
|
+
<div v-html="titleTrailing" />
|
|
20
|
+
</template>
|
|
21
|
+
</drawer-header>`}),e=s.bind({}),c={eyebrowText:"eyebrow",isInteractiveEyebrow:!1,eyebrowEllipsis:!1,title:"Header Title",titleEllipsis:!1,titleColor:r.NEUTRAL_STRONG,leftIcon:null,chipLabel:"chip",isClosable:!0,hasDivider:!1,isSecondLevel:!1,actions:"actions slot",titleTrailing:"trailing slot"},p={eyebrowText:{control:"text"},isInteractiveEyebrow:{control:"boolean"},eyebrowEllipsis:{control:"boolean"},title:{control:"text"},titleEllipsis:{control:"boolean"},titleColor:{control:"select",options:Object.values(r)},leftIcon:{control:"select",options:[...Object.keys(n),null]},chipLabel:{control:"text"},hasDivider:{control:"boolean"},isSecondLevel:{control:"boolean"},isClosable:{control:"boolean"},actions:{control:"text"},titleTrailing:{control:"text"}};e.argTypes=p;e.args=c;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=5844-97971&t=BghQUeaLDBGoEKOq-4"}};var t,i,l;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
|
|
22
|
+
components: {
|
|
23
|
+
DrawerHeader
|
|
24
|
+
},
|
|
25
|
+
setup() {
|
|
26
|
+
return args;
|
|
27
|
+
},
|
|
28
|
+
data() {
|
|
29
|
+
return {
|
|
30
|
+
ICONS: Object.freeze(ICONS)
|
|
31
|
+
};
|
|
32
|
+
},
|
|
33
|
+
template: \`
|
|
34
|
+
<drawer-header
|
|
35
|
+
:eyebrow-ellipsis="eyebrowEllipsis"
|
|
36
|
+
:eyebrow-text="eyebrowText"
|
|
37
|
+
:has-divider="hasDivider"
|
|
38
|
+
:is-closable="isClosable"
|
|
39
|
+
:is-interactive-eyebrow="isInteractiveEyebrow"
|
|
40
|
+
:is-second-level="isSecondLevel"
|
|
41
|
+
:left-icon="ICONS[leftIcon]"
|
|
42
|
+
:chip-label="chipLabel"
|
|
43
|
+
:title-color="titleColor"
|
|
44
|
+
:title-ellipsis="titleEllipsis"
|
|
45
|
+
:title="title"
|
|
46
|
+
>
|
|
47
|
+
<template #actions v-if="actions">
|
|
48
|
+
<div v-html="actions" />
|
|
49
|
+
</template>
|
|
50
|
+
<template #titleTrailing v-if="titleTrailing">
|
|
51
|
+
<div v-html="titleTrailing" />
|
|
52
|
+
</template>
|
|
53
|
+
</drawer-header>\`
|
|
54
|
+
})`,...(l=(i=e.parameters)==null?void 0:i.docs)==null?void 0:l.source}}};const T=["Interactive"];export{e as Interactive,T as __namedExportsOrder,I as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as i,o as t,c as a,a as d,k as r,b as _,r as c}from"./vue.esm-bundler-BSCmGRHc.js";import{a as l,I,b as m}from"./Icon-BiVaixmr.js";import{_ as p}from"./_plugin-vue_export-helper-DlAUqK2U.js";const s={DEFAULT:"default",LOADING:"loading"},n=i({name:"DrawerListItem",components:{DsIcon:l},props:{state:{type:String,default:s.DEFAULT,validator(e){return Object.values(s).includes(e)}},label:{type:String,required:!0},valueText:{type:String,required:!0}},data(){return{DRAWER_LIST_ITEM_STATES:Object.freeze(s),ICONS:Object.freeze(I),ICON_SIZES:Object.freeze(m)}}}),u={class:"ds-drawerListItem"},S={class:"ds-drawerListItem__label"},T={key:1,class:"ds-drawerListItem__value"};function D(e,E,L,f,A,v){const o=c("ds-icon");return t(),a("div",u,[d("div",S,r(e.label),1),e.state===e.DRAWER_LIST_ITEM_STATES.LOADING?(t(),_(o,{key:0,icon:e.ICONS.FAD_SPINNER_THIRD,size:e.ICON_SIZES.XX_SMALL,spinning:""},null,8,["icon","size"])):(t(),a("div",T,r(e.valueText),1))])}const y=p(n,[["render",D],["__scopeId","data-v-be266320"]]);n.__docgenInfo={displayName:"DrawerListItem",exportName:"default",description:"",tags:{},props:[{name:"state",type:{name:"DrawerListItemState"},defaultValue:{func:!1,value:"DRAWER_LIST_ITEM_STATES.DEFAULT"}},{name:"label",type:{name:"string"},required:!0},{name:"valueText",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerListItem/DrawerListItem.vue"]};export{y as D,s as a};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import{D as s,a as n}from"./DrawerListItem-aepUTcTm.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./Icon-BiVaixmr.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const g={title:"Components/Drawer/DrawerListItem",component:s},i=o=>({components:{DrawerListItem:s},setup(){return o},template:`<div style="height: 300px; width: 200px;">
|
|
2
|
+
<drawer-list-item :label="label" :value-text="valueText" :state="state" />
|
|
3
|
+
</div>`}),e=i.bind({}),l={label:"Label",valueText:"value",state:n.DEFAULT},p={state:{control:"select",options:Object.values(n)}};e.argTypes=p;e.args=l;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111025&t=pzyp7YuJcnGNBfS5-4"}};var t,a,r;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
|
|
4
|
+
components: {
|
|
5
|
+
DrawerListItem
|
|
6
|
+
},
|
|
7
|
+
setup() {
|
|
8
|
+
return args;
|
|
9
|
+
},
|
|
10
|
+
template: \`<div style="height: 300px; width: 200px;">
|
|
11
|
+
<drawer-list-item :label="label" :value-text="valueText" :state="state" />
|
|
12
|
+
</div>\`
|
|
13
|
+
})`,...(r=(a=e.parameters)==null?void 0:a.docs)==null?void 0:r.source}}};const v=["Interactive"];export{e as Interactive,v as __namedExportsOrder,g as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as s,o as t,c as o,f as a}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as n}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e=s({name:"DrawerListItemGroup"}),i={class:"ds-drawerListItemGroup"};function d(r,m,p,c,u,_){return t(),o("div",i,[a(r.$slots,"default",{},void 0,!0)])}const w=n(e,[["render",d],["__scopeId","data-v-af074046"]]);e.__docgenInfo={displayName:"DrawerListItemGroup",exportName:"default",description:"",tags:{},slots:[{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerListItemGroup/DrawerListItemGroup.vue"]};export{w as D};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import{D as s}from"./DrawerListItemGroup-CnH532Dv.js";import{D as m}from"./DrawerListItem-aepUTcTm.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Icon-BiVaixmr.js";const w={title:"Components/Drawer/DrawerListItemGroup",component:s},i=o=>({components:{DrawerListItemGroup:s,DrawerListItem:m},setup(){return o},template:`
|
|
2
|
+
<drawer-list-item-group>
|
|
3
|
+
<drawer-list-item value-text="1" label="Item" />
|
|
4
|
+
<drawer-list-item value-text="2" label="Item" />
|
|
5
|
+
</drawer-list-item-group>
|
|
6
|
+
`}),t=i.bind({});t.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111079&t=PEjZUz7dUozNqntp-4"}};var e,r,a;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`args => ({
|
|
7
|
+
components: {
|
|
8
|
+
DrawerListItemGroup,
|
|
9
|
+
DrawerListItem
|
|
10
|
+
},
|
|
11
|
+
setup() {
|
|
12
|
+
return args;
|
|
13
|
+
},
|
|
14
|
+
template: \`
|
|
15
|
+
<drawer-list-item-group>
|
|
16
|
+
<drawer-list-item value-text="1" label="Item" />
|
|
17
|
+
<drawer-list-item value-text="2" label="Item" />
|
|
18
|
+
</drawer-list-item-group>
|
|
19
|
+
\`
|
|
20
|
+
})`,...(a=(r=t.parameters)==null?void 0:r.docs)==null?void 0:a.source}}};const c=["Static"];export{t as Static,c as __namedExportsOrder,w as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{I as t}from"./Icon-BiVaixmr.js";import"./IconButton-COzU-vlz.js";import{i as p,I as f}from"./Button-CBZkgukP.js";import{b as c,S as a,a as o}from"./SectionHeader-DVwe52kA.js";import{d as m,t as n,o as l,c as i,g as E,f as s,h as r,r as S}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as O}from"./_plugin-vue_export-helper-DlAUqK2U.js";const d=m({name:"DrawerSection",components:{DsSectionHeader:c},props:{isExpandable:{type:Boolean,default:!1},iconLeft:{type:Object,default:null,validator(e){return Object.values(t).includes(n(e))}},iconLeftColor:{type:String,default:a.NEUTRAL_WEAK,validator(e){return Object.values(a).includes(n(e))}},iconRight:{type:Object,default:null,validator(e){return Object.values(t).includes(n(e))}},iconRightColor:{type:String,default:a.NEUTRAL_WEAK,validator(e){return Object.values(a).includes(n(e))}},isExpanded:{type:Boolean,default:!0},info:{type:Boolean,default:!1},size:{type:String,default:o.XX_SMALL,validator(e){return Object.values(o).includes(e)}},title:{type:String,required:!0},titleEllipsis:{type:Boolean,default:!1},eyebrow:{type:String,default:""},supportingText:{type:String,default:null},hasDivider:{type:Boolean,default:!0}},emits:["info-click","update:isExpanded"],data(){return{ICON_BUTTON_COLORS:Object.freeze(p),ICON_BUTTON_SIZES:Object.freeze(f),ICONS:Object.freeze(t),isExpandedInternal:this.isExpanded}},watch:{isExpanded:{handler(e){e!==this.isExpandedInternal&&(this.isExpandedInternal=e)},immediate:!0}},methods:{onExpandableHeaderClick(e){this.isExpandedInternal=e,this.$emit("update:isExpanded",e)},onInfoClick(){this.$emit("info-click")}}}),y={class:"ds-drawerSection"},I={key:0},C={key:1};function b(e,g,h,v,_,N){const u=S("ds-section-header");return l(),i("div",y,[E(u,{"icon-left":e.iconLeft,"icon-left-color":e.iconLeftColor,"icon-right":e.iconRight,"icon-right-color":e.iconRightColor,"is-expandable":e.isExpandable,"is-expanded":e.isExpandedInternal,info:e.info,size:e.size,title:e.title,"title-ellipsis":e.titleEllipsis,eyebrow:e.eyebrow,"supporting-text":e.supportingText,"has-divider":e.hasDivider,onInfoClick:e.onInfoClick,"onUpdate:isExpanded":e.onExpandableHeaderClick},null,8,["icon-left","icon-left-color","icon-right","icon-right-color","is-expandable","is-expanded","info","size","title","title-ellipsis","eyebrow","supporting-text","has-divider","onInfoClick","onUpdate:isExpanded"]),e.isExpandedInternal||!e.isExpandable?(l(),i("div",I,[s(e.$slots,"default")])):r("",!0),e.$slots.uncollapsible?(l(),i("div",C,[s(e.$slots,"uncollapsible")])):r("",!0)])}const k=O(d,[["render",b]]);d.__docgenInfo={displayName:"DrawerSection",exportName:"default",description:"",tags:{},props:[{name:"isExpandable",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"iconLeft",type:{name:"Object as () => IconItem"},defaultValue:{func:!1,value:"null"}},{name:"iconLeftColor",type:{name:"String as () => SectionHeaderIconColor"},defaultValue:{func:!1,value:"SECTION_HEADER_ICON_COLORS.NEUTRAL_WEAK"}},{name:"iconRight",type:{name:"Object as () => IconItem"},defaultValue:{func:!1,value:"null"}},{name:"iconRightColor",type:{name:"String as () => SectionHeaderIconColor"},defaultValue:{func:!1,value:"SECTION_HEADER_ICON_COLORS.NEUTRAL_WEAK"}},{name:"isExpanded",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"info",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"SECTION_HEADER_SIZES.XX_SMALL"}},{name:"title",type:{name:"string"},required:!0},{name:"titleEllipsis",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"eyebrow",type:{name:"string"},defaultValue:{func:!1,value:"''"}},{name:"supportingText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"hasDivider",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}}],events:[{name:"info-click"},{name:"update:isExpanded",type:{names:["undefined"]}}],slots:[{name:"default"},{name:"uncollapsible"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerSection/DrawerSection.vue"]};export{k as D};
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import{D as r}from"./DrawerSection-pMhA5dsS.js";import{S as n,a as l}from"./SectionHeader-DVwe52kA.js";import{I as t}from"./Icon-BiVaixmr.js";import"./IconButton-COzU-vlz.js";import"./Button-CBZkgukP.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./device-9fgosCm4.js";import"./Divider-D2yDhW46.js";const{useArgs:d}=__STORYBOOK_MODULE_PREVIEW_API__,D={title:"Components/Drawer/DrawerSection",component:r},f=a=>{const[g,c]=d();return{components:{DrawerSection:r},setup(){return a},data(){return{ICONS:Object.freeze(t)}},methods:{infoClicked(){console.log("info clicked")},isExpandedUpdated(p){c({isExpanded:p})}},template:`
|
|
2
|
+
<drawer-section
|
|
3
|
+
:size="size"
|
|
4
|
+
:title="title"
|
|
5
|
+
:title-ellipsis="titleEllipsis"
|
|
6
|
+
:supporting-text="supportingText"
|
|
7
|
+
:eyebrow="eyebrow"
|
|
8
|
+
:icon-left="ICONS[iconLeft]"
|
|
9
|
+
:icon-left-color="iconLeftColor"
|
|
10
|
+
:icon-right="ICONS[iconRight]"
|
|
11
|
+
:icon-right-color="iconRightColor"
|
|
12
|
+
:info="info"
|
|
13
|
+
:has-divider="hasDivider"
|
|
14
|
+
:is-expandable="isExpandable"
|
|
15
|
+
:is-expanded="isExpanded"
|
|
16
|
+
@infoClick="infoClicked"
|
|
17
|
+
@update:isExpanded="isExpandedUpdated"
|
|
18
|
+
>
|
|
19
|
+
Default slot
|
|
20
|
+
<template #uncollapsible>Uncollapsible slot</template>
|
|
21
|
+
</drawer-section>`}},e=f.bind({}),u={size:l.MEDIUM,title:"Drawer Section Header",titleEllipsis:!1,supportingText:"",eyebrow:"",iconLeft:null,iconLeftColor:n.NEUTRAL,iconRight:null,iconRightColor:n.NEUTRAL,info:!1,hasDivider:!0,isExpandable:!1,isExpanded:!0},m={iconLeft:{control:"select",options:[null,...Object.keys(t)]},iconLeftColor:{control:"select",options:[null,...Object.values(n)]},iconRight:{control:"select",options:[null,...Object.keys(t)]},iconRightColor:{control:"select",options:[null,...Object.values(n)]},size:{control:"select",options:Object.values(l)},hasDivider:{control:"boolean"},info:{control:"boolean"}};e.argTypes=m;e.args=u;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111107&t=jOrkmR91y4woubGJ-4"}};var o,i,s;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`args => {
|
|
22
|
+
const [_, updateArgs] = useArgs();
|
|
23
|
+
return {
|
|
24
|
+
components: {
|
|
25
|
+
DrawerSection
|
|
26
|
+
},
|
|
27
|
+
setup() {
|
|
28
|
+
return args;
|
|
29
|
+
},
|
|
30
|
+
data() {
|
|
31
|
+
return {
|
|
32
|
+
ICONS: Object.freeze(ICONS)
|
|
33
|
+
};
|
|
34
|
+
},
|
|
35
|
+
methods: {
|
|
36
|
+
infoClicked() {
|
|
37
|
+
console.log('info clicked');
|
|
38
|
+
},
|
|
39
|
+
isExpandedUpdated(isExpanded: boolean) {
|
|
40
|
+
updateArgs({
|
|
41
|
+
isExpanded
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
template: \`
|
|
46
|
+
<drawer-section
|
|
47
|
+
:size="size"
|
|
48
|
+
:title="title"
|
|
49
|
+
:title-ellipsis="titleEllipsis"
|
|
50
|
+
:supporting-text="supportingText"
|
|
51
|
+
:eyebrow="eyebrow"
|
|
52
|
+
:icon-left="ICONS[iconLeft]"
|
|
53
|
+
:icon-left-color="iconLeftColor"
|
|
54
|
+
:icon-right="ICONS[iconRight]"
|
|
55
|
+
:icon-right-color="iconRightColor"
|
|
56
|
+
:info="info"
|
|
57
|
+
:has-divider="hasDivider"
|
|
58
|
+
:is-expandable="isExpandable"
|
|
59
|
+
:is-expanded="isExpanded"
|
|
60
|
+
@infoClick="infoClicked"
|
|
61
|
+
@update:isExpanded="isExpandedUpdated"
|
|
62
|
+
>
|
|
63
|
+
Default slot
|
|
64
|
+
<template #uncollapsible>Uncollapsible slot</template>
|
|
65
|
+
</drawer-section>\`
|
|
66
|
+
};
|
|
67
|
+
}`,...(s=(i=e.parameters)==null?void 0:i.docs)==null?void 0:s.source}}};const R=["Interactive"];export{e as Interactive,R as __namedExportsOrder,D as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{b as n,p as t}from"./Tile-DnH9h0Kq.js";import{d as a,o as i,c,g as l,s as p,r as m}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as d}from"./_plugin-vue_export-helper-DlAUqK2U.js";const o=a({name:"DrawerTile",components:{DsTile:n},props:t,emits:["click"]}),_={class:"ds-drawerTile"};function f(e,s,u,w,D,T){const r=m("ds-tile");return i(),c("div",_,[l(r,p(e.$props,{onClick:s[0]||(s[0]=k=>e.$emit("click"))}),null,16)])}const y=d(o,[["render",f],["__scopeId","data-v-d495ac51"]]);o.__docgenInfo={displayName:"DrawerTile",exportName:"default",description:"",tags:{},events:[{name:"click"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Drawer/DrawerTile/DrawerTile.vue"]};export{y as D};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import{D as s}from"./DrawerTile-W2mt6fAk.js";import{a as n,b as p,t as m,d as i}from"./Tile.sb.shared-2W1FnncR.js";import"./Tile-DnH9h0Kq.js";import"./Icon-BiVaixmr.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const D={title:"Components/Drawer/DrawerTile",component:s},c=o=>({components:{DrawerTile:s},setup(){return o},template:m("drawer-tile"),data:i}),e=c.bind({});e.argTypes=n;e.args=p;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=6785-111025&t=pzyp7YuJcnGNBfS5-4"}};var r,t,a;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`args => ({
|
|
2
|
+
components: {
|
|
3
|
+
DrawerTile
|
|
4
|
+
},
|
|
5
|
+
setup() {
|
|
6
|
+
return args;
|
|
7
|
+
},
|
|
8
|
+
template: template('drawer-tile'),
|
|
9
|
+
data
|
|
10
|
+
})`,...(a=(t=e.parameters)==null?void 0:t.docs)==null?void 0:a.source}}};const T=["Interactive"];export{e as Interactive,T as __namedExportsOrder,D as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{V as u}from"./vue-popper-BJbr8Gin.js";import{d as m,o as c,b as f,e as s,r as O,f as a,a as n,n as i,v as h}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as S}from"./_plugin-vue_export-helper-DlAUqK2U.js";const r={CLICK:"click",HOVER:"hover"},o={TOP:"top",BOTTOM:"bottom",BOTH:"both"},l={BOTTOM_START:"bottom-start",BOTTOM_END:"bottom-end"},d=m({name:"Dropdown",components:{VuePopper:u},props:{boundariesSelector:{type:String,default:null},forceShow:{type:Boolean,default:!1},sameWidth:{type:Boolean,default:!1},triggerAction:{type:String,default:r.CLICK,validator(e){return Object.values(r).includes(e)}},radius:{type:String,default:o.BOTH,validate(e){return Object.values(o).includes(e)}},placement:{type:String,default:l.BOTTOM_START,validate(e){return Object.values(l).includes(e)}},maxHeight:{type:String,default:null}},emits:["document-click","hide","show"],data(){return{key:1,isOpened:!1,DROPDOWN_RADIUSES:Object.freeze(o)}},computed:{scrollableWrapperStyles(){return{...this.maxHeight&&{maxHeight:this.maxHeight}}},options(){return{modifiers:{preventOverflow:{padding:0}},placement:this.placement,...this.sameWidth&&{onUpdate:({instance:{reference:e,popper:t}})=>{t.style.width=`${e.offsetWidth}px`}}}}},watch:{triggerAction(){this.updateKey()},sameWidth(){this.updateKey()},boundariesSelector(){this.updateKey()},placement(){this.updateKey()}},methods:{close(){this.isOpened=!1,this.$refs.popper.doClose()},updateKey(){this.key++},onHide(){this.isOpened=!1,this.$emit("hide")},onShow(){this.isOpened=!0,this.$emit("show")}}});function g(e,t,D,y,T,v){const p=O("vue-popper");return c(),f(p,{ref:"popper",key:e.key,"boundaries-selector":e.boundariesSelector,"force-show":e.forceShow,options:e.options,"visible-arrow":!1,trigger:e.triggerAction,"delay-on-mouse-out":300,onDocumentClick:t[0]||(t[0]=b=>e.$emit("document-click")),onHide:e.onHide,onShow:e.onShow},{reference:s(()=>[a(e.$slots,"reference",{isOpened:e.isOpened},void 0,!0)]),default:s(()=>[n("div",{class:i(["popper ds-dropdown",{"-ds-radiusBottom":e.radius===e.DROPDOWN_RADIUSES.BOTTOM,"-ds-radiusTop":e.radius===e.DROPDOWN_RADIUSES.TOP,"-ds-radiusBottom -ds-radiusTop":e.radius===e.DROPDOWN_RADIUSES.BOTH}])},[n("div",{class:i(["ds-dropdown__scrollableWrapper",{"-ds-heightLimited":!!e.maxHeight}]),style:h(e.scrollableWrapperStyles)},[a(e.$slots,"default",{close:e.close},void 0,!0)],6)],2)]),_:3},8,["boundaries-selector","force-show","options","trigger","onHide","onShow"])}const W=S(d,[["render",g],["__scopeId","data-v-2d417441"]]);d.__docgenInfo={displayName:"Dropdown",exportName:"default",description:"",tags:{},props:[{name:"boundariesSelector",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"forceShow",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"sameWidth",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"triggerAction",type:{name:"string"},defaultValue:{func:!1,value:"DROPDOWN_TRIGGER_ACTIONS.CLICK"}},{name:"radius",type:{name:"string"},defaultValue:{func:!1,value:"DROPDOWN_RADIUSES.BOTH"}},{name:"placement",type:{name:"string"},defaultValue:{func:!1,value:"DROPDOWN_PLACEMENTS.BOTTOM_START"}},{name:"maxHeight",type:{name:"string"},defaultValue:{func:!1,value:"null"}}],events:[{name:"document-click"},{name:"hide"},{name:"show"}],slots:[{name:"default",scoped:!0,bindings:[{name:"close",title:"binding"}]},{name:"reference",scoped:!0,bindings:[{name:"is-opened",title:"binding"}]}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Dropdown/Dropdown.vue"]};export{W as D,r as a,o as b,l as c};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import{D as i,a,b as r,c as l}from"./Dropdown-BfX0EVaK.js";import{S as c}from"./SelectList-CTXM5G8Z.js";import{S as p}from"./SelectListItem-_c4CA-YM.js";import"./vue-popper-BJbr8Gin.js";import"./_commonjsHelpers-Chg3vePA.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Icon-BiVaixmr.js";const T={title:"Components/Dropdown",component:i},m=n=>({components:{Dropdown:i,SelectList:c,SelectListItem:p},setup(){return n},template:`
|
|
2
|
+
<div style="position: relative">
|
|
3
|
+
<dropdown :trigger-action="triggerAction"
|
|
4
|
+
:force-show="forceShow"
|
|
5
|
+
:same-width="sameWidth"
|
|
6
|
+
:radius="radius"
|
|
7
|
+
:placement="placement"
|
|
8
|
+
:max-height="maxHeight">
|
|
9
|
+
<template #reference="{ isOpened }"><span>Dropdown entry point {{ isOpened ? 'opened' : 'closed' }}</span>
|
|
10
|
+
</template>
|
|
11
|
+
<template #default="{ close }">
|
|
12
|
+
<select-list>
|
|
13
|
+
<select-list-item label="One" @click.native="close" />
|
|
14
|
+
<select-list-item label="Two" @click.native="close" />
|
|
15
|
+
</select-list>
|
|
16
|
+
</template>
|
|
17
|
+
</dropdown>
|
|
18
|
+
</div>`}),e=m.bind({}),d={triggerAction:a.CLICK,radius:r.BOTH,forceShow:!1,sameWidth:!1,maxHeight:"",placement:l.BOTTOM_START},g={triggerAction:{control:"select",options:Object.values(a)},radius:{control:"select",options:Object.values(r)},placement:{control:"select",options:Object.values(l)},maxHeight:{control:"text"}};e.argTypes=g;e.args=d;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS---Components?node-id=4010%3A69857"}};var t,o,s;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
|
|
19
|
+
components: {
|
|
20
|
+
Dropdown,
|
|
21
|
+
SelectList,
|
|
22
|
+
SelectListItem
|
|
23
|
+
},
|
|
24
|
+
setup() {
|
|
25
|
+
return args;
|
|
26
|
+
},
|
|
27
|
+
template: \`
|
|
28
|
+
<div style="position: relative">
|
|
29
|
+
<dropdown :trigger-action="triggerAction"
|
|
30
|
+
:force-show="forceShow"
|
|
31
|
+
:same-width="sameWidth"
|
|
32
|
+
:radius="radius"
|
|
33
|
+
:placement="placement"
|
|
34
|
+
:max-height="maxHeight">
|
|
35
|
+
<template #reference="{ isOpened }"><span>Dropdown entry point {{ isOpened ? 'opened' : 'closed' }}</span>
|
|
36
|
+
</template>
|
|
37
|
+
<template #default="{ close }">
|
|
38
|
+
<select-list>
|
|
39
|
+
<select-list-item label="One" @click.native="close" />
|
|
40
|
+
<select-list-item label="Two" @click.native="close" />
|
|
41
|
+
</select-list>
|
|
42
|
+
</template>
|
|
43
|
+
</dropdown>
|
|
44
|
+
</div>\`
|
|
45
|
+
})`,...(s=(o=e.parameters)==null?void 0:o.docs)==null?void 0:s.source}}};const I=["Interactive"];export{e as Interactive,I as __namedExportsOrder,T as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as l,I as u,b as o}from"./Icon-BiVaixmr.js";import{d as i,t as E,o as t,c as d,g as c,n as I,r as R}from"./vue.esm-bundler-BSCmGRHc.js";import{_ as O}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={SMALL:"small",MEDIUM:"medium",LARGE:"large",X_LARGE:"xLarge"},a={DANGER:"danger",INFO:"info",NEUTRAL:"neutral",NEUTRAL_WEAK:"neutralWeak",PRIMARY:"primary",SUCCESS:"success",WARNING:"warning"},s=i({name:"FeatureIcon",components:{WnlIcon:l},props:{icon:{type:Object,default:null,validator(e){return Object.values(u).includes(E(e))}},size:{type:String,default:n.MEDIUM,validator:e=>Object.values(n).includes(e)},color:{type:String,required:!0,validator(e){return Object.values(a).includes(e)}},doubleBackground:{type:Boolean,default:!1}},data(){return{FEATURE_ICON_COLOR:Object.freeze(a),FEATURE_ICON_SIZES:Object.freeze(n)}},computed:{iconSize(){return this.size===n.SMALL?o.X_SMALL:this.size===n.LARGE?o.LARGE:this.size===n.X_LARGE?o.X_LARGE:o.MEDIUM}}});function A(e,m,C,f,p,N){const r=R("wnl-icon");return t(),d("div",{class:I(["ds-featureIcon",{"-ds-doubleBackground":e.doubleBackground,"-ds-danger":e.color===e.FEATURE_ICON_COLOR.DANGER,"-ds-info":e.color===e.FEATURE_ICON_COLOR.INFO,"-ds-neutral":e.color===e.FEATURE_ICON_COLOR.NEUTRAL,"-ds-neutralWeak":e.color===e.FEATURE_ICON_COLOR.NEUTRAL_WEAK,"-ds-primary":e.color===e.FEATURE_ICON_COLOR.PRIMARY,"-ds-success":e.color===e.FEATURE_ICON_COLOR.SUCCESS,"-ds-warning":e.color===e.FEATURE_ICON_COLOR.WARNING,"-ds-small":e.size===e.FEATURE_ICON_SIZES.SMALL,"-ds-medium":e.size===e.FEATURE_ICON_SIZES.MEDIUM,"-ds-large":e.size===e.FEATURE_ICON_SIZES.LARGE,"-ds-xLarge":e.size===e.FEATURE_ICON_SIZES.X_LARGE}])},[c(r,{class:"ds-featureIcon__icon",icon:e.icon,size:e.iconSize},null,8,["icon","size"])],2)}const U=O(s,[["render",A]]);s.__docgenInfo={displayName:"FeatureIcon",exportName:"default",description:"",tags:{},props:[{name:"icon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"FEATURE_ICON_SIZES.MEDIUM"}},{name:"color",type:{name:"string"},required:!0},{name:"doubleBackground",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Icons/FeatureIcon/FeatureIcon.vue"]};export{U as F,n as a,a as b};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import{F as c,a as n,b as s}from"./FeatureIcon-n65RPvyA.js";import{I as a}from"./Icon-BiVaixmr.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const g={title:"Components/Icons/FeatureIcon",component:c},u=i=>({components:{FeatureIcon:c},setup(){return i},template:'<feature-icon :icon="ICONS[icon]" :size="size" :color="color" :doubleBackground="doubleBackground" />',data(){return{ICONS:Object.freeze(a)}}}),e=u.bind({}),l={size:n.X_LARGE,icon:"FA_CIRCLE_QUESTION",color:s.PRIMARY,doubleBackground:!0},p={size:{control:"select",options:Object.values(n)},icon:{control:"select",options:[null,...Object.keys(a)]},color:{control:"select",options:Object.values(s)},doubleBackground:{control:"boolean"}};e.argTypes=p;e.args=l;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS---Components?node-id=1552%3A34963"}};var o,t,r;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`args => ({
|
|
2
|
+
components: {
|
|
3
|
+
FeatureIcon
|
|
4
|
+
},
|
|
5
|
+
setup() {
|
|
6
|
+
return args;
|
|
7
|
+
},
|
|
8
|
+
template: '<feature-icon :icon="ICONS[icon]" :size="size" :color="color" :doubleBackground="doubleBackground" />',
|
|
9
|
+
data() {
|
|
10
|
+
return {
|
|
11
|
+
ICONS: Object.freeze(ICONS)
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
})`,...(r=(t=e.parameters)==null?void 0:t.docs)==null?void 0:r.source}}};const b=["Interactive"];export{e as Interactive,b as __namedExportsOrder,g as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as y,t as M,o as t,c as o,f as l,h as s,a as n,g as f,n as i,x as u,v as p,b,r as C}from"./vue.esm-bundler-BSCmGRHc.js";import{D}from"./Checkbox-D_geau8n.js";import{D as V}from"./Divider-D2yDhW46.js";import{a as $,I as v,c as U,b as z}from"./Icon-BiVaixmr.js";import{_ as R}from"./_plugin-vue_export-helper-DlAUqK2U.js";const r={DEFAULT:"default",FLAT:"flat"},c={DEFAULT:"default",LOADING:"loading"},m={SMALL:"small",MEDIUM:"medium"},E={DEFAULT:"default",PRIMARY:"primary",PRIMARY_WEAK:"primary-weak",NEUTRAL_HEAVY:"neutral-heavy",NEUTRAL_STRONG:"neutral-strong",NEUTRAL:"neutral",NEUTRAL_WEAK:"neutral-weak",NEUTRAL_GHOST:"neutral-ghost",DANGER:"danger",DANGER_WEAK:"danger-weak",FAIL:"fail",FAIL_WEAK:"fail-weak",WARNING:"warning",WARNING_WEAK:"warning-weak",SUCCESS:"success",SUCCESS_WEAK:"success-weak",INFO:"info",INFO_WEAK:"info-weak",ACCENT:"accent",ACCENT_WEAK:"accent-weak"},L={NEUTRAL:"neutral",NEUTRAL_WEAK:"neutral-weak"},B={SMALL:"small"},I={HORIZONTAL:"horizontal",VERTICAL:"vertical"},T=y({name:"RichListItem",components:{DsCheckbox:D,DsDivider:V,DsIcon:$},props:{type:{type:String,default:r.DEFAULT,validator(e){return Object.values(r).includes(e)}},layout:{type:String,default:I.HORIZONTAL,validator(e){return Object.values(I).includes(e)}},state:{type:String,default:c.DEFAULT,validator(e){return Object.values(c).includes(e)}},size:{type:String,default:m.MEDIUM,validator(e){return Object.values(m).includes(e)}},isInteractive:{type:Boolean,default:!0},isDimmed:{type:Boolean,default:!1},isDraggable:{type:Boolean,default:!0},icon:{type:Object,default:null,validator(e){return Object.values(v).includes(M(e))}},iconColor:{type:String,default:null,validator(e){return Object.values(U).includes(e)}},iconColorHex:{type:String,default:null},borderColor:{type:String,default:null,validator(e){return Object.values(E).includes(e)}},borderColorHex:{type:String,default:null},draggableIconClassName:{type:String,default:null},backgroundColor:{type:String,default:L.NEUTRAL,validator(e){return Object.values(L).includes(e)}},elevation:{type:String,default:null,validator(e){return Object.values(B).includes(e)}},hasDraggableHandler:{type:Boolean,default:!0},hasActionsSlotDivider:{type:Boolean,default:!0},isSelectable:{type:Boolean,default:!0},isSelected:{type:Boolean,default:!1}},emits:{"icon-click":()=>!0,click:()=>!0,"update:is-selected":e=>!0},data(){return{ICONS:Object.freeze(v),ICON_SIZES:Object.freeze(z),RICH_LIST_ITEM_TYPE:Object.freeze(r),RICH_LIST_ITEM_STATE:Object.freeze(c),RICH_LIST_ITEM_SIZE:Object.freeze(m)}},computed:{classList(){return{"-ds-default":this.type===r.DEFAULT,"-ds-flat":this.type===r.FLAT,"-ds-horizontal":this.isHorizontal,"-ds-verticalWithMedia":this.isVertical&&this.hasMedia,"-ds-vertical":this.isVertical,"-ds-loading":this.state===c.LOADING,"-ds-dimmed":this.isDimmed,"-ds-interactive":this.isInteractive,"-ds-small":this.size===m.SMALL,...this.backgroundColor&&this.type!==r.FLAT&&{[`-ds-background-${this.backgroundColor}`]:!0},...this.elevation&&this.type!==r.FLAT&&{[`-ds-elevation-${this.elevation}`]:!0},"-ds-draggable":this.isDraggable&&!this.hasDraggableHandler,"-ds-has-media":this.hasMedia}},isHorizontal(){return this.layout===I.HORIZONTAL},isVertical(){return this.layout===I.VERTICAL},iconColorClass(){if(!(!this.iconColor||this.iconColor&&this.iconColorHex))return`-ds-${this.iconColor}`},iconColorStyle(){if(!(!this.iconColor||!this.iconColorHex))return{color:this.iconColorHex}},borderColorClass(){if(!(!this.borderColor||this.borderColor&&this.borderColorHex))return`-ds-border-${this.borderColor}`},borderColorStyle(){if(!(!this.borderColor||!this.borderColorHex))return{backgroundColor:this.borderColorHex}},hasMedia(){return!!this.$slots.media}}}),G={key:0,class:"ds-richListItem__mediaVertical -ds-dimmable"},j={class:"ds-richListItem__container -ds-dimmable"},F={key:0,class:"ds-richListItem__mediaHorizontal"},w={key:1,class:"ds-richListItem__dragAndDrop"},Z={key:2,class:"ds-richListItem__iconWrapper"},K={class:"ds-richListItem__content"},W={class:"ds-richListItem__rightContainer"},P={key:0,class:"ds-richListItem__metadata"},Y={key:2,class:"ds-richListItem__checkbox"},X={key:1,class:"ds-richListItem__metadata -ds-dimmable"};function q(e,a,A,O,k,N){const _=C("ds-icon"),h=C("ds-divider"),H=C("ds-checkbox");return t(),o("div",{class:i(["ds-richListItem",e.classList]),onClick:a[5]||(a[5]=d=>e.$emit("click",d))},[e.hasMedia&&e.isVertical?(t(),o("div",G,[l(e.$slots,"media",{},void 0,!0)])):s("",!0),n("div",j,[e.hasMedia&&e.isHorizontal?(t(),o("div",F,[l(e.$slots,"media",{},void 0,!0)])):s("",!0),e.isDraggable&&e.hasDraggableHandler?(t(),o("div",w,[f(_,{icon:e.ICONS.FA_BARS,class:i(["ds-richListItem__dragAndDropIcon",{[e.draggableIconClassName]:!!e.draggableIconClassName}]),size:e.size===e.RICH_LIST_ITEM_SIZE.SMALL?e.ICON_SIZES.XX_SMALL:e.ICON_SIZES.X_SMALL,onClick:a[0]||(a[0]=u(()=>{},["stop"]))},null,8,["icon","class","size"])])):s("",!0),e.icon?(t(),o("div",Z,[f(_,{icon:e.icon,class:i(["ds-richListItem__icon",e.iconColorClass]),size:e.size===e.RICH_LIST_ITEM_SIZE.SMALL?e.ICON_SIZES.XX_SMALL:e.ICON_SIZES.X_SMALL,style:p(e.iconColorStyle),onClick:a[1]||(a[1]=u(d=>e.$emit("icon-click"),["prevent"]))},null,8,["icon","size","class","style"])])):s("",!0),n("div",K,[l(e.$slots,"content",{},void 0,!0)]),n("div",W,[e.$slots.metadata&&e.isHorizontal?(t(),o("div",P,[l(e.$slots,"metadata",{},void 0,!0)])):s("",!0),e.$slots.actions?(t(),o("div",{key:1,class:"ds-richListItem__actionSlot",onClick:a[2]||(a[2]=u(()=>{},["stop"]))},[e.$slots.actions&&e.hasActionsSlotDivider&&e.isHorizontal?(t(),b(h,{key:0,"is-vertical":""})):s("",!0),l(e.$slots,"actions",{},void 0,!0)])):s("",!0),e.isSelectable?(t(),o("div",Y,[e.isHorizontal?(t(),b(h,{key:0,"is-vertical":""})):s("",!0),f(H,{"is-selected":e.isSelected,"onUpdate:isSelected":a[3]||(a[3]=d=>e.$emit("update:is-selected",d)),onClick:a[4]||(a[4]=u(()=>{},["stop"]))},null,8,["is-selected"])])):s("",!0)])]),e.$slots.metadata&&e.isVertical?(t(),o("div",X,[l(e.$slots,"metadata",{},void 0,!0)])):s("",!0),e.borderColorClass||e.borderColorStyle?(t(),o("div",{key:2,class:i(["ds-richListItem__border",e.borderColorClass]),style:p(e.borderColorStyle)},null,6)):s("",!0)],2)}const ie=R(T,[["render",q],["__scopeId","data-v-921cee2e"]]);T.__docgenInfo={displayName:"RichListItem",exportName:"default",description:"",tags:{},props:[{name:"type",type:{name:"RichListItemType"},defaultValue:{func:!1,value:"RICH_LIST_ITEM_TYPE.DEFAULT"}},{name:"layout",type:{name:"RichListItemLayout"},defaultValue:{func:!1,value:"RICH_LIST_ITEM_LAYOUT.HORIZONTAL"}},{name:"state",type:{name:"RichListItemState"},defaultValue:{func:!1,value:"RICH_LIST_ITEM_STATE.DEFAULT"}},{name:"size",type:{name:"RichListItemSize"},defaultValue:{func:!1,value:"RICH_LIST_ITEM_SIZE.MEDIUM"}},{name:"isInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isDimmed",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isDraggable",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"icon",type:{name:"IconItem"},defaultValue:{func:!1,value:"null"}},{name:"iconColor",type:{name:"IconColor"},defaultValue:{func:!1,value:"null"}},{name:"iconColorHex",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"borderColor",type:{name:"RichListItemBorderColor"},defaultValue:{func:!1,value:"null"}},{name:"borderColorHex",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"draggableIconClassName",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"backgroundColor",type:{name:"RichListItemBackgroundColor"},defaultValue:{func:!1,value:"RICH_LIST_ITEM_BACKGROUND_COLOR.NEUTRAL"}},{name:"elevation",type:{name:"RichListItemElevation"},defaultValue:{func:!1,value:"null"}},{name:"hasDraggableHandler",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"hasActionsSlotDivider",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isSelectable",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isSelected",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],events:[{name:"click"},{name:"icon-click"},{name:"update:is-selected"}],slots:[{name:"media"},{name:"content"},{name:"metadata"},{name:"actions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/RichList/RichListItem/RichListItem.vue"]};const J={...E},S={...L},g=y({name:"GroupRichListItem",props:{isExpanded:{type:Boolean,default:!1},borderColor:{type:String,default:null,validator(e){return Object.values(J).includes(e)}},borderColorHex:{type:String,default:null},backgroundColor:{type:String,default:S.NEUTRAL,validator(e){return Object.values(S).includes(e)}}},computed:{classList(){return{...this.backgroundColor&&{[`-ds-background-${this.backgroundColor}`]:!0}}},borderColorClass(){if(!(!this.borderColor||this.borderColor&&this.borderColorHex))return`-ds-border-${this.borderColor}`},borderColorStyle(){if(!(!this.borderColor||!this.borderColorHex))return{backgroundColor:this.borderColorHex}}}}),Q={class:"ds-groupRichListItem__wrapper"},x={class:"ds-groupRichListItem__parent"},ee={key:0,class:"ds-groupRichListItem__children"};function te(e,a,A,O,k,N){return t(),o("div",{class:i(["ds-groupRichListItem",e.classList])},[n("div",Q,[n("div",x,[l(e.$slots,"parent",{},void 0,!0)]),e.isExpanded?(t(),o("div",ee,[l(e.$slots,"children",{},void 0,!0)])):s("",!0)]),e.borderColorClass||e.borderColorStyle?(t(),o("div",{key:0,class:i(["ds-groupRichListItem__border",e.borderColorClass]),style:p(e.borderColorStyle)},null,6)):s("",!0)],2)}const ne=R(g,[["render",te],["__scopeId","data-v-46a9680f"]]);g.__docgenInfo={displayName:"GroupRichListItem",exportName:"default",description:"",tags:{},props:[{name:"isExpanded",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"borderColor",type:{name:"GroupRichListItemBorderColor"},defaultValue:{func:!1,value:"null"}},{name:"borderColorHex",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"backgroundColor",type:{name:"GroupRichListItemBackgroundColor"},defaultValue:{func:!1,value:"GROUP_RICH_LIST_ITEM_BACKGROUND_COLOR.NEUTRAL"}}],slots:[{name:"parent"},{name:"children"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/RichList/GroupRichListItem/GroupRichListItem.vue"]};export{ne as G,r as R,m as a,I as b,c,E as d,L as e,B as f,S as g,J as h,ie as i};
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
import{G as n,g,a,c as s,h as D,f as _,i as b,R as S}from"./GroupRichListItem-DMiaeyaS.js";import{D as T}from"./Divider-D2yDhW46.js";import{c,I as d}from"./Icon-BiVaixmr.js";import"./vue.esm-bundler-BSCmGRHc.js";import"./Checkbox-D_geau8n.js";import"./SelectionControl-BxCh7N21.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const{useArgs:E}=__STORYBOOK_MODULE_PREVIEW_API__,N={title:"Components/RichList/GroupRichListItem",component:n,decorators:[e=>({template:'<div style="display: flex;padding: 16px;"><story/></div>'})]},x={isExpanded:!1,borderColor:null,borderColorHex:"",backgroundColor:g.NEUTRAL,parent_size:a.MEDIUM,parent_elevation:null,parent_isDimmed:!1,parent_isDraggable:!1,parent_hasDraggableHandler:!0,parent_icon:null,parent_iconColor:c.NEUTRAL_WEAK,parent_iconColorHex:"",parent_hasActionsSlotDivider:!0,parent_isSelectable:!0,parent_isSelected:!0,parent_state:s.DEFAULT,parent_isInteractive:!0,child_size:a.MEDIUM,child_elevation:null,child_isDimmed:!1,child_isDraggable:!1,child_hasDraggableHandler:!0,child_icon:null,child_iconColor:c.NEUTRAL_WEAK,child_iconColorHex:"",child_hasActionsSlotDivider:!0,child_isSelectable:!0,child_isSelected:!0,child_state:s.DEFAULT,child_isInteractive:!0},H={borderColor:{options:[null,...Object.values(D)],control:"select"},borderColorHex:{control:"text"},backgroundColor:{options:Object.values(g),control:"select"},parent_state:{options:Object.values(s),control:"select"},parent_size:{options:Object.values(a),control:"select"},parent_iconColor:{options:Object.values(c),control:"select"},parent_icon:{options:[null,...Object.keys(d)],control:"select"},parent_iconColorHex:{control:"text"},parent_elevation:{options:[null,...Object.values(_)],control:"select"},child_state:{options:Object.values(s),control:"select"},child_size:{options:Object.values(a),control:"select"},child_iconColor:{options:Object.values(c),control:"select"},child_icon:{options:[null,...Object.keys(d)],control:"select"},child_iconColorHex:{control:"text"},child_elevation:{options:[null,...Object.values(_)],control:"select"}},l="<template #content>Content slot</template><template #metadata>Metadata slot</template><template #actions>ACS</template>",v=e=>(e.argTypes=H,e.args=x,e.parameters={layout:"fullscreen",design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=8505-126430&mode=design&t=7Ay1DzrwONAPwSGv-4"}},e),L=e=>{const[O,t]=E();return{components:{GroupRichListItem:n,RichListItem:b,Divider:T},setup(){return e},data(){return{RICH_LIST_ITEM_TYPE:Object.freeze(S),RICH_LIST_ITEM_STATE:Object.freeze(s),ICONS:Object.freeze(d)}},methods:{updateParentIsSelected(i){t({parent_isSelected:i})},updateChildIsSelected(i){t({child_isSelected:i})},onClick(){t({isExpanded:!this.isExpanded})}},template:`
|
|
2
|
+
<group-rich-list-item
|
|
3
|
+
:is-expanded="isExpanded"
|
|
4
|
+
:border-color="borderColor"
|
|
5
|
+
:border-color-hex="borderColorHex"
|
|
6
|
+
:background-color="backgroundColor"
|
|
7
|
+
>
|
|
8
|
+
<template #parent>
|
|
9
|
+
<rich-list-item
|
|
10
|
+
:state="parent_state"
|
|
11
|
+
:is-dimmed="parent_isDimmed"
|
|
12
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
13
|
+
:is-selectable="parent_isSelectable"
|
|
14
|
+
:is-selected="parent_isSelected"
|
|
15
|
+
:size="parent_size"
|
|
16
|
+
:is-interactive="parent_isInteractive"
|
|
17
|
+
:is-draggable="parent_isDraggable"
|
|
18
|
+
:icon="ICONS[parent_icon]"
|
|
19
|
+
:icon-color="parent_iconColor"
|
|
20
|
+
:icon-color-hex="parent_iconColorHex"
|
|
21
|
+
:has-draggable-handler="parent_hasDraggableHandler"
|
|
22
|
+
:has-actions-slot-divider="parent_hasActionsSlotDivider"
|
|
23
|
+
@click="onClick"
|
|
24
|
+
@update:is-selected="updateParentIsSelected"
|
|
25
|
+
>
|
|
26
|
+
${l}
|
|
27
|
+
</rich-list-item>
|
|
28
|
+
</template>
|
|
29
|
+
<template #children>
|
|
30
|
+
<rich-list-item
|
|
31
|
+
:state="child_state"
|
|
32
|
+
:is-dimmed="child_isDimmed"
|
|
33
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
34
|
+
:is-selectable="child_isSelectable"
|
|
35
|
+
:is-selected="child_isSelected"
|
|
36
|
+
:size="child_size"
|
|
37
|
+
:is-interactive="child_isInteractive"
|
|
38
|
+
:is-draggable="child_isDraggable"
|
|
39
|
+
:icon="ICONS[child_icon]"
|
|
40
|
+
:icon-color="child_iconColor"
|
|
41
|
+
:icon-color-hex="child_iconColorHex"
|
|
42
|
+
:has-draggable-handler="child_hasDraggableHandler"
|
|
43
|
+
:has-actions-slot-divider="child_hasActionsSlotDivider"
|
|
44
|
+
@update:is-selected="updateChildIsSelected"
|
|
45
|
+
>
|
|
46
|
+
${l}
|
|
47
|
+
</rich-list-item>
|
|
48
|
+
</template>
|
|
49
|
+
</group-rich-list-item>
|
|
50
|
+
`}},r=v(L.bind({})),R=e=>{const[O,t]=E();return{components:{GroupRichListItem:n,RichListItem:b,Divider:T},setup(){return e},data(){return{RICH_LIST_ITEM_TYPE:Object.freeze(S),RICH_LIST_ITEM_STATE:Object.freeze(s),ICONS:Object.freeze(d)}},methods:{updateParentIsSelected(i){t({parent_isSelected:i})},updateChildIsSelected(i){t({child_isSelected:i})},onClick(){t({isExpanded:!this.isExpanded})}},template:`
|
|
51
|
+
<group-rich-list-item
|
|
52
|
+
:is-expanded="isExpanded"
|
|
53
|
+
:border-color="borderColor"
|
|
54
|
+
:border-color-hex="borderColorHex"
|
|
55
|
+
:background-color="backgroundColor"
|
|
56
|
+
>
|
|
57
|
+
<template #parent>
|
|
58
|
+
<rich-list-item
|
|
59
|
+
:state="parent_state"
|
|
60
|
+
:is-dimmed="parent_isDimmed"
|
|
61
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
62
|
+
:is-selectable="parent_isSelectable"
|
|
63
|
+
:is-selected="parent_isSelected"
|
|
64
|
+
:size="parent_size"
|
|
65
|
+
:is-interactive="parent_isInteractive"
|
|
66
|
+
:is-draggable="parent_isDraggable"
|
|
67
|
+
:icon="ICONS[parent_icon]"
|
|
68
|
+
:icon-color="parent_iconColor"
|
|
69
|
+
:icon-color-hex="parent_iconColorHex"
|
|
70
|
+
:has-draggable-handler="parent_hasDraggableHandler"
|
|
71
|
+
:has-actions-slot-divider="parent_hasActionsSlotDivider"
|
|
72
|
+
@click="onClick"
|
|
73
|
+
@update:is-selected="updateParentIsSelected"
|
|
74
|
+
>
|
|
75
|
+
${l}
|
|
76
|
+
</rich-list-item>
|
|
77
|
+
</template>
|
|
78
|
+
<template #children>
|
|
79
|
+
<rich-list-item
|
|
80
|
+
:state="child_state"
|
|
81
|
+
:is-dimmed="child_isDimmed"
|
|
82
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
83
|
+
:is-selectable="child_isSelectable"
|
|
84
|
+
:is-selected="child_isSelected"
|
|
85
|
+
:size="child_size"
|
|
86
|
+
:is-interactive="child_isInteractive"
|
|
87
|
+
:is-draggable="child_isDraggable"
|
|
88
|
+
:icon="ICONS[child_icon]"
|
|
89
|
+
:icon-color="child_iconColor"
|
|
90
|
+
:icon-color-hex="child_iconColorHex"
|
|
91
|
+
:has-draggable-handler="child_hasDraggableHandler"
|
|
92
|
+
:has-actions-slot-divider="child_hasActionsSlotDivider"
|
|
93
|
+
@update:is-selected="updateChildIsSelected"
|
|
94
|
+
>
|
|
95
|
+
${l}
|
|
96
|
+
</rich-list-item>
|
|
97
|
+
<divider />
|
|
98
|
+
<rich-list-item
|
|
99
|
+
:state="child_state"
|
|
100
|
+
:is-dimmed="child_isDimmed"
|
|
101
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
102
|
+
:is-selectable="child_isSelectable"
|
|
103
|
+
:is-selected="child_isSelected"
|
|
104
|
+
:size="child_size"
|
|
105
|
+
:is-interactive="child_isInteractive"
|
|
106
|
+
:is-draggable="child_isDraggable"
|
|
107
|
+
:icon="ICONS[child_icon]"
|
|
108
|
+
:icon-color="child_iconColor"
|
|
109
|
+
:icon-color-hex="child_iconColorHex"
|
|
110
|
+
:has-draggable-handler="child_hasDraggableHandler"
|
|
111
|
+
:has-actions-slot-divider="child_hasActionsSlotDivider"
|
|
112
|
+
@update:is-selected="updateChildIsSelected"
|
|
113
|
+
>
|
|
114
|
+
${l}
|
|
115
|
+
</rich-list-item>
|
|
116
|
+
<divider />
|
|
117
|
+
<rich-list-item
|
|
118
|
+
:state="child_state"
|
|
119
|
+
:is-dimmed="child_isDimmed"
|
|
120
|
+
:type="RICH_LIST_ITEM_TYPE.FLAT"
|
|
121
|
+
:is-selectable="child_isSelectable"
|
|
122
|
+
:is-selected="child_isSelected"
|
|
123
|
+
:size="child_size"
|
|
124
|
+
:is-interactive="child_isInteractive"
|
|
125
|
+
:is-draggable="child_isDraggable"
|
|
126
|
+
:icon="ICONS[child_icon]"
|
|
127
|
+
:icon-color="child_iconColor"
|
|
128
|
+
:icon-color-hex="child_iconColorHex"
|
|
129
|
+
:has-draggable-handler="child_hasDraggableHandler"
|
|
130
|
+
:has-actions-slot-divider="child_hasActionsSlotDivider"
|
|
131
|
+
@update:is-selected="updateChildIsSelected"
|
|
132
|
+
>
|
|
133
|
+
${l}
|
|
134
|
+
</rich-list-item>
|
|
135
|
+
</template>
|
|
136
|
+
</group-rich-list-item>
|
|
137
|
+
`}},o=v(R.bind({}));var p,h,m;r.parameters={...r.parameters,docs:{...(p=r.parameters)==null?void 0:p.docs,source:{originalSource:"expandStory(OneChildStoryTemplate.bind({}))",...(m=(h=r.parameters)==null?void 0:h.docs)==null?void 0:m.source}}};var I,u,C;o.parameters={...o.parameters,docs:{...(I=o.parameters)==null?void 0:I.docs,source:{originalSource:"expandStory(MultipleChildStoryTemplate.bind({}))",...(C=(u=o.parameters)==null?void 0:u.docs)==null?void 0:C.source}}};const k=["OneChild","MultipleChild"];export{o as MultipleChild,r as OneChild,k as __namedExportsOrder,N as default};
|