@bethinkpl/design-system 26.15.1 → 26.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (264) hide show
  1. package/.eslintrc.cjs +9 -0
  2. package/dist/design-system.umd.cjs +18 -18
  3. package/dist/design-system.umd.cjs.map +1 -1
  4. package/dist/lib/js/components/Buttons/HelpButton/HelpButton.vue.d.ts +40 -0
  5. package/dist/lib/js/components/Buttons/HelpButton/index.d.ts +3 -0
  6. package/dist/lib/js/components/Chip/Chip.vue.d.ts +14 -15
  7. package/dist/lib/js/components/DatePickers/DateBox/DateBox.vue.d.ts +1 -1
  8. package/dist/lib/js/components/DatePickers/DatePicker/DatePicker.vue.d.ts +2 -2
  9. package/dist/lib/js/components/DatePickers/DateRangePicker/DateRangePicker.vue.d.ts +1 -1
  10. package/dist/lib/js/components/Form/FormField/FormField.consts.d.ts +9 -0
  11. package/dist/lib/js/components/Form/FormField/FormField.stories.shared.d.ts +5 -0
  12. package/dist/lib/js/components/Form/FormField/FormField.types.d.ts +21 -0
  13. package/dist/lib/js/components/Form/FormField/FormField.utils.d.ts +11 -0
  14. package/dist/lib/js/components/Form/FormField/FormField.vue.d.ts +20 -0
  15. package/dist/lib/js/components/Form/FormField/FormFieldMessage/FormFieldMessage.vue.d.ts +30 -0
  16. package/dist/lib/js/components/Form/FormField/FormFieldMessage/index.d.ts +3 -0
  17. package/dist/lib/js/components/Form/FormField/index.d.ts +5 -0
  18. package/dist/lib/js/components/Form/InputField/InputField.types.d.ts +12 -0
  19. package/dist/lib/js/components/Form/InputField/InputField.vue.d.ts +72 -0
  20. package/dist/lib/js/components/Form/InputField/index.d.ts +3 -0
  21. package/dist/lib/js/components/Form/PasswordField/PasswordField.vue.d.ts +70 -0
  22. package/dist/lib/js/components/Form/PasswordField/index.d.ts +3 -0
  23. package/dist/lib/js/components/Modals/Modal/Modal.consts.d.ts +8 -4
  24. package/dist/lib/js/components/Modals/Modal/Modal.vue.d.ts +15 -14
  25. package/dist/lib/js/components/Modals/ModalDialog/ModalDialog.vue.d.ts +18 -18
  26. package/dist/lib/js/components/Toast/Toast.vue.d.ts +2 -2
  27. package/dist/lib/js/index.d.ts +7 -0
  28. package/docs/assets/{AccessStatus-plchnY0B.js → AccessStatus-DW-L4l_0.js} +1 -1
  29. package/docs/assets/{AccessStatus.stories-DIIoog2Q.js → AccessStatus.stories-DwCxxAOP.js} +1 -1
  30. package/docs/assets/Avatar-CRVC-fPA.js +1 -0
  31. package/docs/assets/{Avatar.stories-9Vth29zT.js → Avatar.stories-D7i8UwP9.js} +1 -1
  32. package/docs/assets/{Badge-BbvNKG41.js → Badge-h4Z2ZKD4.js} +1 -1
  33. package/docs/assets/{Badge.stories-CKPGT_pt.js → Badge.stories-Bl04pHS_.js} +1 -1
  34. package/docs/assets/{BadgeScore-BOOWTi6N.js → BadgeScore-CuteYyZb.js} +1 -1
  35. package/docs/assets/{BadgeScore.stories-ERFMPhhE.js → BadgeScore.stories-BvHEI0pW.js} +1 -1
  36. package/docs/assets/{Banner-DXAd9x-3.js → Banner-sTfmX99M.js} +1 -1
  37. package/docs/assets/{Banner.stories-BC2VxrMC.js → Banner.stories-qhUSAG8g.js} +1 -1
  38. package/docs/assets/BasicRichListItem-C93Qb4K6.js +1 -0
  39. package/docs/assets/{BasicRichListItem.stories-BJZo9YF9.js → BasicRichListItem.stories-B2smX5s7.js} +2 -2
  40. package/docs/assets/{BlockadeStatus-D1j0ZWIW.js → BlockadeStatus-B0FY65_h.js} +1 -1
  41. package/docs/assets/{BlockedeStatus.stories-BKi05Ndl.js → BlockedeStatus.stories-DZ1mfq2q.js} +1 -1
  42. package/docs/assets/{Button-C5dr6u6F.js → Button-CRTJWjWJ.js} +1 -1
  43. package/docs/assets/{Button.stories-Da2LsOLk.js → Button.stories-BOpQOZ6x.js} +1 -1
  44. package/docs/assets/Card-C2-UB9KC.js +1 -0
  45. package/docs/assets/{Card.stories-Bqmd77lg.js → Card.stories-CI8H4t9g.js} +1 -1
  46. package/docs/assets/CardExpandable-BMUVeR31.js +1 -0
  47. package/docs/assets/{CardExpandable.stories-DtC5egGK.js → CardExpandable.stories-CPAZ4mof.js} +1 -1
  48. package/docs/assets/Checkbox-CIfSektM.js +1 -0
  49. package/docs/assets/{Checkbox.stories-BUIzgcCC.js → Checkbox.stories-Dt5C89R2.js} +1 -1
  50. package/docs/assets/{Chip-BJcjfD8j.js → Chip-Bi-iKYH0.js} +1 -1
  51. package/docs/assets/{Chip.stories-Dgmetn8m.js → Chip.stories-BukfI_wY.js} +1 -1
  52. package/docs/assets/{Color-ERTF36HU-DaHgyI5V.js → Color-ERTF36HU-Cor5XXAu.js} +1 -1
  53. package/docs/assets/{Colors.stories-BrNisWwH.js → Colors.stories-yICh_E96.js} +1 -1
  54. package/docs/assets/{ColorsThemes.stories-DvZl0m40.js → ColorsThemes.stories-CKiphr3E.js} +1 -1
  55. package/docs/assets/{ColorsTokensLms.stories-D3nA1ro1.js → ColorsTokensLms.stories-C_hRq1fa.js} +1 -1
  56. package/docs/assets/{ColorsTokensPrimaryBodywork.stories-w4A7RjpQ.js → ColorsTokensPrimaryBodywork.stories-TzJMcnGg.js} +1 -1
  57. package/docs/assets/{ColorsTokensPrimaryWnl.stories-CncgXEG5.js → ColorsTokensPrimaryWnl.stories-CCArJaTw.js} +1 -1
  58. package/docs/assets/{CounterToggle-DKRrZ9t2.js → CounterToggle-D3jTLdlU.js} +1 -1
  59. package/docs/assets/{CounterToggle.stories-DEP60zRp.js → CounterToggle.stories-BZAgprZf.js} +1 -1
  60. package/docs/assets/{DateBox.stories-y5_2vs0g.js → DateBox.stories-CNTaIflE.js} +3 -3
  61. package/docs/assets/{DatePicker-QHo-i7qh.js → DatePicker-aMS5YOMW.js} +1 -1
  62. package/docs/assets/{DatePicker.stories-4hPgpb1-.js → DatePicker.stories-DnojtGGT.js} +1 -1
  63. package/docs/assets/{DateRangePicker-B0NAwdsr.js → DateRangePicker-B25oMOoU.js} +1 -1
  64. package/docs/assets/{DateRangePicker.stories-BXQLC6L-.js → DateRangePicker.stories-CaIkM98h.js} +1 -1
  65. package/docs/assets/{Divider-9o-i_zKL.js → Divider-BNN8PhWF.js} +1 -1
  66. package/docs/assets/{Divider.stories-IQKEznYT.js → Divider.stories-DQGq5WIM.js} +1 -1
  67. package/docs/assets/{DocsRenderer-CFRXHY34-rC6r6xBG.js → DocsRenderer-CFRXHY34-DsMNfqFA.js} +5 -5
  68. package/docs/assets/{Drawer-ClrSDwUZ.js → Drawer-CgEP8-bU.js} +1 -1
  69. package/docs/assets/{Drawer.stories-DR-CXra3.js → Drawer.stories-CetCbwOV.js} +1 -1
  70. package/docs/assets/{DrawerContent-D6Bl5GA-.js → DrawerContent-Dna0k_5V.js} +1 -1
  71. package/docs/assets/{DrawerContent.stories-BR11egKi.js → DrawerContent.stories-BqJ3zitz.js} +1 -1
  72. package/docs/assets/{DrawerDivider-DMhjaSPk.js → DrawerDivider-BjBlvEOJ.js} +1 -1
  73. package/docs/assets/{DrawerDivider.stories-DdcVRbtO.js → DrawerDivider.stories-BN_G8JML.js} +1 -1
  74. package/docs/assets/DrawerHeader-CYgh5yLP.js +1 -0
  75. package/docs/assets/{DrawerHeader.stories-DnPlkGmI.js → DrawerHeader.stories-CsM4PkKY.js} +1 -1
  76. package/docs/assets/{DrawerListItem-dizQZUbe.js → DrawerListItem-BOEqjnvB.js} +1 -1
  77. package/docs/assets/{DrawerListItem.stories-pVTEuckG.js → DrawerListItem.stories-Br_BBZTl.js} +1 -1
  78. package/docs/assets/{DrawerListItemGroup-B5XadRVV.js → DrawerListItemGroup-qG_7CJ2Z.js} +1 -1
  79. package/docs/assets/{DrawerListItemGroup.stories-pOGG952w.js → DrawerListItemGroup.stories-Dj7XnOfZ.js} +1 -1
  80. package/docs/assets/{DrawerSection-HBM59yvF.js → DrawerSection-Bk-qjO-U.js} +1 -1
  81. package/docs/assets/{DrawerSection.stories-tQT_zWBt.js → DrawerSection.stories-bac3ulNN.js} +1 -1
  82. package/docs/assets/DrawerTile-3UrW0AGT.js +1 -0
  83. package/docs/assets/{DrawerTile.stories-6JDnzzyo.js → DrawerTile.stories-AeySW4m1.js} +1 -1
  84. package/docs/assets/Dropdown-vkyblifO.js +1 -0
  85. package/docs/assets/{Dropdown.stories-DLo-4_G3.js → Dropdown.stories-Bvkxpx3n.js} +1 -1
  86. package/docs/assets/{FeatureIcon-BoUhuGOr.js → FeatureIcon-DClL1vj4.js} +1 -1
  87. package/docs/assets/{FeatureIcon.stories-H_yUD4i4.js → FeatureIcon.stories-D1igtEZB.js} +1 -1
  88. package/docs/assets/FormField-u4PxhF2k.js +1 -0
  89. package/docs/assets/FormField.stories-DXTo4Z_Y.js +40 -0
  90. package/docs/assets/FormField.stories.shared-D4ktxakv.js +1 -0
  91. package/docs/assets/FormFieldMessage-JNi0OUbH.js +1 -0
  92. package/docs/assets/FormFieldMessage.stories-lK_yWKrc.js +32 -0
  93. package/docs/assets/GroupRichListItem-D8nu5Fv9.js +1 -0
  94. package/docs/assets/{GroupRichListItem.stories-C25AujXP.js → GroupRichListItem.stories-DKL_YGxk.js} +1 -1
  95. package/docs/assets/HelpButton-Lb2k2yp9.js +1 -0
  96. package/docs/assets/HelpButton.stories-D4-sk1wV.js +17 -0
  97. package/docs/assets/{Icon-I3Cniv10.js → Icon-BxW-ny3A.js} +5 -5
  98. package/docs/assets/{Icon.stories-BhnUVRrV.js → Icon.stories-DaFYO7BK.js} +1 -1
  99. package/docs/assets/IconButton-C0_vxVJn.js +1 -0
  100. package/docs/assets/{IconButton.stories-B8QjmTyV.js → IconButton.stories-BB9x50r9.js} +1 -1
  101. package/docs/assets/{IconText-CKJ4jGzm.js → IconText-Bl-DK5dv.js} +1 -1
  102. package/docs/assets/{IconText.stories-B5zjHqug.js → IconText.stories-BbDEYbhY.js} +1 -1
  103. package/docs/assets/{Image-Dbv2u4ta.js → Image-DXVGtCU-.js} +1 -1
  104. package/docs/assets/{Image.stories-CUWPBT5K.js → Image.stories-CmX0xWLp.js} +1 -1
  105. package/docs/assets/InputField-CjqHh5Cm.js +1 -0
  106. package/docs/assets/InputField.stories-B6VUcIZA.js +44 -0
  107. package/docs/assets/{ItemsList-CJTCYbgI.js → ItemsList-BT-ch5Ki.js} +1 -1
  108. package/docs/assets/{LoadingBar-Dc_eLNsl.js → LoadingBar-CoXHVlvM.js} +1 -1
  109. package/docs/assets/{LoadingBar.stories-DWH4VmcD.js → LoadingBar.stories-B_l4HaQT.js} +1 -1
  110. package/docs/assets/Modal-xuXnp0B3.js +1 -0
  111. package/docs/assets/{Modal.stories-0zzyLX_Z.js → Modal.stories-BSYz4NUn.js} +1 -1
  112. package/docs/assets/{ModalDialog-BuO78uuh.js → ModalDialog-D6jipNV9.js} +1 -1
  113. package/docs/assets/{ModalDialog.stories-lBI09xqp.js → ModalDialog.stories-y0DTZLJ9.js} +1 -1
  114. package/docs/assets/{NumberInCircle-DnPE2szs.js → NumberInCircle-iJQYZsfG.js} +1 -1
  115. package/docs/assets/{NumberInCircle.stories-Tn0v6S_I.js → NumberInCircle.stories-BL7R6Ey9.js} +1 -1
  116. package/docs/assets/OutlineDivider-DpgF_2B_.js +1 -0
  117. package/docs/assets/{OutlineDivider.stories-D9Hzkdbe.js → OutlineDivider.stories-CoI8u05k.js} +1 -1
  118. package/docs/assets/{OutlineItem-1BOyMbS2.js → OutlineItem-COSzRi1t.js} +1 -1
  119. package/docs/assets/{OutlineItem.stories-DZ_RXCGO.js → OutlineItem.stories-DPbUVNt7.js} +1 -1
  120. package/docs/assets/{OutlineSectionHeader-LGOAi424.js → OutlineSectionHeader-C7vAvTfl.js} +1 -1
  121. package/docs/assets/{OutlineSectionHeader.stories-PPIsaHhR.js → OutlineSectionHeader.stories-DTI32viO.js} +1 -1
  122. package/docs/assets/OverlayHeader-DYU6A8e-.js +1 -0
  123. package/docs/assets/{OverlayHeader.stories-D0TRoa1n.js → OverlayHeader.stories-Daj1gEMT.js} +1 -1
  124. package/docs/assets/{PageHeader-DkHlb7_P.js → PageHeader-BKDJxn58.js} +1 -1
  125. package/docs/assets/{PageHeader.stories-WThxfLse.js → PageHeader.stories-BRdESIfF.js} +1 -1
  126. package/docs/assets/{Pagination-CgO9MoPY.js → Pagination-CruPXU6i.js} +1 -1
  127. package/docs/assets/{Pagination.stories-CL9tb6Sx.js → Pagination.stories-pk1h1NdC.js} +1 -1
  128. package/docs/assets/PasswordField-D2k9x-t0.js +1 -0
  129. package/docs/assets/PasswordField.stories-BMwEm_DO.js +42 -0
  130. package/docs/assets/{PopOver-BDVCOkO6.js → PopOver-BjBlXVwF.js} +1 -1
  131. package/docs/assets/{PopOver.stories-CmDQPumC.js → PopOver.stories-3QX4Ga4o.js} +1 -1
  132. package/docs/assets/{ProgressBar-q_I44DQc.js → ProgressBar-VrWJHC2p.js} +1 -1
  133. package/docs/assets/{ProgressBar.stories-Df10tpd-.js → ProgressBar.stories-CrZ2zJwI.js} +1 -1
  134. package/docs/assets/{ProgressDonutChart-DP55sH2Q.js → ProgressDonutChart-CJlokRW-.js} +1 -1
  135. package/docs/assets/{ProgressDonutChart.stories-CXJhJ1AH.js → ProgressDonutChart.stories-BRxY2dWI.js} +1 -1
  136. package/docs/assets/RadioButton-DO6I2WfN.js +1 -0
  137. package/docs/assets/{RadioButton.stories-NVFxjqN4.js → RadioButton.stories-C80hUDbi.js} +1 -1
  138. package/docs/assets/{RichListItem.stories-B3NGpkHT.js → RichListItem.stories-_8Hp41y-.js} +2 -2
  139. package/docs/assets/{SectionHeader-ByewlGaG.js → SectionHeader-BvZF_uZR.js} +1 -1
  140. package/docs/assets/{SectionHeader.stories-CTANEOdf.js → SectionHeader.stories-BjccJa_1.js} +1 -1
  141. package/docs/assets/{SectionTitle-DLcFKzRH.js → SectionTitle-DElPh1Y0.js} +1 -1
  142. package/docs/assets/{SectionTitle.stories-Dybq4paM.js → SectionTitle.stories-BOEziRr6.js} +1 -1
  143. package/docs/assets/{SelectList-B323Y2el.js → SelectList-IYj9X3z5.js} +1 -1
  144. package/docs/assets/{SelectList.stories-BCS6zdJ9.js → SelectList.stories-B0jlx1dv.js} +1 -1
  145. package/docs/assets/{SelectListItem-DfLqJR-_.js → SelectListItem-DxlYAAqR.js} +1 -1
  146. package/docs/assets/{SelectListItem.stories-m8BTHS53.js → SelectListItem.stories-Cbgqd3q6.js} +1 -1
  147. package/docs/assets/{SelectListItemDivider-lDLIwtP8.js → SelectListItemDivider-Bt5LuCh6.js} +1 -1
  148. package/docs/assets/{SelectListItemDivider.stories-BZ6_HOBG.js → SelectListItemDivider.stories-BFdzCK8L.js} +1 -1
  149. package/docs/assets/{SelectListItemTile-DzAuBa66.js → SelectListItemTile-Ci7UUkBi.js} +1 -1
  150. package/docs/assets/{SelectListItemTile.stories-n2MJqr9U.js → SelectListItemTile.stories-D53QYgoj.js} +1 -1
  151. package/docs/assets/{SelectListItemToggle-DJ_P6PIB.js → SelectListItemToggle-uyZKP9l-.js} +1 -1
  152. package/docs/assets/{SelectListItemToggle.stories-yej5J6y8.js → SelectListItemToggle.stories-CHKImbbO.js} +1 -2
  153. package/docs/assets/SelectListSectionTitle-CytprfLI.js +1 -0
  154. package/docs/assets/{SelectListSectionTitle.stories-NKPegok4.js → SelectListSectionTitle.stories-CHaM0ezF.js} +1 -1
  155. package/docs/assets/{SelectionControl-CwdtLuOD.js → SelectionControl-D6-Q7FjJ.js} +1 -1
  156. package/docs/assets/{SelectionTile-hjRK7Lwc.js → SelectionTile-BXjJtuZK.js} +2 -2
  157. package/docs/assets/{SelectionTile.stories-DRdGcDuJ.js → SelectionTile.stories-Cdv1DqAb.js} +1 -1
  158. package/docs/assets/{Skeleton-DhyJ4ZKG.js → Skeleton-a6juZJ74.js} +3 -3
  159. package/docs/assets/{Skeleton.stories-CsZjBoj1.js → Skeleton.stories-CU_bwj6g.js} +1 -1
  160. package/docs/assets/SurveyQuestionOpenEnded-CU362h7V.js +1 -0
  161. package/docs/assets/{SurveyQuestionOpenEnded.stories-Is_s49TT.js → SurveyQuestionOpenEnded.stories-DTfe-q_l.js} +1 -1
  162. package/docs/assets/SurveyQuestionScale-BFW9EZtg.js +1 -0
  163. package/docs/assets/{SurveyQuestionScale.stories-BqOjFThb.js → SurveyQuestionScale.stories-I6PfDZOp.js} +1 -1
  164. package/docs/assets/{SurveyToggle-CCF4WE7n.js → SurveyToggle-BeOR_ZKx.js} +1 -1
  165. package/docs/assets/{SurveyToggle.stories-DySS4Jzx.js → SurveyToggle.stories-DJz0MG-Y.js} +1 -1
  166. package/docs/assets/Switch-DsNVsFhH.js +1 -0
  167. package/docs/assets/{Switch.stories-Bq6_6t39.js → Switch.stories-C1-OEnaq.js} +1 -1
  168. package/docs/assets/{TabItem-Bn_qIbPX.js → TabItem-KyXcr_5Z.js} +1 -1
  169. package/docs/assets/{TabItem.stories-ZPYw1uH1.js → TabItem.stories-BfCXfirX.js} +1 -1
  170. package/docs/assets/{TextGroup-AUUBIFJZ.js → TextGroup-BGFapzPu.js} +1 -1
  171. package/docs/assets/{TextGroup.stories-CqwkdBAO.js → TextGroup.stories-WgHYdmrz.js} +1 -1
  172. package/docs/assets/{ThreeColumnLayout-DXA1815_.js → ThreeColumnLayout-DLj9ww3X.js} +1 -1
  173. package/docs/assets/{ThreeColumnLayout.stories-BA08mTZ7.js → ThreeColumnLayout.stories-BD0ZEOam.js} +1 -1
  174. package/docs/assets/{Tile-3fvrXM7M.js → Tile-CV9qCJCf.js} +1 -1
  175. package/docs/assets/{Tile.sb.shared-Crj50ugV.js → Tile.sb.shared-CYs-5pZ0.js} +1 -1
  176. package/docs/assets/{Tile.stories-0SQaiGz7.js → Tile.stories-32aU_anv.js} +1 -1
  177. package/docs/assets/{Toast-CTbKhm1i.js → Toast-p9LnCPmL.js} +1 -1
  178. package/docs/assets/{Toast.stories-hUEtnOQn.js → Toast.stories-zF82pwwv.js} +1 -1
  179. package/docs/assets/{ToggleButton-D-t1sDTL.js → ToggleButton-D_HZ-8jw.js} +1 -1
  180. package/docs/assets/{ToggleButton.stories-CaAweKdC.js → ToggleButton.stories-CV-iGLoy.js} +1 -1
  181. package/docs/assets/{Tooltip-DZi9yXjr.js → Tooltip-DKqXTPwf.js} +1 -1
  182. package/docs/assets/{Tooltip.stories-D-DHfToA.js → Tooltip.stories-D_SR7U8f.js} +1 -1
  183. package/docs/assets/{TypographyTokensLms.stories-CZpPPUwu.js → TypographyTokensLms.stories-qRJAJdvd.js} +1 -1
  184. package/docs/assets/{TypographyVariables.stories-B4Lg96R3.js → TypographyVariables.stories-B6W3MuIN.js} +1 -1
  185. package/docs/assets/{Well-D1j9q3W3.js → Well-Di8wsKpw.js} +1 -1
  186. package/docs/assets/{Well.stories-wgg6f6S7.js → Well.stories-D3CQkZun.js} +1 -1
  187. package/docs/assets/entry-preview-B1UVjA37.js +1 -0
  188. package/docs/assets/{entry-preview-docs-Bz8Se46p.js → entry-preview-docs-Cs1P1b8z.js} +1 -1
  189. package/docs/assets/{iframe-CKOJ9wC7.js → iframe-BH6Q2yq5.js} +11 -8
  190. package/docs/assets/{index-Be4sB5Yj.js → index-7TY-LtbS.js} +1 -1
  191. package/docs/assets/{index-0M4xY6Fw.js → index-BncE9pY5.js} +1 -1
  192. package/docs/assets/{preview-BIPjgpxe.js → preview-CQnQ4kXS.js} +2 -2
  193. package/docs/assets/preview-RZnfww4F.js +64 -0
  194. package/docs/assets/{string-B1AGRR5v.js → string-DZMRm3DC.js} +1 -1
  195. package/docs/assets/{vue-popper-DoPHnofs.js → vue-popper-CgJSQDC2.js} +1 -1
  196. package/docs/assets/vue.esm-bundler-CC_vsnCp.js +36 -0
  197. package/docs/iframe.html +1 -1
  198. package/docs/index.json +1 -1
  199. package/docs/project.json +1 -1
  200. package/lib/js/components/Badge/Badge.vue +6 -5
  201. package/lib/js/components/Buttons/Button/Button.spec.ts +3 -3
  202. package/lib/js/components/Buttons/HelpButton/HelpButton.spec.ts +87 -0
  203. package/lib/js/components/Buttons/HelpButton/HelpButton.stories.ts +70 -0
  204. package/lib/js/components/Buttons/HelpButton/HelpButton.vue +52 -0
  205. package/lib/js/components/Buttons/HelpButton/index.ts +3 -0
  206. package/lib/js/components/Chip/Chip.spec.ts +3 -2
  207. package/lib/js/components/Chip/Chip.vue +0 -1
  208. package/lib/js/components/DatePickers/DateBox/DateBox.stories.ts +0 -3
  209. package/lib/js/components/Form/FormField/FormField.consts.ts +10 -0
  210. package/lib/js/components/Form/FormField/FormField.spec.ts +138 -0
  211. package/lib/js/components/Form/FormField/FormField.stories.shared.ts +53 -0
  212. package/lib/js/components/Form/FormField/FormField.stories.ts +81 -0
  213. package/lib/js/components/Form/FormField/FormField.types.ts +17 -0
  214. package/lib/js/components/Form/FormField/FormField.utils.ts +24 -0
  215. package/lib/js/components/Form/FormField/FormField.vue +192 -0
  216. package/lib/js/components/Form/FormField/FormFieldMessage/FormFieldMessage.spec.ts +53 -0
  217. package/lib/js/components/Form/FormField/FormFieldMessage/FormFieldMessage.stories.ts +74 -0
  218. package/lib/js/components/Form/FormField/FormFieldMessage/FormFieldMessage.vue +89 -0
  219. package/lib/js/components/Form/FormField/FormFieldMessage/index.ts +2 -0
  220. package/lib/js/components/Form/FormField/index.ts +6 -0
  221. package/lib/js/components/Form/InputField/InputField.spec.ts +135 -0
  222. package/lib/js/components/Form/InputField/InputField.stories.ts +98 -0
  223. package/lib/js/components/Form/InputField/InputField.types.ts +13 -0
  224. package/lib/js/components/Form/InputField/InputField.vue +151 -0
  225. package/lib/js/components/Form/InputField/index.ts +3 -0
  226. package/lib/js/components/Form/PasswordField/PasswordField.spec.ts +73 -0
  227. package/lib/js/components/Form/PasswordField/PasswordField.stories.ts +88 -0
  228. package/lib/js/components/Form/PasswordField/PasswordField.vue +55 -0
  229. package/lib/js/components/Form/PasswordField/index.ts +3 -0
  230. package/lib/js/components/Modals/Modal/Modal.consts.ts +8 -2
  231. package/lib/js/components/Modals/Modal/Modal.vue +10 -3
  232. package/lib/js/components/SelectList/SelectListItemToggle/SelectListItemToggle.stories.ts +0 -1
  233. package/lib/js/components/SurveyQuestions/SurveyQuestionScale/SurveyQuestionScale.vue +43 -47
  234. package/lib/js/components/TabItem/TabItem.spec.ts +0 -1
  235. package/lib/js/components/Toast/Toast.vue +0 -2
  236. package/lib/js/index.ts +7 -0
  237. package/lib/js/styles/Borders/BorderSizes.stories.ts +1 -1
  238. package/lib/js/styles/ItemsList.vue +1 -1
  239. package/package.json +5 -5
  240. package/tsconfig.base.json +1 -2
  241. package/tsconfig.build.json +8 -0
  242. package/tsconfig.json +1 -6
  243. package/vite.config.ts +9 -1
  244. package/docs/assets/Avatar-CM7iogZ3.js +0 -1
  245. package/docs/assets/BasicRichListItem-quALUWxY.js +0 -1
  246. package/docs/assets/Card-KSW_Q55y.js +0 -1
  247. package/docs/assets/CardExpandable-yMDr4_fF.js +0 -1
  248. package/docs/assets/Checkbox-DAOkXx1R.js +0 -1
  249. package/docs/assets/DrawerHeader-AkG6Jq7W.js +0 -1
  250. package/docs/assets/DrawerTile-0-CB5w9j.js +0 -1
  251. package/docs/assets/Dropdown-CYFZ3OvV.js +0 -1
  252. package/docs/assets/GroupRichListItem-C_Gsy7fK.js +0 -1
  253. package/docs/assets/IconButton-BPKB5gT7.js +0 -1
  254. package/docs/assets/Modal-Cy1kzNhG.js +0 -1
  255. package/docs/assets/OutlineDivider-UaRb6wKt.js +0 -1
  256. package/docs/assets/OverlayHeader-u9AeOezr.js +0 -1
  257. package/docs/assets/RadioButton-DISpvFOt.js +0 -1
  258. package/docs/assets/SelectListSectionTitle-BFbrwNgw.js +0 -1
  259. package/docs/assets/SurveyQuestionOpenEnded-B_HbDRQs.js +0 -1
  260. package/docs/assets/SurveyQuestionScale-CiKDA0ax.js +0 -1
  261. package/docs/assets/Switch-Du-uh84v.js +0 -1
  262. package/docs/assets/entry-preview-lHccVHf5.js +0 -1
  263. package/docs/assets/preview-BQvHXGdy.js +0 -64
  264. package/docs/assets/vue.esm-bundler-DD4BrEtS.js +0 -36
@@ -1,4 +1,4 @@
1
- import{a as n,I as t,b as d}from"./Icon-I3Cniv10.js";import{w as f}from"./decorator-B_8W69Nd.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const N={title:"Components/Icons/Icon",component:n,decorators:[f]},u=o=>({components:{Icon:n},setup(){return o},template:'<div class="sbIconList__singleIcon"><icon :icon="ICONS[icon]" :size="size" :touchable="touchable" :spinning="spinning" :rotation="rotation" :flipped-vertical="flippedVertical" :flipped-horizontal="flippedHorizontal" /></div>',data(){return{ICONS:Object.freeze(t)}}}),e=u.bind({}),m={size:d.MEDIUM,icon:"HEAD_WITH_QUESTION_MARK",spinning:!1,touchable:!1,rotation:null,flippedVertical:!1,flippedHorizontal:!1},I={size:{control:"select",options:Object.values(d)},icon:{control:"select",options:Object.keys(t)}};e.argTypes=I;e.args=m;e.parameters={actions:{handles:["click"]},design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS---Components?node-id=1552%3A34963"}};const g=o=>({components:{Icon:n},setup(){return o},template:'<div class="sbIconList"><div v-for="(icon, iconName) in ICONS" :key="iconName" class="sbIconList__icon"><icon :icon="icon" :size="size" :touchable="touchable" :spinning="spinning" :rotation="rotation" :flipped-vertical="flippedVertical" :flipped-horizontal="flippedHorizontal" /><div>{{iconName}}</div></div></div>',data(){return{ICONS:Object.freeze(t)}}}),i=g.bind({});i.argTypes=I;i.args=m;var s,a,c;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`args => ({
1
+ import{a as n,I as t,b as d}from"./Icon-BxW-ny3A.js";import{w as f}from"./decorator-B_8W69Nd.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const N={title:"Components/Icons/Icon",component:n,decorators:[f]},u=o=>({components:{Icon:n},setup(){return o},template:'<div class="sbIconList__singleIcon"><icon :icon="ICONS[icon]" :size="size" :touchable="touchable" :spinning="spinning" :rotation="rotation" :flipped-vertical="flippedVertical" :flipped-horizontal="flippedHorizontal" /></div>',data(){return{ICONS:Object.freeze(t)}}}),e=u.bind({}),m={size:d.MEDIUM,icon:"HEAD_WITH_QUESTION_MARK",spinning:!1,touchable:!1,rotation:null,flippedVertical:!1,flippedHorizontal:!1},I={size:{control:"select",options:Object.values(d)},icon:{control:"select",options:Object.keys(t)}};e.argTypes=I;e.args=m;e.parameters={actions:{handles:["click"]},design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS---Components?node-id=1552%3A34963"}};const g=o=>({components:{Icon:n},setup(){return o},template:'<div class="sbIconList"><div v-for="(icon, iconName) in ICONS" :key="iconName" class="sbIconList__icon"><icon :icon="icon" :size="size" :touchable="touchable" :spinning="spinning" :rotation="rotation" :flipped-vertical="flippedVertical" :flipped-horizontal="flippedHorizontal" /><div>{{iconName}}</div></div></div>',data(){return{ICONS:Object.freeze(t)}}}),i=g.bind({});i.argTypes=I;i.args=m;var s,a,c;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  Icon
4
4
  },
@@ -0,0 +1 @@
1
+ import{a as c,b as s,I as S}from"./Icon-BxW-ny3A.js";import{h as u,B as N,i as O,I as r,f as a,b as d,g as o,D as _,d as m,c as p}from"./Button-CRTJWjWJ.js";import{b as B,d as v,j as A,c as I,g as U,e as y,y as i,f as b,h,C as M,l as C,o as l,k as f}from"./vue.esm-bundler-CC_vsnCp.js";import{i as R}from"./device-9fgosCm4.js";import{_ as z}from"./_plugin-vue_export-helper-DlAUqK2U.js";function D(){const e=B(!1),t=R();return{isHovered:e,mouseOver(){t||(e.value=!0)},mouseLeave(){t||(e.value=!1)},touchStart(){t&&(e.value=!0)},touchEnd(){t&&(e.value=!1)}}}const g={[o.XX_SMALL]:s.XXX_SMALL,[o.X_SMALL]:s.XX_SMALL,[o.SMALL]:s.X_SMALL,[o.MEDIUM]:s.SMALL,[o.LARGE]:s.MEDIUM},E=v({name:"IconButton",components:{WnlIcon:c,WnlButton:_},props:{size:{type:String,default:o.LARGE,validator(e){return Object.values(o).includes(e)}},radius:{type:String,default:d.CAPSULE,validator(e){return Object.values(d).includes(e)}},type:{type:String,default:a.ICON_ONLY,validator(e){return Object.values(a).includes(e)}},icon:{type:Object,required:!0,validator(e){return Object.values(S).includes(A(e))}},color:{type:String,default:r.PRIMARY,validator(e){return Object.values(r).includes(e)}},colorScheme:{type:String,default:O.ALL_IN_COLOR,validator(e){return Object.values(O).includes(e)}},elevation:{type:String,default:N.NONE,validator(e){return Object.values(N).includes(e)}},touchable:{type:Boolean,default:!0},state:{type:String,default:u.DEFAULT,validator(e){return Object.values(u).includes(e)}}},setup(){return{...D()}},data(){return{ICONS:Object.freeze(S),ICON_SIZES:Object.freeze(s),ICON_BUTTON_SIZES:Object.freeze(o),ICON_BUTTON_COLOR_SCHEMES:Object.freeze(O),ICON_BUTTON_TYPES:Object.freeze(a),ICON_BUTTON_STATES:Object.freeze(u),ICON_BUTTON_COLORS:Object.freeze(r),BUTTON_COLORS:Object.freeze(p)}},computed:{iconSize(){return this.type===a.ICON_ONLY?g[this.size]:this.size===o.XX_SMALL?s.XXX_SMALL:this.size===o.X_SMALL?s.XX_SMALL:s.X_SMALL},buttonType(){return this.type===a.ICON_ONLY?m.OUTLINED:this.type},computedColor(){if(!this.isButtonColor){if(this.type===a.ICON_ONLY)return this.color;throw new Error(`Color: ${this.color} is supported only in type: "icon-only"`)}},isButtonColor(){return Object.values(r).includes(this.color)},colorClassName(){return`-ds-color-${this.color}`}}});function j(e,t,X,Y,V,P){const T=C("wnl-icon"),L=C("wnl-button");return l(),I("div",{class:i(["ds-iconButton",{"-ds-xx-small":e.size===e.ICON_BUTTON_SIZES.XX_SMALL,"-ds-x-small":e.size===e.ICON_BUTTON_SIZES.X_SMALL,"-ds-small":e.size===e.ICON_BUTTON_SIZES.SMALL,"-ds-large":e.size===e.ICON_BUTTON_SIZES.LARGE,"-ds-hovered":e.state===e.ICON_BUTTON_STATES.HOVERED,"-ds-focused":e.state===e.ICON_BUTTON_STATES.FOCUSED,"-ds-disabled":e.state===e.ICON_BUTTON_STATES.DISABLED,"-ds-loading":e.state===e.ICON_BUTTON_STATES.LOADING,[e.colorClassName]:e.isButtonColor,"-ds-touchable":e.touchable}]),style:M({color:e.computedColor}),onMouseover:t[0]||(t[0]=(...n)=>e.mouseOver&&e.mouseOver(...n)),onMouseleave:t[1]||(t[1]=(...n)=>e.mouseLeave&&e.mouseLeave(...n)),onTouchstart:t[2]||(t[2]=(...n)=>e.touchStart&&e.touchStart(...n)),onTouchend:t[3]||(t[3]=(...n)=>e.touchEnd&&e.touchEnd(...n))},[e.$slots.default&&e.type!==e.ICON_BUTTON_TYPES.ICON_ONLY?(l(),I("div",{key:0,class:i(["ds-iconButton__label",{"-ds-neutral":e.colorScheme===e.ICON_BUTTON_COLOR_SCHEMES.NEUTRAL_LABEL}])},[b(e.$slots,"default",{},void 0,!0)],2)):U("",!0),y(L,{ref:"button",class:i(["ds-iconButton__button",{"-ds-iconOnly":e.type===e.ICON_BUTTON_TYPES.ICON_ONLY,"-ds-hovered":e.state===e.ICON_BUTTON_STATES.HOVERED,"-ds-focused":e.state===e.ICON_BUTTON_STATES.FOCUSED,"-ds-disabled":e.state===e.ICON_BUTTON_STATES.DISABLED}]),radius:e.radius,type:e.buttonType,state:e.isHovered?e.ICON_BUTTON_STATES.HOVERED:e.ICON_BUTTON_STATES.DEFAULT,elevation:e.elevation,color:e.isButtonColor?e.color:null},{default:h(()=>[e.state===e.ICON_BUTTON_STATES.LOADING?(l(),f(T,{key:0,class:"ds-iconButton__icon",icon:e.ICONS.FAD_SPINNER_THIRD,size:e.iconSize,spinning:""},null,8,["icon","size"])):(l(),f(T,{key:1,class:"ds-iconButton__icon",icon:e.icon,size:e.iconSize},null,8,["icon","size"]))]),_:1},8,["class","radius","type","state","elevation","color"])],38)}const F=z(E,[["render",j],["__scopeId","data-v-75d644c5"]]);E.__docgenInfo={displayName:"IconButton",exportName:"default",description:"",tags:{},props:[{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"ICON_BUTTON_SIZES.LARGE"}},{name:"radius",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_RADIUSES.CAPSULE"}},{name:"type",type:{name:"string"},defaultValue:{func:!1,value:"ICON_BUTTON_TYPES.ICON_ONLY"}},{name:"icon",type:{name:"object"},required:!0},{name:"color",type:{name:"string"},defaultValue:{func:!1,value:"ICON_BUTTON_COLORS.PRIMARY"}},{name:"colorScheme",type:{name:"string"},defaultValue:{func:!1,value:"ICON_BUTTON_COLOR_SCHEMES.ALL_IN_COLOR"}},{name:"elevation",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_ELEVATIONS.NONE"}},{name:"touchable",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"ICON_BUTTON_STATES.DEFAULT"}}],slots:[{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Buttons/IconButton/IconButton.vue"]};export{F as I};
@@ -1,4 +1,4 @@
1
- import{I as o}from"./IconButton-BPKB5gT7.js";import{I as N,f as T,b as S,g as I,h as g,B as v,i as D}from"./Button-C5dr6u6F.js";import{I as r}from"./Icon-I3Cniv10.js";import{w as F}from"./decorator-B_8W69Nd.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const q={title:"Components/Buttons/IconButton",component:o,decorators:[F]},h=e=>({components:{IconButton:o},setup(){return e},computed:{isInverted(){return this.color==="inverted"}},data(){return{ICONS:Object.freeze(r),ICON_BUTTON_COLORS:Object.freeze(N)}},template:`<div :class="{ contrastBackground: isInverted }">
1
+ import{I as o}from"./IconButton-C0_vxVJn.js";import{I as N,f as T,b as S,g as I,h as g,B as v,i as D}from"./Button-CRTJWjWJ.js";import{I as r}from"./Icon-BxW-ny3A.js";import{w as F}from"./decorator-B_8W69Nd.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const q={title:"Components/Buttons/IconButton",component:o,decorators:[F]},h=e=>({components:{IconButton:o},setup(){return e},computed:{isInverted(){return this.color==="inverted"}},data(){return{ICONS:Object.freeze(r),ICON_BUTTON_COLORS:Object.freeze(N)}},template:`<div :class="{ contrastBackground: isInverted }">
2
2
  <icon-button
3
3
  :icon="ICONS[icon]"
4
4
  :size="size"
@@ -1 +1 @@
1
- import{a as i,b as s,I as u}from"./Icon-I3Cniv10.js";import{d,t as c,c as T,b as S,g as E,a as m,k as I,n as _,r as f,o as l}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as L}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={NEUTRAL_WEAK:"neutralWeak",NEUTRAL:"neutral"},a={X_SMALL:"xSmall",SMALL:"small",MEDIUM:"medium"},t={DEFAULT:"default",DISABLED:"disabled"},o=d({name:"IconText",components:{Icon:i},props:{color:{type:String,default:n.NEUTRAL_WEAK,validator(e){return Object.values(n).includes(e)}},icon:{type:Object,required:!0,validate:e=>Object.values(u).includes(c(e))},isInteractive:{type:Boolean,default:!1},isLabelBold:{type:Boolean,default:!1},label:{type:String,required:!0},size:{type:String,default:a.X_SMALL,validator(e){return Object.values(a).includes(e)}},state:{type:String,default:t.DEFAULT,validator(e){return Object.values(t).includes(e)}}},data(){return{ICON_SIZES:Object.freeze(s),ICON_TEXT_COLORS:Object.freeze(n),ICON_TEXT_SIZES:Object.freeze(a),ICON_TEXT_STATES:Object.freeze(t)}},computed:{iconSize(){return[a.SMALL,a.X_SMALL].includes(this.size)?s.XX_SMALL:s.X_SMALL}}});function p(e,O,A,N,C,b){const r=f("icon");return l(),T("div",{class:_(["ds-iconText",{"-ds-neutralWeak":e.color===e.ICON_TEXT_COLORS.NEUTRAL_WEAK,"-ds-neutral":e.color===e.ICON_TEXT_COLORS.NEUTRAL,"-ds-xSmall":e.size===e.ICON_TEXT_SIZES.X_SMALL,"-ds-small":e.size===e.ICON_TEXT_SIZES.SMALL,"-ds-medium":e.size===e.ICON_TEXT_SIZES.MEDIUM,"-ds-bold":e.isLabelBold,"-ds-interactive":e.isInteractive&&e.state!==e.ICON_TEXT_STATES.DISABLED,"-ds-disabled":e.state===e.ICON_TEXT_STATES.DISABLED}])},[e.icon?(l(),S(r,{key:0,class:"ds-iconText__icon",icon:e.icon,size:e.iconSize},null,8,["icon","size"])):E("",!0),m("div",null,I(e.label),1)],2)}const z=L(o,[["render",p],["__scopeId","data-v-a872b51b"]]);o.__docgenInfo={displayName:"IconText",exportName:"default",description:"",tags:{},props:[{name:"color",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_COLORS.NEUTRAL_WEAK"}},{name:"icon",type:{name:"object"},required:!0},{name:"isInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isLabelBold",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"label",type:{name:"string"},required:!0},{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_SIZES.X_SMALL"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_STATES.DEFAULT"}}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/IconText/IconText.vue"]};export{z as I,t as a,n as b,a as c};
1
+ import{a as i,b as s,I as u}from"./Icon-BxW-ny3A.js";import{d,j as c,c as T,k as S,g as E,a as m,v as I,y as _,l as f,o as l}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as L}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={NEUTRAL_WEAK:"neutralWeak",NEUTRAL:"neutral"},a={X_SMALL:"xSmall",SMALL:"small",MEDIUM:"medium"},t={DEFAULT:"default",DISABLED:"disabled"},o=d({name:"IconText",components:{Icon:i},props:{color:{type:String,default:n.NEUTRAL_WEAK,validator(e){return Object.values(n).includes(e)}},icon:{type:Object,required:!0,validate:e=>Object.values(u).includes(c(e))},isInteractive:{type:Boolean,default:!1},isLabelBold:{type:Boolean,default:!1},label:{type:String,required:!0},size:{type:String,default:a.X_SMALL,validator(e){return Object.values(a).includes(e)}},state:{type:String,default:t.DEFAULT,validator(e){return Object.values(t).includes(e)}}},data(){return{ICON_SIZES:Object.freeze(s),ICON_TEXT_COLORS:Object.freeze(n),ICON_TEXT_SIZES:Object.freeze(a),ICON_TEXT_STATES:Object.freeze(t)}},computed:{iconSize(){return[a.SMALL,a.X_SMALL].includes(this.size)?s.XX_SMALL:s.X_SMALL}}});function p(e,O,A,N,C,b){const r=f("icon");return l(),T("div",{class:_(["ds-iconText",{"-ds-neutralWeak":e.color===e.ICON_TEXT_COLORS.NEUTRAL_WEAK,"-ds-neutral":e.color===e.ICON_TEXT_COLORS.NEUTRAL,"-ds-xSmall":e.size===e.ICON_TEXT_SIZES.X_SMALL,"-ds-small":e.size===e.ICON_TEXT_SIZES.SMALL,"-ds-medium":e.size===e.ICON_TEXT_SIZES.MEDIUM,"-ds-bold":e.isLabelBold,"-ds-interactive":e.isInteractive&&e.state!==e.ICON_TEXT_STATES.DISABLED,"-ds-disabled":e.state===e.ICON_TEXT_STATES.DISABLED}])},[e.icon?(l(),S(r,{key:0,class:"ds-iconText__icon",icon:e.icon,size:e.iconSize},null,8,["icon","size"])):E("",!0),m("div",null,I(e.label),1)],2)}const z=L(o,[["render",p],["__scopeId","data-v-a872b51b"]]);o.__docgenInfo={displayName:"IconText",exportName:"default",description:"",tags:{},props:[{name:"color",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_COLORS.NEUTRAL_WEAK"}},{name:"icon",type:{name:"object"},required:!0},{name:"isInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isLabelBold",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"label",type:{name:"string"},required:!0},{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_SIZES.X_SMALL"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"ICON_TEXT_STATES.DEFAULT"}}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/IconText/IconText.vue"]};export{z as I,t as a,n as b,a as c};
@@ -1,4 +1,4 @@
1
- import{I as s,a,b as r,c}from"./IconText-CKJ4jGzm.js";import{I as i}from"./Icon-I3Cniv10.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/IconText",component:s},p=l=>({components:{IconText:s},setup(){return l},template:`
1
+ import{I as s,a,b as r,c}from"./IconText-Bl-DK5dv.js";import{I as i}from"./Icon-BxW-ny3A.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/IconText",component:s},p=l=>({components:{IconText:s},setup(){return l},template:`
2
2
  <icon-text
3
3
  :color="color"
4
4
  :icon="ICONS[icon]"
@@ -1 +1 @@
1
- import{d,c as a,a as m,g as l,n as c,j as p,r as I,o}from"./vue.esm-bundler-DD4BrEtS.js";import{D as g,S as f}from"./Skeleton-DhyJ4ZKG.js";import{_}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={CONTAIN:"contain",COVER:"cover"},r=d({name:"Image",components:{DsSkeleton:g},props:{fit:{type:String,default:n.COVER},src:{type:String,required:!0}},data(){return{isLoading:!0,IMAGE_FITS:Object.freeze(n),SKELETON_RADIUS_SIZES:Object.freeze(f)}}}),u={class:"ds-image"},S=["src"],E={key:0,class:"ds-image__loader"};function N(e,s,A,O,v,C){const t=I("ds-skeleton");return o(),a("div",u,[m("img",{class:c(["ds-image__image",{"-ds-contain":e.fit===e.IMAGE_FITS.CONTAIN,"-ds-cover":e.fit===e.IMAGE_FITS.COVER}]),draggable:"false",loading:"lazy",src:e.src,onError:s[0]||(s[0]=i=>e.isLoading=!1),onLoad:s[1]||(s[1]=i=>e.isLoading=!1)},null,42,S),e.isLoading?(o(),a("div",E,[p(t,{radius:e.SKELETON_RADIUS_SIZES.SMALL},null,8,["radius"])])):l("",!0)])}const V=_(r,[["render",N],["__scopeId","data-v-b1dcf768"]]);r.__docgenInfo={displayName:"Image",exportName:"default",description:"",tags:{},props:[{name:"fit",type:{name:"ImageFit"},defaultValue:{func:!1,value:"IMAGE_FITS.COVER"}},{name:"src",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Image/Image.vue"]};export{V as I,n as a};
1
+ import{d,c as a,a as m,g as l,y as c,e as p,l as I,o}from"./vue.esm-bundler-CC_vsnCp.js";import{D as g,S as f}from"./Skeleton-a6juZJ74.js";import{_}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={CONTAIN:"contain",COVER:"cover"},t=d({name:"Image",components:{DsSkeleton:g},props:{fit:{type:String,default:n.COVER},src:{type:String,required:!0}},data(){return{isLoading:!0,IMAGE_FITS:Object.freeze(n),SKELETON_RADIUS_SIZES:Object.freeze(f)}}}),u={class:"ds-image"},S=["src"],E={key:0,class:"ds-image__loader"};function N(e,s,A,O,v,y){const r=I("ds-skeleton");return o(),a("div",u,[m("img",{class:c(["ds-image__image",{"-ds-contain":e.fit===e.IMAGE_FITS.CONTAIN,"-ds-cover":e.fit===e.IMAGE_FITS.COVER}]),draggable:"false",loading:"lazy",src:e.src,onError:s[0]||(s[0]=i=>e.isLoading=!1),onLoad:s[1]||(s[1]=i=>e.isLoading=!1)},null,42,S),e.isLoading?(o(),a("div",E,[p(r,{radius:e.SKELETON_RADIUS_SIZES.SMALL},null,8,["radius"])])):l("",!0)])}const V=_(t,[["render",N],["__scopeId","data-v-b1dcf768"]]);t.__docgenInfo={displayName:"Image",exportName:"default",description:"",tags:{},props:[{name:"fit",type:{name:"ImageFit"},defaultValue:{func:!1,value:"IMAGE_FITS.COVER"}},{name:"src",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Image/Image.vue"]};export{V as I,n as a};
@@ -1,4 +1,4 @@
1
- import{I as a,a as n}from"./Image-Dbv2u4ta.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./Skeleton-DhyJ4ZKG.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/Image",component:a},i=o=>({components:{DsImage:a},setup(){return o},template:`
1
+ import{I as a,a as n}from"./Image-DXVGtCU-.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./Skeleton-a6juZJ74.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/Image",component:a},i=o=>({components:{DsImage:a},setup(){return o},template:`
2
2
  <div style="height: 500px; width: 800px;">
3
3
  <ds-image
4
4
  :fit="fit"
@@ -0,0 +1 @@
1
+ import{d as F,n as S,p as q,q as f,k as c,s as P,h as t,E as h,G as k,u as n,H as T,o as u,f as i,a as I,y as A,g as b,I as _,c as $,m as x,J as D,v as E}from"./vue.esm-bundler-CC_vsnCp.js";import{F as L}from"./FormField-u4PxhF2k.js";import{F as p}from"./FormFieldMessage-JNi0OUbH.js";import{a as R,b as B}from"./Icon-BxW-ny3A.js";import{_ as M}from"./_plugin-vue_export-helper-DlAUqK2U.js";function V({label:a,state:r,hasRequiredIndicator:l,labelInfo:s,subLabel:d,fieldId:e,messageText:o}){return{label:a,state:r,hasRequiredIndicator:l,labelInfo:s,subLabel:d,fieldId:e,messageText:o}}const C=["id","aria-describedby"],N={key:1,class:"ds-inputField__suffixText"},y=F({__name:"InputField",props:S({inputProps:{},leftIcon:{},suffixText:{},label:{},state:{},hasRequiredIndicator:{type:Boolean},labelInfo:{},subLabel:{},fieldId:{},messageText:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(a){const r=T(a,["inputProps","leftIcon","suffixText"]),l=q(a,"modelValue"),s=f(()=>V(r)),d=f(()=>({disabled:s.value.state===p.DISABLED,...a.inputProps}));return(e,o)=>(u(),c(n(L),h(k(s.value)),P({field:t(({fieldId:m,messageId:v})=>[I("div",{class:A(["ds-inputField",{"-ds-error":s.value.state===n(p).ERROR,"-ds-disabled":s.value.state===n(p).DISABLED}])},[e.leftIcon?(u(),c(n(R),{key:0,icon:e.leftIcon,class:"ds-inputField__leftIcon",size:n(B).X_SMALL},null,8,["icon","size"])):b("",!0),_(I("input",x(d.value,{id:m,"onUpdate:modelValue":o[0]||(o[0]=g=>l.value=g),class:"ds-inputField__input","aria-describedby":v}),null,16,C),[[D,l.value]]),e.suffixText?(u(),$("div",N,E(e.suffixText),1)):b("",!0),i(e.$slots,"action",{},void 0,!0)],2)]),_:2},[e.$slots.help?{name:"help",fn:t(()=>[i(e.$slots,"help",{},void 0,!0)]),key:"0"}:void 0,e.$slots.labelAside?{name:"labelAside",fn:t(()=>[i(e.$slots,"labelAside",{},void 0,!0)]),key:"1"}:void 0,e.$slots.message?{name:"message",fn:t(({messageId:m})=>[i(e.$slots,"message",{messageId:m},void 0,!0)]),key:"2"}:void 0,e.$slots.fieldStatus?{name:"fieldStatus",fn:t(()=>[i(e.$slots,"fieldStatus",{},void 0,!0)]),key:"3"}:void 0]),1040))}}),G=M(y,[["__scopeId","data-v-bb0fc70c"]]);y.__docgenInfo={exportName:"default",displayName:"InputField",description:"",tags:{},props:[{name:"messageText",required:!1,type:{name:"string"}},{name:"fieldId",required:!1,type:{name:"string"}},{name:"subLabel",required:!1,type:{name:"string"}},{name:"labelInfo",required:!1,type:{name:"string"}},{name:"hasRequiredIndicator",required:!1,type:{name:"boolean"}},{name:"state",required:!1,type:{name:"union",elements:[{name:'"default"'},{name:'"disabled"'},{name:'"error"'},{name:'"success"'}]}},{name:"label",required:!1,type:{name:"string"}},{name:"inputProps",required:!1,type:{name:"InputHTMLAttributes"}},{name:"leftIcon",required:!1,type:{name:"union",elements:[{name:"IconItem"},{name:"null"}]}},{name:"suffixText",required:!1,type:{name:"string"}}],slots:[{name:"action"},{name:"help"},{name:"labelAside"},{name:"message",scoped:!0,bindings:[{name:"message-id",title:"binding"}]},{name:"fieldStatus"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Form/InputField/InputField.vue"]};export{G as I};
@@ -0,0 +1,44 @@
1
+ import{I as a}from"./InputField-CjqHh5Cm.js";import{_ as S}from"./HelpButton-Lb2k2yp9.js";import{D as x}from"./Modal-xuXnp0B3.js";import{I as o}from"./Icon-BxW-ny3A.js";import{a as E,b as F}from"./FormField.stories.shared-D4ktxakv.js";import{F as m}from"./FormFieldMessage-JNi0OUbH.js";import{t as h,r as R}from"./vue.esm-bundler-CC_vsnCp.js";import"./FormField-u4PxhF2k.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./IconButton-C0_vxVJn.js";import"./Button-CRTJWjWJ.js";import"./device-9fgosCm4.js";import"./Tooltip-DKqXTPwf.js";import"./FeatureIcon-DClL1vj4.js";const Q={title:"Components/Form/InputField",component:a,render:c=>({components:{InputField:a,HelpButton:S,Modal:x},setup(){const{help:d,labelAside:f,message:u,fieldStatus:g,action:I,...v}=h(c);return{props:R({...v}),labelAside:f,fieldStatus:g,message:u,help:d,action:I,FORM_FIELD_STATES:m,ICONS:o}},data:()=>({value:""}),template:`<InputField v-bind="props" :left-icon="props.leftIcon ? ICONS[props.leftIcon] : null" v-model="value">
2
+ <template v-if="help" #help>
3
+ <HelpButton :is-disabled="props.state === FORM_FIELD_STATES.DISABLED" modal-title="Help modal title">
4
+ <template #modalContent>
5
+ Modal
6
+ </template>
7
+ </HelpButton>
8
+ </template>
9
+ <template #labelAside v-if="labelAside">
10
+ <div v-html="labelAside" />
11
+ </template>
12
+ <template #fieldStatus v-if="fieldStatus">
13
+ <div v-html="fieldStatus" />
14
+ </template>
15
+ <template #message v-if="message">
16
+ <div v-if="message" v-html="message" />
17
+ </template>
18
+ <template #action v-if="action">
19
+ <div v-html="action" />
20
+ </template>
21
+ </InputField>`}),argTypes:{...E,leftIcon:{control:"select",options:[null,...Object.keys(o)]},suffixText:{control:"text"},action:{control:"text"}}},e={args:{...F,leftIcon:null,suffixText:"%",action:"Action",inputProps:{placeholder:"Placeholder"}},parameters:{design:{type:"figma",url:"https://www.figma.com/design/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=13198-38645&t=BlkZV83eerbMSMyv-4"}}},t={...e,args:{...e.args,state:m.ERROR,messageText:"Error message text"}};var s,r,n;e.parameters={...e.parameters,docs:{...(s=e.parameters)==null?void 0:s.docs,source:{originalSource:`{
22
+ args: {
23
+ ...args,
24
+ leftIcon: null,
25
+ suffixText: '%',
26
+ action: 'Action',
27
+ inputProps: {
28
+ placeholder: 'Placeholder'
29
+ }
30
+ },
31
+ parameters: {
32
+ design: {
33
+ type: 'figma',
34
+ url: 'https://www.figma.com/design/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=13198-38645&t=BlkZV83eerbMSMyv-4'
35
+ }
36
+ }
37
+ }`,...(n=(r=e.parameters)==null?void 0:r.docs)==null?void 0:n.source}}};var l,i,p;t.parameters={...t.parameters,docs:{...(l=t.parameters)==null?void 0:l.docs,source:{originalSource:`{
38
+ ...Interactive,
39
+ args: {
40
+ ...Interactive.args,
41
+ state: FORM_FIELD_STATES.ERROR,
42
+ messageText: 'Error message text'
43
+ }
44
+ }`,...(p=(i=t.parameters)==null?void 0:i.docs)==null?void 0:p.source}}};const z=["Interactive","Error"];export{t as Error,e as Interactive,z as __namedExportsOrder,Q as default};
@@ -1 +1 @@
1
- import{d as c,c as s,o as e,F as g,m as b,a as n,k as o,s as F,g as i,l as z,r as f,b as v,n as $}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as m}from"./_plugin-vue_export-helper-DlAUqK2U.js";const k={COLORS:"colors",TYPOGRAPHY:"typography"},j=c({name:"ItemsColor",props:{items:{type:Array,required:!0}}}),T={class:"itemsListItem"},S={class:"itemsListItem__id"},w={class:"itemsListItem__value"},E={class:"itemsListItem__color"};function N(l,a,r,p,x,_){return e(),s("table",T,[(e(!0),s(g,null,b(l.items,t=>(e(),s("tr",{key:t.id,class:"itemsListItem__row"},[n("td",S,o(t.label),1),n("td",w,o(t.value),1),n("td",E,[n("span",{style:F({background:t.value}),class:"itemsListItem__tile"},null,4)])]))),128))])}const O=m(j,[["render",N],["__scopeId","data-v-20b8c23a"]]);j.__docgenInfo={displayName:"ItemsColor",exportName:"default",description:"",tags:{},props:[{name:"items",type:{name:"Array<ColorToken>"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsColor.vue"]};const q=[{id:"tokensjsontypographylineheightbase",label:"base",labelFull:"typography-line-height-base",value:"16px",base:16,ratio:null},{id:"tokensjsontypographylineheight6xl",label:"6xl",labelFull:"typography-line-height-6xl",value:"58px",base:16,ratio:3.625},{id:"tokensjsontypographylineheight5xl",label:"5xl",labelFull:"typography-line-height-5xl",value:"52px",base:16,ratio:3.25},{id:"tokensjsontypographylineheight4xl",label:"4xl",labelFull:"typography-line-height-4xl",value:"44px",base:16,ratio:2.75},{id:"tokensjsontypographylineheight3xl",label:"3xl",labelFull:"typography-line-height-3xl",value:"34px",base:16,ratio:2.125},{id:"tokensjsontypographylineheight2xl",label:"2xl",labelFull:"typography-line-height-2xl",value:"28px",base:16,ratio:1.75},{id:"tokensjsontypographylineheightxl",label:"xl",labelFull:"typography-line-height-xl",value:"26px",base:16,ratio:1.625},{id:"tokensjsontypographylineheightl",label:"l",labelFull:"typography-line-height-l",value:"24px",base:16,ratio:1.5},{id:"tokensjsontypographylineheightm",label:"m",labelFull:"typography-line-height-m",value:"22px",base:16,ratio:1.375},{id:"tokensjsontypographylineheights",label:"s",labelFull:"typography-line-height-s",value:"20px",base:16,ratio:1.25},{id:"tokensjsontypographylineheightxs",label:"xs",labelFull:"typography-line-height-xs",value:"18px",base:16,ratio:1.125},{id:"tokensjsontypographylineheight2xs",label:"2xs",labelFull:"typography-line-height-2xs",value:"16px",base:16,ratio:1},{id:"tokensjsontypographylineheight3xs",label:"3xs",labelFull:"typography-line-height-3xs",value:"14px",base:16,ratio:.875},{id:"tokensjsontypographylineheight4xs",label:"4xs",labelFull:"typography-line-height-4xs",value:"12px",base:16,ratio:.75},{id:"tokensjsontypographylineheight5xs",label:"5xs",labelFull:"typography-line-height-5xs",value:"10px",base:16,ratio:.625}],A=[{id:"tokensjsontypographyfontsizebase",label:"base",labelFull:"typography-font-size-base",value:"16px",base:16,ratio:null},{id:"tokensjsontypographyfontsize5xl",label:"5xl",labelFull:"typography-font-size-5xl",value:"44px",base:16,ratio:2.75},{id:"tokensjsontypographyfontsize4xl",label:"4xl",labelFull:"typography-font-size-4xl",value:"36px",base:16,ratio:2.25},{id:"tokensjsontypographyfontsize3xl",label:"3xl",labelFull:"typography-font-size-3xl",value:"28px",base:16,ratio:1.75},{id:"tokensjsontypographyfontsize2xl",label:"2xl",labelFull:"typography-font-size-2xl",value:"24px",base:16,ratio:1.5},{id:"tokensjsontypographyfontsizexl",label:"xl",labelFull:"typography-font-size-xl",value:"20px",base:16,ratio:1.25},{id:"tokensjsontypographyfontsizel",label:"l",labelFull:"typography-font-size-l",value:"18px",base:16,ratio:1.125},{id:"tokensjsontypographyfontsizem",label:"m",labelFull:"typography-font-size-m",value:"16px",base:16,ratio:1},{id:"tokensjsontypographyfontsizes",label:"s",labelFull:"typography-font-size-s",value:"14px",base:16,ratio:.875},{id:"tokensjsontypographyfontsizexs",label:"xs",labelFull:"typography-font-size-xs",value:"12px",base:16,ratio:.75},{id:"tokensjsontypographyfontsize2xs",label:"2xs",labelFull:"typography-font-size-2xs",value:"10px",base:16,ratio:.625},{id:"tokensjsontypographyfontsize3xs",label:"3xs",labelFull:"typography-font-size-3xs",value:"8px",base:16,ratio:.5}],C=[{id:"tokensjsontypographyletterspacingxs",label:"xs",labelFull:"typography-letter-spacing-xs",value:"0",base:null,ratio:null},{id:"tokensjsontypographyletterspacings",label:"s",labelFull:"typography-letter-spacing-s",value:"0.005em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingm",label:"m",labelFull:"typography-letter-spacing-m",value:"0.0075em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingl",label:"l",labelFull:"typography-letter-spacing-l",value:"0.015em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingxl",label:"xl",labelFull:"typography-letter-spacing-xl",value:"0.06em",base:null,ratio:null}],P=[{id:"tokensjsontypographytexttransformnone",label:"none",labelFull:"typography-text-transform-none",value:"none",base:null,ratio:null},{id:"tokensjsontypographytexttransformuppercase",label:"uppercase",labelFull:"typography-text-transform-uppercase",value:"uppercase",base:null,ratio:null}],Y=[{id:"tokensjsontypographytextdecorationnone",label:"none",labelFull:"typography-text-decoration-none",value:"none",base:null,ratio:null},{id:"tokensjsontypographytextdecorationunderline",label:"underline",labelFull:"typography-text-decoration-underline",value:"underline",base:null,ratio:null}],R=[{id:"tokensjsontypographyfontfamilylato",label:"lato",labelFull:"typography-font-families-lato",value:"Lato",base:null,ratio:null}],B=[{id:"tokensjsontypographyfontweightregular",label:"normal",labelFull:"typography-font-weight-normal",value:"normal",base:null,ratio:null},{id:"tokensjsontypographyfontweightbold",label:"bold",labelFull:"typography-font-weight-bold",value:"bold",base:null,ratio:null},{id:"tokensjsontypographyfontweightlight",label:"light",labelFull:"typography-font-weight-light",value:"light",base:null,ratio:null}],K=[{id:"tokensjsontypographyfontstylenormal",label:"normal",labelFull:"typography-font-style-normal",value:"normal",base:null,ratio:null},{id:"tokensjsontypographyfontstyleitalic",label:"italic",labelFull:"typography-font-style-italic",value:"italic",base:null,ratio:null}],V={lineHeight:q,fontSize:A,letterSpacing:C,textTransform:P,textDecoration:Y,fontFamily:R,fontWeight:B,fontStyle:K},I=c({name:"ItemsTypography",props:{items:{type:Array,required:!0}},methods:{attributesAsStyle(l){let a="";return l.forEach(r=>{a+=r.property+": var(--typography-"+r.value+");"}),a},variableToValue(l){let a;return Object.values(V).find(r=>r.some(p=>p.labelFull==="typography-"+l?(a=p.value,!0):!1)),a}}}),H={class:"itemsListItem"},D={key:0,class:"itemsListItem__label"},G={key:1,class:"itemsListItem__value"},W={key:2,class:"itemsListItem__value"},J={key:3,class:"itemsListItem__token"},M={key:4,class:"itemsListItem__attributes"},Q={key:5,class:"itemsListItem__example"};function U(l,a,r,p,x,_){return e(),s("table",H,[(e(!0),s(g,null,b(l.items,t=>(e(),s("tr",{key:t.id,class:"itemsListItem__row"},[t.label?(e(),s("td",D,o(t.label),1)):i("",!0),t.value?(e(),s("td",G,o(t.value),1)):i("",!0),t.ratio?(e(),s("td",W,o(t.ratio),1)):i("",!0),t.token?(e(),s("td",J,o(t.token),1)):i("",!0),t.attributesRaw?(e(),s("td",M,[(e(!0),s(g,null,b(t.attributesRaw,y=>(e(),s("div",{key:t.id+y.value},[n("strong",null,o(y.property),1),a[0]||(a[0]=z(": ")),n("span",null,"{ "+o(y.value)+" = "+o(l.variableToValue(y.value))+" }",1)]))),128))])):i("",!0),t.attributes?(e(),s("td",Q,[n("div",{style:F(l.attributesAsStyle(t.attributesRaw))}," Enim ullam temporibus quasi unde quam. Eaque praesentium dolor qui necessitatibus magnam voluptatem. Eos aut esse earum. ",4)])):i("",!0)]))),128))])}const X=m(I,[["render",U],["__scopeId","data-v-3b92eaa9"]]);I.__docgenInfo={displayName:"ItemsTypography",exportName:"default",description:"",tags:{},props:[{name:"items",type:{name:"Array<TypographyToken>"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsTypography.vue"]};const L=c({name:"ItemsList",components:{ItemsColor:O,ItemsTypography:X},props:{itemsLists:{type:Array,required:!0},type:{type:String,required:!0,validator(l){return Object.values(k).includes(l)}}},data(){return{TOKENS_TYPES:Object.freeze(k)}},computed:{filteredItemsLists(){let l=[];return this.itemsLists.forEach((a,r)=>{if(a.disabled)for(let p in a.list)p!==a.disabled&&l.push(this.itemsLists[r]);else l.push(this.itemsLists[r])}),l}}}),Z={class:"itemsList__row"},ee={class:"itemsList__title"},le={class:"itemsList__categories"},te=["id"];function se(l,a,r,p,x,_){const t=f("items-color"),y=f("items-typography");return e(),s("div",null,[(e(!0),s(g,null,b(l.filteredItemsLists,u=>(e(),s("div",{key:u.title},[n("div",{class:$(["itemsList",{[u.class]:u.class}])},[n("div",Z,[n("h2",ee,o(u.title),1),n("ol",le,[(e(!0),s(g,null,b(u.list,(d,h)=>(e(),s("li",{key:h,class:"itemsListItem__category"},o(h),1))),128))])]),(e(!0),s(g,null,b(u.list,(d,h)=>(e(),s("div",{key:h,class:"itemsList__row"},[n("h3",{id:"category-"+h,class:"itemsList__category"},o(h),9,te),l.type===l.TOKENS_TYPES.COLORS?(e(),v(t,{key:0,items:d},null,8,["items"])):i("",!0),l.type===l.TOKENS_TYPES.TYPOGRAPHY?(e(),v(y,{key:1,items:d},null,8,["items"])):i("",!0)]))),128))],2)]))),128))])}const ne=m(L,[["render",se],["__scopeId","data-v-dab76bcd"]]);L.__docgenInfo={displayName:"ItemsList",exportName:"default",description:"",tags:{},props:[{name:"itemsLists",type:{name:"Array<ItemsListsItem>"},required:!0},{name:"type",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsList.vue"]};export{ne as I,k as T,V as s};
1
+ import{d as c,c as s,o as e,F as g,B as b,a as n,v as o,C as F,g as i,A as z,l as f,k as v,y as $}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as m}from"./_plugin-vue_export-helper-DlAUqK2U.js";const k={COLORS:"colors",TYPOGRAPHY:"typography"},j=c({name:"ItemsColor",props:{items:{type:Array,required:!0}}}),T={class:"itemsListItem"},S={class:"itemsListItem__id"},w={class:"itemsListItem__value"},E={class:"itemsListItem__color"};function N(l,a,r,p,x,_){return e(),s("table",T,[(e(!0),s(g,null,b(l.items,t=>(e(),s("tr",{key:t.id,class:"itemsListItem__row"},[n("td",S,o(t.label),1),n("td",w,o(t.value),1),n("td",E,[n("span",{style:F({background:t.value}),class:"itemsListItem__tile"},null,4)])]))),128))])}const O=m(j,[["render",N],["__scopeId","data-v-20b8c23a"]]);j.__docgenInfo={displayName:"ItemsColor",exportName:"default",description:"",tags:{},props:[{name:"items",type:{name:"Array<ColorToken>"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsColor.vue"]};const q=[{id:"tokensjsontypographylineheightbase",label:"base",labelFull:"typography-line-height-base",value:"16px",base:16,ratio:null},{id:"tokensjsontypographylineheight6xl",label:"6xl",labelFull:"typography-line-height-6xl",value:"58px",base:16,ratio:3.625},{id:"tokensjsontypographylineheight5xl",label:"5xl",labelFull:"typography-line-height-5xl",value:"52px",base:16,ratio:3.25},{id:"tokensjsontypographylineheight4xl",label:"4xl",labelFull:"typography-line-height-4xl",value:"44px",base:16,ratio:2.75},{id:"tokensjsontypographylineheight3xl",label:"3xl",labelFull:"typography-line-height-3xl",value:"34px",base:16,ratio:2.125},{id:"tokensjsontypographylineheight2xl",label:"2xl",labelFull:"typography-line-height-2xl",value:"28px",base:16,ratio:1.75},{id:"tokensjsontypographylineheightxl",label:"xl",labelFull:"typography-line-height-xl",value:"26px",base:16,ratio:1.625},{id:"tokensjsontypographylineheightl",label:"l",labelFull:"typography-line-height-l",value:"24px",base:16,ratio:1.5},{id:"tokensjsontypographylineheightm",label:"m",labelFull:"typography-line-height-m",value:"22px",base:16,ratio:1.375},{id:"tokensjsontypographylineheights",label:"s",labelFull:"typography-line-height-s",value:"20px",base:16,ratio:1.25},{id:"tokensjsontypographylineheightxs",label:"xs",labelFull:"typography-line-height-xs",value:"18px",base:16,ratio:1.125},{id:"tokensjsontypographylineheight2xs",label:"2xs",labelFull:"typography-line-height-2xs",value:"16px",base:16,ratio:1},{id:"tokensjsontypographylineheight3xs",label:"3xs",labelFull:"typography-line-height-3xs",value:"14px",base:16,ratio:.875},{id:"tokensjsontypographylineheight4xs",label:"4xs",labelFull:"typography-line-height-4xs",value:"12px",base:16,ratio:.75},{id:"tokensjsontypographylineheight5xs",label:"5xs",labelFull:"typography-line-height-5xs",value:"10px",base:16,ratio:.625}],A=[{id:"tokensjsontypographyfontsizebase",label:"base",labelFull:"typography-font-size-base",value:"16px",base:16,ratio:null},{id:"tokensjsontypographyfontsize5xl",label:"5xl",labelFull:"typography-font-size-5xl",value:"44px",base:16,ratio:2.75},{id:"tokensjsontypographyfontsize4xl",label:"4xl",labelFull:"typography-font-size-4xl",value:"36px",base:16,ratio:2.25},{id:"tokensjsontypographyfontsize3xl",label:"3xl",labelFull:"typography-font-size-3xl",value:"28px",base:16,ratio:1.75},{id:"tokensjsontypographyfontsize2xl",label:"2xl",labelFull:"typography-font-size-2xl",value:"24px",base:16,ratio:1.5},{id:"tokensjsontypographyfontsizexl",label:"xl",labelFull:"typography-font-size-xl",value:"20px",base:16,ratio:1.25},{id:"tokensjsontypographyfontsizel",label:"l",labelFull:"typography-font-size-l",value:"18px",base:16,ratio:1.125},{id:"tokensjsontypographyfontsizem",label:"m",labelFull:"typography-font-size-m",value:"16px",base:16,ratio:1},{id:"tokensjsontypographyfontsizes",label:"s",labelFull:"typography-font-size-s",value:"14px",base:16,ratio:.875},{id:"tokensjsontypographyfontsizexs",label:"xs",labelFull:"typography-font-size-xs",value:"12px",base:16,ratio:.75},{id:"tokensjsontypographyfontsize2xs",label:"2xs",labelFull:"typography-font-size-2xs",value:"10px",base:16,ratio:.625},{id:"tokensjsontypographyfontsize3xs",label:"3xs",labelFull:"typography-font-size-3xs",value:"8px",base:16,ratio:.5}],C=[{id:"tokensjsontypographyletterspacingxs",label:"xs",labelFull:"typography-letter-spacing-xs",value:"0",base:null,ratio:null},{id:"tokensjsontypographyletterspacings",label:"s",labelFull:"typography-letter-spacing-s",value:"0.005em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingm",label:"m",labelFull:"typography-letter-spacing-m",value:"0.0075em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingl",label:"l",labelFull:"typography-letter-spacing-l",value:"0.015em",base:null,ratio:null},{id:"tokensjsontypographyletterspacingxl",label:"xl",labelFull:"typography-letter-spacing-xl",value:"0.06em",base:null,ratio:null}],P=[{id:"tokensjsontypographytexttransformnone",label:"none",labelFull:"typography-text-transform-none",value:"none",base:null,ratio:null},{id:"tokensjsontypographytexttransformuppercase",label:"uppercase",labelFull:"typography-text-transform-uppercase",value:"uppercase",base:null,ratio:null}],Y=[{id:"tokensjsontypographytextdecorationnone",label:"none",labelFull:"typography-text-decoration-none",value:"none",base:null,ratio:null},{id:"tokensjsontypographytextdecorationunderline",label:"underline",labelFull:"typography-text-decoration-underline",value:"underline",base:null,ratio:null}],R=[{id:"tokensjsontypographyfontfamilylato",label:"lato",labelFull:"typography-font-families-lato",value:"Lato",base:null,ratio:null}],B=[{id:"tokensjsontypographyfontweightregular",label:"normal",labelFull:"typography-font-weight-normal",value:"normal",base:null,ratio:null},{id:"tokensjsontypographyfontweightbold",label:"bold",labelFull:"typography-font-weight-bold",value:"bold",base:null,ratio:null},{id:"tokensjsontypographyfontweightlight",label:"light",labelFull:"typography-font-weight-light",value:"light",base:null,ratio:null}],K=[{id:"tokensjsontypographyfontstylenormal",label:"normal",labelFull:"typography-font-style-normal",value:"normal",base:null,ratio:null},{id:"tokensjsontypographyfontstyleitalic",label:"italic",labelFull:"typography-font-style-italic",value:"italic",base:null,ratio:null}],V={lineHeight:q,fontSize:A,letterSpacing:C,textTransform:P,textDecoration:Y,fontFamily:R,fontWeight:B,fontStyle:K},I=c({name:"ItemsTypography",props:{items:{type:Array,required:!0}},methods:{attributesAsStyle(l){let a="";return l.forEach(r=>{a+=r.property+": var(--typography-"+r.value+");"}),a},variableToValue(l){let a;return Object.values(V).find(r=>r.some(p=>p.labelFull==="typography-"+l?(a=p.value,!0):!1)),a}}}),H={class:"itemsListItem"},D={key:0,class:"itemsListItem__label"},G={key:1,class:"itemsListItem__value"},W={key:2,class:"itemsListItem__value"},J={key:3,class:"itemsListItem__token"},M={key:4,class:"itemsListItem__attributes"},Q={key:5,class:"itemsListItem__example"};function U(l,a,r,p,x,_){return e(),s("table",H,[(e(!0),s(g,null,b(l.items,t=>(e(),s("tr",{key:t.id,class:"itemsListItem__row"},[t.label?(e(),s("td",D,o(t.label),1)):i("",!0),t.value?(e(),s("td",G,o(t.value),1)):i("",!0),t.ratio?(e(),s("td",W,o(t.ratio),1)):i("",!0),t.token?(e(),s("td",J,o(t.token),1)):i("",!0),t.attributesRaw?(e(),s("td",M,[(e(!0),s(g,null,b(t.attributesRaw,y=>(e(),s("div",{key:t.id+y.value},[n("strong",null,o(y.property),1),a[0]||(a[0]=z(": ")),n("span",null,"{ "+o(y.value)+" = "+o(l.variableToValue(y.value))+" }",1)]))),128))])):i("",!0),t.attributes?(e(),s("td",Q,[n("div",{style:F(l.attributesAsStyle(t.attributesRaw))}," Enim ullam temporibus quasi unde quam. Eaque praesentium dolor qui necessitatibus magnam voluptatem. Eos aut esse earum. ",4)])):i("",!0)]))),128))])}const X=m(I,[["render",U],["__scopeId","data-v-3b92eaa9"]]);I.__docgenInfo={displayName:"ItemsTypography",exportName:"default",description:"",tags:{},props:[{name:"items",type:{name:"Array<TypographyToken>"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsTypography.vue"]};const L=c({name:"ItemsList",components:{ItemsColor:O,ItemsTypography:X},props:{itemsLists:{type:Array,required:!0},type:{type:String,required:!0,validator(l){return Object.values(k).includes(l)}}},data(){return{TOKENS_TYPES:Object.freeze(k)}},computed:{filteredItemsLists(){let l=[];return this.itemsLists.forEach((a,r)=>{if(a.disabled)for(let p in a.list)p!==a.disabled&&l.push(this.itemsLists[r]);else l.push(this.itemsLists[r])}),l}}}),Z={class:"itemsList__row"},ee={class:"itemsList__title"},le={class:"itemsList__categories"},te=["id"];function se(l,a,r,p,x,_){const t=f("items-color"),y=f("items-typography");return e(),s("div",null,[(e(!0),s(g,null,b(l.filteredItemsLists,u=>(e(),s("div",{key:u.title},[n("div",{class:$(["itemsList",{[u.class]:u.class}])},[n("div",Z,[n("h2",ee,o(u.title),1),n("ol",le,[(e(!0),s(g,null,b(u.list,(d,h)=>(e(),s("li",{key:h,class:"itemsListItem__category"},o(h),1))),128))])]),(e(!0),s(g,null,b(u.list,(d,h)=>(e(),s("div",{key:h,class:"itemsList__row"},[n("h3",{id:"category-"+h,class:"itemsList__category"},o(h),9,te),l.type===l.TOKENS_TYPES.COLORS?(e(),v(t,{key:0,items:d},null,8,["items"])):i("",!0),l.type===l.TOKENS_TYPES.TYPOGRAPHY?(e(),v(y,{key:1,items:d},null,8,["items"])):i("",!0)]))),128))],2)]))),128))])}const ne=m(L,[["render",se],["__scopeId","data-v-727a6c8c"]]);L.__docgenInfo={displayName:"ItemsList",exportName:"default",description:"",tags:{},props:[{name:"itemsLists",type:{name:"Array<ItemsListsItem>"},required:!0},{name:"type",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/styles/ItemsList.vue"]};export{ne as I,k as T,V as s};
@@ -1 +1 @@
1
- import{d as t,c as r,a as n,s as i,n as a,o}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as d}from"./_plugin-vue_export-helper-DlAUqK2U.js";const l={NEUTRAL_HEAVY:"neutralHeavy",NEUTRAL_STRONG:"neutralStrong",SUCCESS:"success",WARNING:"warning",DANGER:"danger",INFO:"info"},m={SMALL:"small",MEDIUM:"medium",LARGE:"large"},s=t({name:"LoadingBar",props:{color:{type:String,default:l.NEUTRAL_HEAVY},size:{type:String,default:m.LARGE},time:{type:String,required:!0}},data(){return{intervalId:0,width:0}},computed:{sizeClassName(){return`-ds-size-${this.size}`},loadingBarStyles(){return{width:`${this.width}%`,transition:`width ${this.time}s linear`}}},mounted(){if(this.time==="0"){this.width=100;return}setTimeout(()=>{this.width=100},0)}});function u(e,c,p,_,g,L){return o(),r("div",{class:a(["ds-loadingBar",[e.sizeClassName]])},[n("span",{class:a(["ds-loadingBar__loader",`-ds-border-color-${e.color}`]),style:i(e.loadingBarStyles)},null,6)],2)}const S=d(s,[["render",u],["__scopeId","data-v-281bbb7d"]]);s.__docgenInfo={displayName:"LoadingBar",exportName:"default",description:"",tags:{},props:[{name:"color",type:{name:"LoadingBarColors"},defaultValue:{func:!1,value:"LOADING_BAR_COLORS.NEUTRAL_HEAVY"}},{name:"size",type:{name:"LoadingBarSizes"},defaultValue:{func:!1,value:"LOADING_BAR_SIZES.LARGE"}},{name:"time",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/LoadingBar/LoadingBar.vue"]};export{l as L,S as a,m as b};
1
+ import{d as t,c as r,a as n,C as i,y as a,o}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as d}from"./_plugin-vue_export-helper-DlAUqK2U.js";const l={NEUTRAL_HEAVY:"neutralHeavy",NEUTRAL_STRONG:"neutralStrong",SUCCESS:"success",WARNING:"warning",DANGER:"danger",INFO:"info"},m={SMALL:"small",MEDIUM:"medium",LARGE:"large"},s=t({name:"LoadingBar",props:{color:{type:String,default:l.NEUTRAL_HEAVY},size:{type:String,default:m.LARGE},time:{type:String,required:!0}},data(){return{intervalId:0,width:0}},computed:{sizeClassName(){return`-ds-size-${this.size}`},loadingBarStyles(){return{width:`${this.width}%`,transition:`width ${this.time}s linear`}}},mounted(){if(this.time==="0"){this.width=100;return}setTimeout(()=>{this.width=100},0)}});function u(e,c,p,_,g,L){return o(),r("div",{class:a(["ds-loadingBar",[e.sizeClassName]])},[n("span",{class:a(["ds-loadingBar__loader",`-ds-border-color-${e.color}`]),style:i(e.loadingBarStyles)},null,6)],2)}const S=d(s,[["render",u],["__scopeId","data-v-281bbb7d"]]);s.__docgenInfo={displayName:"LoadingBar",exportName:"default",description:"",tags:{},props:[{name:"color",type:{name:"LoadingBarColors"},defaultValue:{func:!1,value:"LOADING_BAR_COLORS.NEUTRAL_HEAVY"}},{name:"size",type:{name:"LoadingBarSizes"},defaultValue:{func:!1,value:"LOADING_BAR_SIZES.LARGE"}},{name:"time",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/LoadingBar/LoadingBar.vue"]};export{l as L,S as a,m as b};
@@ -1,4 +1,4 @@
1
- import{a as r,L as a,b as n}from"./LoadingBar-Dc_eLNsl.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const L={title:"Components/LoadingBar",component:r},c=i=>({components:{DsLoadingBar:r},setup(){return i},template:'<ds-loading-bar :size="size" :color="color" :time="time" />'}),e=c.bind({}),m={size:n.LARGE,color:a.NEUTRAL_HEAVY,time:"5"},p={size:{control:"select",options:Object.values(n)},color:{control:"select",options:Object.values(a)}};e.argTypes=p;e.args=m;e.parameters={design:{type:"figma",url:"https://www.figma.com/design/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=8375-32853"}};var o,t,s;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`args => ({
1
+ import{a as r,L as a,b as n}from"./LoadingBar-CoXHVlvM.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const L={title:"Components/LoadingBar",component:r},c=i=>({components:{DsLoadingBar:r},setup(){return i},template:'<ds-loading-bar :size="size" :color="color" :time="time" />'}),e=c.bind({}),m={size:n.LARGE,color:a.NEUTRAL_HEAVY,time:"5"},p={size:{control:"select",options:Object.values(n)},color:{control:"select",options:Object.values(a)}};e.argTypes=p;e.args=m;e.parameters={design:{type:"figma",url:"https://www.figma.com/design/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=8375-32853"}};var o,t,s;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  DsLoadingBar: LoadingBar
4
4
  },
@@ -0,0 +1 @@
1
+ import{a as y,F as g,b as C}from"./FeatureIcon-DClL1vj4.js";import{b as A,I as d}from"./Icon-BxW-ny3A.js";import{a as u,D as L,c as i,I as k,d as N,B as U}from"./Button-CRTJWjWJ.js";import{I as M}from"./IconButton-C0_vxVJn.js";import{d as D,j as f,k as c,a as n,y as m,f as B,e as F,D as b,c as r,g as a,l as S,v as s,h as p,m as R,T as j,o as t,A as O}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as V}from"./_plugin-vue_export-helper-DlAUqK2U.js";const I={SMALL:"small",MEDIUM:"medium"},E={SMALL:"small",MEDIUM:"medium"},h=D({name:"Modal",components:{FeatureIcon:g,WnlButton:L,WnlIconButton:M},props:{size:{type:String,default:I.MEDIUM,validator:e=>Object.values(I).includes(e)},danger:{type:Boolean,default:!1},headerTitleSize:{type:String,default:E.MEDIUM,validator:e=>Object.values(E).includes(e)},headerTitle:{type:String,default:null},headerSubtitle:{type:String,default:null},headerFeatureIcon:{type:Object,default:null,validator(e){return Object.values(d).includes(f(e))}},headerFeatureIconColor:{type:String,default:y.NEUTRAL,validator(e){return Object.values(y).includes(e)}},contentCentered:{type:Boolean,default:!1},headerImage:{type:String,default:null},footerPrimaryButtonText:{type:String,default:null},footerPrimaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(d).includes(f(e))}},footerPrimaryButtonState:{type:String,default:u.DEFAULT,validator(e){return Object.values(u).includes(e)}},footerSecondaryButtonText:{type:String,default:null},footerSecondaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(d).includes(f(e))}},footerSecondaryButtonState:{type:String,default:u.DEFAULT,validator(e){return Object.values(u).includes(e)}},footerTertiaryButtonText:{type:String,default:null},footerTertiaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(d).includes(f(e))}},footerTertiaryButtonState:{type:String,default:u.DEFAULT,validator(e){return Object.values(u).includes(e)}},footerCheckboxText:{type:String,default:null}},emits:["tertiary-button-click","checkbox-change","close-modal","secondary-button-click","primary-button-click"],data(){return{BUTTON_COLORS:Object.freeze(i),BUTTON_ELEVATIONS:Object.freeze(U),BUTTON_TYPES:Object.freeze(N),ICONS:Object.freeze(d),ICON_BUTTON_COLORS:Object.freeze(k),ICON_SIZES:Object.freeze(A),MODAL_SIZES:Object.freeze(I),MODAL_HEADER_TITLE_SIZES:Object.freeze(E),FEATURE_ICON_SIZES:Object.freeze(C)}},computed:{calcHeaderFeatureIconColor(){return this.danger?y.DANGER:this.headerFeatureIconColor},calcFooterPrimaryButtonColor(){return this.danger?i.NEUTRAL:i.PRIMARY},calcFooterSecondaryButtonColor(){return this.danger?i.DANGER:i.NEUTRAL},calcSingleColumn(){return!((this.footerTertiaryButtonText||this.footerCheckboxText)&&(this.footerSecondaryButtonText||this.footerPrimaryButtonText))},displayFooter(){return this.footerTertiaryButtonText||this.footerCheckboxText||this.footerSecondaryButtonText||this.footerPrimaryButtonText}}}),P={class:"ds-modal__rightActions"},z={class:"ds-modal__scrollableWrapper"},$=["src"],Z={key:0,class:"ds-modal__header"},w={key:1,class:"ds-modal__headerSubtitle"},H={key:1,class:"ds-modal__slotContent"},Y={key:0,class:"ds-modal__footerCtaSecondary"},W={key:0,class:"ds-modal__checkbox"},X={for:"ds-modal__checkboxInput",class:"ds-modal__checkboxLabel"},G={key:1,class:"ds-modal__footerCtaPrimary"};function K(e,o,q,J,Q,x){const _=S("wnl-icon-button"),v=S("feature-icon"),T=S("wnl-button");return t(),c(j,{to:"body"},[n("div",R({class:"ds-modal"},e.$attrs,{onClick:o[5]||(o[5]=b(l=>e.$emit("close-modal"),["self"]))}),[n("div",{class:m(["ds-modal__wrapper",{"-ds-small":e.size===e.MODAL_SIZES.SMALL}])},[n("div",P,[B(e.$slots,"rightActions",{},void 0,!0),F(_,{touchable:"",icon:e.ICONS.FA_XMARK,size:e.ICON_SIZES.SMALL,elevation:e.BUTTON_ELEVATIONS.X_SMALL,color:e.ICON_BUTTON_COLORS.NEUTRAL_WEAK,"data-test-selector":"ds-modal__closeButton",onClick:o[0]||(o[0]=b(l=>e.$emit("close-modal"),["stop"]))},null,8,["icon","size","elevation","color"])]),n("div",z,[e.headerImage?(t(),r("img",{key:0,class:"ds-modal__image",src:e.headerImage,alt:""},null,8,$)):a("",!0),n("div",{class:m(["ds-modal__content",{"-ds-centered":e.contentCentered}])},[e.headerTitle?(t(),r("div",Z,[e.headerFeatureIcon?(t(),c(v,{key:0,class:"ds-modal__headerFeatureIcon",color:e.calcHeaderFeatureIconColor,icon:e.headerFeatureIcon,size:e.FEATURE_ICON_SIZES.X_LARGE,"double-background":""},null,8,["color","icon","size"])):a("",!0),n("h4",{class:m(["ds-modal__headerTitle",{"-ds-small":e.headerTitleSize===e.MODAL_HEADER_TITLE_SIZES.SMALL}])},s(e.headerTitle),3),e.headerSubtitle?(t(),r("h5",w,s(e.headerSubtitle),1)):a("",!0)])):a("",!0),e.$slots.default?(t(),r("div",H,[B(e.$slots,"default",{},void 0,!0)])):a("",!0),e.displayFooter?(t(),r("div",{key:2,class:m(["ds-modal__footer",{"-ds-singleColumn":e.calcSingleColumn}])},[e.footerTertiaryButtonText||e.footerCheckboxText?(t(),r("div",Y,[e.footerCheckboxText?(t(),r("div",W,[n("input",{id:"ds-modal__checkboxInput",type:"checkbox",checked:!1,onChange:o[1]||(o[1]=l=>e.$emit("checkbox-change",l.target.checked))},null,32),n("label",X,s(e.footerCheckboxText),1)])):a("",!0),e.footerTertiaryButtonText?(t(),c(T,{key:1,type:e.BUTTON_TYPES.TEXT,color:e.BUTTON_COLORS.NEUTRAL,"icon-left":e.footerTertiaryButtonIcon,state:e.footerTertiaryButtonState,class:"ds-modal__tertiaryButton",onClick:o[2]||(o[2]=l=>e.$emit("tertiary-button-click"))},{default:p(()=>[O(s(e.footerTertiaryButtonText),1)]),_:1},8,["type","color","icon-left","state"])):a("",!0)])):a("",!0),e.footerSecondaryButtonText||e.footerPrimaryButtonText?(t(),r("div",G,[e.footerSecondaryButtonText?(t(),c(T,{key:0,type:e.BUTTON_TYPES.OUTLINED,color:e.calcFooterSecondaryButtonColor,"icon-right":e.footerSecondaryButtonIcon,state:e.footerSecondaryButtonState,onClick:o[3]||(o[3]=l=>e.$emit("secondary-button-click"))},{default:p(()=>[O(s(e.footerSecondaryButtonText),1)]),_:1},8,["type","color","icon-right","state"])):a("",!0),e.footerPrimaryButtonText?(t(),c(T,{key:1,color:e.calcFooterPrimaryButtonColor,"icon-right":e.footerPrimaryButtonIcon,state:e.footerPrimaryButtonState,onClick:o[4]||(o[4]=l=>e.$emit("primary-button-click"))},{default:p(()=>[O(s(e.footerPrimaryButtonText),1)]),_:1},8,["color","icon-right","state"])):a("",!0)])):a("",!0)],2)):a("",!0)],2)])],2)],16)])}const le=V(h,[["render",K],["__scopeId","data-v-64e9f862"]]);h.__docgenInfo={displayName:"Modal",exportName:"default",description:"",tags:{},props:[{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"MODAL_SIZES.MEDIUM"}},{name:"danger",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"headerTitleSize",type:{name:"string"},defaultValue:{func:!1,value:"MODAL_HEADER_TITLE_SIZES.MEDIUM"}},{name:"headerTitle",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"headerSubtitle",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIconColor",type:{name:"string"},defaultValue:{func:!1,value:"FEATURE_ICON_COLOR.NEUTRAL"}},{name:"contentCentered",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"headerImage",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}},{name:"footerSecondaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}},{name:"footerTertiaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerTertiaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerTertiaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}},{name:"footerCheckboxText",type:{name:"string"},defaultValue:{func:!1,value:"null"}}],events:[{name:"close-modal"},{name:"checkbox-change"},{name:"tertiary-button-click"},{name:"secondary-button-click"},{name:"primary-button-click"}],slots:[{name:"rightActions"},{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Modals/Modal/Modal.vue"]};export{le as D,I as M,E as a};
@@ -1,4 +1,4 @@
1
- import{D as x,M as i,a as u}from"./Modal-Cy1kzNhG.js";import{I as n}from"./Icon-I3Cniv10.js";import{a as c}from"./FeatureIcon-BoUhuGOr.js";import{a as t}from"./Button-C5dr6u6F.js";import"./IconButton-BPKB5gT7.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const D={title:"Components/Modals/Modal",component:x},l=b=>({components:{Modal:x},setup(){return b},template:'<modal :headerFeatureIcon="ICONS[headerFeatureIcon]" :size="size" :danger="danger" :headerTitleSize="headerTitleSize" :headerTitle="headerTitle" :headerSubtitle="headerSubtitle" :contentCentered="contentCentered" :headerFeatureIconColor="headerFeatureIconColor" :footerPrimaryButtonText="footerPrimaryButtonText" :footerPrimaryButtonIcon="ICONS[footerPrimaryButtonIcon]" :footerPrimaryButtonState="footerPrimaryButtonState" :footerSecondaryButtonText="footerSecondaryButtonText" :footerSecondaryButtonIcon="ICONS[footerSecondaryButtonIcon]" :footerSecondaryButtonState="footerSecondaryButtonState" :footerTertiaryButtonText="footerTertiaryButtonText" :footerTertiaryButtonIcon="ICONS[footerTertiaryButtonIcon]" :footerTertiaryButtonState="footerTertiaryButtonState" :footerCheckboxText="footerCheckboxText" :headerImage="headerImage"><div v-html="defaultSlot" /><template v-if="rightActionsSlot" #rightActions><div style="display: inline-flex;" v-html="rightActionsSlot" /></template></modal>',data(){return{ICONS:Object.freeze(n)}}}),e=l.bind({}),A={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!1,contentCentered:!1,headerImage:"",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_QUESTION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"Tertiary M",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},s={size:{control:"select",options:Object.values(u)},danger:{control:"boolean"},headerTitleSize:{control:"select",options:Object.values(i)},headerTitle:{control:"text"},headerImage:{control:"text"},headerSubtitle:{control:"text"},headerFeatureIcon:{control:"select",options:[null,...Object.keys(n)]},headerFeatureIconColor:{control:"select",options:Object.values(c)},contentCentered:{control:"boolean"},footerPrimaryButtonText:{control:"text"},footerPrimaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerPrimaryButtonState:{control:"select",options:Object.values(t)},footerSecondaryButtonText:{control:"text"},footerSecondaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerSecondaryButtonState:{control:"select",options:Object.values(t)},footerTertiaryButtonText:{control:"text"},footerTertiaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerTertiaryButtonState:{control:"select",options:Object.values(t)},footerCheckboxText:{control:"text"},onCloseModal:{action:"close-modal"},onCheckboxChange:{action:"checkbox-change"},onPrimaryButtonClick:{action:"primary-button-click"},onSecondaryButtonClick:{action:"secondary-button-click"},onTertiaryButtonClick:{action:"tertiary-button-click"}};e.argTypes=s;e.args=A;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5658%3A96416&t=lgUXCZhvWDuBr3qw-0"}};const O={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!0,contentCentered:!1,headerImage:"",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},o=l.bind({});o.argTypes=s;o.args=O;const E={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!1,contentCentered:!1,headerImage:"https://wiecejnizlek.pl/wp-content/uploads/2022/10/WNL-Strona-cover-dla-filmu-2-1.jpg",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:null,headerFeatureIconColor:null,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},r=l.bind({});r.argTypes=s;r.args=E;const q={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.SMALL,danger:!1,contentCentered:!0,headerImage:"",headerTitleSize:i.SMALL,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},a=l.bind({});a.argTypes=s;a.args=q;var d,m,S;e.parameters={...e.parameters,docs:{...(d=e.parameters)==null?void 0:d.docs,source:{originalSource:`args => ({
1
+ import{D as x,a as i,M as u}from"./Modal-xuXnp0B3.js";import{I as n}from"./Icon-BxW-ny3A.js";import{a as c}from"./FeatureIcon-DClL1vj4.js";import{a as t}from"./Button-CRTJWjWJ.js";import"./IconButton-C0_vxVJn.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const D={title:"Components/Modals/Modal",component:x},l=b=>({components:{Modal:x},setup(){return b},template:'<modal :headerFeatureIcon="ICONS[headerFeatureIcon]" :size="size" :danger="danger" :headerTitleSize="headerTitleSize" :headerTitle="headerTitle" :headerSubtitle="headerSubtitle" :contentCentered="contentCentered" :headerFeatureIconColor="headerFeatureIconColor" :footerPrimaryButtonText="footerPrimaryButtonText" :footerPrimaryButtonIcon="ICONS[footerPrimaryButtonIcon]" :footerPrimaryButtonState="footerPrimaryButtonState" :footerSecondaryButtonText="footerSecondaryButtonText" :footerSecondaryButtonIcon="ICONS[footerSecondaryButtonIcon]" :footerSecondaryButtonState="footerSecondaryButtonState" :footerTertiaryButtonText="footerTertiaryButtonText" :footerTertiaryButtonIcon="ICONS[footerTertiaryButtonIcon]" :footerTertiaryButtonState="footerTertiaryButtonState" :footerCheckboxText="footerCheckboxText" :headerImage="headerImage"><div v-html="defaultSlot" /><template v-if="rightActionsSlot" #rightActions><div style="display: inline-flex;" v-html="rightActionsSlot" /></template></modal>',data(){return{ICONS:Object.freeze(n)}}}),e=l.bind({}),A={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!1,contentCentered:!1,headerImage:"",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_QUESTION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"Tertiary M",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},s={size:{control:"select",options:Object.values(u)},danger:{control:"boolean"},headerTitleSize:{control:"select",options:Object.values(i)},headerTitle:{control:"text"},headerImage:{control:"text"},headerSubtitle:{control:"text"},headerFeatureIcon:{control:"select",options:[null,...Object.keys(n)]},headerFeatureIconColor:{control:"select",options:Object.values(c)},contentCentered:{control:"boolean"},footerPrimaryButtonText:{control:"text"},footerPrimaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerPrimaryButtonState:{control:"select",options:Object.values(t)},footerSecondaryButtonText:{control:"text"},footerSecondaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerSecondaryButtonState:{control:"select",options:Object.values(t)},footerTertiaryButtonText:{control:"text"},footerTertiaryButtonIcon:{control:"select",options:[null,...Object.keys(n)]},footerTertiaryButtonState:{control:"select",options:Object.values(t)},footerCheckboxText:{control:"text"},onCloseModal:{action:"close-modal"},onCheckboxChange:{action:"checkbox-change"},onPrimaryButtonClick:{action:"primary-button-click"},onSecondaryButtonClick:{action:"secondary-button-click"},onTertiaryButtonClick:{action:"tertiary-button-click"}};e.argTypes=s;e.args=A;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5658%3A96416&t=lgUXCZhvWDuBr3qw-0"}};const O={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!0,contentCentered:!1,headerImage:"",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},o=l.bind({});o.argTypes=s;o.args=O;const E={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.MEDIUM,danger:!1,contentCentered:!1,headerImage:"https://wiecejnizlek.pl/wp-content/uploads/2022/10/WNL-Strona-cover-dla-filmu-2-1.jpg",headerTitleSize:i.MEDIUM,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:null,headerFeatureIconColor:null,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},r=l.bind({});r.argTypes=s;r.args=E;const q={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",size:u.SMALL,danger:!1,contentCentered:!0,headerImage:"",headerTitleSize:i.SMALL,headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:c.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT,footerTertiaryButtonText:"",footerTertiaryButtonIcon:null,footerTertiaryButtonState:t.DEFAULT,footerCheckboxText:""},a=l.bind({});a.argTypes=s;a.args=q;var d,m,S;e.parameters={...e.parameters,docs:{...(d=e.parameters)==null?void 0:d.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  Modal
4
4
  },
@@ -1 +1 @@
1
- import{D as f,M as m,a as c}from"./Modal-Cy1kzNhG.js";import{I as o}from"./Icon-I3Cniv10.js";import{a as l}from"./FeatureIcon-BoUhuGOr.js";import{d as y,t as r,b as p,e as u,r as S,o as b,f as d}from"./vue.esm-bundler-DD4BrEtS.js";import{a}from"./Button-C5dr6u6F.js";import{_ as g}from"./_plugin-vue_export-helper-DlAUqK2U.js";const i=y({name:"ModalDialog",components:{DsModal:f},props:{danger:{type:Boolean,default:!1},headerTitle:{type:String,required:!0},headerSubtitle:{type:String,default:null},headerFeatureIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},headerFeatureIconColor:{type:String,default:l.NEUTRAL,validator(e){return Object.values(l).includes(e)}},headerImage:{type:String,default:null},footerPrimaryButtonText:{type:String,default:null},footerPrimaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},footerPrimaryButtonState:{type:String,default:a.DEFAULT,validator(e){return Object.values(a).includes(e)}},footerSecondaryButtonText:{type:String,default:null},footerSecondaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},footerSecondaryButtonState:{type:String,default:a.DEFAULT,validator(e){return Object.values(a).includes(e)}}},emits:["close-modal","primary-button-click","secondary-button-click"],data(){return{MODAL_SIZES:Object.freeze(c),MODAL_HEADER_TITLE_SIZES:Object.freeze(m)}}});function T(e,t,v,I,E,h){const s=S("ds-modal");return b(),p(s,{class:"ds-modalDialog",size:e.MODAL_SIZES.SMALL,danger:e.danger,"content-centered":!0,"header-image":e.headerImage,"header-title-size":e.MODAL_HEADER_TITLE_SIZES.SMALL,"header-feature-icon":e.headerFeatureIcon,"header-feature-icon-color":e.headerFeatureIconColor,"header-title":e.headerTitle,"header-subtitle":e.headerSubtitle,"footer-primary-button-text":e.footerPrimaryButtonText,"footer-primary-button-icon":e.footerPrimaryButtonIcon,"footer-primary-button-state":e.footerPrimaryButtonState,"footer-secondary-button-text":e.footerSecondaryButtonText,"footer-secondary-button-icon":e.footerSecondaryButtonIcon,"footer-secondary-button-state":e.footerSecondaryButtonState,onCloseModal:t[0]||(t[0]=n=>e.$emit("close-modal")),onPrimaryButtonClick:t[1]||(t[1]=n=>e.$emit("primary-button-click")),onSecondaryButtonClick:t[2]||(t[2]=n=>e.$emit("secondary-button-click"))},{rightActions:u(()=>[d(e.$slots,"rightActions")]),default:u(()=>[d(e.$slots,"default")]),_:3},8,["size","danger","header-image","header-title-size","header-feature-icon","header-feature-icon-color","header-title","header-subtitle","footer-primary-button-text","footer-primary-button-icon","footer-primary-button-state","footer-secondary-button-text","footer-secondary-button-icon","footer-secondary-button-state"])}const j=g(i,[["render",T]]);i.__docgenInfo={displayName:"ModalDialog",exportName:"default",description:"",tags:{},props:[{name:"danger",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"headerTitle",type:{name:"string"},required:!0},{name:"headerSubtitle",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIconColor",type:{name:"string"},defaultValue:{func:!1,value:"FEATURE_ICON_COLOR.NEUTRAL"}},{name:"headerImage",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}},{name:"footerSecondaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}}],events:[{name:"close-modal"},{name:"primary-button-click"},{name:"secondary-button-click"}],slots:[{name:"default"},{name:"rightActions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Modals/ModalDialog/ModalDialog.vue"]};export{j as M};
1
+ import{D as f,a as m,M as c}from"./Modal-xuXnp0B3.js";import{I as o}from"./Icon-BxW-ny3A.js";import{a as l}from"./FeatureIcon-DClL1vj4.js";import{d as y,j as r,k as p,h as u,l as S,o as b,f as d}from"./vue.esm-bundler-CC_vsnCp.js";import{a}from"./Button-CRTJWjWJ.js";import{_ as g}from"./_plugin-vue_export-helper-DlAUqK2U.js";const i=y({name:"ModalDialog",components:{DsModal:f},props:{danger:{type:Boolean,default:!1},headerTitle:{type:String,required:!0},headerSubtitle:{type:String,default:null},headerFeatureIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},headerFeatureIconColor:{type:String,default:l.NEUTRAL,validator(e){return Object.values(l).includes(e)}},headerImage:{type:String,default:null},footerPrimaryButtonText:{type:String,default:null},footerPrimaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},footerPrimaryButtonState:{type:String,default:a.DEFAULT,validator(e){return Object.values(a).includes(e)}},footerSecondaryButtonText:{type:String,default:null},footerSecondaryButtonIcon:{type:Object,default:null,validator(e){return Object.values(o).includes(r(e))}},footerSecondaryButtonState:{type:String,default:a.DEFAULT,validator(e){return Object.values(a).includes(e)}}},emits:["close-modal","primary-button-click","secondary-button-click"],data(){return{MODAL_SIZES:Object.freeze(c),MODAL_HEADER_TITLE_SIZES:Object.freeze(m)}}});function T(e,t,v,I,h,E){const s=S("ds-modal");return b(),p(s,{class:"ds-modalDialog",size:e.MODAL_SIZES.SMALL,danger:e.danger,"content-centered":!0,"header-image":e.headerImage,"header-title-size":e.MODAL_HEADER_TITLE_SIZES.SMALL,"header-feature-icon":e.headerFeatureIcon,"header-feature-icon-color":e.headerFeatureIconColor,"header-title":e.headerTitle,"header-subtitle":e.headerSubtitle,"footer-primary-button-text":e.footerPrimaryButtonText,"footer-primary-button-icon":e.footerPrimaryButtonIcon,"footer-primary-button-state":e.footerPrimaryButtonState,"footer-secondary-button-text":e.footerSecondaryButtonText,"footer-secondary-button-icon":e.footerSecondaryButtonIcon,"footer-secondary-button-state":e.footerSecondaryButtonState,onCloseModal:t[0]||(t[0]=n=>e.$emit("close-modal")),onPrimaryButtonClick:t[1]||(t[1]=n=>e.$emit("primary-button-click")),onSecondaryButtonClick:t[2]||(t[2]=n=>e.$emit("secondary-button-click"))},{rightActions:u(()=>[d(e.$slots,"rightActions")]),default:u(()=>[d(e.$slots,"default")]),_:3},8,["size","danger","header-image","header-title-size","header-feature-icon","header-feature-icon-color","header-title","header-subtitle","footer-primary-button-text","footer-primary-button-icon","footer-primary-button-state","footer-secondary-button-text","footer-secondary-button-icon","footer-secondary-button-state"])}const j=g(i,[["render",T]]);i.__docgenInfo={displayName:"ModalDialog",exportName:"default",description:"",tags:{},props:[{name:"danger",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"headerTitle",type:{name:"string"},required:!0},{name:"headerSubtitle",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"headerFeatureIconColor",type:{name:"string"},defaultValue:{func:!1,value:"FEATURE_ICON_COLOR.NEUTRAL"}},{name:"headerImage",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerPrimaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}},{name:"footerSecondaryButtonText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonIcon",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"footerSecondaryButtonState",type:{name:"string"},defaultValue:{func:!1,value:"BUTTON_STATES.DEFAULT"}}],events:[{name:"close-modal"},{name:"primary-button-click"},{name:"secondary-button-click"}],slots:[{name:"default"},{name:"rightActions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Modals/ModalDialog/ModalDialog.vue"]};export{j as M};
@@ -1,4 +1,4 @@
1
- import{M as g}from"./ModalDialog-BuO78uuh.js";import{I as a}from"./Icon-I3Cniv10.js";import{a as n}from"./FeatureIcon-BoUhuGOr.js";import{a as t}from"./Button-C5dr6u6F.js";import"./Modal-Cy1kzNhG.js";import"./IconButton-BPKB5gT7.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const q={title:"Components/Modals/ModalDialog",component:g},i=h=>({components:{ModalDialog:g},setup(){return h},template:'<modal-dialog :headerFeatureIcon="ICONS[headerFeatureIcon]" :danger="danger" :headerTitle="headerTitle" :headerSubtitle="headerSubtitle" :headerFeatureIconColor="headerFeatureIconColor" :footerPrimaryButtonText="footerPrimaryButtonText" :footerPrimaryButtonIcon="footerPrimaryButtonIcon" :footerPrimaryButtonState="footerPrimaryButtonState" :headerImage="headerImage" :footerSecondaryButtonText="footerSecondaryButtonText" :footerSecondaryButtonIcon="footerSecondaryButtonIcon" :footerSecondaryButtonState="footerSecondaryButtonState"><div v-html="defaultSlot" /><template v-if="rightActionsSlot" #rightActions><div style="display: inline-flex;" v-html="rightActionsSlot" /></template></modal-dialog>',data(){return{ICONS:Object.freeze(a),BUTTON_STATES:Object.freeze(t)}}}),e=i.bind({}),T={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",danger:!1,headerImage:"",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_QUESTION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},u={danger:{control:"boolean"},headerImage:{control:"text",table:{type:{summary:"string"},defaultValue:{summary:"Hello"}}},headerTitle:{control:"text"},headerSubtitle:{control:"text"},headerFeatureIcon:{control:"select",options:[null,...Object.keys(a)]},headerFeatureIconColor:{control:"select",options:Object.values(n)},footerPrimaryButtonText:{control:"text"},footerPrimaryButtonIcon:{control:"select",options:[null,...Object.keys(a)]},footerPrimaryButtonState:{control:"select",options:Object.values(t)},footerSecondaryButtonText:{control:"text"},footerSecondaryButtonIcon:{control:"select",options:[null,...Object.keys(a)]},footerSecondaryButtonState:{control:"select",options:Object.values(t)}};e.argTypes=u;e.args=T;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5658%3A96416&t=lgUXCZhvWDuBr3qw-0"}};const I={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",danger:!0,headerImage:"",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},o=i.bind({});o.argTypes=u;o.args=I;const B={defaultSlot:"",rightActionsSlot:"",danger:!1,headerImage:"https://wiecejnizlek.pl/wp-content/themes/uncode-child/assets/patterns/pattern-black.png",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},r=i.bind({});r.argTypes=u;r.args=B;var l,c,s;e.parameters={...e.parameters,docs:{...(l=e.parameters)==null?void 0:l.docs,source:{originalSource:`args => ({
1
+ import{M as g}from"./ModalDialog-D6jipNV9.js";import{I as a}from"./Icon-BxW-ny3A.js";import{a as n}from"./FeatureIcon-DClL1vj4.js";import{a as t}from"./Button-CRTJWjWJ.js";import"./Modal-xuXnp0B3.js";import"./IconButton-C0_vxVJn.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./device-9fgosCm4.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const q={title:"Components/Modals/ModalDialog",component:g},i=h=>({components:{ModalDialog:g},setup(){return h},template:'<modal-dialog :headerFeatureIcon="ICONS[headerFeatureIcon]" :danger="danger" :headerTitle="headerTitle" :headerSubtitle="headerSubtitle" :headerFeatureIconColor="headerFeatureIconColor" :footerPrimaryButtonText="footerPrimaryButtonText" :footerPrimaryButtonIcon="footerPrimaryButtonIcon" :footerPrimaryButtonState="footerPrimaryButtonState" :headerImage="headerImage" :footerSecondaryButtonText="footerSecondaryButtonText" :footerSecondaryButtonIcon="footerSecondaryButtonIcon" :footerSecondaryButtonState="footerSecondaryButtonState"><div v-html="defaultSlot" /><template v-if="rightActionsSlot" #rightActions><div style="display: inline-flex;" v-html="rightActionsSlot" /></template></modal-dialog>',data(){return{ICONS:Object.freeze(a),BUTTON_STATES:Object.freeze(t)}}}),e=i.bind({}),T={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",danger:!1,headerImage:"",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_QUESTION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},u={danger:{control:"boolean"},headerImage:{control:"text",table:{type:{summary:"string"},defaultValue:{summary:"Hello"}}},headerTitle:{control:"text"},headerSubtitle:{control:"text"},headerFeatureIcon:{control:"select",options:[null,...Object.keys(a)]},headerFeatureIconColor:{control:"select",options:Object.values(n)},footerPrimaryButtonText:{control:"text"},footerPrimaryButtonIcon:{control:"select",options:[null,...Object.keys(a)]},footerPrimaryButtonState:{control:"select",options:Object.values(t)},footerSecondaryButtonText:{control:"text"},footerSecondaryButtonIcon:{control:"select",options:[null,...Object.keys(a)]},footerSecondaryButtonState:{control:"select",options:Object.values(t)}};e.argTypes=u;e.args=T;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5658%3A96416&t=lgUXCZhvWDuBr3qw-0"}};const I={defaultSlot:'<p style="margin-top: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p><p style="margin-top: 0; margin-bottom: 0">Text. Occaecati qui debitis ut minima ab ut ipsa. Eos qui eum. Vel eaque sint. Aut voluptatem est. Eos est aut sit soluta est facere qui soluta aspernatur. Et sint repellat sunt.</p>',rightActionsSlot:"Right actions",danger:!0,headerImage:"",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},o=i.bind({});o.argTypes=u;o.args=I;const B={defaultSlot:"",rightActionsSlot:"",danger:!1,headerImage:"https://wiecejnizlek.pl/wp-content/themes/uncode-child/assets/patterns/pattern-black.png",headerTitle:"Modal Title Accusantium occaecati atque similique gg provident nobis.",headerSubtitle:"Modal Subtitle Aut vitae neque consequatur. Consequuntur natus sint ad.",headerFeatureIcon:"FA_CIRCLE_EXCLAMATION",headerFeatureIconColor:n.NEUTRAL,footerPrimaryButtonText:"Primary M",footerPrimaryButtonIcon:null,footerPrimaryButtonState:t.DEFAULT,footerSecondaryButtonText:"Secondary M",footerSecondaryButtonIcon:null,footerSecondaryButtonState:t.DEFAULT},r=i.bind({});r.argTypes=u;r.args=B;var l,c,s;e.parameters={...e.parameters,docs:{...(l=e.parameters)==null?void 0:l.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  ModalDialog
4
4
  },
@@ -1 +1 @@
1
- import{d as n,c as r,f as o,n as l,o as t}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as u}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e={DEFAULT:"default",PRIMARY:"primary",NEUTRAL:"neutral",SUCCESS:"success",DANGER:"danger",INFO:"info",ACCENT:"accent"},a=n({name:"NumberInCircle",props:{index:{type:Number,default:1},medium:{type:Boolean,default:!1},color:{type:String,default:e.DEFAULT,validator(s){return Object.values(e).includes(s)}}},computed:{colorClass(){return{[e.DEFAULT]:`-ds-is${this.index}`,[e.PRIMARY]:"-ds-primary",[e.NEUTRAL]:"-ds-neutral",[e.SUCCESS]:"-ds-success",[e.DANGER]:"-ds-danger",[e.INFO]:"-ds-info",[e.ACCENT]:"-ds-accent"}[this.color]}}});function d(s,c,m,i,f,p){return t(),r("div",{class:l(["ds-numberInCircle",{"-ds-medium":s.medium,[s.colorClass]:!0}])},[o(s.$slots,"default",{},void 0,!0)],2)}const E=u(a,[["render",d],["__scopeId","data-v-974ee868"]]);a.__docgenInfo={displayName:"NumberInCircle",exportName:"default",description:"",tags:{},props:[{name:"index",type:{name:"number"},defaultValue:{func:!1,value:"1"}},{name:"medium",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"color",type:{name:"string"},defaultValue:{func:!1,value:"NUMBER_IN_CIRCLE_COLORS.DEFAULT"}}],slots:[{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/NumberInCircle/NumberInCircle.vue"]};export{E as N,e as a};
1
+ import{d as n,c as r,f as o,y as l,o as t}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as u}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e={DEFAULT:"default",PRIMARY:"primary",NEUTRAL:"neutral",SUCCESS:"success",DANGER:"danger",INFO:"info",ACCENT:"accent"},a=n({name:"NumberInCircle",props:{index:{type:Number,default:1},medium:{type:Boolean,default:!1},color:{type:String,default:e.DEFAULT,validator(s){return Object.values(e).includes(s)}}},computed:{colorClass(){return{[e.DEFAULT]:`-ds-is${this.index}`,[e.PRIMARY]:"-ds-primary",[e.NEUTRAL]:"-ds-neutral",[e.SUCCESS]:"-ds-success",[e.DANGER]:"-ds-danger",[e.INFO]:"-ds-info",[e.ACCENT]:"-ds-accent"}[this.color]}}});function d(s,c,m,i,f,p){return t(),r("div",{class:l(["ds-numberInCircle",{"-ds-medium":s.medium,[s.colorClass]:!0}])},[o(s.$slots,"default",{},void 0,!0)],2)}const E=u(a,[["render",d],["__scopeId","data-v-974ee868"]]);a.__docgenInfo={displayName:"NumberInCircle",exportName:"default",description:"",tags:{},props:[{name:"index",type:{name:"number"},defaultValue:{func:!1,value:"1"}},{name:"medium",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"color",type:{name:"string"},defaultValue:{func:!1,value:"NUMBER_IN_CIRCLE_COLORS.DEFAULT"}}],slots:[{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/NumberInCircle/NumberInCircle.vue"]};export{E as N,e as a};
@@ -1,4 +1,4 @@
1
- import{N as n,a as s}from"./NumberInCircle-DnPE2szs.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/NumberInCircle",component:n},i=c=>({components:{NumberInCircle:n},setup(){return c},template:'<number-in-circle :index="index" :color="color" :medium="medium">{{slotText}}</number-in-circle>'}),e=i.bind({}),m={slotText:"1",index:1,color:s.DEFAULT,medium:!1},a={color:{control:"select",options:Object.values(s)},slotText:{control:"text"}};e.argTypes=a;e.args=m;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5151%3A82053&t=y03jPaHjasRQu2Pm-0"}};var r,t,o;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`args => ({
1
+ import{N as n,a as s}from"./NumberInCircle-iJQYZsfG.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const d={title:"Components/NumberInCircle",component:n},i=c=>({components:{NumberInCircle:n},setup(){return c},template:'<number-in-circle :index="index" :color="color" :medium="medium">{{slotText}}</number-in-circle>'}),e=i.bind({}),m={slotText:"1",index:1,color:s.DEFAULT,medium:!1},a={color:{control:"select",options:Object.values(s)},slotText:{control:"text"}};e.argTypes=a;e.args=m;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?node-id=5151%3A82053&t=y03jPaHjasRQu2Pm-0"}};var r,t,o;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  NumberInCircle
4
4
  },
@@ -0,0 +1 @@
1
+ import{a as n,b as i,D as o}from"./Divider-BNN8PhWF.js";import{d as a,c as r,e as d,l,o as c}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as p}from"./_plugin-vue_export-helper-DlAUqK2U.js";const s=a({name:"OutlineDivider",components:{DsDivider:o},props:{prominence:{type:String,default:i.DEFAULT,validator:e=>Object.values(i).includes(e)},size:{type:String,default:n.S,validator:e=>Object.values(n).includes(e)}}}),u={class:"ds-outlineDivider"};function m(e,f,_,v,D,I){const t=l("ds-divider");return c(),r("div",u,[d(t,{prominence:e.prominence,size:e.size},null,8,["prominence","size"])])}const g=p(s,[["render",m],["__scopeId","data-v-1ff70e1d"]]);s.__docgenInfo={displayName:"OutlineDivider",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/Outline/OutlineDivider/OutlineDivider.vue"]};export{g as O};
@@ -1,4 +1,4 @@
1
- import{O as r}from"./OutlineDivider-UaRb6wKt.js";import{a as o,b as s}from"./Divider-9o-i_zKL.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const g={title:"Components/Outline/OutlineDivider",component:r},a=p=>({components:{OutlineDivider:r},setup(){return p},template:`
1
+ import{O as r}from"./OutlineDivider-DpgF_2B_.js";import{a as o,b as s}from"./Divider-BNN8PhWF.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const g={title:"Components/Outline/OutlineDivider",component:r},a=p=>({components:{OutlineDivider:r},setup(){return p},template:`
2
2
  <outline-divider :prominence="prominence" :size="size" />`}),e=a.bind({}),m={prominence:{control:"select",options:Object.values(s)},size:{control:"select",options:Object.values(o)}};e.args={prominence:s.DEFAULT,size:o.S};e.argTypes=m;e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=6148-111431&t=Amd0mke9FMknuKCX-0"}};var t,n,i;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
3
3
  components: {
4
4
  OutlineDivider
@@ -1 +1 @@
1
- import{a as S,b as O,I as o}from"./Icon-I3Cniv10.js";import{d as E,t as m,c as n,a as u,g as t,b as i,n as l,k as d,f as I,F as b,l as y,r as L,o as a}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as v}from"./_plugin-vue_export-helper-DlAUqK2U.js";const r={SMALL:"small",MEDIUM:"medium"},c={DEFAULT:"default",DISABLED:"disabled"},f={NEUTRAL_WEAK:"neutralWeak",NEUTRAL:"neutral"},p=E({name:"OutlineItem",components:{DsIcon:S},props:{size:{type:String,default:r.SMALL,validator(e){return Object.values(r).includes(e)}},backgroundColor:{type:String,default:f.NEUTRAL_WEAK,validator(e){return Object.values(f).includes(e)}},iconLeft:{type:Object,default:null,validator(e){return e==null||Object.values(o).includes(m(e))}},iconRight:{type:Object,default:null,validator(e){return e==null||Object.values(o).includes(m(e))}},iconRightRotation:{type:Number,default:null,validator(e){return[90,180,270].includes(e)}},index:{type:Number,default:null},label:{type:String,default:""},isLabelUppercase:{type:Boolean,default:!1},additionalText:{type:String,default:null},state:{type:String,default:c.DEFAULT,validator(e){return Object.values(c).includes(e)}},isSelected:{type:Boolean,default:!1},isDone:{type:Boolean,default:!1},hasSelectedIconsColorPrimary:{type:Boolean,default:!0},isSelectedInteractive:{type:Boolean,default:!1}},data(){return{ICONS:Object.freeze(o),ICON_SIZES:Object.freeze(O),OUTLINE_ITEM_BACKGROUND_COLORS:Object.freeze(f),OUTLINE_ITEM_SIZES:Object.freeze(r)}},computed:{isDisabled(){return this.state===c.DISABLED}}}),T={class:"ds-outlineItem__text"},_={key:0,class:"ds-outlineItem__additionalText"};function N(e,C,g,U,A,R){const s=L("ds-icon");return a(),n("div",{class:l(["ds-outlineItem",{"-ds-disabled":e.isDisabled,"-ds-medium":e.size===e.OUTLINE_ITEM_SIZES.MEDIUM,"-ds-selected":e.isSelected,"-ds-hoverable":!e.isSelected||e.isSelectedInteractive,"-ds-backgroundNeutral":e.backgroundColor===e.OUTLINE_ITEM_BACKGROUND_COLORS.NEUTRAL}])},[u("div",{class:l(["ds-outlineItem__content",{"-ds-centeredContent":e.$slots.default}])},[e.index!==null?(a(),n("span",{key:0,class:l(["ds-outlineItem__index",{"-ds-active":e.isSelected}])},d(e.index)+". ",3)):t("",!0),e.iconLeft?(a(),i(s,{key:1,class:l(["ds-outlineItem__icon",{"-ds-active":e.isSelected&&e.hasSelectedIconsColorPrimary}]),icon:e.iconLeft,size:e.ICON_SIZES.X_SMALL},null,8,["class","icon","size"])):t("",!0),u("span",T,[u("span",{class:l(["ds-outlineItem__label",{"-ds-uppercase":e.isLabelUppercase}])},[e.$slots.labelSlot?I(e.$slots,"labelSlot",{key:0},void 0,!0):(a(),n(b,{key:1},[y(d(e.label),1)],64))],2),e.additionalText?(a(),n("span",_,d(e.additionalText),1)):t("",!0)])],2),e.$slots.default||e.isDone||e.iconRight?(a(),n("div",{key:0,class:l(["ds-outlineItem__rightContent",{"-ds-centeredContent":e.$slots.default}])},[e.$slots.default?I(e.$slots,"default",{key:0},void 0,!0):t("",!0),e.isDone?(a(),i(s,{key:1,class:"ds-outlineItem__icon -ds-active",icon:e.ICONS.FA_CHECK_SOLID,size:e.ICON_SIZES.X_SMALL},null,8,["icon","size"])):e.iconRight?(a(),i(s,{key:2,class:l(["ds-outlineItem__icon",{"-ds-active":e.isSelected&&e.hasSelectedIconsColorPrimary}]),icon:e.iconRight,size:e.ICON_SIZES.X_SMALL,rotation:e.iconRightRotation},null,8,["class","icon","size","rotation"])):t("",!0)],2)):t("",!0)],2)}const k=v(p,[["render",N],["__scopeId","data-v-4f1d6404"]]);p.__docgenInfo={displayName:"OutlineItem",exportName:"default",description:"",tags:{},props:[{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_SIZES.SMALL"}},{name:"backgroundColor",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_BACKGROUND_COLORS.NEUTRAL_WEAK"}},{name:"iconLeft",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"iconRight",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"iconRightRotation",type:{name:"number"},defaultValue:{func:!1,value:"null"},values:[90,180,270]},{name:"index",type:{name:"number"},defaultValue:{func:!1,value:"null"}},{name:"label",type:{name:"string"},defaultValue:{func:!1,value:"''"}},{name:"isLabelUppercase",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"additionalText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_STATES.DEFAULT"}},{name:"isSelected",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isDone",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"hasSelectedIconsColorPrimary",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isSelectedInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],slots:[{name:"labelSlot"},{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Outline/OutlineItem/OutlineItem.vue"]};export{k as O,f as a,r as b,c};
1
+ import{a as S,b as O,I as o}from"./Icon-BxW-ny3A.js";import{d as E,j as m,c as n,a as u,g as t,k as i,y as l,v as d,f as I,F as y,A as b,l as L,o as a}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as v}from"./_plugin-vue_export-helper-DlAUqK2U.js";const r={SMALL:"small",MEDIUM:"medium"},c={DEFAULT:"default",DISABLED:"disabled"},f={NEUTRAL_WEAK:"neutralWeak",NEUTRAL:"neutral"},p=E({name:"OutlineItem",components:{DsIcon:S},props:{size:{type:String,default:r.SMALL,validator(e){return Object.values(r).includes(e)}},backgroundColor:{type:String,default:f.NEUTRAL_WEAK,validator(e){return Object.values(f).includes(e)}},iconLeft:{type:Object,default:null,validator(e){return e==null||Object.values(o).includes(m(e))}},iconRight:{type:Object,default:null,validator(e){return e==null||Object.values(o).includes(m(e))}},iconRightRotation:{type:Number,default:null,validator(e){return[90,180,270].includes(e)}},index:{type:Number,default:null},label:{type:String,default:""},isLabelUppercase:{type:Boolean,default:!1},additionalText:{type:String,default:null},state:{type:String,default:c.DEFAULT,validator(e){return Object.values(c).includes(e)}},isSelected:{type:Boolean,default:!1},isDone:{type:Boolean,default:!1},hasSelectedIconsColorPrimary:{type:Boolean,default:!0},isSelectedInteractive:{type:Boolean,default:!1}},data(){return{ICONS:Object.freeze(o),ICON_SIZES:Object.freeze(O),OUTLINE_ITEM_BACKGROUND_COLORS:Object.freeze(f),OUTLINE_ITEM_SIZES:Object.freeze(r)}},computed:{isDisabled(){return this.state===c.DISABLED}}}),T={class:"ds-outlineItem__text"},_={key:0,class:"ds-outlineItem__additionalText"};function N(e,C,g,A,U,R){const s=L("ds-icon");return a(),n("div",{class:l(["ds-outlineItem",{"-ds-disabled":e.isDisabled,"-ds-medium":e.size===e.OUTLINE_ITEM_SIZES.MEDIUM,"-ds-selected":e.isSelected,"-ds-hoverable":!e.isSelected||e.isSelectedInteractive,"-ds-backgroundNeutral":e.backgroundColor===e.OUTLINE_ITEM_BACKGROUND_COLORS.NEUTRAL}])},[u("div",{class:l(["ds-outlineItem__content",{"-ds-centeredContent":e.$slots.default}])},[e.index!==null?(a(),n("span",{key:0,class:l(["ds-outlineItem__index",{"-ds-active":e.isSelected}])},d(e.index)+". ",3)):t("",!0),e.iconLeft?(a(),i(s,{key:1,class:l(["ds-outlineItem__icon",{"-ds-active":e.isSelected&&e.hasSelectedIconsColorPrimary}]),icon:e.iconLeft,size:e.ICON_SIZES.X_SMALL},null,8,["class","icon","size"])):t("",!0),u("span",T,[u("span",{class:l(["ds-outlineItem__label",{"-ds-uppercase":e.isLabelUppercase}])},[e.$slots.labelSlot?I(e.$slots,"labelSlot",{key:0},void 0,!0):(a(),n(y,{key:1},[b(d(e.label),1)],64))],2),e.additionalText?(a(),n("span",_,d(e.additionalText),1)):t("",!0)])],2),e.$slots.default||e.isDone||e.iconRight?(a(),n("div",{key:0,class:l(["ds-outlineItem__rightContent",{"-ds-centeredContent":e.$slots.default}])},[e.$slots.default?I(e.$slots,"default",{key:0},void 0,!0):t("",!0),e.isDone?(a(),i(s,{key:1,class:"ds-outlineItem__icon -ds-active",icon:e.ICONS.FA_CHECK_SOLID,size:e.ICON_SIZES.X_SMALL},null,8,["icon","size"])):e.iconRight?(a(),i(s,{key:2,class:l(["ds-outlineItem__icon",{"-ds-active":e.isSelected&&e.hasSelectedIconsColorPrimary}]),icon:e.iconRight,size:e.ICON_SIZES.X_SMALL,rotation:e.iconRightRotation},null,8,["class","icon","size","rotation"])):t("",!0)],2)):t("",!0)],2)}const k=v(p,[["render",N],["__scopeId","data-v-4f1d6404"]]);p.__docgenInfo={displayName:"OutlineItem",exportName:"default",description:"",tags:{},props:[{name:"size",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_SIZES.SMALL"}},{name:"backgroundColor",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_BACKGROUND_COLORS.NEUTRAL_WEAK"}},{name:"iconLeft",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"iconRight",type:{name:"object"},defaultValue:{func:!1,value:"null"}},{name:"iconRightRotation",type:{name:"number"},defaultValue:{func:!1,value:"null"},values:[90,180,270]},{name:"index",type:{name:"number"},defaultValue:{func:!1,value:"null"}},{name:"label",type:{name:"string"},defaultValue:{func:!1,value:"''"}},{name:"isLabelUppercase",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"additionalText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"OUTLINE_ITEM_STATES.DEFAULT"}},{name:"isSelected",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isDone",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"hasSelectedIconsColorPrimary",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"isSelectedInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],slots:[{name:"labelSlot"},{name:"default"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Outline/OutlineItem/OutlineItem.vue"]};export{k as O,f as a,r as b,c};
@@ -1,4 +1,4 @@
1
- import{O as i,a,b as s,c as r}from"./OutlineItem-1BOyMbS2.js";import{C as d}from"./Chip-BJcjfD8j.js";import{I as t}from"./Icon-I3Cniv10.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Button-C5dr6u6F.js";import"./IconButton-BPKB5gT7.js";import"./device-9fgosCm4.js";const x={title:"Components/Outline/OutlineItem",component:i},p=c=>({components:{OutlineItem:i,DsChip:d},setup(){return c},data(){return{ICONS:Object.freeze(t)}},template:`
1
+ import{O as i,a,b as s,c as r}from"./OutlineItem-COSzRi1t.js";import{C as d}from"./Chip-Bi-iKYH0.js";import{I as t}from"./Icon-BxW-ny3A.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Button-CRTJWjWJ.js";import"./IconButton-C0_vxVJn.js";import"./device-9fgosCm4.js";const x={title:"Components/Outline/OutlineItem",component:i},p=c=>({components:{OutlineItem:i,DsChip:d},setup(){return c},data(){return{ICONS:Object.freeze(t)}},template:`
2
2
  <outline-item :label="label" :additional-text="additionalText" :size="size" :state="state"
3
3
  :icon-left="ICONS[iconLeft]" :icon-right="ICONS[iconRight]" :is-done="isDone"
4
4
  :is-selected="isSelected" :background-color="backgroundColor" :index="index"
@@ -1 +1 @@
1
- import{d as n,c as o,k as i,o as r}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as s}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e=n({name:"OutlineSectionHeader",props:{title:{type:String,required:!0}}}),a={class:"ds-outlineSectionHeader"};function c(t,d,p,l,u,m){return r(),o("div",a,i(t.title),1)}const S=s(e,[["render",c],["__scopeId","data-v-451a822d"]]);e.__docgenInfo={displayName:"OutlineSectionHeader",exportName:"default",description:"",tags:{},props:[{name:"title",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Outline/OutlineSectionHeader/OutlineSectionHeader.vue"]};export{S as O};
1
+ import{d as n,c as o,v as i,o as r}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as s}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e=n({name:"OutlineSectionHeader",props:{title:{type:String,required:!0}}}),a={class:"ds-outlineSectionHeader"};function c(t,d,p,l,u,m){return r(),o("div",a,i(t.title),1)}const S=s(e,[["render",c],["__scopeId","data-v-451a822d"]]);e.__docgenInfo={displayName:"OutlineSectionHeader",exportName:"default",description:"",tags:{},props:[{name:"title",type:{name:"string"},required:!0}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Outline/OutlineSectionHeader/OutlineSectionHeader.vue"]};export{S as O};
@@ -1,4 +1,4 @@
1
- import{O as o}from"./OutlineSectionHeader-LGOAi424.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const m={title:"Components/Outline/OutlineSectionHeader",component:o},s=i=>({components:{OutlineSectionHeader:o},setup(){return i},template:'<outline-section-header :title="title" />'}),e=s.bind({}),a={title:{control:"text"}};e.argTypes=a;e.args={title:"section header all caps"};e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=6148-111431&t=Amd0mke9FMknuKCX-0"}};var t,n,r;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
1
+ import{O as o}from"./OutlineSectionHeader-C7vAvTfl.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const m={title:"Components/Outline/OutlineSectionHeader",component:o},s=i=>({components:{OutlineSectionHeader:o},setup(){return i},template:'<outline-section-header :title="title" />'}),e=s.bind({}),a={title:{control:"text"}};e.argTypes=a;e.args={title:"section header all caps"};e.parameters={design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=6148-111431&t=Amd0mke9FMknuKCX-0"}};var t,n,r;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  OutlineSectionHeader
4
4
  },
@@ -0,0 +1 @@
1
+ import{I as L}from"./IconButton-C0_vxVJn.js";import{D as A,b as C}from"./Divider-BNN8PhWF.js";import{D as I,a as f}from"./Dropdown-vkyblifO.js";import{D as b}from"./Skeleton-a6juZJ74.js";import{T as D,a as g}from"./Tooltip-DKqXTPwf.js";import{h as w,I as H,g as h}from"./Button-CRTJWjWJ.js";import{I as u}from"./Icon-BxW-ny3A.js";import{d as k,j as U,c as o,g as t,e as r,f as n,a as d,y as T,v as _,F as R,h as c,l,o as s}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as B}from"./_plugin-vue_export-helper-DlAUqK2U.js";const p={NEUTRAL_GHOST:"neutralGhost",NEUTRAL:"neutral",SUCCESS:"success",FAIL:"fail",WARNING:"warning"},O={DEFAULT:"default",LOADING:"loading"},V=e=>(e==null?void 0:e.tagName)==="INPUT"||(e==null?void 0:e.tagName)==="SELECT"||(e==null?void 0:e.tagName)==="TEXTAREA"||!!(e!=null&&e.isContentEditable),S=k({name:"OverlayHeader",components:{DsIconButton:L,DsDivider:A,DsDropdown:I,DsSkeleton:b,DsTooltip:D},props:{title:{type:String,required:!0},shortTitle:{type:String,default:null},eyebrowText:{type:String,default:null},borderColor:{type:String,default:p.NEUTRAL_GHOST,validator:e=>Object.values(p).includes(e)},isTitleInteractive:{type:Boolean,default:!1},state:{type:String,default:O.DEFAULT,validator(e){return Object.values(O).includes(e)}},dropdownIcon:{type:Object,default:()=>u.FA_ELLIPSIS_VERTICAL,validator(e){return Object.values(u).includes(U(e))}}},emits:{close:()=>!0,titleClick:()=>!0},data(){return{ICON_BUTTON_SIZES:Object.freeze(h),ICON_BUTTON_COLORS:Object.freeze(H),ICON_BUTTON_STATES:Object.freeze(w),ICONS:Object.freeze(u),DIVIDER_PROMINENCES:Object.freeze(C),OVERLAY_HEADER_BORDER_COLORS:Object.freeze(p),OVERLAY_HEADER_STATES:Object.freeze(O),DROPDOWN_PLACEMENTS:Object.freeze(f),isDropdownOpen:!1,TOOLTIP_PLACEMENTS:Object.freeze(g)}},computed:{isLoading(){return this.state===O.LOADING}},beforeUnmount(){window.removeEventListener("keydown",this.onKeydown)},mounted(){window.addEventListener("keydown",this.onKeydown)},methods:{onKeydown(e){if(!V(e.target))switch(e.key){case"q":case"Q":e.stopPropagation(),this.$emit("close");break}},onTitleClick(){this.isTitleInteractive&&this.$emit("titleClick")}}}),$={key:0,class:"ds-overlayHeader__loadingWrapper"},P={key:1,class:"ds-overlayHeader__accessory"},j={key:2,class:"ds-overlayHeader__content"},M={key:0,class:"ds-overlayHeader__eyebrow"},z=["title"],F={key:1,class:"ds-overlayHeader__eyebrowAccessory"},G={class:"ds-overlayHeader__main"},Y={key:0,class:"ds-overlayHeader__titleLeading"},W=["title"],Z={class:"ds-overlayHeader__title -ds-desktop"},K={class:"ds-overlayHeader__title -ds-mobile"},q={key:2,class:"ds-overlayHeader__titleTrailingWrapper"},Q={class:"ds-overlayHeader__titleTrailing"},X={class:"ds-overlayHeader__actions"};function J(e,a,x,ee,oe,se){const E=l("ds-skeleton"),y=l("ds-divider"),v=l("ds-icon-button"),N=l("ds-dropdown"),m=l("ds-tooltip");return s(),o("div",{class:T(["ds-overlayHeader",{"-ds-borderNeutral":e.borderColor===e.OVERLAY_HEADER_BORDER_COLORS.NEUTRAL,"-ds-borderSuccess":e.borderColor===e.OVERLAY_HEADER_BORDER_COLORS.SUCCESS,"-ds-borderFail":e.borderColor===e.OVERLAY_HEADER_BORDER_COLORS.FAIL,"-ds-borderWarning":e.borderColor===e.OVERLAY_HEADER_BORDER_COLORS.WARNING}])},[e.isLoading?(s(),o("div",$,[r(E,{width:"50%",height:"12px"}),r(E,{class:"ds-overlayHeader__loadingBar -ds-desktop",width:"100%",height:"20px"}),r(E,{class:"ds-overlayHeader__loadingBar -ds-mobile",width:"100%",height:"18px"})])):t("",!0),!e.isLoading&&e.$slots.accessory?(s(),o("div",P,[n(e.$slots,"accessory",{},void 0,!0)])):t("",!0),e.isLoading?t("",!0):(s(),o("div",j,[e.eyebrowText||e.$slots.eyebrowAccessory?(s(),o("div",M,[e.eyebrowText?(s(),o("div",{key:0,class:T(["ds-overlayHeader__eyebrowText",{"-ds-withRightMargin":e.$slots.eyebrowAccessory}]),title:e.eyebrowText},_(e.eyebrowText),11,z)):t("",!0),e.$slots.eyebrowAccessory?(s(),o("div",F,[n(e.$slots,"eyebrowAccessory",{},void 0,!0)])):t("",!0)])):t("",!0),d("div",G,[e.$slots.titleLeading?(s(),o("div",Y,[n(e.$slots,"titleLeading",{},void 0,!0)])):t("",!0),e.title||e.shortTitle?(s(),o("div",{key:1,class:T(["ds-overlayHeader__titleWrapper",{"-ds-interactive":e.isTitleInteractive}]),title:e.title,onClick:a[0]||(a[0]=(...i)=>e.onTitleClick&&e.onTitleClick(...i))},[d("div",Z,_(e.title),1),d("div",K,_(e.shortTitle||e.title),1)],10,W)):t("",!0),e.$slots.titleTrailing?(s(),o("div",q,[d("div",Q,[n(e.$slots,"titleTrailing",{},void 0,!0)])])):t("",!0)])])),!e.isLoading&&e.$slots.actions?(s(),o(R,{key:3},[d("div",X,[n(e.$slots,"actions",{},void 0,!0)]),r(y,{class:"ds-overlayHeader__divider -ds-mobileHidden",prominence:e.DIVIDER_PROMINENCES.STRONG,"is-vertical":""},null,8,["prominence"])],64)):t("",!0),!e.isLoading&&e.$slots.dropdown?(s(),o(R,{key:4},[r(N,{"boundaries-selector":"body",placement:e.DROPDOWN_PLACEMENTS.BOTTOM_END,onShow:a[1]||(a[1]=i=>e.isDropdownOpen=!0),onHide:a[2]||(a[2]=i=>e.isDropdownOpen=!1)},{reference:c(()=>[r(v,{icon:e.dropdownIcon,size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,state:e.isDropdownOpen?e.ICON_BUTTON_STATES.HOVERED:e.ICON_BUTTON_STATES.DEFAULT},null,8,["icon","size","color","state"])]),default:c(({close:i})=>[n(e.$slots,"dropdown",{close:i},void 0,!0)]),_:3},8,["placement"]),r(y,{class:"ds-overlayHeader__divider",prominence:e.DIVIDER_PROMINENCES.STRONG,"is-vertical":""},null,8,["prominence"])],64)):t("",!0),r(m,{"is-pointer-visible":!1,placement:e.TOOLTIP_PLACEMENTS.LEFT,text:"Zamknij — Q"},{default:c(()=>[r(v,{"data-test-selector":"overlay-header-close-button",icon:e.ICONS.FA_XMARK,size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,onClick:a[3]||(a[3]=i=>e.$emit("close"))},null,8,["icon","size","color"])]),_:1},8,["placement"])],2)}const ue=B(S,[["render",J],["__scopeId","data-v-fd621d71"]]);S.__docgenInfo={displayName:"OverlayHeader",exportName:"default",description:"",tags:{},props:[{name:"title",type:{name:"string"},required:!0},{name:"shortTitle",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"eyebrowText",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"borderColor",type:{name:"string"},defaultValue:{func:!1,value:"OVERLAY_HEADER_BORDER_COLORS.NEUTRAL_GHOST"}},{name:"isTitleInteractive",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"state",type:{name:"string"},defaultValue:{func:!1,value:"OVERLAY_HEADER_STATES.DEFAULT"}},{name:"dropdownIcon",type:{name:"object"},defaultValue:{func:!0,value:"() => ICONS.FA_ELLIPSIS_VERTICAL"}}],events:[{name:"close"},{name:"titleClick"}],slots:[{name:"accessory"},{name:"eyebrowAccessory"},{name:"titleLeading"},{name:"titleTrailing"},{name:"actions"},{name:"dropdown",scoped:!0,bindings:[{name:"close",title:"binding"}]}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Headers/OverlayHeader/OverlayHeader.vue"]};export{ue as O,O as a,p as b};
@@ -1,4 +1,4 @@
1
- import{O as o,a as s,b as n}from"./OverlayHeader-u9AeOezr.js";import{I as l}from"./Icon-I3Cniv10.js";import"./IconButton-BPKB5gT7.js";import"./Button-C5dr6u6F.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./device-9fgosCm4.js";import"./Divider-9o-i_zKL.js";import"./Dropdown-CYFZ3OvV.js";import"./vue-popper-DoPHnofs.js";import"./_commonjsHelpers-CDR5Xrri.js";import"./Skeleton-DhyJ4ZKG.js";import"./Tooltip-DZi9yXjr.js";const A={title:"Components/Headers/OverlayHeader",component:o},d=i=>({components:{OverlayHeader:o},setup(){return{args:i}},methods:{onClose(){console.log("OverlayHeader emitted close event")}},data(){return{ICONS:Object.freeze(l)}},template:`
1
+ import{O as o,a as s,b as n}from"./OverlayHeader-DYU6A8e-.js";import{I as l}from"./Icon-BxW-ny3A.js";import"./IconButton-C0_vxVJn.js";import"./Button-CRTJWjWJ.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./device-9fgosCm4.js";import"./Divider-BNN8PhWF.js";import"./Dropdown-vkyblifO.js";import"./vue-popper-CgJSQDC2.js";import"./_commonjsHelpers-CDR5Xrri.js";import"./Skeleton-a6juZJ74.js";import"./Tooltip-DKqXTPwf.js";const A={title:"Components/Headers/OverlayHeader",component:o},d=i=>({components:{OverlayHeader:o},setup(){return{args:i}},methods:{onClose(){console.log("OverlayHeader emitted close event")}},data(){return{ICONS:Object.freeze(l)}},template:`
2
2
  <div style="height: 300px">
3
3
  <overlay-header v-bind=args :dropdown-icon="ICONS[args.dropdownIcon]" @close="onClose">
4
4
  <template v-if="args.accessorySlot" #accessory>
@@ -1 +1 @@
1
- import{D as p}from"./Divider-9o-i_zKL.js";import{d as u,c as s,a as t,b as c,g as r,f as n,k as d,n as _,r as m,o as a}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as g}from"./_plugin-vue_export-helper-DlAUqK2U.js";const o={VERTICAL:"vertical",HORIZONTAL:"horizontal"},i=u({name:"PageHeader",components:{DsDivider:p},props:{pageTitle:{type:String,required:!0},supportingInfo:{type:String,default:null},divider:{type:Boolean,default:!0},mobileLayout:{type:String,default:o.VERTICAL,validator:e=>Object.values(o).includes(e)}},data(){return{PAGE_HEADER_MOBILE_LAYOUTS:Object.freeze(o)}}}),f={class:"ds-pageHeader__wrapper"},v={key:0,class:"ds-pageHeader__breadcrumbs"},E={class:"ds-pageHeader__contentWrapper"},H={class:"ds-pageHeader__textWrapper"},y={class:"ds-pageHeader__title"},b={key:0,class:"ds-pageHeader__supportingText"},A={key:0,class:"ds-pageHeader__actions"};function L(e,I,O,T,h,P){const l=m("ds-divider");return a(),s("div",{class:_(["ds-pageHeader",{"-ds-horizontal":e.mobileLayout===e.PAGE_HEADER_MOBILE_LAYOUTS.HORIZONTAL}])},[t("div",f,[e.$slots.breadcrumbs?(a(),s("div",v,[n(e.$slots,"breadcrumbs",{},void 0,!0)])):r("",!0),t("div",E,[t("div",H,[t("div",y,d(e.pageTitle),1),e.supportingInfo?(a(),s("div",b,d(e.supportingInfo),1)):r("",!0)]),e.$slots.actions?(a(),s("div",A,[n(e.$slots,"actions",{},void 0,!0)])):r("",!0)])]),e.divider?(a(),c(l,{key:0})):r("",!0)],2)}const S=g(i,[["render",L],["__scopeId","data-v-da9b7953"]]);i.__docgenInfo={displayName:"PageHeader",exportName:"default",description:"",tags:{},props:[{name:"pageTitle",type:{name:"string"},required:!0},{name:"supportingInfo",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"divider",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"mobileLayout",type:{name:"string"},defaultValue:{func:!1,value:"PAGE_HEADER_MOBILE_LAYOUTS.VERTICAL"}}],slots:[{name:"breadcrumbs"},{name:"actions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Headers/PageHeader/PageHeader.vue"]};export{S as P,o as a};
1
+ import{D as p}from"./Divider-BNN8PhWF.js";import{d as u,c as s,a as t,k as c,g as o,f as d,v as n,y as _,l as m,o as a}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as g}from"./_plugin-vue_export-helper-DlAUqK2U.js";const r={VERTICAL:"vertical",HORIZONTAL:"horizontal"},i=u({name:"PageHeader",components:{DsDivider:p},props:{pageTitle:{type:String,required:!0},supportingInfo:{type:String,default:null},divider:{type:Boolean,default:!0},mobileLayout:{type:String,default:r.VERTICAL,validator:e=>Object.values(r).includes(e)}},data(){return{PAGE_HEADER_MOBILE_LAYOUTS:Object.freeze(r)}}}),f={class:"ds-pageHeader__wrapper"},v={key:0,class:"ds-pageHeader__breadcrumbs"},y={class:"ds-pageHeader__contentWrapper"},E={class:"ds-pageHeader__textWrapper"},H={class:"ds-pageHeader__title"},A={key:0,class:"ds-pageHeader__supportingText"},b={key:0,class:"ds-pageHeader__actions"};function L(e,I,O,T,h,P){const l=m("ds-divider");return a(),s("div",{class:_(["ds-pageHeader",{"-ds-horizontal":e.mobileLayout===e.PAGE_HEADER_MOBILE_LAYOUTS.HORIZONTAL}])},[t("div",f,[e.$slots.breadcrumbs?(a(),s("div",v,[d(e.$slots,"breadcrumbs",{},void 0,!0)])):o("",!0),t("div",y,[t("div",E,[t("div",H,n(e.pageTitle),1),e.supportingInfo?(a(),s("div",A,n(e.supportingInfo),1)):o("",!0)]),e.$slots.actions?(a(),s("div",b,[d(e.$slots,"actions",{},void 0,!0)])):o("",!0)])]),e.divider?(a(),c(l,{key:0})):o("",!0)],2)}const S=g(i,[["render",L],["__scopeId","data-v-da9b7953"]]);i.__docgenInfo={displayName:"PageHeader",exportName:"default",description:"",tags:{},props:[{name:"pageTitle",type:{name:"string"},required:!0},{name:"supportingInfo",type:{name:"string"},defaultValue:{func:!1,value:"null"}},{name:"divider",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"mobileLayout",type:{name:"string"},defaultValue:{func:!1,value:"PAGE_HEADER_MOBILE_LAYOUTS.VERTICAL"}}],slots:[{name:"breadcrumbs"},{name:"actions"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Headers/PageHeader/PageHeader.vue"]};export{S as P,r as a};
@@ -1,4 +1,4 @@
1
- import{P as r,a as i}from"./PageHeader-DkHlb7_P.js";import{w as p}from"./decorator-B_8W69Nd.js";import"./Divider-9o-i_zKL.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const f={title:"Components/Headers/PageHeader",component:r,decorators:[p]},n=s=>({components:{PageHeader:r},setup(){return s},template:'<page-header :page-title="pageTitle" :supporting-info="supportingInfo" :mobile-layout="mobileLayout" :divider="divider"><template v-if="breadcrumbs" #breadcrumbs><div v-html="breadcrumbs" /></template><template v-if="actions" #actions><div v-html="actions" /></template></page-header>'}),e=n.bind({}),m={breadcrumbs:"",actions:"",pageTitle:"Page title",supportingInfo:"Supporting info write here",divider:!0,mobileLayout:i.VERTICAL},d={breadcrumbs:{control:"text"},actions:{control:"text"},pageTitle:{control:"text"},supportingInfo:{control:"text"},divider:{control:"boolean"},mobileLayout:{control:"select",options:Object.values(i)}};e.argTypes=d;e.args=m;e.parameters={actions:{handles:["click"]},design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=6984-129711&t=ivzu5dM9vSgW20Re-0"}};var t,a,o;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
1
+ import{P as r,a as i}from"./PageHeader-BKDJxn58.js";import{w as p}from"./decorator-B_8W69Nd.js";import"./Divider-BNN8PhWF.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./v4-CwV2VaSl.js";const f={title:"Components/Headers/PageHeader",component:r,decorators:[p]},n=s=>({components:{PageHeader:r},setup(){return s},template:'<page-header :page-title="pageTitle" :supporting-info="supportingInfo" :mobile-layout="mobileLayout" :divider="divider"><template v-if="breadcrumbs" #breadcrumbs><div v-html="breadcrumbs" /></template><template v-if="actions" #actions><div v-html="actions" /></template></page-header>'}),e=n.bind({}),m={breadcrumbs:"",actions:"",pageTitle:"Page title",supportingInfo:"Supporting info write here",divider:!0,mobileLayout:i.VERTICAL},d={breadcrumbs:{control:"text"},actions:{control:"text"},pageTitle:{control:"text"},supportingInfo:{control:"text"},divider:{control:"boolean"},mobileLayout:{control:"select",options:Object.values(i)}};e.argTypes=d;e.args=m;e.parameters={actions:{handles:["click"]},design:{type:"figma",url:"https://www.figma.com/file/izQdYyiBR1GQgFkaOIfIJI/LMS---DS-Components?type=design&node-id=6984-129711&t=ivzu5dM9vSgW20Re-0"}};var t,a,o;e.parameters={...e.parameters,docs:{...(t=e.parameters)==null?void 0:t.docs,source:{originalSource:`args => ({
2
2
  components: {
3
3
  PageHeader
4
4
  },
@@ -1 +1 @@
1
- import{I as y}from"./IconButton-BPKB5gT7.js";import{h as B,I as U,g as L}from"./Button-C5dr6u6F.js";import{I as b}from"./Icon-I3Cniv10.js";import{D as M,b as k,a as F}from"./Dropdown-CYFZ3OvV.js";import{S as $}from"./SelectList-B323Y2el.js";import{S as V}from"./SelectListItem-DfLqJR-_.js";import{d as z,c as o,a as i,g as p,F as P,m as h,j as T,A as G,k as N,f as w,n as u,r as m,o as n,e as _,b as S}from"./vue.esm-bundler-DD4BrEtS.js";import{_ as W}from"./_plugin-vue_export-helper-DlAUqK2U.js";const j=30,Z=7,C="ellipsis",d=1,E=z({name:"Pagination",components:{IconButton:y,Dropdown:M,SelectListItem:V,SelectList:$},props:{currentPage:{type:Number,default:d,validator(e){return e>0}},forceCompact:{type:Boolean,default:!1},isCentered:{type:Boolean,default:!1},itemsPerPage:{type:Number,default:j,validator(e){return e>0}},itemsTotalAmount:{type:Number,required:!0}},emits:["change-page"],data(){return{DROPDOWN_PLACEMENTS:Object.freeze(F),DROPDOWN_RADIUSES:Object.freeze(k),ICON_BUTTON_SIZES:Object.freeze(L),ICON_BUTTON_COLORS:Object.freeze(U),ICON_BUTTON_STATES:Object.freeze(B),ICONS:Object.freeze(b),FIRST_PAGE_NUMBER:d}},computed:{lastPage(){return Math.ceil(this.itemsTotalAmount/this.itemsPerPage)||d},navigationItems(){let e;this.lastPage<=Z?e=7:e=this.currentPage>4&&this.currentPage<this.lastPage-3?2:4;const t={start:Math.round(this.currentPage-e/2),end:Math.round(this.currentPage+e/2)};(t.start-1===1||t.end+1===this.lastPage)&&(t.start+=1,t.end+=1);let a=this.currentPage>e?this.getRange(Math.min(t.start,this.lastPage-e),Math.min(t.end,this.lastPage)):this.getRange(1,Math.min(this.lastPage,e+1));const r=(O,f)=>a.length+1!==this.lastPage?f:[O];return a[0]!==1&&(a=r(1,[1,C]).concat(a)),a[a.length-1]<this.lastPage&&(a=a.concat(r(this.lastPage,[C,this.lastPage]))),a},navigationItemsForDropdown(){return this.getRange(d,this.lastPage).map(e=>{const t=(e-1)*this.itemsPerPage,a=e<this.lastPage?t+this.itemsPerPage:this.itemsTotalAmount;return{label:`${e} (${t+1} - ${a})`,value:e}})}},methods:{ellipsisAsSecond(e){return e===1},getRange(e,t){return Array(t-e+1).fill(null).map((a,r)=>r+e)},changePage(e){this.currentPage!==e&&this.$emit("change-page",e)},isPage(e){return typeof e=="number"},onInputValueConfirmed(e){const t=+e.target.value;this.changePage(t)},onDropdownClick(e,t){this.changePage(e),t()}}}),q={class:"ds-pagination__itemsWrapper"},K={key:0,class:"ds-pagination__items -ds-default"},H=["onClick"],X={class:"ds-pagination__itemWrapper -ds-touchable"},J={key:1,class:"ds-pagination__items -ds-compact"},Q={class:"ds-pagination__compactItem"},Y=["value","min","max"],x={class:"ds-pagination__text"},ee={class:"ds-pagination__accessorySlot"};function te(e,t,a,r,O,f){const A=m("select-list-item"),D=m("select-list"),v=m("dropdown"),I=m("icon-button");return n(),o("div",{class:u(["ds-pagination",{"-ds-forceCompact":e.forceCompact,"-ds-centered":e.isCentered&&!e.$slots.accessory}])},[i("div",q,[e.navigationItems.length>1&&!e.forceCompact?(n(),o("div",K,[(n(!0),o(P,null,h(e.navigationItems,(s,c)=>(n(),o(P,null,[e.isPage(s)?(n(),o("div",{key:c,class:u(["ds-pagination__itemWrapper",{"-ds-touchable":e.currentPage!==s}]),role:"link",onClick:l=>e.changePage(s)},[i("span",{class:u(["ds-pagination__item",{"-ds-selected":e.currentPage===s}])},N(s),3)],10,H)):(n(),o("div",{key:`ellipsis${c}`},[T(v,{radius:e.DROPDOWN_RADIUSES.BOTTOM,"max-height":"250px",placement:e.ellipsisAsSecond(c)?e.DROPDOWN_PLACEMENTS.BOTTOM_START:e.DROPDOWN_PLACEMENTS.BOTTOM_END},{reference:_(({isOpened:l})=>[i("div",X,[i("span",{class:u(["ds-pagination__item",{"-ds-selected":l}])},"…",2)])]),default:_(({close:l})=>[e.navigationItemsForDropdown.length?(n(),S(D,{key:0},{default:_(()=>[(n(!0),o(P,null,h(e.navigationItemsForDropdown,(g,R)=>(n(),S(A,{key:R,label:g.label,"is-selected":e.currentPage===g.value,onClick:ae=>e.onDropdownClick(g.value,l)},null,8,["label","is-selected","onClick"]))),128))]),_:2},1024)):p("",!0)]),_:2},1032,["radius","placement"])]))],64))),256))])):p("",!0),e.navigationItems.length>1?(n(),o("div",J,[T(I,{size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,icon:e.ICONS.FA_ANGLE_LEFT,state:e.currentPage<=e.FIRST_PAGE_NUMBER?e.ICON_BUTTON_STATES.DISABLED:e.ICON_BUTTON_STATES.DEFAULT,onClick:t[0]||(t[0]=s=>e.changePage(e.currentPage-1))},null,8,["size","color","icon","state"]),i("div",Q,[i("input",{class:"ds-pagination__input",type:"number",value:e.currentPage,min:e.FIRST_PAGE_NUMBER,step:1,max:e.lastPage,onChange:t[1]||(t[1]=(...s)=>e.onInputValueConfirmed&&e.onInputValueConfirmed(...s)),onKeyup:t[2]||(t[2]=G((...s)=>e.onInputValueConfirmed&&e.onInputValueConfirmed(...s),["enter"]))},null,40,Y),i("span",x,"z "+N(e.lastPage),1)]),T(I,{size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,icon:e.ICONS.FA_ANGLE_RIGHT,state:e.currentPage>=e.lastPage?e.ICON_BUTTON_STATES.DISABLED:e.ICON_BUTTON_STATES.DEFAULT,onClick:t[3]||(t[3]=s=>e.changePage(e.currentPage+1))},null,8,["size","color","icon","state"])])):p("",!0)]),i("div",ee,[w(e.$slots,"accessory",{},void 0,!0)])],2)}const de=W(E,[["render",te],["__scopeId","data-v-b9c67c30"]]);E.__docgenInfo={displayName:"Pagination",exportName:"default",description:"",tags:{},props:[{name:"currentPage",type:{name:"number"},defaultValue:{func:!1,value:"FIRST_PAGE_NUMBER"}},{name:"forceCompact",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isCentered",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"itemsPerPage",type:{name:"number"},defaultValue:{func:!1,value:"PAGINATION_DEFAULT_ITEMS_PER_PAGE"}},{name:"itemsTotalAmount",type:{name:"number"},required:!0}],events:[{name:"change-page",type:{names:["undefined"]}}],slots:[{name:"accessory"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Pagination/Pagination.vue"]};export{de as P};
1
+ import{I as y}from"./IconButton-C0_vxVJn.js";import{h as B,I as U,g as L}from"./Button-CRTJWjWJ.js";import{I as M}from"./Icon-BxW-ny3A.js";import{D as b,b as k,a as F}from"./Dropdown-vkyblifO.js";import{S as $}from"./SelectList-IYj9X3z5.js";import{S as V}from"./SelectListItem-DxlYAAqR.js";import{d as z,c as o,a as i,g as p,F as P,B as I,e as T,M as G,v as N,f as w,y as u,l as m,o as n,h as _,k as S}from"./vue.esm-bundler-CC_vsnCp.js";import{_ as W}from"./_plugin-vue_export-helper-DlAUqK2U.js";const j=30,Z=7,C="ellipsis",d=1,E=z({name:"Pagination",components:{IconButton:y,Dropdown:b,SelectListItem:V,SelectList:$},props:{currentPage:{type:Number,default:d,validator(e){return e>0}},forceCompact:{type:Boolean,default:!1},isCentered:{type:Boolean,default:!1},itemsPerPage:{type:Number,default:j,validator(e){return e>0}},itemsTotalAmount:{type:Number,required:!0}},emits:["change-page"],data(){return{DROPDOWN_PLACEMENTS:Object.freeze(F),DROPDOWN_RADIUSES:Object.freeze(k),ICON_BUTTON_SIZES:Object.freeze(L),ICON_BUTTON_COLORS:Object.freeze(U),ICON_BUTTON_STATES:Object.freeze(B),ICONS:Object.freeze(M),FIRST_PAGE_NUMBER:d}},computed:{lastPage(){return Math.ceil(this.itemsTotalAmount/this.itemsPerPage)||d},navigationItems(){let e;this.lastPage<=Z?e=7:e=this.currentPage>4&&this.currentPage<this.lastPage-3?2:4;const t={start:Math.round(this.currentPage-e/2),end:Math.round(this.currentPage+e/2)};(t.start-1===1||t.end+1===this.lastPage)&&(t.start+=1,t.end+=1);let a=this.currentPage>e?this.getRange(Math.min(t.start,this.lastPage-e),Math.min(t.end,this.lastPage)):this.getRange(1,Math.min(this.lastPage,e+1));const r=(O,f)=>a.length+1!==this.lastPage?f:[O];return a[0]!==1&&(a=r(1,[1,C]).concat(a)),a[a.length-1]<this.lastPage&&(a=a.concat(r(this.lastPage,[C,this.lastPage]))),a},navigationItemsForDropdown(){return this.getRange(d,this.lastPage).map(e=>{const t=(e-1)*this.itemsPerPage,a=e<this.lastPage?t+this.itemsPerPage:this.itemsTotalAmount;return{label:`${e} (${t+1} - ${a})`,value:e}})}},methods:{ellipsisAsSecond(e){return e===1},getRange(e,t){return Array(t-e+1).fill(null).map((a,r)=>r+e)},changePage(e){this.currentPage!==e&&this.$emit("change-page",e)},isPage(e){return typeof e=="number"},onInputValueConfirmed(e){const t=+e.target.value;this.changePage(t)},onDropdownClick(e,t){this.changePage(e),t()}}}),q={class:"ds-pagination__itemsWrapper"},K={key:0,class:"ds-pagination__items -ds-default"},H=["onClick"],X={class:"ds-pagination__itemWrapper -ds-touchable"},J={key:1,class:"ds-pagination__items -ds-compact"},Q={class:"ds-pagination__compactItem"},Y=["value","min","max"],x={class:"ds-pagination__text"},ee={class:"ds-pagination__accessorySlot"};function te(e,t,a,r,O,f){const A=m("select-list-item"),D=m("select-list"),v=m("dropdown"),h=m("icon-button");return n(),o("div",{class:u(["ds-pagination",{"-ds-forceCompact":e.forceCompact,"-ds-centered":e.isCentered&&!e.$slots.accessory}])},[i("div",q,[e.navigationItems.length>1&&!e.forceCompact?(n(),o("div",K,[(n(!0),o(P,null,I(e.navigationItems,(s,c)=>(n(),o(P,null,[e.isPage(s)?(n(),o("div",{key:c,class:u(["ds-pagination__itemWrapper",{"-ds-touchable":e.currentPage!==s}]),role:"link",onClick:l=>e.changePage(s)},[i("span",{class:u(["ds-pagination__item",{"-ds-selected":e.currentPage===s}])},N(s),3)],10,H)):(n(),o("div",{key:`ellipsis${c}`},[T(v,{radius:e.DROPDOWN_RADIUSES.BOTTOM,"max-height":"250px",placement:e.ellipsisAsSecond(c)?e.DROPDOWN_PLACEMENTS.BOTTOM_START:e.DROPDOWN_PLACEMENTS.BOTTOM_END},{reference:_(({isOpened:l})=>[i("div",X,[i("span",{class:u(["ds-pagination__item",{"-ds-selected":l}])},"…",2)])]),default:_(({close:l})=>[e.navigationItemsForDropdown.length?(n(),S(D,{key:0},{default:_(()=>[(n(!0),o(P,null,I(e.navigationItemsForDropdown,(g,R)=>(n(),S(A,{key:R,label:g.label,"is-selected":e.currentPage===g.value,onClick:ae=>e.onDropdownClick(g.value,l)},null,8,["label","is-selected","onClick"]))),128))]),_:2},1024)):p("",!0)]),_:2},1032,["radius","placement"])]))],64))),256))])):p("",!0),e.navigationItems.length>1?(n(),o("div",J,[T(h,{size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,icon:e.ICONS.FA_ANGLE_LEFT,state:e.currentPage<=e.FIRST_PAGE_NUMBER?e.ICON_BUTTON_STATES.DISABLED:e.ICON_BUTTON_STATES.DEFAULT,onClick:t[0]||(t[0]=s=>e.changePage(e.currentPage-1))},null,8,["size","color","icon","state"]),i("div",Q,[i("input",{class:"ds-pagination__input",type:"number",value:e.currentPage,min:e.FIRST_PAGE_NUMBER,step:1,max:e.lastPage,onChange:t[1]||(t[1]=(...s)=>e.onInputValueConfirmed&&e.onInputValueConfirmed(...s)),onKeyup:t[2]||(t[2]=G((...s)=>e.onInputValueConfirmed&&e.onInputValueConfirmed(...s),["enter"]))},null,40,Y),i("span",x,"z "+N(e.lastPage),1)]),T(h,{size:e.ICON_BUTTON_SIZES.MEDIUM,color:e.ICON_BUTTON_COLORS.NEUTRAL,icon:e.ICONS.FA_ANGLE_RIGHT,state:e.currentPage>=e.lastPage?e.ICON_BUTTON_STATES.DISABLED:e.ICON_BUTTON_STATES.DEFAULT,onClick:t[3]||(t[3]=s=>e.changePage(e.currentPage+1))},null,8,["size","color","icon","state"])])):p("",!0)]),i("div",ee,[w(e.$slots,"accessory",{},void 0,!0)])],2)}const de=W(E,[["render",te],["__scopeId","data-v-b9c67c30"]]);E.__docgenInfo={displayName:"Pagination",exportName:"default",description:"",tags:{},props:[{name:"currentPage",type:{name:"number"},defaultValue:{func:!1,value:"FIRST_PAGE_NUMBER"}},{name:"forceCompact",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"isCentered",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"itemsPerPage",type:{name:"number"},defaultValue:{func:!1,value:"PAGINATION_DEFAULT_ITEMS_PER_PAGE"}},{name:"itemsTotalAmount",type:{name:"number"},required:!0}],events:[{name:"change-page",type:{names:["undefined"]}}],slots:[{name:"accessory"}],sourceFiles:["/home/runner/work/design-system/design-system/lib/js/components/Pagination/Pagination.vue"]};export{de as P};
@@ -1,4 +1,4 @@
1
- import{P as o}from"./Pagination-CgO9MoPY.js";import"./IconButton-BPKB5gT7.js";import"./Icon-I3Cniv10.js";import"./vue.esm-bundler-DD4BrEtS.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Button-C5dr6u6F.js";import"./device-9fgosCm4.js";import"./Dropdown-CYFZ3OvV.js";import"./vue-popper-DoPHnofs.js";import"./_commonjsHelpers-CDR5Xrri.js";import"./SelectList-B323Y2el.js";import"./SelectListItem-DfLqJR-_.js";const{useArgs:c}=__STORYBOOK_MODULE_PREVIEW_API__,I={title:"Components/Pagination",component:o},m=r=>{const[p,s]=c();return{components:{Pagination:o},setup(){return{args:r}},methods:{onChangePage(i){s({currentPage:i})}},template:`
1
+ import{P as o}from"./Pagination-CruPXU6i.js";import"./IconButton-C0_vxVJn.js";import"./Icon-BxW-ny3A.js";import"./vue.esm-bundler-CC_vsnCp.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Button-CRTJWjWJ.js";import"./device-9fgosCm4.js";import"./Dropdown-vkyblifO.js";import"./vue-popper-CgJSQDC2.js";import"./_commonjsHelpers-CDR5Xrri.js";import"./SelectList-IYj9X3z5.js";import"./SelectListItem-DxlYAAqR.js";const{useArgs:c}=__STORYBOOK_MODULE_PREVIEW_API__,I={title:"Components/Pagination",component:o},m=r=>{const[p,s]=c();return{components:{Pagination:o},setup(){return{args:r}},methods:{onChangePage(i){s({currentPage:i})}},template:`
2
2
  <Pagination v-bind=args @change-page="onChangePage">
3
3
  <template #accessory>
4
4
  <div v-if="args.accessory" v-html="args.accessory" />