@nextcloud/vue 8.26.0 → 8.27.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.
- package/CHANGELOG.md +36 -7
- package/dist/Components/NcActionButton.cjs +1 -1
- package/dist/Components/NcActionButton.mjs +1 -1
- package/dist/Components/NcActionButtonGroup.mjs +1 -1
- package/dist/Components/NcActionInput.cjs +1 -1
- package/dist/Components/NcActionInput.mjs +1 -1
- package/dist/Components/NcActionLink.cjs +1 -1
- package/dist/Components/NcActionLink.mjs +1 -1
- package/dist/Components/NcActionRouter.cjs +1 -1
- package/dist/Components/NcActionRouter.mjs +1 -1
- package/dist/Components/NcActionText.cjs +1 -1
- package/dist/Components/NcActionText.mjs +1 -1
- package/dist/Components/NcActionTextEditable.cjs +1 -1
- package/dist/Components/NcActionTextEditable.mjs +1 -1
- package/dist/Components/NcActions.mjs +1 -1
- package/dist/Components/NcAppContent.cjs +1 -1
- package/dist/Components/NcAppContent.mjs +1 -1
- package/dist/Components/NcAppNavigation.cjs +1 -1
- package/dist/Components/NcAppNavigation.mjs +1 -1
- package/dist/Components/NcAppNavigationCaption.mjs +1 -1
- package/dist/Components/NcAppNavigationItem.cjs +1 -1
- package/dist/Components/NcAppNavigationItem.mjs +1 -1
- package/dist/Components/NcAppNavigationNewItem.mjs +1 -1
- package/dist/Components/NcAppNavigationSearch.mjs +1 -1
- package/dist/Components/NcAppNavigationSettings.mjs +1 -1
- package/dist/Components/NcAppNavigationToggle.mjs +1 -1
- package/dist/Components/NcAppSettingsDialog.cjs +1 -1
- package/dist/Components/NcAppSettingsDialog.mjs +1 -1
- package/dist/Components/NcAppSidebar.cjs +1 -1
- package/dist/Components/NcAppSidebar.mjs +1 -1
- package/dist/Components/NcAvatar.cjs +1 -1
- package/dist/Components/NcAvatar.mjs +1 -1
- package/dist/Components/NcBreadcrumb.cjs +1 -1
- package/dist/Components/NcBreadcrumb.mjs +1 -1
- package/dist/Components/NcBreadcrumbs.cjs +1 -1
- package/dist/Components/NcBreadcrumbs.mjs +1 -1
- package/dist/Components/NcCheckboxRadioSwitch.mjs +1 -1
- package/dist/Components/NcChip.cjs +14 -7
- package/dist/Components/NcChip.cjs.map +1 -1
- package/dist/Components/NcChip.mjs +16 -9
- package/dist/Components/NcChip.mjs.map +1 -1
- package/dist/Components/NcCollectionList.cjs +1 -1
- package/dist/Components/NcCollectionList.mjs +1 -1
- package/dist/Components/NcColorPicker.mjs +1 -1
- package/dist/Components/NcContent.cjs +1 -1
- package/dist/Components/NcContent.mjs +1 -1
- package/dist/Components/NcDashboardWidget.cjs +1 -1
- package/dist/Components/NcDashboardWidget.mjs +1 -1
- package/dist/Components/NcDashboardWidgetItem.cjs +1 -1
- package/dist/Components/NcDashboardWidgetItem.mjs +1 -1
- package/dist/Components/NcDateTime.mjs +1 -1
- package/dist/Components/NcDateTimePicker.cjs +3 -3
- package/dist/Components/NcDateTimePicker.mjs +4 -4
- package/dist/Components/NcDateTimePickerNative.cjs +4 -5
- package/dist/Components/NcDateTimePickerNative.cjs.map +1 -1
- package/dist/Components/NcDateTimePickerNative.mjs +4 -5
- package/dist/Components/NcDateTimePickerNative.mjs.map +1 -1
- package/dist/Components/NcDialog.cjs +1 -1
- package/dist/Components/NcDialog.mjs +1 -1
- package/dist/Components/NcDialogButton.cjs +1 -1
- package/dist/Components/NcDialogButton.mjs +1 -1
- package/dist/Components/NcEmojiPicker.mjs +1 -1
- package/dist/Components/NcEmptyContent.cjs +2 -2
- package/dist/Components/NcEmptyContent.cjs.map +1 -1
- package/dist/Components/NcEmptyContent.mjs +2 -2
- package/dist/Components/NcEmptyContent.mjs.map +1 -1
- package/dist/Components/NcIconSvgWrapper.cjs +1 -1
- package/dist/Components/NcIconSvgWrapper.mjs +1 -1
- package/dist/Components/NcListItem.mjs +1 -1
- package/dist/Components/NcListItemIcon.cjs +1 -1
- package/dist/Components/NcListItemIcon.mjs +1 -1
- package/dist/Components/NcModal.cjs +3 -3
- package/dist/Components/NcModal.mjs +5 -5
- package/dist/Components/NcPasswordField.mjs +1 -1
- package/dist/Components/NcRelatedResourcesPanel.cjs +1 -1
- package/dist/Components/NcRelatedResourcesPanel.mjs +1 -1
- package/dist/Components/NcRichContenteditable.cjs +1 -1
- package/dist/Components/NcRichContenteditable.mjs +1 -1
- package/dist/Components/NcRichText.cjs +2 -2
- package/dist/Components/NcRichText.mjs +3 -3
- package/dist/Components/NcSelect.cjs +1 -1
- package/dist/Components/NcSelect.mjs +1 -1
- package/dist/Components/NcSelectTags.cjs +1 -1
- package/dist/Components/NcSelectTags.mjs +1 -1
- package/dist/Components/NcSelectUsers.cjs +1 -1
- package/dist/Components/NcSelectUsers.mjs +1 -1
- package/dist/Components/NcSettingsInputText.mjs +1 -1
- package/dist/Components/NcSettingsSection.mjs +1 -1
- package/dist/Components/NcSettingsSelectGroup.cjs +1 -1
- package/dist/Components/NcSettingsSelectGroup.mjs +1 -1
- package/dist/Components/NcTextField.mjs +1 -1
- package/dist/Components/NcTimezonePicker.cjs +1 -1
- package/dist/Components/NcTimezonePicker.mjs +1 -1
- package/dist/Components/NcUserBubble.cjs +1 -1
- package/dist/Components/NcUserBubble.mjs +1 -1
- package/dist/Components/NcUserStatusIcon.mjs +1 -1
- package/dist/Composables/useHotKey.cjs +22 -20
- package/dist/Composables/useHotKey.cjs.map +1 -1
- package/dist/Composables/useHotKey.mjs +22 -20
- package/dist/Composables/useHotKey.mjs.map +1 -1
- package/dist/Composables/useIsFullscreen.cjs +3 -1
- package/dist/Composables/useIsFullscreen.cjs.map +1 -1
- package/dist/Composables/useIsFullscreen.mjs +3 -1
- package/dist/Composables/useIsFullscreen.mjs.map +1 -1
- package/dist/Directives/Focus.cjs +1 -3
- package/dist/Directives/Focus.cjs.map +1 -1
- package/dist/Directives/Focus.mjs +1 -2
- package/dist/Directives/Focus.mjs.map +1 -1
- package/dist/Functions/reference.cjs +1 -1
- package/dist/Functions/reference.mjs +1 -1
- package/dist/Functions/usernameToColor.mjs +1 -1
- package/dist/Mixins/isFullscreen.cjs.map +1 -1
- package/dist/Mixins/isFullscreen.mjs.map +1 -1
- package/dist/assets/{NcActionButton-BqMeBMdA.css → NcActionButton-CuV1ITDb.css} +25 -17
- package/dist/assets/{NcActionLink-DA3ebr8W.css → NcActionLink-CNMaob5P.css} +9 -1
- package/dist/assets/{NcActionRouter-DlqXQ6ai.css → NcActionRouter-zXuKLsvi.css} +9 -1
- package/dist/assets/{NcActionText-Cvug6qMa.css → NcActionText-vT7nheBU.css} +9 -1
- package/dist/assets/{NcActionTextEditable-CasTVqIo.css → NcActionTextEditable-BflqGcjc.css} +60 -60
- package/dist/assets/{NcAppNavigation-DfTQlVGB.css → NcAppNavigation-WhHdkLQF.css} +12 -12
- package/dist/assets/{NcAppSidebar-DVDDtSbA.css → NcAppSidebar-BFg2HHh6.css} +44 -50
- package/dist/assets/{NcChip-BNLuZgd6.css → NcChip-CF4Q149V.css} +9 -9
- package/dist/assets/{NcDateTimePicker-BjzB4Eug.css → NcDateTimePicker-hcAowAbZ.css} +7 -7
- package/dist/assets/{NcDateTimePickerNative-DVGEymgr.css → NcDateTimePickerNative-CYS2ORfo.css} +13 -13
- package/dist/assets/{NcEmptyContent-CSsXYYcn.css → NcEmptyContent-CHVEJoER.css} +12 -9
- package/dist/assets/{NcIconSvgWrapper-BiNW6Guv.css → NcIconSvgWrapper-DX_XWpAs.css} +9 -6
- package/dist/assets/{NcRichText-CzCM9V1U.css → NcRichText-li93TNBn.css} +83 -83
- package/dist/chunks/{GenColors-S7frO84b.mjs → GenColors-B49R8TGp.mjs} +2 -2
- package/dist/chunks/{GenColors-S7frO84b.mjs.map → GenColors-B49R8TGp.mjs.map} +1 -1
- package/dist/chunks/{NcActionButton-CXeEXQLT.cjs → NcActionButton-CD87AU6W.cjs} +18 -46
- package/dist/chunks/NcActionButton-CD87AU6W.cjs.map +1 -0
- package/dist/chunks/{NcActionButton-Gpv56vuS.mjs → NcActionButton-CuVNJJtW.mjs} +18 -46
- package/dist/chunks/NcActionButton-CuVNJJtW.mjs.map +1 -0
- package/dist/chunks/{NcActionButtonGroup-BteTNhIn.mjs → NcActionButtonGroup-DEf00ge6.mjs} +2 -2
- package/dist/chunks/{NcActionButtonGroup-BteTNhIn.mjs.map → NcActionButtonGroup-DEf00ge6.mjs.map} +1 -1
- package/dist/chunks/{NcActionInput-DXQauTM5.mjs → NcActionInput-B4qGsF57.mjs} +5 -5
- package/dist/chunks/{NcActionInput-DXQauTM5.mjs.map → NcActionInput-B4qGsF57.mjs.map} +1 -1
- package/dist/chunks/{NcActionInput-DXkx_xX-.cjs → NcActionInput-BmERg0FB.cjs} +2 -2
- package/dist/chunks/{NcActionInput-DXkx_xX-.cjs.map → NcActionInput-BmERg0FB.cjs.map} +1 -1
- package/dist/chunks/{NcActionTextEditable-s1Xqpg6x.cjs → NcActionTextEditable-Cceub6Yt.cjs} +8 -10
- package/dist/chunks/NcActionTextEditable-Cceub6Yt.cjs.map +1 -0
- package/dist/chunks/{NcActionTextEditable-BYqqHPj2.mjs → NcActionTextEditable-DNweMXRJ.mjs} +8 -10
- package/dist/chunks/NcActionTextEditable-DNweMXRJ.mjs.map +1 -0
- package/dist/chunks/{NcActions-DEZO46mP.mjs → NcActions-B4VZCD8B.mjs} +2 -2
- package/dist/chunks/{NcActions-DEZO46mP.mjs.map → NcActions-B4VZCD8B.mjs.map} +1 -1
- package/dist/chunks/{NcAppContent-CiYhQ9r8.cjs → NcAppContent-B7ER65tk.cjs} +5 -4
- package/dist/chunks/NcAppContent-B7ER65tk.cjs.map +1 -0
- package/dist/chunks/{NcAppContent-LEyo6v0_.mjs → NcAppContent-DyXqBrOB.mjs} +4 -3
- package/dist/chunks/NcAppContent-DyXqBrOB.mjs.map +1 -0
- package/dist/chunks/{NcAppNavigation-H8Gvbq5E.mjs → NcAppNavigation-CqKWSnxO.mjs} +4 -4
- package/dist/chunks/{NcAppNavigation-H8Gvbq5E.mjs.map → NcAppNavigation-CqKWSnxO.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigation-DBfTz6qV.cjs → NcAppNavigation-JyeZxhb6.cjs} +3 -3
- package/dist/chunks/{NcAppNavigation-DBfTz6qV.cjs.map → NcAppNavigation-JyeZxhb6.cjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationCaption-CkIBHQGQ.mjs → NcAppNavigationCaption-DcgSwIOY.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationCaption-CkIBHQGQ.mjs.map → NcAppNavigationCaption-DcgSwIOY.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationItem-BXAslQdH.cjs → NcAppNavigationItem-B9Gs5p7m.cjs} +2 -2
- package/dist/chunks/{NcAppNavigationItem-BXAslQdH.cjs.map → NcAppNavigationItem-B9Gs5p7m.cjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationItem-CjhP63uG.mjs → NcAppNavigationItem-CrTVtqYV.mjs} +5 -5
- package/dist/chunks/{NcAppNavigationItem-CjhP63uG.mjs.map → NcAppNavigationItem-CrTVtqYV.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationNewItem-DGjgp78o.mjs → NcAppNavigationNewItem-CcBvnQst.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationNewItem-DGjgp78o.mjs.map → NcAppNavigationNewItem-CcBvnQst.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationSearch-DTW6CtnU.mjs → NcAppNavigationSearch-BC3kPnxr.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationSearch-DTW6CtnU.mjs.map → NcAppNavigationSearch-BC3kPnxr.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationSettings-t9JntjoG.mjs → NcAppNavigationSettings-JruJ3cF1.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationSettings-t9JntjoG.mjs.map → NcAppNavigationSettings-JruJ3cF1.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationToggle-CjPJB2s3.mjs → NcAppNavigationToggle-CUdNQwyN.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationToggle-CjPJB2s3.mjs.map → NcAppNavigationToggle-CUdNQwyN.mjs.map} +1 -1
- package/dist/chunks/{NcAppSettingsDialog-K3yVenLs.cjs → NcAppSettingsDialog-6cTux_qA.cjs} +2 -2
- package/dist/chunks/{NcAppSettingsDialog-K3yVenLs.cjs.map → NcAppSettingsDialog-6cTux_qA.cjs.map} +1 -1
- package/dist/chunks/{NcAppSettingsDialog-Dl-kMSpe.mjs → NcAppSettingsDialog-D98cLpyy.mjs} +3 -3
- package/dist/chunks/{NcAppSettingsDialog-Dl-kMSpe.mjs.map → NcAppSettingsDialog-D98cLpyy.mjs.map} +1 -1
- package/dist/chunks/{NcAppSidebar-C_C76E_8.mjs → NcAppSidebar-BdryV6wY.mjs} +7 -7
- package/dist/chunks/{NcAppSidebar-C8jffFJX.cjs.map → NcAppSidebar-BdryV6wY.mjs.map} +1 -1
- package/dist/chunks/{NcAppSidebar-C8jffFJX.cjs → NcAppSidebar-BqMsSY-_.cjs} +4 -4
- package/dist/chunks/{NcAppSidebar-C_C76E_8.mjs.map → NcAppSidebar-BqMsSY-_.cjs.map} +1 -1
- package/dist/chunks/{NcAvatar-CwEPANj3.cjs → NcAvatar-D_1clyWB.cjs} +3 -3
- package/dist/chunks/{NcAvatar-CwEPANj3.cjs.map → NcAvatar-D_1clyWB.cjs.map} +1 -1
- package/dist/chunks/{NcAvatar-C7__uk4K.mjs → NcAvatar-YSp2ORHc.mjs} +7 -7
- package/dist/chunks/{NcAvatar-C7__uk4K.mjs.map → NcAvatar-YSp2ORHc.mjs.map} +1 -1
- package/dist/chunks/{NcBreadcrumb-BExltxiq.cjs → NcBreadcrumb-BSRmcIIh.cjs} +36 -4
- package/dist/chunks/NcBreadcrumb-BSRmcIIh.cjs.map +1 -0
- package/dist/chunks/{NcBreadcrumb-c6GeY5FH.mjs → NcBreadcrumb-Cu1XtrUo.mjs} +36 -4
- package/dist/chunks/NcBreadcrumb-Cu1XtrUo.mjs.map +1 -0
- package/dist/chunks/{NcBreadcrumbs-Q3JgS6gv.cjs → NcBreadcrumbs-B0m6jKER.cjs} +3 -3
- package/dist/chunks/{NcBreadcrumbs-Q3JgS6gv.cjs.map → NcBreadcrumbs-B0m6jKER.cjs.map} +1 -1
- package/dist/chunks/{NcBreadcrumbs-CPmhYEn-.mjs → NcBreadcrumbs-B1LdRe5_.mjs} +4 -4
- package/dist/chunks/{NcBreadcrumbs-CPmhYEn-.mjs.map → NcBreadcrumbs-B1LdRe5_.mjs.map} +1 -1
- package/dist/chunks/{NcCheckboxRadioSwitch-Di9rSADK.mjs → NcCheckboxRadioSwitch-VeztTzpz.mjs} +2 -2
- package/dist/chunks/{NcCheckboxRadioSwitch-Di9rSADK.mjs.map → NcCheckboxRadioSwitch-VeztTzpz.mjs.map} +1 -1
- package/dist/chunks/{NcCollectionList-BqeRskNY.cjs → NcCollectionList-BStYmq4u.cjs} +4 -4
- package/dist/chunks/{NcCollectionList-BqeRskNY.cjs.map → NcCollectionList-BStYmq4u.cjs.map} +1 -1
- package/dist/chunks/{NcCollectionList-Bih4GaqC.mjs → NcCollectionList-CFt-EZON.mjs} +6 -6
- package/dist/chunks/{NcCollectionList-Bih4GaqC.mjs.map → NcCollectionList-CFt-EZON.mjs.map} +1 -1
- package/dist/chunks/{NcColorPicker-C0sDksCi.mjs → NcColorPicker-D7aj2f61.mjs} +3 -3
- package/dist/chunks/{NcColorPicker-C0sDksCi.mjs.map → NcColorPicker-D7aj2f61.mjs.map} +1 -1
- package/dist/chunks/{NcContent-BHl5YDYI.mjs → NcContent-Cfz3ytoh.mjs} +3 -3
- package/dist/chunks/{NcContent-BHl5YDYI.mjs.map → NcContent-Cfz3ytoh.mjs.map} +1 -1
- package/dist/chunks/{NcContent-4X_oNYtW.cjs → NcContent-DUUfYUtn.cjs} +2 -2
- package/dist/chunks/{NcContent-4X_oNYtW.cjs.map → NcContent-DUUfYUtn.cjs.map} +1 -1
- package/dist/chunks/{NcDashboardWidget-D0APPS8G.cjs → NcDashboardWidget-BI_Z44sc.cjs} +3 -3
- package/dist/chunks/{NcDashboardWidget-D0APPS8G.cjs.map → NcDashboardWidget-BI_Z44sc.cjs.map} +1 -1
- package/dist/chunks/{NcDashboardWidget-Doiev7HC.mjs → NcDashboardWidget-eStjL-WD.mjs} +4 -4
- package/dist/chunks/{NcDashboardWidget-Doiev7HC.mjs.map → NcDashboardWidget-eStjL-WD.mjs.map} +1 -1
- package/dist/chunks/{NcDashboardWidgetItem-CgDB6x5V.mjs → NcDashboardWidgetItem-BRFj1-Ir.mjs} +4 -4
- package/dist/chunks/{NcDashboardWidgetItem-CgDB6x5V.mjs.map → NcDashboardWidgetItem-BRFj1-Ir.mjs.map} +1 -1
- package/dist/chunks/{NcDashboardWidgetItem-BxKKR8k4.cjs → NcDashboardWidgetItem-gMKHqbAo.cjs} +3 -3
- package/dist/chunks/{NcDashboardWidgetItem-BxKKR8k4.cjs.map → NcDashboardWidgetItem-gMKHqbAo.cjs.map} +1 -1
- package/dist/chunks/{NcDateTime-BR6BBvML.mjs → NcDateTime-DshRFtUU.mjs} +2 -2
- package/dist/chunks/{NcDateTime-BR6BBvML.mjs.map → NcDateTime-DshRFtUU.mjs.map} +1 -1
- package/dist/chunks/{NcDialog-D2lwwZL-.mjs → NcDialog-CKgpZOiy.mjs} +2 -2
- package/dist/chunks/{NcDialog-D2lwwZL-.mjs.map → NcDialog-CKgpZOiy.mjs.map} +1 -1
- package/dist/chunks/{NcDialog-BjLJB7fW.cjs → NcDialog-DvC6y1MC.cjs} +2 -2
- package/dist/chunks/{NcDialog-BjLJB7fW.cjs.map → NcDialog-DvC6y1MC.cjs.map} +1 -1
- package/dist/chunks/{NcDialogButton-ByvLH63s.cjs → NcDialogButton-BFemrIUw.cjs} +2 -2
- package/dist/chunks/{NcDialogButton-ByvLH63s.cjs.map → NcDialogButton-BFemrIUw.cjs.map} +1 -1
- package/dist/chunks/{NcDialogButton-BB56HcBl.mjs → NcDialogButton-CROAi1Ll.mjs} +3 -3
- package/dist/chunks/{NcDialogButton-BB56HcBl.mjs.map → NcDialogButton-CROAi1Ll.mjs.map} +1 -1
- package/dist/chunks/{NcEmojiPicker-B7hMntv4.mjs → NcEmojiPicker-Du-vbR5T.mjs} +5 -5
- package/dist/chunks/{NcEmojiPicker-B7hMntv4.mjs.map → NcEmojiPicker-Du-vbR5T.mjs.map} +1 -1
- package/dist/chunks/{NcIconSvgWrapper-RKuZn260.mjs → NcIconSvgWrapper-Cb-cPj1R.mjs} +4 -4
- package/dist/chunks/{NcIconSvgWrapper-RKuZn260.mjs.map → NcIconSvgWrapper-Cb-cPj1R.mjs.map} +1 -1
- package/dist/chunks/{NcIconSvgWrapper-BlucK1g3.cjs → NcIconSvgWrapper-CrnN5Sq5.cjs} +4 -4
- package/dist/chunks/{NcIconSvgWrapper-BlucK1g3.cjs.map → NcIconSvgWrapper-CrnN5Sq5.cjs.map} +1 -1
- package/dist/chunks/{NcInputConfirmCancel-CacBXLGS.mjs → NcInputConfirmCancel-Dhbj3Gad.mjs} +2 -2
- package/dist/chunks/{NcInputConfirmCancel-CacBXLGS.mjs.map → NcInputConfirmCancel-Dhbj3Gad.mjs.map} +1 -1
- package/dist/chunks/{NcListItem-CM-2Sxu0.mjs → NcListItem-B4Uyn2AS.mjs} +2 -2
- package/dist/chunks/{NcListItem-CM-2Sxu0.mjs.map → NcListItem-B4Uyn2AS.mjs.map} +1 -1
- package/dist/chunks/{NcListItemIcon-qx58XY9w.mjs → NcListItemIcon-0H1Pepui.mjs} +3 -3
- package/dist/chunks/{NcListItemIcon-qx58XY9w.mjs.map → NcListItemIcon-0H1Pepui.mjs.map} +1 -1
- package/dist/chunks/{NcListItemIcon-BxBLI3Cf.cjs → NcListItemIcon-C_sEE5Xw.cjs} +3 -3
- package/dist/chunks/{NcListItemIcon-BxBLI3Cf.cjs.map → NcListItemIcon-C_sEE5Xw.cjs.map} +1 -1
- package/dist/chunks/{NcPasswordField-CTKHRVC4.mjs → NcPasswordField-DNjegDVj.mjs} +2 -2
- package/dist/chunks/{NcPasswordField-CTKHRVC4.mjs.map → NcPasswordField-DNjegDVj.mjs.map} +1 -1
- package/dist/chunks/{NcRelatedResourcesPanel-B-y_Wan4.cjs → NcRelatedResourcesPanel-C9qkNtuo.cjs} +2 -2
- package/dist/chunks/{NcRelatedResourcesPanel-B-y_Wan4.cjs.map → NcRelatedResourcesPanel-C9qkNtuo.cjs.map} +1 -1
- package/dist/chunks/{NcRelatedResourcesPanel-CmiW_ds0.mjs → NcRelatedResourcesPanel-Y38zaKtn.mjs} +3 -3
- package/dist/chunks/{NcRelatedResourcesPanel-CmiW_ds0.mjs.map → NcRelatedResourcesPanel-Y38zaKtn.mjs.map} +1 -1
- package/dist/chunks/{NcRichContenteditable-BT7nIuR_.mjs → NcRichContenteditable-B8UqleMX.mjs} +7 -7
- package/dist/chunks/{NcRichContenteditable-BT7nIuR_.mjs.map → NcRichContenteditable-B8UqleMX.mjs.map} +1 -1
- package/dist/chunks/{NcRichContenteditable-X5J0Qi0e.cjs → NcRichContenteditable-Df_eA-oc.cjs} +4 -4
- package/dist/chunks/{NcRichContenteditable-X5J0Qi0e.cjs.map → NcRichContenteditable-Df_eA-oc.cjs.map} +1 -1
- package/dist/chunks/{NcRichText-CFfsXyEN.cjs → NcRichText-BS22_NFb.cjs} +8 -5
- package/dist/chunks/{NcRichText-DpFtge5H.mjs.map → NcRichText-BS22_NFb.cjs.map} +1 -1
- package/dist/chunks/{NcRichText-DpFtge5H.mjs → NcRichText-CwXSzf21.mjs} +8 -6
- package/dist/chunks/{NcRichText-CFfsXyEN.cjs.map → NcRichText-CwXSzf21.mjs.map} +1 -1
- package/dist/chunks/{NcSelect-DYSqnJAW.mjs → NcSelect-CjUzohn5.mjs} +3 -3
- package/dist/chunks/{NcSelect-DYSqnJAW.mjs.map → NcSelect-CjUzohn5.mjs.map} +1 -1
- package/dist/chunks/{NcSelect-DDfu-5yj.cjs → NcSelect-D2xnxw4_.cjs} +2 -2
- package/dist/chunks/{NcSelect-DDfu-5yj.cjs.map → NcSelect-D2xnxw4_.cjs.map} +1 -1
- package/dist/chunks/{NcSelectTags-DFIf3ZbY.cjs → NcSelectTags--3rrSgOf.cjs} +2 -2
- package/dist/chunks/{NcSelectTags-DFIf3ZbY.cjs.map → NcSelectTags--3rrSgOf.cjs.map} +1 -1
- package/dist/chunks/{NcSelectTags-DHMtiklq.mjs → NcSelectTags-wJN9J7_t.mjs} +3 -3
- package/dist/chunks/{NcSelectTags-DHMtiklq.mjs.map → NcSelectTags-wJN9J7_t.mjs.map} +1 -1
- package/dist/chunks/{NcSelectUsers-DHeyF0V3.cjs → NcSelectUsers-CtuVriGK.cjs} +3 -3
- package/dist/chunks/{NcSelectUsers-DHeyF0V3.cjs.map → NcSelectUsers-CtuVriGK.cjs.map} +1 -1
- package/dist/chunks/{NcSelectUsers-MAZYa8N3.mjs → NcSelectUsers-W17kOow7.mjs} +4 -4
- package/dist/chunks/{NcSelectUsers-MAZYa8N3.mjs.map → NcSelectUsers-W17kOow7.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsInputText-t1FMnLKA.mjs → NcSettingsInputText-YO053agL.mjs} +2 -2
- package/dist/chunks/{NcSettingsInputText-t1FMnLKA.mjs.map → NcSettingsInputText-YO053agL.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsSection-EC3SmiDX.mjs → NcSettingsSection-C76Kqeew.mjs} +2 -2
- package/dist/chunks/{NcSettingsSection-EC3SmiDX.mjs.map → NcSettingsSection-C76Kqeew.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsSelectGroup-5TT25zk4.mjs → NcSettingsSelectGroup-CH_kppKo.mjs} +3 -3
- package/dist/chunks/{NcSettingsSelectGroup-5TT25zk4.mjs.map → NcSettingsSelectGroup-CH_kppKo.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsSelectGroup-B1jMnVTt.cjs → NcSettingsSelectGroup-Dj0Cusng.cjs} +2 -2
- package/dist/chunks/{NcSettingsSelectGroup-B1jMnVTt.cjs.map → NcSettingsSelectGroup-Dj0Cusng.cjs.map} +1 -1
- package/dist/chunks/{NcTextField-DRANdaIf.mjs → NcTextField-o_8gWurX.mjs} +2 -2
- package/dist/chunks/{NcTextField-DRANdaIf.mjs.map → NcTextField-o_8gWurX.mjs.map} +1 -1
- package/dist/chunks/{NcTimezonePicker-BHbJMvKH.cjs → NcTimezonePicker-BZhgUp10.cjs} +2 -2
- package/dist/chunks/{NcTimezonePicker-BHbJMvKH.cjs.map → NcTimezonePicker-BZhgUp10.cjs.map} +1 -1
- package/dist/chunks/{NcTimezonePicker-DMlta1oU.mjs → NcTimezonePicker-q46K1fSq.mjs} +3 -3
- package/dist/chunks/{NcTimezonePicker-DMlta1oU.mjs.map → NcTimezonePicker-q46K1fSq.mjs.map} +1 -1
- package/dist/chunks/{NcUserBubble-B0WUzIE6.mjs → NcUserBubble-B3-E-5F5.mjs} +2 -2
- package/dist/chunks/{NcUserBubble-B0WUzIE6.mjs.map → NcUserBubble-B3-E-5F5.mjs.map} +1 -1
- package/dist/chunks/{NcUserBubble-C1vjKHDG.cjs → NcUserBubble-CQHrLJ0S.cjs} +2 -2
- package/dist/chunks/{NcUserBubble-C1vjKHDG.cjs.map → NcUserBubble-CQHrLJ0S.cjs.map} +1 -1
- package/dist/chunks/{NcUserStatusIcon-WEKmuaoU.mjs → NcUserStatusIcon-kbPFeJV6.mjs} +2 -2
- package/dist/chunks/{NcUserStatusIcon-WEKmuaoU.mjs.map → NcUserStatusIcon-kbPFeJV6.mjs.map} +1 -1
- package/dist/chunks/{ScopeComponent-BgpM7PMa.mjs → ScopeComponent-B1B5sM-c.mjs} +2 -2
- package/dist/chunks/{ScopeComponent-BgpM7PMa.mjs.map → ScopeComponent-B1B5sM-c.mjs.map} +1 -1
- package/dist/chunks/{ScopeComponent-B3KEK6Gp.cjs → ScopeComponent-CsLxtFTy.cjs} +2 -2
- package/dist/chunks/{ScopeComponent-B3KEK6Gp.cjs.map → ScopeComponent-CsLxtFTy.cjs.map} +1 -1
- package/dist/chunks/{_l10n-Dt0m9Fxw.mjs → _l10n-DQgzdF9S.mjs} +5 -5
- package/dist/chunks/_l10n-DQgzdF9S.mjs.map +1 -0
- package/dist/chunks/mdi-VRLMiqbd.mjs +13 -0
- package/dist/chunks/{mdi-CZJxQPz6.mjs.map → mdi-VRLMiqbd.mjs.map} +1 -1
- package/dist/chunks/{mdi-Da9VuUVq.cjs → mdi-YVKlPhQN.cjs} +5 -1
- package/dist/chunks/{mdi-Da9VuUVq.cjs.map → mdi-YVKlPhQN.cjs.map} +1 -1
- package/dist/chunks/{referencePickerModal-BkKFAotc.mjs → referencePickerModal-4kExxHbR.mjs} +4 -4
- package/dist/chunks/{referencePickerModal-BkKFAotc.mjs.map → referencePickerModal-4kExxHbR.mjs.map} +1 -1
- package/dist/chunks/{referencePickerModal-DweQwMJ_.cjs → referencePickerModal-D4q4tELn.cjs} +2 -2
- package/dist/chunks/{referencePickerModal-DweQwMJ_.cjs.map → referencePickerModal-D4q4tELn.cjs.map} +1 -1
- package/dist/chunks/{usernameToColor-DJfepfog.mjs → usernameToColor-yoVXn0De.mjs} +2 -2
- package/dist/chunks/{usernameToColor-DJfepfog.mjs.map → usernameToColor-yoVXn0De.mjs.map} +1 -1
- package/dist/composables/useHotKey/index.d.ts +35 -0
- package/dist/composables/useIsFullscreen/index.d.ts +11 -0
- package/dist/directives/Focus/index.d.ts +3 -0
- package/dist/index.cjs +36 -36
- package/dist/index.mjs +51 -51
- package/package.json +3 -2
- package/dist/chunks/ChevronRight-BUv-PtHh.mjs +0 -38
- package/dist/chunks/ChevronRight-BUv-PtHh.mjs.map +0 -1
- package/dist/chunks/ChevronRight-ZCKVg9OI.cjs +0 -37
- package/dist/chunks/ChevronRight-ZCKVg9OI.cjs.map +0 -1
- package/dist/chunks/NcActionButton-CXeEXQLT.cjs.map +0 -1
- package/dist/chunks/NcActionButton-Gpv56vuS.mjs.map +0 -1
- package/dist/chunks/NcActionTextEditable-BYqqHPj2.mjs.map +0 -1
- package/dist/chunks/NcActionTextEditable-s1Xqpg6x.cjs.map +0 -1
- package/dist/chunks/NcAppContent-CiYhQ9r8.cjs.map +0 -1
- package/dist/chunks/NcAppContent-LEyo6v0_.mjs.map +0 -1
- package/dist/chunks/NcBreadcrumb-BExltxiq.cjs.map +0 -1
- package/dist/chunks/NcBreadcrumb-c6GeY5FH.mjs.map +0 -1
- package/dist/chunks/_l10n-Dt0m9Fxw.mjs.map +0 -1
- package/dist/chunks/mdi-CZJxQPz6.mjs +0 -9
- package/dist/chunks/rtl-DLuwcTlm.cjs +0 -5
- package/dist/chunks/rtl-DLuwcTlm.cjs.map +0 -1
- package/dist/chunks/rtl-v0UOPAM7.mjs +0 -6
- package/dist/chunks/rtl-v0UOPAM7.mjs.map +0 -1
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
require('../assets/NcDateTimePicker-
|
|
1
|
+
require('../assets/NcDateTimePicker-hcAowAbZ.css');
|
|
2
2
|
"use strict";
|
|
3
3
|
const _l10n = require("../chunks/_l10n-BiiXtYiP.cjs");
|
|
4
4
|
const GenRandomId = require("../chunks/GenRandomId-BQDud3d4.cjs");
|
|
5
5
|
const useModelMigration = require("../chunks/useModelMigration-D5zhrNXr.cjs");
|
|
6
|
-
const NcTimezonePicker = require("../chunks/NcTimezonePicker-
|
|
6
|
+
const NcTimezonePicker = require("../chunks/NcTimezonePicker-BZhgUp10.cjs");
|
|
7
7
|
const NcPopover = require("../chunks/NcPopover-B2z7TwNr.cjs");
|
|
8
8
|
const _pluginVue2_normalizer = require("../chunks/_plugin-vue2_normalizer-V0q-tHlQ.cjs");
|
|
9
9
|
const l10n = require("@nextcloud/l10n");
|
|
10
10
|
const DatePicker = require("vue2-datepicker");
|
|
11
|
-
const ScopeComponent = require("../chunks/ScopeComponent-
|
|
11
|
+
const ScopeComponent = require("../chunks/ScopeComponent-CsLxtFTy.cjs");
|
|
12
12
|
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
|
|
13
13
|
const DatePicker__default = /* @__PURE__ */ _interopDefault(DatePicker);
|
|
14
14
|
_l10n.register(_l10n.t37);
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import '../assets/NcDateTimePicker-
|
|
2
|
-
import { r as register, K as t37, a as t } from "../chunks/_l10n-
|
|
1
|
+
import '../assets/NcDateTimePicker-hcAowAbZ.css';
|
|
2
|
+
import { r as register, K as t37, a as t } from "../chunks/_l10n-DQgzdF9S.mjs";
|
|
3
3
|
import { G as GenRandomId } from "../chunks/GenRandomId-CMooMQt0.mjs";
|
|
4
4
|
import { u as useModelMigration } from "../chunks/useModelMigration-EhAWvqDD.mjs";
|
|
5
|
-
import { N as NcTimezonePicker } from "../chunks/NcTimezonePicker-
|
|
5
|
+
import { N as NcTimezonePicker } from "../chunks/NcTimezonePicker-q46K1fSq.mjs";
|
|
6
6
|
import { N as NcPopover } from "../chunks/NcPopover-kYsewfff.mjs";
|
|
7
7
|
import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-DU4iP6Vu.mjs";
|
|
8
8
|
import { getFirstDay, getDayNamesMin, getDayNamesShort, getDayNames, getMonthNamesShort, getMonthNames } from "@nextcloud/l10n";
|
|
9
9
|
import DatePicker from "vue2-datepicker";
|
|
10
|
-
import { S as ScopeComponent } from "../chunks/ScopeComponent-
|
|
10
|
+
import { S as ScopeComponent } from "../chunks/ScopeComponent-B1B5sM-c.mjs";
|
|
11
11
|
register(t37);
|
|
12
12
|
const _sfc_main$2 = {
|
|
13
13
|
name: "CalendarBlankIcon",
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
require('../assets/NcDateTimePickerNative-
|
|
1
|
+
require('../assets/NcDateTimePickerNative-CYS2ORfo.css');
|
|
2
2
|
"use strict";
|
|
3
3
|
const useModelMigration = require("../chunks/useModelMigration-D5zhrNXr.cjs");
|
|
4
4
|
const GenRandomId = require("../chunks/GenRandomId-BQDud3d4.cjs");
|
|
5
5
|
const _pluginVue2_normalizer = require("../chunks/_plugin-vue2_normalizer-V0q-tHlQ.cjs");
|
|
6
|
-
const ScopeComponent = require("../chunks/ScopeComponent-
|
|
6
|
+
const ScopeComponent = require("../chunks/ScopeComponent-CsLxtFTy.cjs");
|
|
7
7
|
const inputDateTypes = ["date", "datetime-local", "month", "time", "week"];
|
|
8
8
|
const _sfc_main = {
|
|
9
9
|
name: "NcDateTimePickerNative",
|
|
@@ -134,8 +134,7 @@ const _sfc_main = {
|
|
|
134
134
|
/**
|
|
135
135
|
* Handle the input event
|
|
136
136
|
*
|
|
137
|
-
* @param {InputEvent} $event input event
|
|
138
|
-
* @return {Date|string} new chosen Date() or an empty string
|
|
137
|
+
* @param {InputEvent} $event input event payloads
|
|
139
138
|
*/
|
|
140
139
|
input: ($event) => {
|
|
141
140
|
if (isNaN($event.target.valueAsNumber)) {
|
|
@@ -224,7 +223,7 @@ var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
|
|
|
224
223
|
_sfc_staticRenderFns,
|
|
225
224
|
false,
|
|
226
225
|
null,
|
|
227
|
-
"
|
|
226
|
+
"9e776556"
|
|
228
227
|
);
|
|
229
228
|
const NcDateTimePickerNative = __component__.exports;
|
|
230
229
|
ScopeComponent.ScopeComponent(NcDateTimePickerNative);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcDateTimePickerNative.cjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html# <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label class=\"native-datetime-picker--label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tvalue: {\n\t\t\ttype: Date,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'date-time-picker-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'input',\n\t\t/**\n\t\t * Emitted when the input value changes\n\t\t *\n\t\t * @return {Date} new chosen Date()\n\t\t */\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('value', 'input')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.model)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payload\n\t\t\t\t * @return {Date|string} new chosen Date() or an empty string\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\tthis.model = null\n\t\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t\t\t\tthis.model = new Date(inputDateWithTimezone)\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n","/**\n * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":["GenRandomId","useModelMigration","ScopeComponent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"NcDateTimePickerNative.cjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html# <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label class=\"native-datetime-picker--label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tvalue: {\n\t\t\ttype: Date,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'date-time-picker-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'input',\n\t\t/**\n\t\t * Emitted when the input value changes\n\t\t *\n\t\t * @return {Date} new chosen Date()\n\t\t */\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('value', 'input')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.model)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payloads\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\tthis.model = null\n\t\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t\t\t\tthis.model = new Date(inputDateWithTimezone)\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n","/**\n * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":["GenRandomId","useModelMigration","ScopeComponent"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import '../assets/NcDateTimePickerNative-
|
|
1
|
+
import '../assets/NcDateTimePickerNative-CYS2ORfo.css';
|
|
2
2
|
import { u as useModelMigration } from "../chunks/useModelMigration-EhAWvqDD.mjs";
|
|
3
3
|
import { G as GenRandomId } from "../chunks/GenRandomId-CMooMQt0.mjs";
|
|
4
4
|
import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-DU4iP6Vu.mjs";
|
|
5
|
-
import { S as ScopeComponent } from "../chunks/ScopeComponent-
|
|
5
|
+
import { S as ScopeComponent } from "../chunks/ScopeComponent-B1B5sM-c.mjs";
|
|
6
6
|
const inputDateTypes = ["date", "datetime-local", "month", "time", "week"];
|
|
7
7
|
const _sfc_main = {
|
|
8
8
|
name: "NcDateTimePickerNative",
|
|
@@ -133,8 +133,7 @@ const _sfc_main = {
|
|
|
133
133
|
/**
|
|
134
134
|
* Handle the input event
|
|
135
135
|
*
|
|
136
|
-
* @param {InputEvent} $event input event
|
|
137
|
-
* @return {Date|string} new chosen Date() or an empty string
|
|
136
|
+
* @param {InputEvent} $event input event payloads
|
|
138
137
|
*/
|
|
139
138
|
input: ($event) => {
|
|
140
139
|
if (isNaN($event.target.valueAsNumber)) {
|
|
@@ -223,7 +222,7 @@ var __component__ = /* @__PURE__ */ normalizeComponent(
|
|
|
223
222
|
_sfc_staticRenderFns,
|
|
224
223
|
false,
|
|
225
224
|
null,
|
|
226
|
-
"
|
|
225
|
+
"9e776556"
|
|
227
226
|
);
|
|
228
227
|
const NcDateTimePickerNative = __component__.exports;
|
|
229
228
|
ScopeComponent(NcDateTimePickerNative);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcDateTimePickerNative.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html# <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label class=\"native-datetime-picker--label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tvalue: {\n\t\t\ttype: Date,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'date-time-picker-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'input',\n\t\t/**\n\t\t * Emitted when the input value changes\n\t\t *\n\t\t * @return {Date} new chosen Date()\n\t\t */\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('value', 'input')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.model)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payload\n\t\t\t\t * @return {Date|string} new chosen Date() or an empty string\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\tthis.model = null\n\t\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t\t\t\tthis.model = new Date(inputDateWithTimezone)\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n","/**\n * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"NcDateTimePickerNative.mjs","sources":["../../src/components/NcDateTimePickerNative/NcDateTimePickerNative.vue","../../src/components/NcDateTimePickerNative/index.js"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n\n### General description\n\nThis components provides a wrapper around the native browser datetime picker. <br>\nThis is an input with some type of date e.g. https://html.spec.whatwg.org/multipage/input.html#local-date-and-time-state-(type=datetime-local). <br>\nAll available types are: 'date', 'datetime-local', 'month', 'time' and 'week', please check them here: https://html.spec.whatwg.org/multipage/input.html# <br>\n\n### Examples\n\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<hr/>\n\t\t<div class=\"flex\">\n\t\t\t<NcSelect v-bind=\"props\" v-model=\"type\" />\n\t\t\t<NcDateTimePickerNative\n\t\t\t\tv-model=\"value\"\n\t\t\t\t:label=\"label\"\n\t\t\t\t:type=\"type\" />\n\t\t</div>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tprops: {\n\t\t\t\t\tclearable: false,\n\t\t\t\t\tinputLabel: 'Picker type',\n\t\t\t\t\toptions: [\n\t\t\t\t\t\t'date',\n\t\t\t\t\t\t'datetime-local',\n\t\t\t\t\t\t'month',\n\t\t\t\t\t\t'time',\n\t\t\t\t\t\t'week',\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\ttype: 'datetime-local',\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'Select a new date or time',\n\t\t\t}\n\t\t},\n\t}\n</script>\n<style scoped>\n.flex {\n\tdisplay: flex;\n\tgap: 4px;\n}\n</style>\n```\n\n#### Usage: type='datetime-local' with min date and max date\n```vue\n<template>\n\t<div>\n\t\t<span>Picked date: {{ value || 'null' }}</span>\n\t\t<NcDateTimePickerNative\n\t\t\tv-model=\"value\"\n\t\t\t:min=\"yesterdayDate\"\n\t\t\t:max=\"someDate\"\n\t\t\t:label=\"label\"\n\t\t\ttype=\"datetime-local\" />\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tvalue: new Date(),\n\t\t\t\tlabel: 'please select a new date',\n\t\t\t\tyesterdayDate: new Date(new Date().setDate(new Date().getDate() - 1)),\n\t\t\t\tsomeDate: new Date(new Date().setDate(new Date().getDate() + 7)),\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"native-datetime-picker\">\n\t\t<label class=\"native-datetime-picker--label\"\n\t\t\t:class=\"{ 'hidden-visually': hideLabel }\"\n\t\t\t:for=\"id\">\n\t\t\t{{ label }}\n\t\t</label>\n\t\t<input :id=\"id\"\n\t\t\tclass=\"native-datetime-picker--input\"\n\t\t\t:class=\"inputClass\"\n\t\t\t:type=\"type\"\n\t\t\t:value=\"formattedValue\"\n\t\t\t:min=\"formattedMin\"\n\t\t\t:max=\"formattedMax\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\tv-on=\"listeners\">\n\t</div>\n</template>\n\n<script>\nimport { useModelMigration } from '../../composables/useModelMigration.ts'\nimport GenRandomId from '../../utils/GenRandomId.js'\n\nconst inputDateTypes = ['date', 'datetime-local', 'month', 'time', 'week']\n\nexport default {\n\tname: 'NcDateTimePickerNative',\n\tinheritAttrs: false,\n\n\tmodel: {\n\t\tprop: 'modelValue',\n\t\tevent: 'update:modelValue',\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Removed in v9 - use `modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\tvalue: {\n\t\t\ttype: Date,\n\t\t\tdefault: undefined,\n\t\t},\n\n\t\t/**\n\t\t * The date is – like the `Date` object in JavaScript – tied to UTC.\n\t\t * The selected time zone does not have an influence of the selected time and date value.\n\t\t * You have to translate the time yourself when you want to factor in time zones.\n\t\t * Pass null to clear the input field.\n\t\t */\n\t\tmodelValue: {\n\t\t\ttype: Date,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * id attribute of the input field\n\t\t */\n\t\tid: {\n\t\t\ttype: String,\n\t\t\tdefault: () => 'date-time-picker-' + GenRandomId(),\n\t\t\tvalidator: id => id.trim() !== '',\n\t\t},\n\t\t/**\n\t\t * type attribute of the input field\n\t\t * default type: String\n\t\t * The type of the input element, it can be `date`, `datetime-local`, `month`, `time`, `week`\n\t\t */\n\t\ttype: {\n\t\t\ttype: String,\n\t\t\tdefault: 'date',\n\t\t\tvalidate: (name) => inputDateTypes.includes(name),\n\t\t},\n\t\t/**\n\t\t * text inside the label element\n\t\t * default type: String\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: 'Please choose a date',\n\t\t},\n\t\t/**\n\t\t * min attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmin: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * max attribute of the input field\n\t\t * default type: null\n\t\t */\n\t\tmax: {\n\t\t\ttype: [Date, Boolean],\n\t\t\tdefault: null,\n\t\t},\n\t\t/**\n\t\t * Flag to hide the label\n\t\t * default type: String\n\t\t * The hidden input label for accessibility purposes.\n\t\t */\n\t\thideLabel: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Class to add to the input field.\n\t\t * Necessary to use NcDateTimePickerNative in the NcActionInput component.\n\t\t */\n\t\tinputClass: {\n\t\t\ttype: [Object, String],\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\temits: [\n\t\t/**\n\t\t * Removed in v9 - use `update:modelValue` (`v-model`) instead\n\t\t * @deprecated\n\t\t */\n\t\t'input',\n\t\t/**\n\t\t * Emitted when the input value changes\n\t\t *\n\t\t * @return {Date} new chosen Date()\n\t\t */\n\t\t'update:modelValue',\n\t\t/** Same as update:modelValue for Vue 2 compatibility */\n\t\t'update:model-value',\n\t],\n\n\tsetup() {\n\t\tconst model = useModelMigration('value', 'input')\n\t\treturn {\n\t\t\tmodel,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tformattedValue() {\n\t\t\treturn this.formatValue(this.model)\n\t\t},\n\t\tformattedMin() {\n\t\t\tif (this.min) {\n\t\t\t\treturn this.formatValue(this.min)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tformattedMax() {\n\t\t\tif (this.max) {\n\t\t\t\treturn this.formatValue(this.max)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tlisteners() {\n\t\t\treturn {\n\t\t\t\t...this.$listeners,\n\t\t\t\t/**\n\t\t\t\t * Handle the input event\n\t\t\t\t *\n\t\t\t\t * @param {InputEvent} $event input event payloads\n\t\t\t\t */\n\t\t\t\tinput: ($event) => {\n\t\t\t\t\tif (isNaN($event.target.valueAsNumber)) {\n\t\t\t\t\t\tthis.model = null\n\t\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\t\tconst time = $event.target.value\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\t// this case is because of Chrome bug\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\t/**\n\t\t\t\t\t\t\t * Emitted when the input value changes\n\t\t\t\t\t\t\t *\n\t\t\t\t\t\t\t * @return {Date} new chosen Date()\n\t\t\t\t\t\t\t */\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, MM, dd } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${time}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\t\tconst MM = (new Date($event.target.value).getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\t\t\tif (this.model === '') {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(new Date())\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tconst { yyyy, dd, hh, mm } = this.getReadableDate(this.model)\n\t\t\t\t\t\t\tthis.model = new Date(`${yyyy}-${MM}-${dd}T${hh}:${mm}`)\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst timezoneOffsetSeconds = new Date($event.target.valueAsNumber).getTimezoneOffset() * 1000 * 60\n\t\t\t\t\t\tconst inputDateWithTimezone = $event.target.valueAsNumber + timezoneOffsetSeconds\n\t\t\t\t\t\tthis.model = new Date(inputDateWithTimezone)\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t}\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Returns Object with string values of a Date\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {object|undefined}\n\t\t */\n\t\tgetReadableDate(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst yyyy = value.getFullYear().toString().padStart(4, '0')\n\t\t\t\tconst MM = (value.getMonth() + 1).toString().padStart(2, '0')\n\t\t\t\tconst dd = value.getDate().toString().padStart(2, '0')\n\t\t\t\tconst hh = value.getHours().toString().padStart(2, '0')\n\t\t\t\tconst mm = value.getMinutes().toString().padStart(2, '0')\n\n\t\t\t\treturn { yyyy, MM, dd, hh, mm }\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Returns preformatted value for the input field\n\t\t *\n\t\t * @param {Date} value The selected value\n\t\t * @return {string|undefined}\n\t\t */\n\t\tformatValue(value) {\n\t\t\tif (value instanceof Date) {\n\t\t\t\tconst { yyyy, MM, dd, hh, mm } = this.getReadableDate(value)\n\t\t\t\tif (this.type === 'datetime-local') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}T${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'date') {\n\t\t\t\t\treturn `${yyyy}-${MM}-${dd}`\n\t\t\t\t} else if (this.type === 'month') {\n\t\t\t\t\treturn `${yyyy}-${MM}`\n\t\t\t\t} else if (this.type === 'time') {\n\t\t\t\t\treturn `${hh}:${mm}`\n\t\t\t\t} else if (this.type === 'week') {\n\t\t\t\t\tconst startDate = new Date(yyyy, 0, 1)\n\t\t\t\t\tconst daysSinceBeginningOfYear = Math.floor((value - startDate)\n\t\t\t\t\t\t/ (24 * 60 * 60 * 1000))\n\t\t\t\t\tconst weekNumber = Math.ceil(daysSinceBeginningOfYear / 7)\n\t\t\t\t\treturn `${yyyy}-W${weekNumber}`\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n\t.native-datetime-picker {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--label {\n\t\tmargin-block-end: 2px;\n\t}\n\n\t.native-datetime-picker .native-datetime-picker--input {\n\t\t// If border width differs between focused and unfocused we need to compensate to prevent jumping\n\t\t--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));\n\t\twidth: 100%;\n\t\tflex: 0 0 auto;\n\t\tmargin: 0;\n\t\tpadding-inline-start: calc(var(--border-radius-large) + var(--input-border-width-offset));\n\t\tpadding-inline-end: calc(var(--default-grid-baseline) + var(--input-border-width-offset));\n\t\tborder: var(--border-width-input, 2px) solid var(--color-border-maxcontrast);\n\n\t\t&:active:not([disabled]),\n\t\t&:hover:not([disabled]),\n\t\t&:focus:not([disabled]),\n\t\t&:focus-within:not([disabled]) {\n\t\t\tborder-color: var(--color-main-text);\n\t\t\tborder-width: var(--border-width-input-focused, 2px);\n\t\t\tbox-shadow: 0 0 0 2px var(--color-main-background) !important;\n\t\t\t// Reset padding offset when focused\n\t\t\t--input-border-width-offset: 0px;\n\t\t}\n\t}\n\n\t[data-theme-light],\n\t[data-themes*=light] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: light;\n\t\t}\n\t}\n\n\t[data-theme-dark],\n\t[data-themes*=dark] {\n\t\t.native-datetime-picker--input {\n\t\t\tcolor-scheme: dark;\n\t\t}\n\t}\n\n\t[data-theme-default],\n\t[data-themes*=default] {\n\t\t@media (prefers-color-scheme: light) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: light;\n\t\t\t}\n\t\t}\n\t\t@media (prefers-color-scheme: dark) {\n\t\t\t.native-datetime-picker--input {\n\t\t\t\tcolor-scheme: dark;\n\t\t\t}\n\t\t}\n\t}\n</style>\n","/**\n * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport NcDateTimePickerNative from './NcDateTimePickerNative.vue'\nimport ScopeComponent from '../../utils/ScopeComponent.js'\n\nScopeComponent(NcDateTimePickerNative)\n\nexport default NcDateTimePickerNative\n"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
require('../assets/NcEmptyContent-
|
|
1
|
+
require('../assets/NcEmptyContent-CHVEJoER.css');
|
|
2
2
|
"use strict";
|
|
3
3
|
const _pluginVue2_normalizer = require("../chunks/_plugin-vue2_normalizer-V0q-tHlQ.cjs");
|
|
4
4
|
const _sfc_main = {
|
|
@@ -48,7 +48,7 @@ var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
|
|
|
48
48
|
_sfc_staticRenderFns,
|
|
49
49
|
false,
|
|
50
50
|
null,
|
|
51
|
-
"
|
|
51
|
+
"8aaa3146"
|
|
52
52
|
);
|
|
53
53
|
const NcEmptyContent = __component__.exports;
|
|
54
54
|
module.exports = NcEmptyContent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcEmptyContent.cjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";;AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"NcEmptyContent.cjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\tpadding: var(--default-grid-baseline);\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\ttext-align: center;\n\t\ttext-wrap-style: balance;\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";;AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import '../assets/NcEmptyContent-
|
|
1
|
+
import '../assets/NcEmptyContent-CHVEJoER.css';
|
|
2
2
|
import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-DU4iP6Vu.mjs";
|
|
3
3
|
const _sfc_main = {
|
|
4
4
|
name: "NcEmptyContent",
|
|
@@ -47,7 +47,7 @@ var __component__ = /* @__PURE__ */ normalizeComponent(
|
|
|
47
47
|
_sfc_staticRenderFns,
|
|
48
48
|
false,
|
|
49
49
|
null,
|
|
50
|
-
"
|
|
50
|
+
"8aaa3146"
|
|
51
51
|
);
|
|
52
52
|
const NcEmptyContent = __component__.exports;
|
|
53
53
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcEmptyContent.mjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"NcEmptyContent.mjs","sources":["../../src/components/NcEmptyContent/NcEmptyContent.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Basic use\n\nUse this component to display a message about an empty content.\nProviding an icon, name, and a description is strongly advised.\n\n```\n<template>\n\t<NcEmptyContent name=\"No comments\"\n\t\tdescription=\"Start writing comments and they will appear here.\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n#### With custom svg\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No files in here\">\n\t\t<template #icon>\n\t\t\t<NcIconSvgWrapper :svg=\"folderSvg\" />\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport folderSvg from '@mdi/svg/svg/folder.svg?raw'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tfolderSvg,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also customize the name using the `#name` slot\nand add actions. But to keep the style consistent across Nextcloud\nconsider only using header elements as the root elements for the name slot.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tdescription=\"No comments in here\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #name>\n\t\t\t<h1 class=\"empty-content__name\">\n\t\t\t\tNo comments\n\t\t\t</h1>\n\t\t</template>\n\t\t<template #action>\n\t\t\t<NcButton variant=\"primary\">\n\t\t\t\tAdd a comment!\n\t\t\t</NcButton>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n\nSimilar to the `#name` slot, you could also use the `#description` slot.\nThe content will be rendered within a paragraph so you can use any inline element,\nlike a link.\n\n```\n<template>\n\t<NcEmptyContent\n\t\tname=\"No comments\">\n\t\t<template #icon>\n\t\t\t<Comment />\n\t\t</template>\n\t\t<template #description>\n\t\t\t<a href=\"https://en.wikipedia.org/wiki/Comment\">What is even a comment?</a>\n\t\t</template>\n\t</NcEmptyContent>\n</template>\n\n<script>\nimport Comment from 'vue-material-design-icons/Comment.vue'\n\nexport default {\n\tcomponents: {\n\t\tComment,\n\t},\n}\n</script>\n```\n</docs>\n\n<template>\n\t<div class=\"empty-content\" role=\"note\">\n\t\t<div v-if=\"$slots.icon\" class=\"empty-content__icon\" aria-hidden=\"true\">\n\t\t\t<!-- @slot Optional material design icon -->\n\t\t\t<slot name=\"icon\" />\n\t\t</div>\n\t\t<!-- @slot Optional name if not set as property, shall be enclosed by a header element -->\n\t\t<slot name=\"name\">\n\t\t\t<span v-if=\"hasName\" class=\"empty-content__name\">\n\t\t\t\t{{ name }}\n\t\t\t</span>\n\t\t</slot>\n\t\t<p v-if=\"hasDescription\" class=\"empty-content__description\">\n\t\t\t<!-- @slot Optional formatted description rendered inside a paragraph -->\n\t\t\t<slot name=\"description\">\n\t\t\t\t{{ description }}\n\t\t\t</slot>\n\t\t</p>\n\t\t<div v-if=\"$slots.action\" class=\"empty-content__action\">\n\t\t\t<!-- @slot Optional slot for a button or the like -->\n\t\t\t<slot name=\"action\" />\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tname: 'NcEmptyContent',\n\n\tprops: {\n\t\t/**\n\t\t * A header message about an empty content shown\n\t\t * @example 'No comments'\n\t\t */\n\t\tname: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Desription of the empty content\n\t\t * @example 'No comments yet, start the conversation!'\n\t\t */\n\t\tdescription: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t},\n\n\tcomputed: {\n\t\thasName() {\n\t\t\treturn this.name !== ''\n\t\t},\n\t\t/**\n\t\t * Check if a description is given as either property or slot\n\t\t */\n\t\thasDescription() {\n\t\t\treturn this.description !== '' || this.$slots.description?.[0]\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.empty-content {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-direction: column;\n\tjustify-content: center;\n\t/* In case of using in a flex container - flex in advance */\n\tflex-grow: 1;\n\tpadding: var(--default-grid-baseline);\n\n\t.modal-wrapper & {\n\t\tmargin-top: 5vh;\n\t\tmargin-bottom: 5vh;\n\t}\n\n\t&__icon {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tmargin: 0 auto 15px;\n\t\topacity: .4;\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-position: center;\n\t\tbackground-size: 64px;\n\n\t\t:deep(svg) {\n\t\t\twidth: 64px !important;\n\t\t\theight: 64px !important;\n\t\t\tmax-width: 64px !important;\n\t\t\tmax-height: 64px !important;\n\t\t}\n\t}\n\n\t&__name {\n\t\tmargin-bottom: 10px;\n\t\ttext-align: center;\n\t\tfont-weight: bold;\n\t\tfont-size: 20px;\n\t\tline-height: 30px;\n\t}\n\n\t&__description {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\ttext-align: center;\n\t\ttext-wrap-style: balance;\n\t}\n\n\t&__action {\n\t\tmargin-top: 8px;\n\n\t\t.modal-wrapper & {\n\t\t\tmargin-top: 20px;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";AAqJA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,UAAA;AACA,aAAA,KAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAA;AACA,aAAA,KAAA,gBAAA,MAAA,KAAA,OAAA,cAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
const NcIconSvgWrapper = require("../chunks/NcIconSvgWrapper-
|
|
2
|
+
const NcIconSvgWrapper = require("../chunks/NcIconSvgWrapper-CrnN5Sq5.cjs");
|
|
3
3
|
module.exports = NcIconSvgWrapper.NcIconSvgWrapper;
|
|
4
4
|
//# sourceMappingURL=NcIconSvgWrapper.cjs.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
require('../assets/NcModal-BS5vtogq.css');
|
|
2
2
|
"use strict";
|
|
3
|
-
const ScopeComponent = require("../chunks/ScopeComponent-
|
|
3
|
+
const ScopeComponent = require("../chunks/ScopeComponent-CsLxtFTy.cjs");
|
|
4
4
|
const core = require("@vueuse/core");
|
|
5
|
-
const mdi = require("../chunks/mdi-
|
|
5
|
+
const mdi = require("../chunks/mdi-YVKlPhQN.cjs");
|
|
6
6
|
const focusTrap$1 = require("focus-trap");
|
|
7
7
|
const Vue = require("vue");
|
|
8
8
|
const GenRandomId = require("../chunks/GenRandomId-BQDud3d4.cjs");
|
|
@@ -10,7 +10,7 @@ const focusTrap = require("../chunks/focusTrap-Vbgxe8ZX.cjs");
|
|
|
10
10
|
const _l10n = require("../chunks/_l10n-BiiXtYiP.cjs");
|
|
11
11
|
const NcActions = require("../chunks/NcActions-B7DbEbCo.cjs");
|
|
12
12
|
const Components_NcButton = require("./NcButton.cjs");
|
|
13
|
-
const NcIconSvgWrapper = require("../chunks/NcIconSvgWrapper-
|
|
13
|
+
const NcIconSvgWrapper = require("../chunks/NcIconSvgWrapper-CrnN5Sq5.cjs");
|
|
14
14
|
const Close = require("../chunks/Close-CqmXxEKi.cjs");
|
|
15
15
|
const _pluginVue2_normalizer = require("../chunks/_plugin-vue2_normalizer-V0q-tHlQ.cjs");
|
|
16
16
|
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import '../assets/NcModal-BS5vtogq.css';
|
|
2
|
-
import { S as ScopeComponent } from "../chunks/ScopeComponent-
|
|
2
|
+
import { S as ScopeComponent } from "../chunks/ScopeComponent-B1B5sM-c.mjs";
|
|
3
3
|
import { useSwipe } from "@vueuse/core";
|
|
4
|
-
import {
|
|
4
|
+
import { m as mdiChevronRight, d as mdiChevronLeft } from "../chunks/mdi-VRLMiqbd.mjs";
|
|
5
5
|
import { createFocusTrap } from "focus-trap";
|
|
6
6
|
import Vue, { useCssVars } from "vue";
|
|
7
7
|
import { G as GenRandomId } from "../chunks/GenRandomId-CMooMQt0.mjs";
|
|
8
8
|
import { g as getTrapStack } from "../chunks/focusTrap-DmkaYJTC.mjs";
|
|
9
|
-
import { r as register, J as t33, n as t17, a as t } from "../chunks/_l10n-
|
|
10
|
-
import { N as NcActions } from "../chunks/NcActions-
|
|
9
|
+
import { r as register, J as t33, n as t17, a as t } from "../chunks/_l10n-DQgzdF9S.mjs";
|
|
10
|
+
import { N as NcActions } from "../chunks/NcActions-B4VZCD8B.mjs";
|
|
11
11
|
import NcButton from "./NcButton.mjs";
|
|
12
|
-
import { N as NcIconSvgWrapper } from "../chunks/NcIconSvgWrapper-
|
|
12
|
+
import { N as NcIconSvgWrapper } from "../chunks/NcIconSvgWrapper-Cb-cPj1R.mjs";
|
|
13
13
|
import { C as Close } from "../chunks/Close-BtLPUSdO.mjs";
|
|
14
14
|
import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-DU4iP6Vu.mjs";
|
|
15
15
|
register(t17, t33);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
const NcRelatedResourcesPanel = require("../chunks/NcRelatedResourcesPanel-
|
|
2
|
+
const NcRelatedResourcesPanel = require("../chunks/NcRelatedResourcesPanel-C9qkNtuo.cjs");
|
|
3
3
|
module.exports = NcRelatedResourcesPanel.NcRelatedResourcesPanel;
|
|
4
4
|
//# sourceMappingURL=NcRelatedResourcesPanel.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
3
|
const Mixins_richEditor = require("../chunks/index-B0yHh7IW.cjs");
|
|
4
|
-
const NcRichContenteditable = require("../chunks/NcRichContenteditable-
|
|
4
|
+
const NcRichContenteditable = require("../chunks/NcRichContenteditable-Df_eA-oc.cjs");
|
|
5
5
|
exports.NcMentionBubble = Mixins_richEditor.NcMentionBubble;
|
|
6
6
|
exports.NcAutoCompleteResult = NcRichContenteditable.NcAutoCompleteResult;
|
|
7
7
|
exports.default = NcRichContenteditable.NcRichContenteditable;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
|
-
const NcRichText = require("../chunks/NcRichText-
|
|
3
|
+
const NcRichText = require("../chunks/NcRichText-BS22_NFb.cjs");
|
|
4
4
|
const Functions_registerReference = require("../chunks/index-BV85rPB7.cjs");
|
|
5
|
-
const referencePickerModal = require("../chunks/referencePickerModal-
|
|
5
|
+
const referencePickerModal = require("../chunks/referencePickerModal-D4q4tELn.cjs");
|
|
6
6
|
exports.NcReferenceList = NcRichText.NcReferenceList;
|
|
7
7
|
exports.NcRichText = NcRichText.NcRichText;
|
|
8
8
|
exports.default = NcRichText.NcRichText;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { N as NcRichText } from "../chunks/NcRichText-
|
|
2
|
-
import { a } from "../chunks/NcRichText-
|
|
1
|
+
import { N as NcRichText } from "../chunks/NcRichText-CwXSzf21.mjs";
|
|
2
|
+
import { a } from "../chunks/NcRichText-CwXSzf21.mjs";
|
|
3
3
|
import { N, d, i, b, r, c, a as a2 } from "../chunks/index-56SXuvlv.mjs";
|
|
4
|
-
import { e, f, N as N2, h, a as a3, g, b as b2, c as c2, d as d2, s } from "../chunks/referencePickerModal-
|
|
4
|
+
import { e, f, N as N2, h, a as a3, g, b as b2, c as c2, d as d2, s } from "../chunks/referencePickerModal-4kExxHbR.mjs";
|
|
5
5
|
export {
|
|
6
6
|
N as NcCustomPickerRenderResult,
|
|
7
7
|
a as NcReferenceList,
|