@nextcloud/vue 9.0.0-rc.0 → 9.0.0-rc.2
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 +57 -11
- package/dist/assets/{NcActionButton-DfdRrSEu.css → NcActionButton-B2G7zsju.css} +25 -17
- package/dist/assets/{NcActionInput-BNWL2Q-3.css → NcActionInput-SoC93uat.css} +62 -62
- package/dist/assets/{NcActionLink-C9_ycPLF.css → NcActionLink-VngQl-C2.css} +21 -13
- package/dist/assets/{NcActionRouter-CVsc7Ezc.css → NcActionRouter-CBVOuCQ3.css} +9 -1
- package/dist/assets/{NcActionText-C7y7Pe6P.css → NcActionText-CWAPsJmz.css} +9 -1
- package/dist/assets/{NcActionTextEditable-OBnWSj_T.css → NcActionTextEditable-BbOijUsB.css} +60 -60
- package/dist/assets/{NcActions-D7gPHaUE.css → NcActions-DxcpMfrs.css} +11 -11
- package/dist/assets/{NcAppContent-CvTesBem.css → NcAppContent-Di-SbMxO.css} +23 -23
- package/dist/assets/{NcAppNavigationItem-DRU-cLRN.css → NcAppNavigationItem-Cq6ZYdmT.css} +30 -30
- package/dist/assets/{NcAppSettingsDialog-DZfD_UEa.css → NcAppSettingsDialog-DMWosHw9.css} +10 -10
- package/dist/assets/{NcAppSidebar-GFQ62pY2.css → NcAppSidebar-exl90fRm.css} +85 -76
- package/dist/assets/{NcAvatar-UxFZ39EC.css → NcAvatar-B3wk2Xxl.css} +24 -24
- package/dist/assets/{NcChip-CKtzzrlA.css → NcChip-VsVAGaG6.css} +9 -9
- package/dist/assets/{NcContent-aXaYSfjS.css → NcContent-cRwic6r5.css} +9 -9
- package/dist/assets/{NcCounterBubble-DWgyYB0d.css → NcCounterBubble-DpKQwKTI.css} +7 -7
- package/dist/assets/{NcDashboardWidget-xV4o6Cen.css → NcDashboardWidget-BEYk4O95.css} +12 -12
- package/dist/assets/{NcDateTimePickerNative-CdHLvH4A.css → NcDateTimePickerNative-CeuS8Oeg.css} +13 -13
- package/dist/assets/{NcEmptyContent-D1O466rM.css → NcEmptyContent-q-geAf0w.css} +12 -9
- package/dist/assets/{NcGuestContent-C9lbC3vg.css → NcGuestContent-BZ26iXQi.css} +2 -2
- package/dist/assets/{NcIconSvgWrapper-BzRHs8iB.css → NcIconSvgWrapper-cYxhjYue.css} +12 -9
- package/dist/assets/{NcListItem-Byw-ayOI.css → NcListItem-9eCenovm.css} +44 -44
- package/dist/assets/{NcListItemIcon-Bnr-Z-SO.css → NcListItemIcon-DjEDwxRp.css} +13 -13
- package/dist/assets/{NcMentionBubble-CB5c5ue2.css → NcMentionBubble-DLOTFwpl.css} +9 -9
- package/dist/assets/{index-CjPwAJ46.css → NcModal-DaHROv08.css} +61 -61
- package/dist/assets/{NcRichContenteditable-CkyUKlIz.css → NcRichContenteditable-KsmFPJmm.css} +21 -21
- package/dist/assets/{NcRichText-BbVi69cc.css → NcRichText-GnQKcHYO.css} +84 -84
- package/dist/assets/NcSelectUsers-2-PyuY9Z.css +4 -0
- package/dist/assets/{NcUserStatusIcon-Du-BEPk_.css → NcUserStatusIcon-CtJLt6AU.css} +3 -3
- package/dist/assets/{referencePickerModal-CkGgDb19.css → referencePickerModal-DAD-jv3F.css} +23 -23
- package/dist/chunks/{ArrowRight-DQT24Cb-.mjs → ArrowRight-DRKHUZMH.mjs} +3 -3
- package/dist/chunks/{ArrowRight-DQT24Cb-.mjs.map → ArrowRight-DRKHUZMH.mjs.map} +1 -1
- package/dist/chunks/{NcActionButton-BZEDhdCm.mjs → NcActionButton-CnX0dQzz.mjs} +44 -95
- package/dist/chunks/NcActionButton-CnX0dQzz.mjs.map +1 -0
- package/dist/chunks/{NcActionButtonGroup-Dqt8Gekb.mjs → NcActionButtonGroup-3Da8b3EI.mjs} +2 -2
- package/dist/chunks/{NcActionButtonGroup-Dqt8Gekb.mjs.map → NcActionButtonGroup-3Da8b3EI.mjs.map} +1 -1
- package/dist/chunks/{NcActionInput-C_rmP0eZ.mjs → NcActionInput-DeFy255L.mjs} +11 -18
- package/dist/chunks/NcActionInput-DeFy255L.mjs.map +1 -0
- package/dist/chunks/{NcActionLink-BTIApspK.mjs → NcActionLink-BEo7zmXX.mjs} +4 -13
- package/dist/chunks/{NcActionLink-BTIApspK.mjs.map → NcActionLink-BEo7zmXX.mjs.map} +1 -1
- package/dist/chunks/{NcActionRouter-DATNpU_e.mjs → NcActionRouter-ERoQjJKv.mjs} +3 -3
- package/dist/chunks/{NcActionRouter-DATNpU_e.mjs.map → NcActionRouter-ERoQjJKv.mjs.map} +1 -1
- package/dist/chunks/{NcActionText-3mJjsJz_.mjs → NcActionText-DJWBefhJ.mjs} +3 -3
- package/dist/chunks/{NcActionText-3mJjsJz_.mjs.map → NcActionText-DJWBefhJ.mjs.map} +1 -1
- package/dist/chunks/{NcActionTextEditable-Dv1_bMFY.mjs → NcActionTextEditable-B7nemAOJ.mjs} +14 -20
- package/dist/chunks/NcActionTextEditable-B7nemAOJ.mjs.map +1 -0
- package/dist/chunks/{NcActions-DpYAcY6a.mjs → NcActions-DS88I6qk.mjs} +22 -20
- package/dist/chunks/NcActions-DS88I6qk.mjs.map +1 -0
- package/dist/chunks/{NcAppContent-BMiA5ySy.mjs → NcAppContent-DRhM7Gyz.mjs} +38 -66
- package/dist/chunks/NcAppContent-DRhM7Gyz.mjs.map +1 -0
- package/dist/chunks/NcAppContentDetails.vue_vue_type_script_setup_true_lang-Dnf4r_Ng.mjs +16 -0
- package/dist/chunks/NcAppContentDetails.vue_vue_type_script_setup_true_lang-Dnf4r_Ng.mjs.map +1 -0
- package/dist/chunks/{NcAppNavigation-DuLUJbsJ.mjs → NcAppNavigation-BVXVi9JQ.mjs} +2 -2
- package/dist/chunks/{NcAppNavigation-DuLUJbsJ.mjs.map → NcAppNavigation-BVXVi9JQ.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationCaption-DTVdWgpf.mjs → NcAppNavigationCaption-DkiIEk6r.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationCaption-DTVdWgpf.mjs.map → NcAppNavigationCaption-DkiIEk6r.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationItem-5KG5Pl2c.mjs → NcAppNavigationItem-s3GC1n4o.mjs} +68 -68
- package/dist/chunks/{NcAppNavigationItem-5KG5Pl2c.mjs.map → NcAppNavigationItem-s3GC1n4o.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationNewItem-CRCOC0hV.mjs → NcAppNavigationNewItem-D1GWsi8R.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationNewItem-CRCOC0hV.mjs.map → NcAppNavigationNewItem-D1GWsi8R.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationSearch-AT_S98B0.mjs → NcAppNavigationSearch-Cy0s4XWp.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationSearch-AT_S98B0.mjs.map → NcAppNavigationSearch-Cy0s4XWp.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationSettings-DFsvNlME.mjs → NcAppNavigationSettings-GeCb9tlR.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationSettings-DFsvNlME.mjs.map → NcAppNavigationSettings-GeCb9tlR.mjs.map} +1 -1
- package/dist/chunks/{NcAppNavigationToggle-CqZs9ls-.mjs → NcAppNavigationToggle-CFw3W3_o.mjs} +2 -2
- package/dist/chunks/{NcAppNavigationToggle-CqZs9ls-.mjs.map → NcAppNavigationToggle-CFw3W3_o.mjs.map} +1 -1
- package/dist/chunks/{NcAppSettingsDialog-CTUoQezW.mjs → NcAppSettingsDialog-CBLZvdnK.mjs} +7 -7
- package/dist/chunks/{NcAppSettingsDialog-CTUoQezW.mjs.map → NcAppSettingsDialog-CBLZvdnK.mjs.map} +1 -1
- package/dist/chunks/{NcAppSidebar-B7shIqzm.mjs → NcAppSidebar-BomlW59S.mjs} +287 -274
- package/dist/chunks/NcAppSidebar-BomlW59S.mjs.map +1 -0
- package/dist/chunks/NcAppSidebarHeader.vue_vue_type_script_setup_true_lang-0j0aFDeK.mjs +30 -0
- package/dist/chunks/NcAppSidebarHeader.vue_vue_type_script_setup_true_lang-0j0aFDeK.mjs.map +1 -0
- package/dist/chunks/{NcAvatar-CvPCBukb.mjs → NcAvatar-CSk-1oFe.mjs} +13 -13
- package/dist/chunks/{NcAvatar-CvPCBukb.mjs.map → NcAvatar-CSk-1oFe.mjs.map} +1 -1
- package/dist/chunks/{NcBreadcrumb-C3qGDt3z.mjs → NcBreadcrumb-Bvsnecwa.mjs} +46 -4
- package/dist/chunks/NcBreadcrumb-Bvsnecwa.mjs.map +1 -0
- package/dist/chunks/{NcBreadcrumbs-DtBCo9yI.mjs → NcBreadcrumbs-DWU2ZRkM.mjs} +6 -6
- package/dist/chunks/{NcBreadcrumbs-DtBCo9yI.mjs.map → NcBreadcrumbs-DWU2ZRkM.mjs.map} +1 -1
- package/dist/chunks/{NcCheckboxRadioSwitch-DrNlVZw8.mjs → NcCheckboxRadioSwitch-Ca1ouh22.mjs} +2 -2
- package/dist/chunks/{NcCheckboxRadioSwitch-DrNlVZw8.mjs.map → NcCheckboxRadioSwitch-Ca1ouh22.mjs.map} +1 -1
- package/dist/chunks/{NcChip-Cq8DrWKb.mjs → NcChip-Cl6RfDoK.mjs} +14 -15
- package/dist/chunks/NcChip-Cl6RfDoK.mjs.map +1 -0
- package/dist/chunks/{NcCollectionList-CFuwV9sI.mjs → NcCollectionList-CxzQkCFq.mjs} +6 -6
- package/dist/chunks/{NcCollectionList-CFuwV9sI.mjs.map → NcCollectionList-CxzQkCFq.mjs.map} +1 -1
- package/dist/chunks/{NcColorPicker-Clo5oIYN.mjs → NcColorPicker-BjsBCkEt.mjs} +4 -4
- package/dist/chunks/{NcColorPicker-Clo5oIYN.mjs.map → NcColorPicker-BjsBCkEt.mjs.map} +1 -1
- package/dist/chunks/{NcContent-CUuf0HwJ.mjs → NcContent-DtM8j8ub.mjs} +5 -5
- package/dist/chunks/{NcContent-CUuf0HwJ.mjs.map → NcContent-DtM8j8ub.mjs.map} +1 -1
- package/dist/chunks/NcCounterBubble-PBdqn9Nf.mjs +52 -0
- package/dist/chunks/NcCounterBubble-PBdqn9Nf.mjs.map +1 -0
- package/dist/chunks/{NcDashboardWidget-CXw7Hxc8.mjs → NcDashboardWidget-uBobynyZ.mjs} +7 -7
- package/dist/chunks/{NcDashboardWidget-CXw7Hxc8.mjs.map → NcDashboardWidget-uBobynyZ.mjs.map} +1 -1
- package/dist/chunks/{NcDashboardWidgetItem-C6GoJEri.mjs → NcDashboardWidgetItem-DnI9uLf1.mjs} +4 -4
- package/dist/chunks/{NcDashboardWidgetItem-C6GoJEri.mjs.map → NcDashboardWidgetItem-DnI9uLf1.mjs.map} +1 -1
- package/dist/chunks/{NcDateTime.vue_vue_type_script_setup_true_lang-BYXau4sd.mjs → NcDateTime.vue_vue_type_script_setup_true_lang-BD-rj6Dr.mjs} +2 -2
- package/dist/chunks/{NcDateTime.vue_vue_type_script_setup_true_lang-BYXau4sd.mjs.map → NcDateTime.vue_vue_type_script_setup_true_lang-BD-rj6Dr.mjs.map} +1 -1
- package/dist/chunks/{NcDateTimePicker-CDFvxL3U.mjs → NcDateTimePicker-DYNOGc6A.mjs} +5 -5
- package/dist/chunks/{NcDateTimePicker-CDFvxL3U.mjs.map → NcDateTimePicker-DYNOGc6A.mjs.map} +1 -1
- package/dist/chunks/{NcDateTimePickerNative-BRuMK89z.mjs → NcDateTimePickerNative-D0pjWawX.mjs} +5 -6
- package/dist/chunks/NcDateTimePickerNative-D0pjWawX.mjs.map +1 -0
- package/dist/chunks/{NcDialog-BX0IET9Y.mjs → NcDialog-BQNR_-Ju.mjs} +3 -3
- package/dist/chunks/{NcDialog-BX0IET9Y.mjs.map → NcDialog-BQNR_-Ju.mjs.map} +1 -1
- package/dist/chunks/{NcDialogButton.vue_vue_type_script_setup_true_lang-DbzPc_gW.mjs → NcDialogButton.vue_vue_type_script_setup_true_lang-DAZ2Budh.mjs} +3 -3
- package/dist/chunks/{NcDialogButton.vue_vue_type_script_setup_true_lang-DbzPc_gW.mjs.map → NcDialogButton.vue_vue_type_script_setup_true_lang-DAZ2Budh.mjs.map} +1 -1
- package/dist/chunks/{NcEmojiPicker-C30Ofq8B.mjs → NcEmojiPicker-lhuMMbDy.mjs} +6 -6
- package/dist/chunks/{NcEmojiPicker-C30Ofq8B.mjs.map → NcEmojiPicker-lhuMMbDy.mjs.map} +1 -1
- package/dist/chunks/NcEmptyContent-BdOezubv.mjs +56 -0
- package/dist/chunks/NcEmptyContent-BdOezubv.mjs.map +1 -0
- package/dist/chunks/NcGuestContent-B_S2nyJ4.mjs +25 -0
- package/dist/chunks/NcGuestContent-B_S2nyJ4.mjs.map +1 -0
- package/dist/chunks/{NcHeaderMenu-CEH_-KT_.mjs → NcHeaderMenu-o9FmNBI5.mjs} +2 -2
- package/dist/chunks/{NcHeaderMenu-CEH_-KT_.mjs.map → NcHeaderMenu-o9FmNBI5.mjs.map} +1 -1
- package/dist/chunks/NcIconSvgWrapper-BOiCKv0b.mjs +68 -0
- package/dist/chunks/NcIconSvgWrapper-BOiCKv0b.mjs.map +1 -0
- package/dist/chunks/{NcInputConfirmCancel-DeWD9uc6.mjs → NcInputConfirmCancel-C1K1gyQA.mjs} +4 -4
- package/dist/chunks/{NcInputConfirmCancel-DeWD9uc6.mjs.map → NcInputConfirmCancel-C1K1gyQA.mjs.map} +1 -1
- package/dist/chunks/{NcListItem-CVX52kG-.mjs → NcListItem-C2LlJgjL.mjs} +6 -6
- package/dist/chunks/{NcListItem-CVX52kG-.mjs.map → NcListItem-C2LlJgjL.mjs.map} +1 -1
- package/dist/chunks/{NcListItemIcon-Cc6vXRrY.mjs → NcListItemIcon-5ms0eK3w.mjs} +6 -6
- package/dist/chunks/{NcListItemIcon-Cc6vXRrY.mjs.map → NcListItemIcon-5ms0eK3w.mjs.map} +1 -1
- package/dist/chunks/{NcMentionBubble.vue_vue_type_style_index_0_scoped_5b8f093f_lang-DZbkIMTW.mjs → NcMentionBubble.vue_vue_type_style_index_0_scoped_c29760cd_lang-CZdrlInz.mjs} +2 -2
- package/dist/chunks/{NcMentionBubble.vue_vue_type_style_index_0_scoped_5b8f093f_lang-DZbkIMTW.mjs.map → NcMentionBubble.vue_vue_type_style_index_0_scoped_c29760cd_lang-CZdrlInz.mjs.map} +1 -1
- package/dist/chunks/NcModal-BisVxXe_.mjs +780 -0
- package/dist/chunks/NcModal-BisVxXe_.mjs.map +1 -0
- package/dist/chunks/{NcPasswordField-CYPRKGml.mjs → NcPasswordField-hZiEd3tC.mjs} +2 -2
- package/dist/chunks/{NcPasswordField-CYPRKGml.mjs.map → NcPasswordField-hZiEd3tC.mjs.map} +1 -1
- package/dist/chunks/{NcPopover-EPnt2iHh.mjs → NcPopover-MsWUAvsI.mjs} +13 -6
- package/dist/chunks/NcPopover-MsWUAvsI.mjs.map +1 -0
- package/dist/chunks/{NcRelatedResourcesPanel-Bcy58V31.mjs → NcRelatedResourcesPanel-CShyi9lg.mjs} +3 -3
- package/dist/chunks/{NcRelatedResourcesPanel-Bcy58V31.mjs.map → NcRelatedResourcesPanel-CShyi9lg.mjs.map} +1 -1
- package/dist/chunks/{NcRichContenteditable-BR08SbpA.mjs → NcRichContenteditable-DgH9H1qf.mjs} +22 -42
- package/dist/chunks/NcRichContenteditable-DgH9H1qf.mjs.map +1 -0
- package/dist/chunks/{NcRichText-jZif8PdV.mjs → NcRichText-BkKK1moX.mjs} +8 -6
- package/dist/chunks/{NcRichText-jZif8PdV.mjs.map → NcRichText-BkKK1moX.mjs.map} +1 -1
- package/dist/chunks/{NcSelect-BkTH-Yqm.mjs → NcSelect-BSa2kSPW.mjs} +2 -4
- package/dist/chunks/NcSelect-BSa2kSPW.mjs.map +1 -0
- package/dist/chunks/{NcSelectTags-BY8LM7qV.mjs → NcSelectTags-BW0QroJV.mjs} +3 -3
- package/dist/chunks/{NcSelectTags-BY8LM7qV.mjs.map → NcSelectTags-BW0QroJV.mjs.map} +1 -1
- package/dist/chunks/NcSelectUsers-Bhx9k-0v.mjs +76 -0
- package/dist/chunks/NcSelectUsers-Bhx9k-0v.mjs.map +1 -0
- package/dist/chunks/{NcSettingsInputText-B129n9sr.mjs → NcSettingsInputText-CrOqaL-x.mjs} +2 -2
- package/dist/chunks/{NcSettingsInputText-B129n9sr.mjs.map → NcSettingsInputText-CrOqaL-x.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsSection-CjWtq7TT.mjs → NcSettingsSection-D6ShpfeY.mjs} +2 -2
- package/dist/chunks/{NcSettingsSection-CjWtq7TT.mjs.map → NcSettingsSection-D6ShpfeY.mjs.map} +1 -1
- package/dist/chunks/{NcSettingsSelectGroup-B8uq0KIw.mjs → NcSettingsSelectGroup-DpNxkoZ2.mjs} +3 -3
- package/dist/chunks/{NcSettingsSelectGroup-B8uq0KIw.mjs.map → NcSettingsSelectGroup-DpNxkoZ2.mjs.map} +1 -1
- package/dist/chunks/{NcTextField-KGXtf7Y6.mjs → NcTextField-DJ1KtSKd.mjs} +4 -4
- package/dist/chunks/{NcTextField-KGXtf7Y6.mjs.map → NcTextField-DJ1KtSKd.mjs.map} +1 -1
- package/dist/chunks/{NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs → NcTimezonePicker.vue_vue_type_script_setup_true_lang-T3gPr-FV.mjs} +3 -3
- package/dist/chunks/{NcTimezonePicker.vue_vue_type_script_setup_true_lang-DxoB-jLa.mjs.map → NcTimezonePicker.vue_vue_type_script_setup_true_lang-T3gPr-FV.mjs.map} +1 -1
- package/dist/chunks/{NcUserBubble-qqRewR9C.mjs → NcUserBubble-Csot0WLv.mjs} +3 -3
- package/dist/chunks/{NcUserBubble-qqRewR9C.mjs.map → NcUserBubble-Csot0WLv.mjs.map} +1 -1
- package/dist/chunks/{NcUserStatusIcon-DpZVD4HJ.mjs → NcUserStatusIcon-CtOZd90o.mjs} +54 -103
- package/dist/chunks/NcUserStatusIcon-CtOZd90o.mjs.map +1 -0
- package/dist/chunks/NcVNodes.vue_vue_type_script_lang-BqUHinRZ.mjs +23 -0
- package/dist/chunks/NcVNodes.vue_vue_type_script_lang-BqUHinRZ.mjs.map +1 -0
- package/dist/chunks/{_l10n-BNGeEX3W.mjs → _l10n-Bg-fZ9R0.mjs} +34 -38
- package/dist/chunks/_l10n-Bg-fZ9R0.mjs.map +1 -0
- package/dist/chunks/{actionText-BiV1_BZX.mjs → actionText-DdSwf9le.mjs} +7 -10
- package/dist/chunks/actionText-DdSwf9le.mjs.map +1 -0
- package/dist/chunks/{colors-CSUSQx1k.mjs → colors-BPGhD2C5.mjs} +2 -2
- package/dist/chunks/{colors-CSUSQx1k.mjs.map → colors-BPGhD2C5.mjs.map} +1 -1
- package/dist/chunks/{mdi-zYpVOORa.mjs → mdi-CR-3gwdl.mjs} +12 -8
- package/dist/chunks/{mdi-zYpVOORa.mjs.map → mdi-CR-3gwdl.mjs.map} +1 -1
- package/dist/chunks/{referencePickerModal-DzM7CkKN.mjs → referencePickerModal-Dw1szWUR.mjs} +10 -10
- package/dist/chunks/{referencePickerModal-DzM7CkKN.mjs.map → referencePickerModal-Dw1szWUR.mjs.map} +1 -1
- package/dist/chunks/{useFormatDateTime-BPGWjR3-.mjs → useFormatDateTime-L411ysPm.mjs} +2 -2
- package/dist/chunks/{useFormatDateTime-BPGWjR3-.mjs.map → useFormatDateTime-L411ysPm.mjs.map} +1 -1
- package/dist/chunks/{usernameToColor-Bl9NGU_9.mjs → usernameToColor-CuTR6O_B.mjs} +2 -2
- package/dist/chunks/{usernameToColor-Bl9NGU_9.mjs.map → usernameToColor-CuTR6O_B.mjs.map} +1 -1
- package/dist/components/NcActionButton/NcActionButton.vue.d.ts +38 -27
- package/dist/components/NcActionButton/index.mjs +1 -1
- package/dist/components/NcActionButtonGroup/index.mjs +1 -1
- package/dist/components/NcActionCheckbox/NcActionCheckbox.vue.d.ts +1 -1
- package/dist/components/NcActionInput/index.mjs +1 -1
- package/dist/components/NcActionLink/index.mjs +1 -1
- package/dist/components/NcActionRadio/NcActionRadio.vue.d.ts +1 -1
- package/dist/components/NcActionRouter/NcActionRouter.vue.d.ts +1 -4
- package/dist/components/NcActionRouter/index.mjs +1 -1
- package/dist/components/NcActionText/NcActionText.vue.d.ts +1 -4
- package/dist/components/NcActionText/index.mjs +1 -1
- package/dist/components/NcActionTextEditable/NcActionTextEditable.vue.d.ts +24 -9
- package/dist/components/NcActionTextEditable/index.mjs +1 -1
- package/dist/components/NcActions/index.mjs +1 -1
- package/dist/components/NcAppContent/NcAppContent.vue.d.ts +225 -0
- package/dist/components/NcAppContent/NcAppDetailsToggle.vue.d.ts +2 -0
- package/dist/components/NcAppContent/index.mjs +1 -1
- package/dist/components/NcAppContentDetails/NcAppContentDetails.vue.d.ts +27 -1
- package/dist/components/NcAppContentDetails/index.d.ts +4 -0
- package/dist/components/NcAppContentDetails/index.mjs +2 -2
- package/dist/components/NcAppNavigation/index.mjs +1 -1
- package/dist/components/NcAppNavigationCaption/index.mjs +1 -1
- package/dist/components/NcAppNavigationItem/index.mjs +1 -1
- package/dist/components/NcAppNavigationNewItem/index.mjs +1 -1
- package/dist/components/NcAppNavigationSearch/index.mjs +1 -1
- package/dist/components/NcAppNavigationSettings/index.mjs +1 -1
- package/dist/components/NcAppNavigationToggle/index.mjs +1 -1
- package/dist/components/NcAppSettingsDialog/index.mjs +1 -1
- package/dist/components/NcAppSidebar/NcAppSidebarTabs.vue.d.ts +7 -3
- package/dist/components/NcAppSidebar/index.mjs +1 -1
- package/dist/components/NcAppSidebarHeader/NcAppSidebarHeader.vue.d.ts +18 -0
- package/dist/components/NcAppSidebarHeader/index.d.ts +5 -0
- package/dist/components/NcAppSidebarHeader/index.mjs +5 -0
- package/dist/components/NcAppSidebarHeader/index.mjs.map +1 -0
- package/dist/components/NcAvatar/index.mjs +1 -1
- package/dist/components/NcBreadcrumb/index.mjs +1 -1
- package/dist/components/NcBreadcrumbs/index.mjs +1 -1
- package/dist/components/NcCheckboxRadioSwitch/index.mjs +1 -1
- package/dist/components/NcChip/NcChip.vue.d.ts +38 -6
- package/dist/components/NcChip/index.mjs +1 -1
- package/dist/components/NcCollectionList/index.mjs +1 -1
- package/dist/components/NcColorPicker/index.mjs +1 -1
- package/dist/components/NcContent/index.mjs +1 -1
- package/dist/components/NcCounterBubble/NcCounterBubble.vue.d.ts +10 -60
- package/dist/components/NcCounterBubble/index.d.ts +4 -0
- package/dist/components/NcCounterBubble/index.mjs +1 -1
- package/dist/components/NcDashboardWidget/index.mjs +1 -1
- package/dist/components/NcDashboardWidgetItem/index.mjs +1 -1
- package/dist/components/NcDateTime/index.mjs +1 -1
- package/dist/components/NcDateTimePicker/index.mjs +1 -1
- package/dist/components/NcDateTimePickerNative/NcDateTimePickerNative.vue.d.ts +178 -1
- package/dist/components/NcDateTimePickerNative/index.mjs +1 -1
- package/dist/components/NcDialog/NcDialog.vue.d.ts +4 -4
- package/dist/components/NcDialog/index.mjs +1 -1
- package/dist/components/NcDialogButton/NcDialogButton.vue.d.ts +1 -1
- package/dist/components/NcDialogButton/index.mjs +1 -1
- package/dist/components/NcEmojiPicker/index.mjs +1 -1
- package/dist/components/NcEmptyContent/NcEmptyContent.vue.d.ts +58 -28
- package/dist/components/NcEmptyContent/index.d.ts +4 -0
- package/dist/components/NcEmptyContent/index.mjs +1 -1
- package/dist/components/NcGuestContent/NcGuestContent.vue.d.ts +19 -1
- package/dist/components/NcGuestContent/index.d.ts +4 -0
- package/dist/components/NcGuestContent/index.mjs +1 -1
- package/dist/components/NcHeaderMenu/index.mjs +1 -1
- package/dist/components/NcIconSvgWrapper/NcIconSvgWrapper.vue.d.ts +12 -87
- package/dist/components/NcIconSvgWrapper/index.d.ts +4 -0
- package/dist/components/NcIconSvgWrapper/index.mjs +1 -1
- package/dist/components/NcListItem/index.mjs +1 -1
- package/dist/components/NcListItemIcon/index.mjs +1 -1
- package/dist/components/NcModal/index.d.ts +1 -2
- package/dist/components/NcModal/index.mjs +2 -779
- package/dist/components/NcModal/index.mjs.map +1 -1
- package/dist/components/NcPasswordField/index.mjs +1 -1
- package/dist/components/NcPopover/index.mjs +1 -1
- package/dist/components/NcRelatedResourcesPanel/index.mjs +1 -1
- package/dist/components/NcRichContenteditable/NcAutoCompleteResult.vue.d.ts +18 -19
- package/dist/components/NcRichContenteditable/NcMentionBubble.vue.d.ts +0 -18
- package/dist/components/NcRichContenteditable/NcRichContenteditable.vue.d.ts +3 -3
- package/dist/components/NcRichContenteditable/index.mjs +1 -1
- package/dist/components/NcRichText/NcReferencePicker/NcProviderList.vue.d.ts +41 -20
- package/dist/components/NcRichText/NcReferencePicker/NcSearch.vue.d.ts +41 -20
- package/dist/components/NcRichText/index.mjs +3 -3
- package/dist/components/NcSelect/index.mjs +1 -1
- package/dist/components/NcSelectTags/index.mjs +1 -1
- package/dist/components/NcSelectUsers/NcSelectUsers.vue.d.ts +3 -3
- package/dist/components/NcSelectUsers/index.mjs +2 -70
- package/dist/components/NcSelectUsers/index.mjs.map +1 -1
- package/dist/components/NcSettingsInputText/NcSettingsInputText.vue.d.ts +3 -3
- package/dist/components/NcSettingsInputText/index.mjs +1 -1
- package/dist/components/NcSettingsSection/index.mjs +1 -1
- package/dist/components/NcSettingsSelectGroup/NcSettingsSelectGroup.vue.d.ts +2 -2
- package/dist/components/NcSettingsSelectGroup/index.mjs +1 -1
- package/dist/components/NcTextArea/NcTextArea.vue.d.ts +1 -1
- package/dist/components/NcTextField/index.mjs +1 -1
- package/dist/components/NcTimezonePicker/index.mjs +1 -1
- package/dist/components/NcUserBubble/index.mjs +1 -1
- package/dist/components/NcUserStatusIcon/NcUserStatusIcon.vue.d.ts +21 -1
- package/dist/components/NcUserStatusIcon/index.d.ts +4 -0
- package/dist/components/NcUserStatusIcon/index.mjs +1 -1
- package/dist/components/NcVNodes/NcVNodes.vue.d.ts +8 -3
- package/dist/components/NcVNodes/index.d.ts +4 -0
- package/dist/components/NcVNodes/index.mjs +2 -21
- package/dist/components/NcVNodes/index.mjs.map +1 -1
- package/dist/components/index.d.ts +11 -9
- package/dist/directives/Focus/index.d.ts +2 -3
- package/dist/directives/Focus/index.mjs +1 -2
- package/dist/directives/Focus/index.mjs.map +1 -1
- package/dist/directives/index.d.ts +1 -1
- package/dist/functions/dialog/index.d.ts +8 -1
- package/dist/functions/dialog/index.mjs.map +1 -1
- package/dist/functions/reference/index.mjs +1 -1
- package/dist/functions/usernameToColor/index.mjs +1 -1
- package/dist/index.mjs +140 -136
- package/dist/index.mjs.map +1 -1
- package/dist/mixins/actionText.d.ts +1 -6
- package/package.json +5 -6
- package/dist/assets/index-D9L0rgJk.css +0 -4
- package/dist/chunks/ChevronRight-LvtA5_hq.mjs +0 -49
- package/dist/chunks/ChevronRight-LvtA5_hq.mjs.map +0 -1
- package/dist/chunks/NcActionButton-BZEDhdCm.mjs.map +0 -1
- package/dist/chunks/NcActionInput-C_rmP0eZ.mjs.map +0 -1
- package/dist/chunks/NcActionTextEditable-Dv1_bMFY.mjs.map +0 -1
- package/dist/chunks/NcActions-DpYAcY6a.mjs.map +0 -1
- package/dist/chunks/NcAppContent-BMiA5ySy.mjs.map +0 -1
- package/dist/chunks/NcAppContentDetails-DsEEBJ0U.mjs +0 -16
- package/dist/chunks/NcAppContentDetails-DsEEBJ0U.mjs.map +0 -1
- package/dist/chunks/NcAppSidebar-B7shIqzm.mjs.map +0 -1
- package/dist/chunks/NcBreadcrumb-C3qGDt3z.mjs.map +0 -1
- package/dist/chunks/NcChip-Cq8DrWKb.mjs.map +0 -1
- package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs +0 -78
- package/dist/chunks/NcCounterBubble-6B_JNUUS.mjs.map +0 -1
- package/dist/chunks/NcDateTimePickerNative-BRuMK89z.mjs.map +0 -1
- package/dist/chunks/NcEmptyContent-BQnIrQQn.mjs +0 -68
- package/dist/chunks/NcEmptyContent-BQnIrQQn.mjs.map +0 -1
- package/dist/chunks/NcGuestContent-iQpV7mLC.mjs +0 -23
- package/dist/chunks/NcGuestContent-iQpV7mLC.mjs.map +0 -1
- package/dist/chunks/NcIconSvgWrapper-Bc3ogp8T.mjs +0 -120
- package/dist/chunks/NcIconSvgWrapper-Bc3ogp8T.mjs.map +0 -1
- package/dist/chunks/NcPopover-EPnt2iHh.mjs.map +0 -1
- package/dist/chunks/NcRichContenteditable-BR08SbpA.mjs.map +0 -1
- package/dist/chunks/NcSelect-BkTH-Yqm.mjs.map +0 -1
- package/dist/chunks/NcUserStatusIcon-DpZVD4HJ.mjs.map +0 -1
- package/dist/chunks/ScopeComponent-BIpNSmeE.mjs +0 -15
- package/dist/chunks/ScopeComponent-BIpNSmeE.mjs.map +0 -1
- package/dist/chunks/_l10n-BNGeEX3W.mjs.map +0 -1
- package/dist/chunks/actionText-BiV1_BZX.mjs.map +0 -1
- package/dist/utils/ScopeComponent.d.ts +0 -6
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, createBlock, openBlock, unref, withCtx, createTextVNode, toDisplayString, renderSlot, createCommentVNode } from "vue";
|
|
2
|
-
import { r as register, a as t } from "./_l10n-
|
|
2
|
+
import { r as register, a as t } from "./_l10n-Bg-fZ9R0.mjs";
|
|
3
3
|
import { N as NcButton } from "./NcButton-Byg8-ta1.mjs";
|
|
4
|
-
import { N as NcIconSvgWrapper } from "./NcIconSvgWrapper-
|
|
4
|
+
import { N as NcIconSvgWrapper } from "./NcIconSvgWrapper-BOiCKv0b.mjs";
|
|
5
5
|
import { N as NcLoadingIcon } from "./NcLoadingIcon-CsMn1bFR.mjs";
|
|
6
6
|
register();
|
|
7
7
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
@@ -66,4 +66,4 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
66
66
|
export {
|
|
67
67
|
_sfc_main as _
|
|
68
68
|
};
|
|
69
|
-
//# sourceMappingURL=NcDialogButton.vue_vue_type_script_setup_true_lang-
|
|
69
|
+
//# sourceMappingURL=NcDialogButton.vue_vue_type_script_setup_true_lang-DAZ2Budh.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcDialogButton.vue_vue_type_script_setup_true_lang-
|
|
1
|
+
{"version":3,"file":"NcDialogButton.vue_vue_type_script_setup_true_lang-DAZ2Budh.mjs","sources":["../../src/components/NcDialogButton/NcDialogButton.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\nDialog button component used by NcDialog in the actions slot to display the buttons passed by the `buttons` prop.\n</docs>\n\n<template>\n\t<NcButton :aria-label=\"label\"\n\t\t:disabled\n\t\t:type\n\t\t:variant\n\t\t@click=\"handleClick\">\n\t\t{{ label }}\n\t\t<template #icon>\n\t\t\t<!-- @slot Allow to set a custom icon for the button -->\n\t\t\t<slot name=\"icon\">\n\t\t\t\t<!-- The loading state is an information that must be accessible -->\n\t\t\t\t<NcLoadingIcon v-if=\"isLoading\" :name=\"t('Loading …') /* TRANSLATORS: The button is in a loading state*/\" />\n\t\t\t\t<NcIconSvgWrapper v-else-if=\"icon !== undefined\" :svg=\"icon\" />\n\t\t\t</slot>\n\t\t</template>\n\t</NcButton>\n</template>\n\n<script setup lang=\"ts\">\nimport type { ButtonType, ButtonVariant } from '../NcButton/index.ts'\nimport { ref } from 'vue'\nimport { t } from '../../l10n.js'\n\nimport NcButton from '../NcButton/index'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/index.ts'\nimport NcLoadingIcon from '../NcLoadingIcon/index.js'\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * The function that will be called when the button is pressed.\n\t * If the function returns `false` the click is ignored and the dialog will not be closed,\n\t * which is the default behavior of \"reset\"-buttons.\n\t *\n\t * @default '() => {}'\n\t */\n\tcallback?: () => unknown|false\n\n\t/**\n\t * If the button should be shown as disabled.\n\t *\n\t * @default false\n\t */\n\tdisabled?: boolean\n\n\t/**\n\t * Optional inline SVG icon for the button.\n\t *\n\t * @default undefined\n\t */\n\ticon?: string\n\n\t/**\n\t * The label of the button.\n\t */\n\tlabel: string\n\n\t/**\n\t * The button type, see `NcButton`.\n\t *\n\t * @default 'button'\n\t */\n\ttype?: ButtonType\n\n\t/**\n\t * The button variant, see `NcButton`.\n\t *\n\t * @default 'tertiary'\n\t * @since 8.24.0\n\t */\n\tvariant?: ButtonVariant\n}>(), {\n\tcallback: () => {},\n\tdisabled: false,\n\ticon: undefined,\n\ttype: 'button',\n\tvariant: 'tertiary',\n})\n\nconst emit = defineEmits<{\n\t/**\n\t * The click event (`MouseEvent`) and the value returned by the callback\n\t */\n\t'click': [event: MouseEvent, payload: unknown]\n}>()\n\nconst isLoading = ref(false)\n\n/**\n * Handle clicking the button\n * @param e The click event\n */\nasync function handleClick(e: MouseEvent) {\n\t// Do not re-emit while loading\n\tif (isLoading.value) {\n\t\treturn\n\t}\n\n\tisLoading.value = true\n\ttry {\n\t\t// for reset buttons the default is \"false\"\n\t\tconst fallback = props.type === 'reset' ? false : undefined\n\t\tconst result = await props.callback?.() ?? fallback\n\t\tif (result !== false) {\n\t\t\temit('click', e, result)\n\t\t}\n\t} finally {\n\t\tisLoading.value = false\n\t}\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ;AAmDd,UAAM,OAAO;AAOP,UAAA,YAAY,IAAI,KAAK;AAM3B,mBAAe,YAAY,GAAe;AAEzC,UAAI,UAAU,OAAO;AACpB;AAAA,MAAA;AAGD,gBAAU,QAAQ;AACd,UAAA;AAEH,cAAM,WAAW,MAAM,SAAS,UAAU,QAAQ;AAClD,cAAM,SAAS,MAAM,MAAM,WAAgB,KAAA;AAC3C,YAAI,WAAW,OAAO;AAChB,eAAA,SAAS,GAAG,MAAM;AAAA,QAAA;AAAA,MACxB,UACC;AACD,kBAAU,QAAQ;AAAA,MAAA;AAAA,IACnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -3,15 +3,15 @@ import { isFocusable } from "tabbable";
|
|
|
3
3
|
import { Picker, Emoji, EmojiIndex } from "emoji-mart-vue-fast/src/index.js";
|
|
4
4
|
import { u as useTrapStackControl } from "./useTrapStackControl-b3A_383w.mjs";
|
|
5
5
|
import { s as setCurrentSkinTone, g as getCurrentSkinTone } from "./emoji-BY_D0V5K.mjs";
|
|
6
|
-
import { C as Color } from "./colors-
|
|
7
|
-
import { r as register, q as t39, s as t35, u as t15, v as t5, a as t } from "./_l10n-
|
|
6
|
+
import { C as Color } from "./colors-BPGhD2C5.mjs";
|
|
7
|
+
import { r as register, q as t39, s as t35, u as t15, v as t5, a as t } from "./_l10n-Bg-fZ9R0.mjs";
|
|
8
8
|
import data from "emoji-mart-vue-fast/data/all.json";
|
|
9
9
|
import { createElementBlock, openBlock, mergeProps, createElementVNode, createCommentVNode, toDisplayString, resolveComponent, createBlock, withCtx, createVNode, withKeys, withModifiers, createSlots, normalizeStyle, renderSlot, normalizeProps, guardReactiveProps } from "vue";
|
|
10
10
|
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
|
|
11
11
|
import { N as NcButton } from "./NcButton-Byg8-ta1.mjs";
|
|
12
|
-
import { N as NcColorPicker } from "./NcColorPicker-
|
|
13
|
-
import { N as NcPopover } from "./NcPopover-
|
|
14
|
-
import { N as NcTextField } from "./NcTextField-
|
|
12
|
+
import { N as NcColorPicker } from "./NcColorPicker-BjsBCkEt.mjs";
|
|
13
|
+
import { N as NcPopover } from "./NcPopover-MsWUAvsI.mjs";
|
|
14
|
+
import { N as NcTextField } from "./NcTextField-DJ1KtSKd.mjs";
|
|
15
15
|
register(t5, t15, t35, t39);
|
|
16
16
|
const _sfc_main$1 = {
|
|
17
17
|
name: "CircleIcon",
|
|
@@ -397,4 +397,4 @@ const NcEmojiPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_re
|
|
|
397
397
|
export {
|
|
398
398
|
NcEmojiPicker as N
|
|
399
399
|
};
|
|
400
|
-
//# sourceMappingURL=NcEmojiPicker-
|
|
400
|
+
//# sourceMappingURL=NcEmojiPicker-lhuMMbDy.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcEmojiPicker-C30Ofq8B.mjs","sources":["../../node_modules/vue-material-design-icons/Circle.vue","../../src/components/NcEmojiPicker/NcEmojiPicker.vue"],"sourcesContent":["<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon circle-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CircleIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### General description\n\nThis component allows the user to pick an emoji.\n\n### Usage\n\n* Listen to the select event and pass in an HTML element that will be treated as a trigger:\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker @select=\"select\" style=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n* Showing a preview and keeping it open after a user selected an emoji\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker\n\t\t\t:close-on-select=\"false\"\n\t\t\t:show-preview=\"true\"\n\t\t\t@select=\"select\"\n\t\t\tstyle=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n* Allow unselecting a previously set emoji.\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker\n\t\t\t:show-preview=\"true\"\n\t\t\t:allow-unselect=\"true\"\n\t\t\t:selected-emoji=\"emoji\"\n\t\t\t@select=\"select\"\n\t\t\t@unselect=\"unselect\"\n\t\t\tstyle=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t\tunselect() {\n\t\t\t\tthis.emoji = ''\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<template>\n\t<NcPopover ref=\"popover\"\n\t\tv-model:shown=\"open\"\n\t\t:container=\"container\"\n\t\tpopup-role=\"dialog\"\n\t\t:focus-trap=\"false /* Handled manually to remove emoji buttons from TAB sequence */\"\n\t\t@after-show=\"afterShow\"\n\t\t@after-hide=\"afterHide\">\n\t\t<template #trigger=\"slotProps\">\n\t\t\t<slot v-bind=\"slotProps\" />\n\t\t</template>\n\t\t<Picker ref=\"picker\"\n\t\t\tclass=\"nc-emoji-picker\"\n\t\t\tcolor=\"var(--color-primary-element)\"\n\t\t\t:data=\"emojiIndex\"\n\t\t\t:emoji=\"previewFallbackEmoji\"\n\t\t\t:i18n\n\t\t\t:native\n\t\t\t:emoji-size=\"20\"\n\t\t\t:per-line=\"8\"\n\t\t\t:picker-styles=\"{ width: '320px' }\"\n\t\t\t:show-preview\n\t\t\t:skin=\"currentSkinTone\"\n\t\t\t:show-skin-tones=\"false\"\n\t\t\t:title=\"previewFallbackName\"\n\t\t\trole=\"dialog\"\n\t\t\taria-modal=\"true\"\n\t\t\t:aria-label=\"t('Emoji picker')\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@keydown.tab.prevent=\"handleTabNavigationSkippingEmojis\"\n\t\t\t@select=\"select\">\n\t\t\t<template #searchTemplate=\"{ onSearch }\">\n\t\t\t\t<div class=\"search__wrapper\">\n\t\t\t\t\t<NcTextField ref=\"search\"\n\t\t\t\t\t\tv-model=\"search\"\n\t\t\t\t\t\tclass=\"search\"\n\t\t\t\t\t\t:label=\"t('Search')\"\n\t\t\t\t\t\t:label-visible=\"true\"\n\t\t\t\t\t\t:placeholder=\"i18n.search\"\n\t\t\t\t\t\ttrailing-button-icon=\"close\"\n\t\t\t\t\t\t:trailing-button-label=\"t('Clear search')\"\n\t\t\t\t\t\t:show-trailing-button=\"search !== ''\"\n\t\t\t\t\t\t@keydown.left=\"callPickerArrowHandlerWithScrollFix('onArrowLeft', $event)\"\n\t\t\t\t\t\t@keydown.right=\"callPickerArrowHandlerWithScrollFix('onArrowRight', $event)\"\n\t\t\t\t\t\t@keydown.down=\"callPickerArrowHandlerWithScrollFix('onArrowDown', $event)\"\n\t\t\t\t\t\t@keydown.up=\"callPickerArrowHandlerWithScrollFix('onArrowUp', $event)\"\n\t\t\t\t\t\t@keydown.enter=\"$refs.picker.onEnter($event)\"\n\t\t\t\t\t\t@trailing-button-click=\"clearSearch(); onSearch('');\"\n\t\t\t\t\t\t@update:model-value=\"onSearch(search)\" />\n\t\t\t\t\t<NcColorPicker palette-only\n\t\t\t\t\t\t:container\n\t\t\t\t\t\t:palette=\"skinTonePalette\"\n\t\t\t\t\t\t:model-value=\"currentColor.color\"\n\t\t\t\t\t\t@update:model-value=\"onChangeSkinTone\">\n\t\t\t\t\t\t<NcButton :aria-label=\"t('Skin tone')\" variant=\"tertiary-no-background\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<IconCircle :style=\"{ color: currentColor.color }\" :title=\"currentColor.name\" :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</NcColorPicker>\n\t\t\t\t</div>\n\t\t\t</template>\n\t\t\t<template v-if=\"allowUnselect && selectedEmoji\" #customCategory>\n\t\t\t\t<div class=\"emoji-mart-category-label\">\n\t\t\t\t\t<h3 class=\"emoji-mart-category-label\">\n\t\t\t\t\t\t{{ t('Selected') }}\n\t\t\t\t\t</h3>\n\t\t\t\t</div>\n\t\t\t\t<Emoji class=\"emoji-selected\"\n\t\t\t\t\t:data=\"emojiIndex\"\n\t\t\t\t\t:emoji=\"selectedEmoji\"\n\t\t\t\t\tnative\n\t\t\t\t\t:size=\"32\"\n\t\t\t\t\t@click=\"unselect\" />\n\t\t\t\t<Emoji class=\"emoji-delete\"\n\t\t\t\t\t:data=\"emojiIndex\"\n\t\t\t\t\temoji=\":x:\"\n\t\t\t\t\tnative\n\t\t\t\t\t:size=\"10\"\n\t\t\t\t\t@click=\"unselect\" />\n\t\t\t</template>\n\t\t</Picker>\n\t</NcPopover>\n</template>\n\n<script>\nimport { isFocusable } from 'tabbable'\nimport { Picker, Emoji, EmojiIndex } from 'emoji-mart-vue-fast/src/index.js'\nimport { useTrapStackControl } from '../../composables/useTrapStackControl.ts'\nimport { getCurrentSkinTone, setCurrentSkinTone } from '../../functions/emoji/emoji.ts'\nimport { Color } from '../../utils/colors.ts'\nimport { t } from '../../l10n.js'\n\nimport data from 'emoji-mart-vue-fast/data/all.json'\n\nimport IconCircle from 'vue-material-design-icons/Circle.vue'\nimport NcButton from '../NcButton/index.ts'\nimport NcColorPicker from '../NcColorPicker/NcColorPicker.vue'\nimport NcPopover from '../NcPopover/index.js'\nimport NcTextField from '../NcTextField/index.js'\n\n// Shared emoji index and skinTone for all NcEmojiPicker instances\n// Will be initialized on the first NcEmojiPicker creating\nlet emojiIndex\n\nconst i18n = {\n\tsearch: t('Search emoji'),\n\tnotfound: t('No emoji found'),\n\tcategories: {\n\t\tsearch: t('Search results'),\n\t\trecent: t('Frequently used'),\n\t\tsmileys: t('Smileys & Emotion'),\n\t\tpeople: t('People & Body'),\n\t\tnature: t('Animals & Nature'),\n\t\tfoods: t('Food & Drink'),\n\t\tactivity: t('Activities'),\n\t\tplaces: t('Travel & Places'),\n\t\tobjects: t('Objects'),\n\t\tsymbols: t('Symbols'),\n\t\tflags: t('Flags'),\n\t\tcustom: t('Custom'),\n\t},\n}\n\nconst skinTonePalette = [\n\tnew Color(255, 222, 52, t('Neutral skin color')),\n\tnew Color(228, 205, 166, t('Light skin tone')),\n\tnew Color(250, 221, 192, t('Medium light skin tone')),\n\tnew Color(174, 129, 87, t('Medium skin tone')),\n\tnew Color(158, 113, 88, t('Medium dark skin tone')),\n\tnew Color(96, 79, 69, t('Dark skin tone')),\n]\n\nexport default {\n\tname: 'NcEmojiPicker',\n\n\tcomponents: {\n\t\tIconCircle,\n\t\tNcButton,\n\t\tNcColorPicker,\n\t\tNcPopover,\n\t\tNcTextField,\n\t\tEmoji,\n\t\tPicker,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The emoji-set\n\t\t */\n\t\tactiveSet: {\n\t\t\ttype: String,\n\t\t\tdefault: 'native',\n\t\t},\n\t\t/**\n\t\t * Show preview section when hovering emoji\n\t\t */\n\t\tshowPreview: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Allow unselecting the selected emoji\n\t\t */\n\t\tallowUnselect: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Selected emoji to allow unselecting\n\t\t */\n\t\tselectedEmoji: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * The fallback emoji in the preview section\n\t\t */\n\t\tpreviewFallbackEmoji: {\n\t\t\ttype: String,\n\t\t\tdefault: 'grinning',\n\t\t},\n\t\t/**\n\t\t * The fallback text in the preview section\n\t\t */\n\t\tpreviewFallbackName: {\n\t\t\ttype: String,\n\t\t\tdefault: t('Pick an emoji'),\n\t\t},\n\t\t/**\n\t\t * Whether to close the emoji picker after picking one\n\t\t */\n\t\tcloseOnSelect: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Selector for the popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: [String, Object, Element, Boolean],\n\t\t\tdefault: 'body',\n\t\t},\n\t},\n\temits: [\n\t\t'select',\n\t\t'select-data',\n\t\t'unselect',\n\t],\n\n\tsetup() {\n\t\t// If this is the first instance of NcEmojiPicker - setup EmojiIndex\n\t\tif (!emojiIndex) {\n\t\t\temojiIndex = new EmojiIndex(data)\n\t\t}\n\n\t\treturn {\n\t\t\t// Non-reactive constants\n\t\t\temojiIndex,\n\t\t\tskinTonePalette,\n\t\t\ti18n,\n\t\t}\n\t},\n\n\tdata() {\n\t\tconst currentSkinTone = getCurrentSkinTone()\n\n\t\treturn {\n\t\t\t/**\n\t\t\t * The current active color from the skin tone palette\n\t\t\t */\n\t\t\tcurrentColor: skinTonePalette[currentSkinTone - 1],\n\t\t\t/**\n\t\t\t * The current active skin tone\n\t\t\t * @type {1|2|3|4|5|6}\n\t\t\t */\n\t\t\tcurrentSkinTone,\n\t\t\tsearch: '',\n\t\t\topen: false,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tnative() {\n\t\t\treturn this.activeSet === 'native'\n\t\t},\n\t},\n\n\tcreated() {\n\t\t// Component has its own custom focus management\n\t\t// The global focus trap stack should be paused\n\t\tuseTrapStackControl(() => this.open)\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\tclearSearch() {\n\t\t\tthis.search = ''\n\t\t\tthis.$refs.search.focus()\n\t\t},\n\n\t\t/**\n\t\t * Update the current skin tone by the result of the color picker\n\t\t * @param {string} color Color set\n\t\t */\n\t\tonChangeSkinTone(color) {\n\t\t\tconst index = this.skinTonePalette.findIndex((tone) => tone.color.toLowerCase() === color.toLowerCase())\n\t\t\tif (index > -1) {\n\t\t\t\tthis.currentSkinTone = index + 1\n\t\t\t\tthis.currentColor = this.skinTonePalette[index]\n\t\t\t\tsetCurrentSkinTone(this.currentSkinTone)\n\t\t\t}\n\t\t},\n\n\t\tselect(emojiObject) {\n\t\t\t/**\n\t\t\t * Emits a string containing the emoji e.g. '👩🏿💻'\n\t\t\t */\n\t\t\tthis.$emit('select', emojiObject.native)\n\n\t\t\t/**\n\t\t\t * Emits a object with more data about the picked emoji\n\t\t\t */\n\t\t\tthis.$emit('select-data', emojiObject)\n\n\t\t\tif (this.closeOnSelect) {\n\t\t\t\tthis.open = false\n\t\t\t}\n\t\t},\n\n\t\tunselect() {\n\t\t\tthis.$emit('unselect')\n\t\t},\n\n\t\tafterShow() {\n\t\t\tthis.$refs.search.focus()\n\t\t},\n\n\t\tafterHide() {\n\t\t\t// Manually return focus to the trigger button, as we disabled focus-trap\n\t\t\t// But only if there is no focus target outside the picker, for example, input element that received focus by click closing the emoji picker\n\t\t\tif (!document.activeElement || this.$refs.picker.$el.contains(document.activeElement) || !isFocusable(document.activeElement)) {\n\t\t\t\tthis.$refs.popover.$el.querySelector('button, [role=\"button\"]')?.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Manually handle Tab navigation skipping emoji buttons.\n\t\t * Navigation over emojis is handled by Arrow keys.\n\t\t * @param {KeyboardEvent} event - Keyboard event\n\t\t */\n\t\thandleTabNavigationSkippingEmojis(event) {\n\t\t\tconst current = event.target\n\t\t\tconst focusable = Array.from(this.$refs.picker.$el.querySelectorAll('button:not(.emoji-mart-emoji), input'))\n\t\t\tif (!event.shiftKey) {\n\t\t\t\tconst nextNode = focusable.find((node) => current.compareDocumentPosition(node) & Node.DOCUMENT_POSITION_FOLLOWING) || focusable[0]\n\t\t\t\tnextNode.focus()\n\t\t\t} else {\n\t\t\t\tconst prevNode = focusable.findLast((node) => current.compareDocumentPosition(node) & Node.DOCUMENT_POSITION_PRECEDING) || focusable.at(-1)\n\t\t\t\tprevNode.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Handle arrow navigation via <Picker>'s handlers with scroll bug fix\n\t\t * @param {'onArrowLeft' | 'onArrowRight' | 'onArrowDown' | 'onArrowUp'} originalHandlerName - Picker's arrow keydown handler name\n\t\t * @param {KeyboardEvent} event - Keyboard event\n\t\t */\n\t\tasync callPickerArrowHandlerWithScrollFix(originalHandlerName, event) {\n\t\t\t// Call the original handler\n\t\t\t// See: https://github.com/serebrov/emoji-mart-vue/blob/a1ea72673a111cce78dc8caad8bc9ea3e02ad5bd/src/components/Picker.vue#L29\n\t\t\t// TODO: expose these methods via slot props in upstream library\n\t\t\tthis.$refs.picker[originalHandlerName](event)\n\n\t\t\t// Wait until emoji-mart-vue-fast scrolls\n\t\t\tawait this.$nextTick()\n\n\t\t\t// Scroll position is incorrect after emoji-mart-vue-fast scrolls...\n\t\t\t// It calculates scroll incorrectly.\n\t\t\t// It doesn't take into account, that emojis are wrapped into categories sections\n\t\t\t// See: https://github.com/serebrov/emoji-mart-vue/blob/a1ea72673a111cce78dc8caad8bc9ea3e02ad5bd/src/utils/picker.js#L244\n\t\t\t// Now scroll to the correct position\n\t\t\t// TODO: fix in upstream\n\t\t\tconst selectedEmoji = this.$refs.picker.$el.querySelector('.emoji-mart-emoji-selected')\n\t\t\tselectedEmoji?.scrollIntoView({\n\t\t\t\tblock: 'center',\n\t\t\t\tinline: 'center',\n\t\t\t})\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\">\n@import 'emoji-mart-vue-fast/css/emoji-mart.css';\n\n.nc-emoji-picker.emoji-mart {\n\tbackground-color: var(--color-main-background) !important;\n\tborder: 0;\n\tcolor: var(--color-main-text) !important;\n\tdisplay: flex !important;\n\n\t// Reset emoji-mart styles\n\tbutton {\n\t\tborder: none;\n\t\tbackground: transparent;\n\t\tfont-size: inherit;\n\t}\n\n\t.emoji-mart-bar,\n\t.emoji-mart-anchors,\n\t.emoji-mart-search,\n\t.emoji-mart-search input,\n\t.emoji-mart-category,\n\t.emoji-mart-category-label,\n\t.emoji-mart-category-label span,\n\t.emoji-mart-skin-swatches {\n\t\tbackground-color: transparent !important;\n\t\tborder-color: var(--color-border) !important;\n\t\tcolor: inherit !important;\n\t}\n\n\t.emoji-mart-anchors {\n\t\tpadding-block: 0;\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t}\n\n\t.emoji-mart-anchor {\n\t\tborder-radius: 0;\n\t\tmargin: 0 !important;\n\t\tpadding: 0 !important;\n\t\theight: var(--clickable-area-small);\n\t\tmin-width: var(--clickable-area-small);\n\n\t\t&:hover {\n\t\t\tbackground-color: var(--color-background-hover);\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline: 2px solid var(--color-primary-element) !important;\n\t\t\toutline-offset: -2px;\n\t\t}\n\n\t\t// Icon\n\t\tdiv {\n\t\t\tdisplay: grid;\n\t\t\tplace-content: center;\n\t\t}\n\t}\n\n\t.emoji-mart-scroll {\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t\tpadding-block: 0 calc(2 * var(--default-grid-baseline));\n\t}\n\n\t.emoji-mart-category {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tjustify-items: stretch;\n\n\t\t&.emoji-mart-no-results {\n\t\t\tgrid-template-columns: 1fr;\n\t\t\tfont-size: inherit;\n\t\t\tcolor: var(--color-text-maxcontrast) !important;\n\t\t}\n\t}\n\n\t/* Label element in the section grid */\n\tdiv.emoji-mart-category-label {\n\t\tgrid-column: span 8;\n\t\tjustify-self: stretch;\n\t}\n\n\t/* An actual heading inside the element */\n\th3.emoji-mart-category-label {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t// Inline with buttons\n\t\theight: var(--default-clickable-area);\n\t\tmargin: 0;\n\t\t// Inline with input\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t\tpadding-block: 0;\n\t\tuser-select: none;\n\t}\n\n\t.emoji-mart-emoji {\n\t\taspect-ratio: 1 / 1;\n\t\ttext-align: center;\n\t\tmargin: 0 !important;\n\t\tpadding: 0 !important;\n\n\t\t&:hover,\n\t\t&:focus-visible,\n\t\t&.emoji-mart-emoji-selected {\n\t\t\tbackground-color: var(--color-background-hover) !important;\n\t\t\tborder: none;\n\t\t\tborder-radius: var(--border-radius-element, var(--border-radius-pill));\n\t\t\tbox-shadow: none !important;\n\t\t\toutline: 2px solid var(--color-primary-element) !important;\n\t\t\toutline-offset: -2px;\n\t\t}\n\n\t\t&::before {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tspan {\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n}\n</style>\n\n<style scoped lang=\"scss\">\n.search__wrapper {\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: var(--default-grid-baseline);\n\talign-items: end;\n\tpadding-block: var(--default-grid-baseline);\n\tpadding-inline: calc(2 * var(--default-grid-baseline));\n}\n\n.row-selected {\n\tbutton, span {\n\t\tvertical-align: middle;\n\t}\n}\n\n.emoji-delete {\n\tvertical-align: top;\n\tmargin-inline-start: -21px;\n\tmargin-top: -3px;\n}\n</style>\n"],"names":["_sfc_main","_hoisted_1","_hoisted_2","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","_createBlock","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps","_createVNode","_withKeys","_withModifiers","_createSlots","_normalizeStyle","_toDisplayString"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"NcEmojiPicker-lhuMMbDy.mjs","sources":["../../node_modules/vue-material-design-icons/Circle.vue","../../src/components/NcEmojiPicker/NcEmojiPicker.vue"],"sourcesContent":["<template>\n <span v-bind=\"$attrs\"\n :aria-hidden=\"title ? null : 'true'\"\n :aria-label=\"title\"\n class=\"material-design-icon circle-icon\"\n role=\"img\"\n @click=\"$emit('click', $event)\">\n <svg :fill=\"fillColor\"\n class=\"material-design-icon__svg\"\n :width=\"size\"\n :height=\"size\"\n viewBox=\"0 0 24 24\">\n <path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\">\n <title v-if=\"title\">{{ title }}</title>\n </path>\n </svg>\n </span>\n</template>\n\n<script>\nexport default {\n name: \"CircleIcon\",\n emits: ['click'],\n props: {\n title: {\n type: String,\n },\n fillColor: {\n type: String,\n default: \"currentColor\"\n },\n size: {\n type: Number,\n default: 24\n }\n }\n}\n</script>","<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### General description\n\nThis component allows the user to pick an emoji.\n\n### Usage\n\n* Listen to the select event and pass in an HTML element that will be treated as a trigger:\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker @select=\"select\" style=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n* Showing a preview and keeping it open after a user selected an emoji\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker\n\t\t\t:close-on-select=\"false\"\n\t\t\t:show-preview=\"true\"\n\t\t\t@select=\"select\"\n\t\t\tstyle=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n* Allow unselecting a previously set emoji.\n\n```vue\n<template>\n\t<div>\n\t\t<NcEmojiPicker\n\t\t\t:show-preview=\"true\"\n\t\t\t:allow-unselect=\"true\"\n\t\t\t:selected-emoji=\"emoji\"\n\t\t\t@select=\"select\"\n\t\t\t@unselect=\"unselect\"\n\t\t\tstyle=\"display: inline-block\">\n\t\t\t<NcButton> Click Me </NcButton>\n\t\t</NcEmojiPicker>\n\t\t<span>selected emoji: {{ emoji }}</span>\n\t</div>\n</template>\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\temoji: '',\n\t\t\t}\n\t\t},\n\t\tmethods: {\n\t\t\tselect(emoji) {\n\t\t\t\tthis.emoji = emoji\n\t\t\t},\n\t\t\tunselect() {\n\t\t\t\tthis.emoji = ''\n\t\t\t},\n\t\t},\n\t}\n</script>\n```\n\n</docs>\n\n<template>\n\t<NcPopover ref=\"popover\"\n\t\tv-model:shown=\"open\"\n\t\t:container=\"container\"\n\t\tpopup-role=\"dialog\"\n\t\t:focus-trap=\"false /* Handled manually to remove emoji buttons from TAB sequence */\"\n\t\t@after-show=\"afterShow\"\n\t\t@after-hide=\"afterHide\">\n\t\t<template #trigger=\"slotProps\">\n\t\t\t<slot v-bind=\"slotProps\" />\n\t\t</template>\n\t\t<Picker ref=\"picker\"\n\t\t\tclass=\"nc-emoji-picker\"\n\t\t\tcolor=\"var(--color-primary-element)\"\n\t\t\t:data=\"emojiIndex\"\n\t\t\t:emoji=\"previewFallbackEmoji\"\n\t\t\t:i18n\n\t\t\t:native\n\t\t\t:emoji-size=\"20\"\n\t\t\t:per-line=\"8\"\n\t\t\t:picker-styles=\"{ width: '320px' }\"\n\t\t\t:show-preview\n\t\t\t:skin=\"currentSkinTone\"\n\t\t\t:show-skin-tones=\"false\"\n\t\t\t:title=\"previewFallbackName\"\n\t\t\trole=\"dialog\"\n\t\t\taria-modal=\"true\"\n\t\t\t:aria-label=\"t('Emoji picker')\"\n\t\t\tv-bind=\"$attrs\"\n\t\t\t@keydown.tab.prevent=\"handleTabNavigationSkippingEmojis\"\n\t\t\t@select=\"select\">\n\t\t\t<template #searchTemplate=\"{ onSearch }\">\n\t\t\t\t<div class=\"search__wrapper\">\n\t\t\t\t\t<NcTextField ref=\"search\"\n\t\t\t\t\t\tv-model=\"search\"\n\t\t\t\t\t\tclass=\"search\"\n\t\t\t\t\t\t:label=\"t('Search')\"\n\t\t\t\t\t\t:label-visible=\"true\"\n\t\t\t\t\t\t:placeholder=\"i18n.search\"\n\t\t\t\t\t\ttrailing-button-icon=\"close\"\n\t\t\t\t\t\t:trailing-button-label=\"t('Clear search')\"\n\t\t\t\t\t\t:show-trailing-button=\"search !== ''\"\n\t\t\t\t\t\t@keydown.left=\"callPickerArrowHandlerWithScrollFix('onArrowLeft', $event)\"\n\t\t\t\t\t\t@keydown.right=\"callPickerArrowHandlerWithScrollFix('onArrowRight', $event)\"\n\t\t\t\t\t\t@keydown.down=\"callPickerArrowHandlerWithScrollFix('onArrowDown', $event)\"\n\t\t\t\t\t\t@keydown.up=\"callPickerArrowHandlerWithScrollFix('onArrowUp', $event)\"\n\t\t\t\t\t\t@keydown.enter=\"$refs.picker.onEnter($event)\"\n\t\t\t\t\t\t@trailing-button-click=\"clearSearch(); onSearch('');\"\n\t\t\t\t\t\t@update:model-value=\"onSearch(search)\" />\n\t\t\t\t\t<NcColorPicker palette-only\n\t\t\t\t\t\t:container\n\t\t\t\t\t\t:palette=\"skinTonePalette\"\n\t\t\t\t\t\t:model-value=\"currentColor.color\"\n\t\t\t\t\t\t@update:model-value=\"onChangeSkinTone\">\n\t\t\t\t\t\t<NcButton :aria-label=\"t('Skin tone')\" variant=\"tertiary-no-background\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<IconCircle :style=\"{ color: currentColor.color }\" :title=\"currentColor.name\" :size=\"20\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</NcColorPicker>\n\t\t\t\t</div>\n\t\t\t</template>\n\t\t\t<template v-if=\"allowUnselect && selectedEmoji\" #customCategory>\n\t\t\t\t<div class=\"emoji-mart-category-label\">\n\t\t\t\t\t<h3 class=\"emoji-mart-category-label\">\n\t\t\t\t\t\t{{ t('Selected') }}\n\t\t\t\t\t</h3>\n\t\t\t\t</div>\n\t\t\t\t<Emoji class=\"emoji-selected\"\n\t\t\t\t\t:data=\"emojiIndex\"\n\t\t\t\t\t:emoji=\"selectedEmoji\"\n\t\t\t\t\tnative\n\t\t\t\t\t:size=\"32\"\n\t\t\t\t\t@click=\"unselect\" />\n\t\t\t\t<Emoji class=\"emoji-delete\"\n\t\t\t\t\t:data=\"emojiIndex\"\n\t\t\t\t\temoji=\":x:\"\n\t\t\t\t\tnative\n\t\t\t\t\t:size=\"10\"\n\t\t\t\t\t@click=\"unselect\" />\n\t\t\t</template>\n\t\t</Picker>\n\t</NcPopover>\n</template>\n\n<script>\nimport { isFocusable } from 'tabbable'\nimport { Picker, Emoji, EmojiIndex } from 'emoji-mart-vue-fast/src/index.js'\nimport { useTrapStackControl } from '../../composables/useTrapStackControl.ts'\nimport { getCurrentSkinTone, setCurrentSkinTone } from '../../functions/emoji/emoji.ts'\nimport { Color } from '../../utils/colors.ts'\nimport { t } from '../../l10n.js'\n\nimport data from 'emoji-mart-vue-fast/data/all.json'\n\nimport IconCircle from 'vue-material-design-icons/Circle.vue'\nimport NcButton from '../NcButton/index.ts'\nimport NcColorPicker from '../NcColorPicker/NcColorPicker.vue'\nimport NcPopover from '../NcPopover/index.js'\nimport NcTextField from '../NcTextField/index.js'\n\n// Shared emoji index and skinTone for all NcEmojiPicker instances\n// Will be initialized on the first NcEmojiPicker creating\nlet emojiIndex\n\nconst i18n = {\n\tsearch: t('Search emoji'),\n\tnotfound: t('No emoji found'),\n\tcategories: {\n\t\tsearch: t('Search results'),\n\t\trecent: t('Frequently used'),\n\t\tsmileys: t('Smileys & Emotion'),\n\t\tpeople: t('People & Body'),\n\t\tnature: t('Animals & Nature'),\n\t\tfoods: t('Food & Drink'),\n\t\tactivity: t('Activities'),\n\t\tplaces: t('Travel & Places'),\n\t\tobjects: t('Objects'),\n\t\tsymbols: t('Symbols'),\n\t\tflags: t('Flags'),\n\t\tcustom: t('Custom'),\n\t},\n}\n\nconst skinTonePalette = [\n\tnew Color(255, 222, 52, t('Neutral skin color')),\n\tnew Color(228, 205, 166, t('Light skin tone')),\n\tnew Color(250, 221, 192, t('Medium light skin tone')),\n\tnew Color(174, 129, 87, t('Medium skin tone')),\n\tnew Color(158, 113, 88, t('Medium dark skin tone')),\n\tnew Color(96, 79, 69, t('Dark skin tone')),\n]\n\nexport default {\n\tname: 'NcEmojiPicker',\n\n\tcomponents: {\n\t\tIconCircle,\n\t\tNcButton,\n\t\tNcColorPicker,\n\t\tNcPopover,\n\t\tNcTextField,\n\t\tEmoji,\n\t\tPicker,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The emoji-set\n\t\t */\n\t\tactiveSet: {\n\t\t\ttype: String,\n\t\t\tdefault: 'native',\n\t\t},\n\t\t/**\n\t\t * Show preview section when hovering emoji\n\t\t */\n\t\tshowPreview: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Allow unselecting the selected emoji\n\t\t */\n\t\tallowUnselect: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\t\t/**\n\t\t * Selected emoji to allow unselecting\n\t\t */\n\t\tselectedEmoji: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\t\t/**\n\t\t * The fallback emoji in the preview section\n\t\t */\n\t\tpreviewFallbackEmoji: {\n\t\t\ttype: String,\n\t\t\tdefault: 'grinning',\n\t\t},\n\t\t/**\n\t\t * The fallback text in the preview section\n\t\t */\n\t\tpreviewFallbackName: {\n\t\t\ttype: String,\n\t\t\tdefault: t('Pick an emoji'),\n\t\t},\n\t\t/**\n\t\t * Whether to close the emoji picker after picking one\n\t\t */\n\t\tcloseOnSelect: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/**\n\t\t * Selector for the popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: [String, Object, Element, Boolean],\n\t\t\tdefault: 'body',\n\t\t},\n\t},\n\temits: [\n\t\t'select',\n\t\t'select-data',\n\t\t'unselect',\n\t],\n\n\tsetup() {\n\t\t// If this is the first instance of NcEmojiPicker - setup EmojiIndex\n\t\tif (!emojiIndex) {\n\t\t\temojiIndex = new EmojiIndex(data)\n\t\t}\n\n\t\treturn {\n\t\t\t// Non-reactive constants\n\t\t\temojiIndex,\n\t\t\tskinTonePalette,\n\t\t\ti18n,\n\t\t}\n\t},\n\n\tdata() {\n\t\tconst currentSkinTone = getCurrentSkinTone()\n\n\t\treturn {\n\t\t\t/**\n\t\t\t * The current active color from the skin tone palette\n\t\t\t */\n\t\t\tcurrentColor: skinTonePalette[currentSkinTone - 1],\n\t\t\t/**\n\t\t\t * The current active skin tone\n\t\t\t * @type {1|2|3|4|5|6}\n\t\t\t */\n\t\t\tcurrentSkinTone,\n\t\t\tsearch: '',\n\t\t\topen: false,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tnative() {\n\t\t\treturn this.activeSet === 'native'\n\t\t},\n\t},\n\n\tcreated() {\n\t\t// Component has its own custom focus management\n\t\t// The global focus trap stack should be paused\n\t\tuseTrapStackControl(() => this.open)\n\t},\n\n\tmethods: {\n\t\tt,\n\n\t\tclearSearch() {\n\t\t\tthis.search = ''\n\t\t\tthis.$refs.search.focus()\n\t\t},\n\n\t\t/**\n\t\t * Update the current skin tone by the result of the color picker\n\t\t * @param {string} color Color set\n\t\t */\n\t\tonChangeSkinTone(color) {\n\t\t\tconst index = this.skinTonePalette.findIndex((tone) => tone.color.toLowerCase() === color.toLowerCase())\n\t\t\tif (index > -1) {\n\t\t\t\tthis.currentSkinTone = index + 1\n\t\t\t\tthis.currentColor = this.skinTonePalette[index]\n\t\t\t\tsetCurrentSkinTone(this.currentSkinTone)\n\t\t\t}\n\t\t},\n\n\t\tselect(emojiObject) {\n\t\t\t/**\n\t\t\t * Emits a string containing the emoji e.g. '👩🏿💻'\n\t\t\t */\n\t\t\tthis.$emit('select', emojiObject.native)\n\n\t\t\t/**\n\t\t\t * Emits a object with more data about the picked emoji\n\t\t\t */\n\t\t\tthis.$emit('select-data', emojiObject)\n\n\t\t\tif (this.closeOnSelect) {\n\t\t\t\tthis.open = false\n\t\t\t}\n\t\t},\n\n\t\tunselect() {\n\t\t\tthis.$emit('unselect')\n\t\t},\n\n\t\tafterShow() {\n\t\t\tthis.$refs.search.focus()\n\t\t},\n\n\t\tafterHide() {\n\t\t\t// Manually return focus to the trigger button, as we disabled focus-trap\n\t\t\t// But only if there is no focus target outside the picker, for example, input element that received focus by click closing the emoji picker\n\t\t\tif (!document.activeElement || this.$refs.picker.$el.contains(document.activeElement) || !isFocusable(document.activeElement)) {\n\t\t\t\tthis.$refs.popover.$el.querySelector('button, [role=\"button\"]')?.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Manually handle Tab navigation skipping emoji buttons.\n\t\t * Navigation over emojis is handled by Arrow keys.\n\t\t * @param {KeyboardEvent} event - Keyboard event\n\t\t */\n\t\thandleTabNavigationSkippingEmojis(event) {\n\t\t\tconst current = event.target\n\t\t\tconst focusable = Array.from(this.$refs.picker.$el.querySelectorAll('button:not(.emoji-mart-emoji), input'))\n\t\t\tif (!event.shiftKey) {\n\t\t\t\tconst nextNode = focusable.find((node) => current.compareDocumentPosition(node) & Node.DOCUMENT_POSITION_FOLLOWING) || focusable[0]\n\t\t\t\tnextNode.focus()\n\t\t\t} else {\n\t\t\t\tconst prevNode = focusable.findLast((node) => current.compareDocumentPosition(node) & Node.DOCUMENT_POSITION_PRECEDING) || focusable.at(-1)\n\t\t\t\tprevNode.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Handle arrow navigation via <Picker>'s handlers with scroll bug fix\n\t\t * @param {'onArrowLeft' | 'onArrowRight' | 'onArrowDown' | 'onArrowUp'} originalHandlerName - Picker's arrow keydown handler name\n\t\t * @param {KeyboardEvent} event - Keyboard event\n\t\t */\n\t\tasync callPickerArrowHandlerWithScrollFix(originalHandlerName, event) {\n\t\t\t// Call the original handler\n\t\t\t// See: https://github.com/serebrov/emoji-mart-vue/blob/a1ea72673a111cce78dc8caad8bc9ea3e02ad5bd/src/components/Picker.vue#L29\n\t\t\t// TODO: expose these methods via slot props in upstream library\n\t\t\tthis.$refs.picker[originalHandlerName](event)\n\n\t\t\t// Wait until emoji-mart-vue-fast scrolls\n\t\t\tawait this.$nextTick()\n\n\t\t\t// Scroll position is incorrect after emoji-mart-vue-fast scrolls...\n\t\t\t// It calculates scroll incorrectly.\n\t\t\t// It doesn't take into account, that emojis are wrapped into categories sections\n\t\t\t// See: https://github.com/serebrov/emoji-mart-vue/blob/a1ea72673a111cce78dc8caad8bc9ea3e02ad5bd/src/utils/picker.js#L244\n\t\t\t// Now scroll to the correct position\n\t\t\t// TODO: fix in upstream\n\t\t\tconst selectedEmoji = this.$refs.picker.$el.querySelector('.emoji-mart-emoji-selected')\n\t\t\tselectedEmoji?.scrollIntoView({\n\t\t\t\tblock: 'center',\n\t\t\t\tinline: 'center',\n\t\t\t})\n\t\t},\n\t},\n}\n</script>\n\n<style lang=\"scss\">\n@import 'emoji-mart-vue-fast/css/emoji-mart.css';\n\n.nc-emoji-picker.emoji-mart {\n\tbackground-color: var(--color-main-background) !important;\n\tborder: 0;\n\tcolor: var(--color-main-text) !important;\n\tdisplay: flex !important;\n\n\t// Reset emoji-mart styles\n\tbutton {\n\t\tborder: none;\n\t\tbackground: transparent;\n\t\tfont-size: inherit;\n\t}\n\n\t.emoji-mart-bar,\n\t.emoji-mart-anchors,\n\t.emoji-mart-search,\n\t.emoji-mart-search input,\n\t.emoji-mart-category,\n\t.emoji-mart-category-label,\n\t.emoji-mart-category-label span,\n\t.emoji-mart-skin-swatches {\n\t\tbackground-color: transparent !important;\n\t\tborder-color: var(--color-border) !important;\n\t\tcolor: inherit !important;\n\t}\n\n\t.emoji-mart-anchors {\n\t\tpadding-block: 0;\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t}\n\n\t.emoji-mart-anchor {\n\t\tborder-radius: 0;\n\t\tmargin: 0 !important;\n\t\tpadding: 0 !important;\n\t\theight: var(--clickable-area-small);\n\t\tmin-width: var(--clickable-area-small);\n\n\t\t&:hover {\n\t\t\tbackground-color: var(--color-background-hover);\n\t\t}\n\n\t\t&:focus-visible {\n\t\t\toutline: 2px solid var(--color-primary-element) !important;\n\t\t\toutline-offset: -2px;\n\t\t}\n\n\t\t// Icon\n\t\tdiv {\n\t\t\tdisplay: grid;\n\t\t\tplace-content: center;\n\t\t}\n\t}\n\n\t.emoji-mart-scroll {\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t\tpadding-block: 0 calc(2 * var(--default-grid-baseline));\n\t}\n\n\t.emoji-mart-category {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tjustify-items: stretch;\n\n\t\t&.emoji-mart-no-results {\n\t\t\tgrid-template-columns: 1fr;\n\t\t\tfont-size: inherit;\n\t\t\tcolor: var(--color-text-maxcontrast) !important;\n\t\t}\n\t}\n\n\t/* Label element in the section grid */\n\tdiv.emoji-mart-category-label {\n\t\tgrid-column: span 8;\n\t\tjustify-self: stretch;\n\t}\n\n\t/* An actual heading inside the element */\n\th3.emoji-mart-category-label {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t// Inline with buttons\n\t\theight: var(--default-clickable-area);\n\t\tmargin: 0;\n\t\t// Inline with input\n\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t\tpadding-block: 0;\n\t\tuser-select: none;\n\t}\n\n\t.emoji-mart-emoji {\n\t\taspect-ratio: 1 / 1;\n\t\ttext-align: center;\n\t\tmargin: 0 !important;\n\t\tpadding: 0 !important;\n\n\t\t&:hover,\n\t\t&:focus-visible,\n\t\t&.emoji-mart-emoji-selected {\n\t\t\tbackground-color: var(--color-background-hover) !important;\n\t\t\tborder: none;\n\t\t\tborder-radius: var(--border-radius-element, var(--border-radius-pill));\n\t\t\tbox-shadow: none !important;\n\t\t\toutline: 2px solid var(--color-primary-element) !important;\n\t\t\toutline-offset: -2px;\n\t\t}\n\n\t\t&::before {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tspan {\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n}\n</style>\n\n<style scoped lang=\"scss\">\n.search__wrapper {\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: var(--default-grid-baseline);\n\talign-items: end;\n\tpadding-block: var(--default-grid-baseline);\n\tpadding-inline: calc(2 * var(--default-grid-baseline));\n}\n\n.row-selected {\n\tbutton, span {\n\t\tvertical-align: middle;\n\t}\n}\n\n.emoji-delete {\n\tvertical-align: top;\n\tmargin-inline-start: -21px;\n\tmargin-top: -3px;\n}\n</style>\n"],"names":["_sfc_main","_hoisted_1","_hoisted_2","_hoisted_3","_createElementBlock","_mergeProps","_createElementVNode","_createCommentVNode","_createBlock","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps","_createVNode","_withKeys","_withModifiers","_createSlots","_normalizeStyle","_toDisplayString"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import '../assets/NcEmptyContent-q-geAf0w.css';
|
|
2
|
+
import { defineComponent, createElementBlock, openBlock, createCommentVNode, renderSlot, toDisplayString, createTextVNode } from "vue";
|
|
3
|
+
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
|
|
4
|
+
const _hoisted_1 = {
|
|
5
|
+
class: "empty-content",
|
|
6
|
+
role: "note"
|
|
7
|
+
};
|
|
8
|
+
const _hoisted_2 = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "empty-content__icon",
|
|
11
|
+
"aria-hidden": "true"
|
|
12
|
+
};
|
|
13
|
+
const _hoisted_3 = {
|
|
14
|
+
key: 0,
|
|
15
|
+
class: "empty-content__name"
|
|
16
|
+
};
|
|
17
|
+
const _hoisted_4 = {
|
|
18
|
+
key: 1,
|
|
19
|
+
class: "empty-content__description"
|
|
20
|
+
};
|
|
21
|
+
const _hoisted_5 = {
|
|
22
|
+
key: 2,
|
|
23
|
+
class: "empty-content__action"
|
|
24
|
+
};
|
|
25
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
26
|
+
__name: "NcEmptyContent",
|
|
27
|
+
props: {
|
|
28
|
+
description: { default: "" },
|
|
29
|
+
name: { default: "" }
|
|
30
|
+
},
|
|
31
|
+
setup(__props) {
|
|
32
|
+
return (_ctx, _cache) => {
|
|
33
|
+
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
34
|
+
_ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_2, [
|
|
35
|
+
renderSlot(_ctx.$slots, "icon", {}, void 0, true)
|
|
36
|
+
])) : createCommentVNode("", true),
|
|
37
|
+
renderSlot(_ctx.$slots, "name", {}, () => [
|
|
38
|
+
_ctx.name !== "" ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(_ctx.name), 1)) : createCommentVNode("", true)
|
|
39
|
+
], true),
|
|
40
|
+
_ctx.description !== "" || _ctx.$slots.description ? (openBlock(), createElementBlock("p", _hoisted_4, [
|
|
41
|
+
renderSlot(_ctx.$slots, "description", {}, () => [
|
|
42
|
+
createTextVNode(toDisplayString(_ctx.description), 1)
|
|
43
|
+
], true)
|
|
44
|
+
])) : createCommentVNode("", true),
|
|
45
|
+
_ctx.$slots.action ? (openBlock(), createElementBlock("div", _hoisted_5, [
|
|
46
|
+
renderSlot(_ctx.$slots, "action", {}, void 0, true)
|
|
47
|
+
])) : createCommentVNode("", true)
|
|
48
|
+
]);
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
const NcEmptyContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-697cfd8f"]]);
|
|
53
|
+
export {
|
|
54
|
+
NcEmptyContent as N
|
|
55
|
+
};
|
|
56
|
+
//# sourceMappingURL=NcEmptyContent-BdOezubv.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NcEmptyContent-BdOezubv.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import '../assets/NcGuestContent-BZ26iXQi.css';
|
|
2
|
+
import { defineComponent, onMounted, onUnmounted, createElementBlock, openBlock, renderSlot } from "vue";
|
|
3
|
+
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
|
|
4
|
+
const _hoisted_1 = { id: "guest-content-vue" };
|
|
5
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
6
|
+
__name: "NcGuestContent",
|
|
7
|
+
setup(__props) {
|
|
8
|
+
onMounted(() => {
|
|
9
|
+
document.getElementById("content").classList.add("nc-guest-content");
|
|
10
|
+
});
|
|
11
|
+
onUnmounted(() => {
|
|
12
|
+
document.getElementById("content").classList.remove("nc-guest-content");
|
|
13
|
+
});
|
|
14
|
+
return (_ctx, _cache) => {
|
|
15
|
+
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
16
|
+
renderSlot(_ctx.$slots, "default", {}, void 0, true)
|
|
17
|
+
]);
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
const NcGuestContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8d718fc0"]]);
|
|
22
|
+
export {
|
|
23
|
+
NcGuestContent as N
|
|
24
|
+
};
|
|
25
|
+
//# sourceMappingURL=NcGuestContent-B_S2nyJ4.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NcGuestContent-B_S2nyJ4.mjs","sources":["../../src/components/NcGuestContent/NcGuestContent.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### General description\nGuest content container to be used for the guest content of your app.\n\nThis components provides a wrapper around guest page content.\nIt should be used as the main wrapper for public pages, similar to `NcContent`.\n\nIt can't be used multiple times on the same page.\n\n### Usage\n\n```vue\n<template>\n\t<NcGuestContent>\n\t\t<h2>Hello guest</h2>\n\t\t<span>How are you?</span>\n\t</NcGuestContent>\n</template>\n```\n</docs>\n\n<script setup lang=\"ts\">\nimport type { Slot } from 'vue'\nimport { onMounted, onUnmounted } from 'vue'\n\ndefineSlots<{\n\tdefault?: Slot\n}>()\n\nonMounted(() => {\n\tdocument.getElementById('content')!.classList.add('nc-guest-content')\n})\n\nonUnmounted(() => {\n\tdocument.getElementById('content')!.classList.remove('nc-guest-content')\n})\n</script>\n\n<template>\n\t<div id=\"guest-content-vue\">\n\t\t<slot />\n\t</div>\n</template>\n\n<style lang=\"scss\" scoped>\n#guest-content-vue {\n\tcolor: var(--color-main-text);\n\tbackground-color: var(--color-main-background);\n\tmin-width: 0;\n\tborder-radius: var(--border-radius-large);\n\tbox-shadow: 0 0 10px var(--color-box-shadow);\n\theight: fit-content;\n\tpadding: 15px;\n\tmargin: 20px auto;\n}\n</style>\n\n<style lang=\"scss\">\n#content.nc-guest-content {\n\t// Enable scrolling\n\toverflow: auto;\n\n\t// Fix box being cutoff at the bottom\n\tmargin-bottom: 0;\n\theight: calc(var(--body-height) + var(--body-container-margin));\n}\n</style>\n"],"names":[],"mappings":";;;;;;AAkCA,cAAU,MAAM;AACf,eAAS,eAAe,SAAS,EAAG,UAAU,IAAI,kBAAkB;AAAA,IAAA,CACpE;AAED,gBAAY,MAAM;AACjB,eAAS,eAAe,SAAS,EAAG,UAAU,OAAO,kBAAkB;AAAA,IAAA,CACvE;;;;;;;;;"}
|
|
@@ -2,7 +2,7 @@ import '../assets/NcHeaderMenu-zo6kw_jn.css';
|
|
|
2
2
|
import { defineComponent, ref, computed, useTemplateRef, watch, nextTick, createBlock, openBlock, resolveDynamicComponent, normalizeClass, unref, withCtx, createVNode, createElementBlock, createCommentVNode, withDirectives, withModifiers, renderSlot, toDisplayString, createElementVNode, vShow } from "vue";
|
|
3
3
|
import { onClickOutside } from "@vueuse/core";
|
|
4
4
|
import { createFocusTrap } from "focus-trap";
|
|
5
|
-
import "./useFormatDateTime-
|
|
5
|
+
import "./useFormatDateTime-L411ysPm.mjs";
|
|
6
6
|
import { useHotKey } from "../composables/useHotKey/index.mjs";
|
|
7
7
|
import "../composables/useIsDarkTheme/index.mjs";
|
|
8
8
|
import "../composables/useIsFullscreen/index.mjs";
|
|
@@ -138,4 +138,4 @@ const NcHeaderMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data
|
|
|
138
138
|
export {
|
|
139
139
|
NcHeaderMenu as N
|
|
140
140
|
};
|
|
141
|
-
//# sourceMappingURL=NcHeaderMenu-
|
|
141
|
+
//# sourceMappingURL=NcHeaderMenu-o9FmNBI5.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcHeaderMenu-CEH_-KT_.mjs","sources":["../../src/components/NcHeaderMenu/NcHeaderMenu.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\nThis component is made to be used in the Nextcloud top header.\n\n```\n<template>\n\t<div id=\"nextcloud-header\">\n\t\t<NcHeaderMenu id=\"search\"\n\t\t\taria-label=\"Search\">\n\t\t\t<template #trigger>\n\t\t\t\t<Magnify />\n\t\t\t</template>\n\t\t\t<div>\n\t\t\t\t<NcTextField label=\"Search for files, comments, contacts…\"\n\t\t\t\t\tstyle=\"padding-inline: 8px;\"\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tv-model=\"query\" />\n\t\t\t\t<NcEmptyContent\n\t\t\t\t\tname=\"Search\"\n\t\t\t\t\t:description=\"query ? `No results for '${query}'` : 'Start typing to search'\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Magnify />\n\t\t\t\t\t</template>\n\t\t\t\t</NcEmptyContent>\n\t\t\t</div>\n\t\t</NcHeaderMenu>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify'\n\nexport default {\n\tcomponents: {\n\t\tMagnify,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tquery: '',\n\t\t}\n\t},\n}\n</script>\n<style>\n#nextcloud-header {\n\tdisplay: flex;\n\tjustify-content: right;\n\tbackground-color: var(--color-primary);\n\theight: var(--header-height, 50px);\n\tpadding-inline-end: 12px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<component :is=\"wrapperTag\"\n\t\t:id=\"id\"\n\t\tref=\"headerMenu\"\n\t\t:aria-labelledby=\"isNav ? triggerId : null\"\n\t\t:class=\"{ 'header-menu--opened': isOpened }\"\n\t\tclass=\"header-menu\"\n\t\t@focusout=\"onFocusOut\">\n\t\t<!-- Trigger -->\n\t\t<NcButton :id=\"isNav ? triggerId : null\"\n\t\t\tref=\"triggerButton\"\n\t\t\tclass=\"header-menu__trigger\"\n\t\t\t:aria-controls=\"`header-menu-${id}`\"\n\t\t\t:aria-expanded=\"isOpened.toString()\"\n\t\t\tsize=\"large\"\n\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t@click.prevent=\"toggleMenu\">\n\t\t\t<template #icon>\n\t\t\t\t<slot name=\"trigger\" />\n\t\t\t</template>\n\t\t</NcButton>\n\n\t\t<span v-if=\"description\"\n\t\t\t:id=\"descriptionId\"\n\t\t\tclass=\"header-menu__description hidden-visually\">\n\t\t\t{{ description }}\n\t\t</span>\n\n\t\t<!-- Visual triangle -->\n\t\t<div v-show=\"isOpened\" class=\"header-menu__caret\" />\n\n\t\t<!-- Menu opened content -->\n\t\t<div v-show=\"isOpened\"\n\t\t\t:id=\"`header-menu-${id}`\"\n\t\t\tclass=\"header-menu__wrapper\">\n\t\t\t<div ref=\"contentContainer\" class=\"header-menu__content\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\t\t</div>\n\t</component>\n</template>\n\n<script setup lang=\"ts\">\nimport type { FocusTrap } from 'focus-trap'\n\nimport { onClickOutside } from '@vueuse/core'\nimport { createFocusTrap } from 'focus-trap'\nimport { computed, nextTick, ref, useTemplateRef, watch, type Slot } from 'vue'\nimport { useHotKey } from '../../composables/index.js'\nimport { getTrapStack } from '../../utils/focusTrap.js'\nimport { createElementId } from '../../utils/createElementId.ts'\n\nimport NcButton from '../NcButton/index.ts'\n\nconst {\n\texcludeClickOutsideSelectors = [],\n\topen = false,\n\tisNav = false,\n} = defineProps<{\n\t/**\n\t * Unique id for this menu\n\t */\n\tid: string\n\n\t/**\n\t * aria-label attribute of the menu open button\n\t */\n\tariaLabel?: string\n\n\t/**\n\t * Current menu open state\n\t */\n\topen?: boolean\n\n\t/**\n\t * Pass `true` if the header menu is used for website navigation\n\t *\n\t * The wrapper tag will be set to `nav` and its `aria-labelledby`\n\t * will be associated with the menu open button\n\t */\n\tisNav?: boolean\n\n\t/**\n\t * Additional visually hidden description text for the menu\n\t * open button\n\t */\n\tdescription?: string\n\n\t/**\n\t * A query-selector or an array of query-selectors\n\t * to be ignored when clicking outside an element\n\t */\n\texcludeClickOutsideSelectors?: string | string[]\n}>()\n\nconst emit = defineEmits<{\n\t/** Emitted when the menu is fully closed (animation done) */\n\tclosed: []\n\n\t/** Emitted when the menu is fully opened (animation done) */\n\topened: []\n\n\t/** Updated open state */\n\t'update:open': [v: boolean]\n}>()\n\ndefineSlots<{\n\t/** The menu content */\n\tdefault: Slot\n\t/** Icon trigger slot. Make sure the svg path is at least 16px. Usually mdi icon works at 20px */\n\ttrigger: Slot\n}>()\n\n/** Id of the menu description */\nconst descriptionId = createElementId()\n/** Id of the trigger button */\nconst triggerId = createElementId()\n/** The active focus trap (if any) */\nconst focusTrap = ref<FocusTrap>()\n/** Is the menu currently opened */\nconst isOpened = ref(open)\n/** HTML tag to use for the header menu */\nconst wrapperTag = computed(() => isNav ? 'nav' : 'div')\n\n/** The menu content container element */\nconst contentContainer = useTemplateRef('contentContainer')\n/** The overall header menu wrapping element (<nav> or <div>) */\nconst headerMenu = useTemplateRef<HTMLElement>('headerMenu')\n/** The menu trigger button */\nconst triggerButton = useTemplateRef('triggerButton')\n\n// Handle click outside of the menu -> should close the menu\nconst ignore = computed(() => Array.isArray(excludeClickOutsideSelectors)\n\t? excludeClickOutsideSelectors\n\t: excludeClickOutsideSelectors.split(' '),\n)\nonClickOutside(headerMenu, () => setMenuState(false), { ignore })\n\n// Pressing escape should close the menu\nuseHotKey('Escape', () => setMenuState(false), { prevent: true })\n\n// Watch the open prop to adjust the internal opened state\nwatch(() => open, (state: boolean) => setMenuState(state))\n\n/**\n * Toggle the current menu open state\n */\nfunction toggleMenu() {\n\tsetMenuState(!isOpened.value)\n}\n\n/**\n * Set the menu opened state\n * @param state The opened state to set\n */\nasync function setMenuState(state: boolean) {\n\tif (state === isOpened.value) {\n\t\treturn\n\t}\n\n\tisOpened.value = state\n\temit('update:open', state)\n\n\t// wait one tick to make sure the rendering finished\n\tawait nextTick()\n\t// either add or clear the focus trap\n\tawait (state ? addFocusTrap() : clearFocusTrap())\n\n\t// Emit signal to mark finished toggling\n\t// @ts-expect-error This seems to be broken in Vue's typescript macro compiler...\n\temit(state ? 'opened' : 'closed')\n}\n\n/**\n * When this is role navigation, then we cannot apply a focus trap.\n * In this case we close the menu on focus-out.\n *\n * @param event the focus event\n */\nfunction onFocusOut(event: FocusEvent) {\n\t// Is not a navigation\n\tif (!isNav) {\n\t\treturn\n\t}\n\n\t// Event target is not a node\n\tif (!(event.relatedTarget instanceof Node)) {\n\t\treturn\n\t}\n\n\tif (headerMenu.value?.contains(event.relatedTarget)) {\n\t\tsetMenuState(false)\n\t}\n}\n\n/**\n * Add focus trap for accessibility.\n * Shall only be used when all children are mounted\n * and available in the DOM. We use $nextTick for that.\n */\nasync function addFocusTrap() {\n\t// We cannot add the focus trap on navigation roles\n\t// also skip if already set\n\tif (isNav || focusTrap.value) {\n\t\treturn\n\t}\n\n\t// Init focus trap\n\tfocusTrap.value = createFocusTrap(contentContainer.value!, {\n\t\tallowOutsideClick: true,\n\t\ttrapStack: getTrapStack(),\n\t\tfallbackFocus: triggerButton.value?.$el,\n\t})\n\tfocusTrap.value.activate()\n}\n\n/**\n * Deactivate and clear the focus trap\n */\nfunction clearFocusTrap() {\n\tfocusTrap.value?.deactivate()\n\tfocusTrap.value = undefined\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@use './header-menu__trigger.scss';\n\n// content inner and outer margin\n// Also used for menu top-right positioning\n$externalMargin: 8px;\n\n.header-menu {\n\t&__wrapper {\n\t\tposition: fixed;\n\t\tz-index: 2000;\n\t\ttop: var(--header-height);\n\t\tinset-inline-end: 0;\n\t\tbox-sizing: border-box;\n\t\tmargin: 0 $externalMargin;\n\t\tborder-radius: 0 0 var(--border-radius) var(--border-radius);\n\t\tborder-radius: var(--border-radius-large);\n\t\tbackground-color: var(--color-main-background);\n\n\t\tfilter: drop-shadow(0 1px 5px var(--color-box-shadow));\n\t}\n\n\t&__carret {\n\t\tposition: absolute;\n\t\tz-index: 2001; // Because __wrapper is 2000.\n\t\tbottom: 0;\n\t\tinset-inline-start: calc(50% - 10px);\n\t\twidth: 0;\n\t\theight: 0;\n\t\tcontent: ' ';\n\t\tpointer-events: none;\n\t\tborder: 10px solid transparent;\n\t\tborder-bottom-color: var(--color-main-background);\n\t}\n\n\t&__content {\n\t\toverflow: auto;\n\t\twidth: 350px;\n\t\tmax-width: calc(100vw - 2 * $externalMargin);\n\t\tmin-height: calc(var(--default-clickable-area) * 1.5);\n\t\tmax-height: calc(100vh - var(--header-height) * 2);\n\t\t:deep(.empty-content) {\n\t\t\tmargin: 12vh 10px;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAyJA,UAAM,OAAO;AAmBb,UAAM,gBAAgB,gBAAgB;AAEtC,UAAM,YAAY,gBAAgB;AAElC,UAAM,YAAY,IAAe;AAE3B,UAAA,WAAW,IAAI,QAAI,IAAA;AAEzB,UAAM,aAAa,SAAS,MAAM,QAAK,QAAG,QAAQ,KAAK;AAGjD,UAAA,mBAAmB,eAAe,kBAAkB;AAEpD,UAAA,aAAa,eAA4B,YAAY;AAErD,UAAA,gBAAgB,eAAe,eAAe;AAGpD,UAAM,SAAS;AAAA,MAAS,MAAM,MAAM,QAAQ,QAA4B,4BAAA,IACrE,QAAA,+BACA,QAA4B,6BAAC,MAAM,GAAG;AAAA,IACzC;AACA,mBAAe,YAAY,MAAM,aAAa,KAAK,GAAG,EAAE,QAAQ;AAGtD,cAAA,UAAU,MAAM,aAAa,KAAK,GAAG,EAAE,SAAS,MAAM;AAGhE,UAAM,MAAM,QAAA,MAAM,CAAC,UAAmB,aAAa,KAAK,CAAC;AAKzD,aAAS,aAAa;AACR,mBAAA,CAAC,SAAS,KAAK;AAAA,IAAA;AAO7B,mBAAe,aAAa,OAAgB;AACvC,UAAA,UAAU,SAAS,OAAO;AAC7B;AAAA,MAAA;AAGD,eAAS,QAAQ;AACjB,WAAK,eAAe,KAAK;AAGzB,YAAM,SAAS;AAER,aAAA,QAAQ,iBAAiB;AAI3B,WAAA,QAAQ,WAAW,QAAQ;AAAA,IAAA;AASjC,aAAS,WAAW,OAAmB;AAElC,UAAA,CAAC,QAAA,OAAO;AACX;AAAA,MAAA;AAIG,UAAA,EAAE,MAAM,yBAAyB,OAAO;AAC3C;AAAA,MAAA;AAGD,UAAI,WAAW,OAAO,SAAS,MAAM,aAAa,GAAG;AACpD,qBAAa,KAAK;AAAA,MAAA;AAAA,IACnB;AAQD,mBAAe,eAAe;AAGzB,UAAA,QAAA,SAAS,UAAU,OAAO;AAC7B;AAAA,MAAA;AAIS,gBAAA,QAAQ,gBAAgB,iBAAiB,OAAQ;AAAA,QAC1D,mBAAmB;AAAA,QACnB,WAAW,aAAa;AAAA,QACxB,eAAe,cAAc,OAAO;AAAA,MAAA,CACpC;AACD,gBAAU,MAAM,SAAS;AAAA,IAAA;AAM1B,aAAS,iBAAiB;AACzB,gBAAU,OAAO,WAAW;AAC5B,gBAAU,QAAQ;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"NcHeaderMenu-o9FmNBI5.mjs","sources":["../../src/components/NcHeaderMenu/NcHeaderMenu.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\nThis component is made to be used in the Nextcloud top header.\n\n```\n<template>\n\t<div id=\"nextcloud-header\">\n\t\t<NcHeaderMenu id=\"search\"\n\t\t\taria-label=\"Search\">\n\t\t\t<template #trigger>\n\t\t\t\t<Magnify />\n\t\t\t</template>\n\t\t\t<div>\n\t\t\t\t<NcTextField label=\"Search for files, comments, contacts…\"\n\t\t\t\t\tstyle=\"padding-inline: 8px;\"\n\t\t\t\t\ttype=\"search\"\n\t\t\t\t\tv-model=\"query\" />\n\t\t\t\t<NcEmptyContent\n\t\t\t\t\tname=\"Search\"\n\t\t\t\t\t:description=\"query ? `No results for '${query}'` : 'Start typing to search'\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Magnify />\n\t\t\t\t\t</template>\n\t\t\t\t</NcEmptyContent>\n\t\t\t</div>\n\t\t</NcHeaderMenu>\n\t</div>\n</template>\n<script>\nimport Magnify from 'vue-material-design-icons/Magnify'\n\nexport default {\n\tcomponents: {\n\t\tMagnify,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tquery: '',\n\t\t}\n\t},\n}\n</script>\n<style>\n#nextcloud-header {\n\tdisplay: flex;\n\tjustify-content: right;\n\tbackground-color: var(--color-primary);\n\theight: var(--header-height, 50px);\n\tpadding-inline-end: 12px;\n}\n</style>\n```\n</docs>\n\n<template>\n\t<component :is=\"wrapperTag\"\n\t\t:id=\"id\"\n\t\tref=\"headerMenu\"\n\t\t:aria-labelledby=\"isNav ? triggerId : null\"\n\t\t:class=\"{ 'header-menu--opened': isOpened }\"\n\t\tclass=\"header-menu\"\n\t\t@focusout=\"onFocusOut\">\n\t\t<!-- Trigger -->\n\t\t<NcButton :id=\"isNav ? triggerId : null\"\n\t\t\tref=\"triggerButton\"\n\t\t\tclass=\"header-menu__trigger\"\n\t\t\t:aria-controls=\"`header-menu-${id}`\"\n\t\t\t:aria-expanded=\"isOpened.toString()\"\n\t\t\tsize=\"large\"\n\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t@click.prevent=\"toggleMenu\">\n\t\t\t<template #icon>\n\t\t\t\t<slot name=\"trigger\" />\n\t\t\t</template>\n\t\t</NcButton>\n\n\t\t<span v-if=\"description\"\n\t\t\t:id=\"descriptionId\"\n\t\t\tclass=\"header-menu__description hidden-visually\">\n\t\t\t{{ description }}\n\t\t</span>\n\n\t\t<!-- Visual triangle -->\n\t\t<div v-show=\"isOpened\" class=\"header-menu__caret\" />\n\n\t\t<!-- Menu opened content -->\n\t\t<div v-show=\"isOpened\"\n\t\t\t:id=\"`header-menu-${id}`\"\n\t\t\tclass=\"header-menu__wrapper\">\n\t\t\t<div ref=\"contentContainer\" class=\"header-menu__content\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\t\t</div>\n\t</component>\n</template>\n\n<script setup lang=\"ts\">\nimport type { FocusTrap } from 'focus-trap'\n\nimport { onClickOutside } from '@vueuse/core'\nimport { createFocusTrap } from 'focus-trap'\nimport { computed, nextTick, ref, useTemplateRef, watch, type Slot } from 'vue'\nimport { useHotKey } from '../../composables/index.js'\nimport { getTrapStack } from '../../utils/focusTrap.js'\nimport { createElementId } from '../../utils/createElementId.ts'\n\nimport NcButton from '../NcButton/index.ts'\n\nconst {\n\texcludeClickOutsideSelectors = [],\n\topen = false,\n\tisNav = false,\n} = defineProps<{\n\t/**\n\t * Unique id for this menu\n\t */\n\tid: string\n\n\t/**\n\t * aria-label attribute of the menu open button\n\t */\n\tariaLabel?: string\n\n\t/**\n\t * Current menu open state\n\t */\n\topen?: boolean\n\n\t/**\n\t * Pass `true` if the header menu is used for website navigation\n\t *\n\t * The wrapper tag will be set to `nav` and its `aria-labelledby`\n\t * will be associated with the menu open button\n\t */\n\tisNav?: boolean\n\n\t/**\n\t * Additional visually hidden description text for the menu\n\t * open button\n\t */\n\tdescription?: string\n\n\t/**\n\t * A query-selector or an array of query-selectors\n\t * to be ignored when clicking outside an element\n\t */\n\texcludeClickOutsideSelectors?: string | string[]\n}>()\n\nconst emit = defineEmits<{\n\t/** Emitted when the menu is fully closed (animation done) */\n\tclosed: []\n\n\t/** Emitted when the menu is fully opened (animation done) */\n\topened: []\n\n\t/** Updated open state */\n\t'update:open': [v: boolean]\n}>()\n\ndefineSlots<{\n\t/** The menu content */\n\tdefault: Slot\n\t/** Icon trigger slot. Make sure the svg path is at least 16px. Usually mdi icon works at 20px */\n\ttrigger: Slot\n}>()\n\n/** Id of the menu description */\nconst descriptionId = createElementId()\n/** Id of the trigger button */\nconst triggerId = createElementId()\n/** The active focus trap (if any) */\nconst focusTrap = ref<FocusTrap>()\n/** Is the menu currently opened */\nconst isOpened = ref(open)\n/** HTML tag to use for the header menu */\nconst wrapperTag = computed(() => isNav ? 'nav' : 'div')\n\n/** The menu content container element */\nconst contentContainer = useTemplateRef('contentContainer')\n/** The overall header menu wrapping element (<nav> or <div>) */\nconst headerMenu = useTemplateRef<HTMLElement>('headerMenu')\n/** The menu trigger button */\nconst triggerButton = useTemplateRef('triggerButton')\n\n// Handle click outside of the menu -> should close the menu\nconst ignore = computed(() => Array.isArray(excludeClickOutsideSelectors)\n\t? excludeClickOutsideSelectors\n\t: excludeClickOutsideSelectors.split(' '),\n)\nonClickOutside(headerMenu, () => setMenuState(false), { ignore })\n\n// Pressing escape should close the menu\nuseHotKey('Escape', () => setMenuState(false), { prevent: true })\n\n// Watch the open prop to adjust the internal opened state\nwatch(() => open, (state: boolean) => setMenuState(state))\n\n/**\n * Toggle the current menu open state\n */\nfunction toggleMenu() {\n\tsetMenuState(!isOpened.value)\n}\n\n/**\n * Set the menu opened state\n * @param state The opened state to set\n */\nasync function setMenuState(state: boolean) {\n\tif (state === isOpened.value) {\n\t\treturn\n\t}\n\n\tisOpened.value = state\n\temit('update:open', state)\n\n\t// wait one tick to make sure the rendering finished\n\tawait nextTick()\n\t// either add or clear the focus trap\n\tawait (state ? addFocusTrap() : clearFocusTrap())\n\n\t// Emit signal to mark finished toggling\n\t// @ts-expect-error This seems to be broken in Vue's typescript macro compiler...\n\temit(state ? 'opened' : 'closed')\n}\n\n/**\n * When this is role navigation, then we cannot apply a focus trap.\n * In this case we close the menu on focus-out.\n *\n * @param event the focus event\n */\nfunction onFocusOut(event: FocusEvent) {\n\t// Is not a navigation\n\tif (!isNav) {\n\t\treturn\n\t}\n\n\t// Event target is not a node\n\tif (!(event.relatedTarget instanceof Node)) {\n\t\treturn\n\t}\n\n\tif (headerMenu.value?.contains(event.relatedTarget)) {\n\t\tsetMenuState(false)\n\t}\n}\n\n/**\n * Add focus trap for accessibility.\n * Shall only be used when all children are mounted\n * and available in the DOM. We use $nextTick for that.\n */\nasync function addFocusTrap() {\n\t// We cannot add the focus trap on navigation roles\n\t// also skip if already set\n\tif (isNav || focusTrap.value) {\n\t\treturn\n\t}\n\n\t// Init focus trap\n\tfocusTrap.value = createFocusTrap(contentContainer.value!, {\n\t\tallowOutsideClick: true,\n\t\ttrapStack: getTrapStack(),\n\t\tfallbackFocus: triggerButton.value?.$el,\n\t})\n\tfocusTrap.value.activate()\n}\n\n/**\n * Deactivate and clear the focus trap\n */\nfunction clearFocusTrap() {\n\tfocusTrap.value?.deactivate()\n\tfocusTrap.value = undefined\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@use './header-menu__trigger.scss';\n\n// content inner and outer margin\n// Also used for menu top-right positioning\n$externalMargin: 8px;\n\n.header-menu {\n\t&__wrapper {\n\t\tposition: fixed;\n\t\tz-index: 2000;\n\t\ttop: var(--header-height);\n\t\tinset-inline-end: 0;\n\t\tbox-sizing: border-box;\n\t\tmargin: 0 $externalMargin;\n\t\tborder-radius: 0 0 var(--border-radius) var(--border-radius);\n\t\tborder-radius: var(--border-radius-large);\n\t\tbackground-color: var(--color-main-background);\n\n\t\tfilter: drop-shadow(0 1px 5px var(--color-box-shadow));\n\t}\n\n\t&__carret {\n\t\tposition: absolute;\n\t\tz-index: 2001; // Because __wrapper is 2000.\n\t\tbottom: 0;\n\t\tinset-inline-start: calc(50% - 10px);\n\t\twidth: 0;\n\t\theight: 0;\n\t\tcontent: ' ';\n\t\tpointer-events: none;\n\t\tborder: 10px solid transparent;\n\t\tborder-bottom-color: var(--color-main-background);\n\t}\n\n\t&__content {\n\t\toverflow: auto;\n\t\twidth: 350px;\n\t\tmax-width: calc(100vw - 2 * $externalMargin);\n\t\tmin-height: calc(var(--default-clickable-area) * 1.5);\n\t\tmax-height: calc(100vh - var(--header-height) * 2);\n\t\t:deep(.empty-content) {\n\t\t\tmargin: 12vh 10px;\n\t\t}\n\t}\n}\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAyJA,UAAM,OAAO;AAmBb,UAAM,gBAAgB,gBAAgB;AAEtC,UAAM,YAAY,gBAAgB;AAElC,UAAM,YAAY,IAAe;AAE3B,UAAA,WAAW,IAAI,QAAI,IAAA;AAEzB,UAAM,aAAa,SAAS,MAAM,QAAK,QAAG,QAAQ,KAAK;AAGjD,UAAA,mBAAmB,eAAe,kBAAkB;AAEpD,UAAA,aAAa,eAA4B,YAAY;AAErD,UAAA,gBAAgB,eAAe,eAAe;AAGpD,UAAM,SAAS;AAAA,MAAS,MAAM,MAAM,QAAQ,QAA4B,4BAAA,IACrE,QAAA,+BACA,QAA4B,6BAAC,MAAM,GAAG;AAAA,IACzC;AACA,mBAAe,YAAY,MAAM,aAAa,KAAK,GAAG,EAAE,QAAQ;AAGtD,cAAA,UAAU,MAAM,aAAa,KAAK,GAAG,EAAE,SAAS,MAAM;AAGhE,UAAM,MAAM,QAAA,MAAM,CAAC,UAAmB,aAAa,KAAK,CAAC;AAKzD,aAAS,aAAa;AACR,mBAAA,CAAC,SAAS,KAAK;AAAA,IAAA;AAO7B,mBAAe,aAAa,OAAgB;AACvC,UAAA,UAAU,SAAS,OAAO;AAC7B;AAAA,MAAA;AAGD,eAAS,QAAQ;AACjB,WAAK,eAAe,KAAK;AAGzB,YAAM,SAAS;AAER,aAAA,QAAQ,iBAAiB;AAI3B,WAAA,QAAQ,WAAW,QAAQ;AAAA,IAAA;AASjC,aAAS,WAAW,OAAmB;AAElC,UAAA,CAAC,QAAA,OAAO;AACX;AAAA,MAAA;AAIG,UAAA,EAAE,MAAM,yBAAyB,OAAO;AAC3C;AAAA,MAAA;AAGD,UAAI,WAAW,OAAO,SAAS,MAAM,aAAa,GAAG;AACpD,qBAAa,KAAK;AAAA,MAAA;AAAA,IACnB;AAQD,mBAAe,eAAe;AAGzB,UAAA,QAAA,SAAS,UAAU,OAAO;AAC7B;AAAA,MAAA;AAIS,gBAAA,QAAQ,gBAAgB,iBAAiB,OAAQ;AAAA,QAC1D,mBAAmB;AAAA,QACnB,WAAW,aAAa;AAAA,QACxB,eAAe,cAAc,OAAO;AAAA,MAAA,CACpC;AACD,gBAAU,MAAM,SAAS;AAAA,IAAA;AAM1B,aAAS,iBAAiB;AACzB,gBAAU,OAAO,WAAW;AAC5B,gBAAU,QAAQ;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import '../assets/NcIconSvgWrapper-cYxhjYue.css';
|
|
2
|
+
import { defineComponent, useCssVars, computed, warn, createElementBlock, openBlock, normalizeClass, createElementVNode } from "vue";
|
|
3
|
+
import DOMPurify from "dompurify";
|
|
4
|
+
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
|
|
5
|
+
const _hoisted_1 = ["aria-hidden", "aria-label"];
|
|
6
|
+
const _hoisted_2 = {
|
|
7
|
+
key: 0,
|
|
8
|
+
viewBox: "0 0 24 24",
|
|
9
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
10
|
+
};
|
|
11
|
+
const _hoisted_3 = ["d"];
|
|
12
|
+
const _hoisted_4 = ["innerHTML"];
|
|
13
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
14
|
+
__name: "NcIconSvgWrapper",
|
|
15
|
+
props: {
|
|
16
|
+
directional: { type: Boolean },
|
|
17
|
+
inline: { type: Boolean },
|
|
18
|
+
svg: { default: "" },
|
|
19
|
+
name: { default: void 0 },
|
|
20
|
+
path: { default: "" },
|
|
21
|
+
size: { default: 20 }
|
|
22
|
+
},
|
|
23
|
+
setup(__props) {
|
|
24
|
+
useCssVars((_ctx) => ({
|
|
25
|
+
"4f0d35a8": iconSize.value
|
|
26
|
+
}));
|
|
27
|
+
const props = __props;
|
|
28
|
+
const iconSize = computed(() => typeof props.size === "number" ? `${props.size}px` : props.size);
|
|
29
|
+
const cleanSvg = computed(() => {
|
|
30
|
+
if (!props.svg || props.path) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
const svg = DOMPurify.sanitize(props.svg);
|
|
34
|
+
const svgDocument = new DOMParser().parseFromString(svg, "image/svg+xml");
|
|
35
|
+
if (svgDocument.querySelector("parsererror")) {
|
|
36
|
+
warn("SVG is not valid");
|
|
37
|
+
return "";
|
|
38
|
+
}
|
|
39
|
+
if (svgDocument.documentElement.id) {
|
|
40
|
+
svgDocument.documentElement.removeAttribute("id");
|
|
41
|
+
}
|
|
42
|
+
return svgDocument.documentElement.outerHTML;
|
|
43
|
+
});
|
|
44
|
+
return (_ctx, _cache) => {
|
|
45
|
+
return openBlock(), createElementBlock("span", {
|
|
46
|
+
"aria-hidden": _ctx.name ? void 0 : "true",
|
|
47
|
+
"aria-label": _ctx.name || void 0,
|
|
48
|
+
class: normalizeClass(["icon-vue", {
|
|
49
|
+
"icon-vue--directional": _ctx.directional,
|
|
50
|
+
"icon-vue--inline": _ctx.inline
|
|
51
|
+
}]),
|
|
52
|
+
role: "img"
|
|
53
|
+
}, [
|
|
54
|
+
!cleanSvg.value ? (openBlock(), createElementBlock("svg", _hoisted_2, [
|
|
55
|
+
createElementVNode("path", { d: _ctx.path }, null, 8, _hoisted_3)
|
|
56
|
+
])) : (openBlock(), createElementBlock("span", {
|
|
57
|
+
key: 1,
|
|
58
|
+
innerHTML: cleanSvg.value
|
|
59
|
+
}, null, 8, _hoisted_4))
|
|
60
|
+
], 10, _hoisted_1);
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
const NcIconSvgWrapper = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0aa5a569"]]);
|
|
65
|
+
export {
|
|
66
|
+
NcIconSvgWrapper as N
|
|
67
|
+
};
|
|
68
|
+
//# sourceMappingURL=NcIconSvgWrapper-BOiCKv0b.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NcIconSvgWrapper-BOiCKv0b.mjs","sources":["../../src/components/NcIconSvgWrapper/NcIconSvgWrapper.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n### Description\n\nRender raw SVG string icons.\n\n### Usage within `icon`-slot\n\n```vue\n<template>\n\t<div class=\"grid\">\n\t\t<NcButton aria-label=\"Close\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :svg=\"closeSvg\" name=\"Close\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcButton aria-label=\"Settings\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :svg=\"cogSvg\" name=\"Cog\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcButton aria-label=\"Add\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :svg=\"plusSvg\" name=\"Plus\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcButton aria-label=\"Send\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :path=\"mdiSend\" name=\"Send\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t\t<NcButton aria-label=\"Star\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :path=\"mdiStar\" name=\"Star\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t</div>\n</template>\n\n<script>\nimport closeSvg from '@mdi/svg/svg/close.svg?raw'\nimport cogSvg from '@mdi/svg/svg/cog.svg?raw'\nimport plusSvg from '@mdi/svg/svg/plus.svg?raw'\nimport { mdiSend } from '@mdi/js'\nimport { mdiStar } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\t// This icons are static data, so you do not need to put them into `data` which will make them reactive\n\t\treturn {\n\t\t\tcloseSvg,\n\t\t\tcogSvg,\n\t\t\tplusSvg,\n\t\t\tmdiSend,\n\t\t\tmdiStar,\n\t\t}\n\t},\n}\n</script>\n\n<style>\n.grid {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(5, max-content);\n\tgap: 10px;\n}\n</style>\n```\n\n### Inline usage inside text\n\n```vue\n<template>\n\t<p>\n\t\tThis is my <NcIconSvgWrapper inline :path=\"mdiStar\" /> Favorite\n\t</p>\n</template>\n<script>\nimport { mdiStar } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tmdiStar,\n\t\t}\n\t},\n}\n</script>\n```\n\n### Directional usage\n\nThe `directional` property allows to enable a language direction aware icon.\nThis icon component can be used in places where an language direction aware icon should be used,\nfor example if an arrow pointing to the left it used it often points in the wrong direction for right-to-left languages.\nIn this cases this icon can be used which will always point into the logical \"start\" direction.\n\n```vue\n<template>\n\t<div class=\"wrapper\">\n\t\t<NcButton @click=\"isRtl = !isRtl\">Toggle RTL</NcButton>\n\t\t<div class=\"directional\" :dir=\"isRtl ? 'rtl' : 'ltr'\">\n\t\t\t<NcButton alignment=\"start\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper directional :path=\"mdiChevronLeft\" />\n\t\t\t\t</template>\n\t\t\t\tPrevious\n\t\t\t</NcButton>\n\t\t\t<NcButton alignment=\"end-reverse\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper directional :path=\"mdiChevronRight\" />\n\t\t\t\t</template>\n\t\t\t\tNext\n\t\t\t</NcButton>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport { mdiChevronLeft, mdiChevronRight } from '@mdi/js'\n\nexport default {\n\tsetup() {\n\t\treturn {\n\t\t\tmdiChevronLeft,\n\t\t\tmdiChevronRight,\n\t\t}\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tisRtl: false\n\t\t}\n\t},\n}\n</script>\n<style scoped>\n.wrapper {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tmax-width: 300px;\n}\n\n.directional {\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.directional * {\n\tflex: 1 50%;\n}\n</style>\n```\n</docs>\n\n<script setup lang=\"ts\">\nimport { computed, warn } from 'vue'\nimport DOMPurify from 'dompurify'\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * Make the icon directional, meaning it is langauge direction aware.\n\t * If the icon is placed in a right-to-left context it will be mirrored vertically.\n\t */\n\tdirectional?: boolean\n\n\t/**\n\t * Set if the icon should be used as inline content e.g. within text.\n\t * By default the icon is made a block element for use inside `icon`-slots.\n\t */\n\tinline?: boolean\n\n\t/**\n\t * Raw SVG string to render\n\t */\n\tsvg?: string\n\n\t/**\n\t * Label of the icon, used in aria-label\n\t */\n\tname?: string\n\n\t/**\n\t * Raw SVG path to render. Takes precedence over the SVG string in the `svg` prop.\n\t */\n\tpath?: string\n\n\t/**\n\t * Size of the icon to show. Only use if not using within an icon slot.\n\t * Defaults to 20px which is the Nextcloud icon size for all icon slots.\n\t */\n\tsize?: number | 'auto'\n}>(), {\n\tname: undefined,\n\tpath: '',\n\tsize: 20,\n\tsvg: '',\n})\n\n/**\n * Icon size used in CSS\n */\nconst iconSize = computed(() => typeof props.size === 'number' ? `${props.size}px` : props.size)\n\n/**\n * The sanitized SVG or undefined if path shall be used\n */\nconst cleanSvg = computed(() => {\n\tif (!props.svg || props.path) {\n\t\treturn\n\t}\n\n\tconst svg = DOMPurify.sanitize(props.svg)\n\n\tconst svgDocument = new DOMParser().parseFromString(svg, 'image/svg+xml')\n\n\tif (svgDocument.querySelector('parsererror')) {\n\t\twarn('SVG is not valid')\n\t\treturn ''\n\t}\n\n\tif (svgDocument.documentElement.id) {\n\t\tsvgDocument.documentElement.removeAttribute('id')\n\t}\n\n\treturn svgDocument.documentElement.outerHTML\n})\n</script>\n\n<template>\n\t<span :aria-hidden=\"name ? undefined : 'true'\"\n\t\t:aria-label=\"name || undefined\"\n\t\tclass=\"icon-vue\"\n\t\t:class=\"{\n\t\t\t'icon-vue--directional': directional,\n\t\t\t'icon-vue--inline': inline,\n\t\t}\"\n\t\trole=\"img\">\n\t\t<svg v-if=\"!cleanSvg\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t<path :d=\"path\" />\n\t\t</svg>\n\t\t<!-- eslint-disable-next-line vue/no-v-text-v-html-on-component,vue/no-v-html -->\n\t\t<span v-else v-html=\"cleanSvg\" />\n\t</span>\n</template>\n\n<style lang=\"scss\" scoped>\n.icon-vue {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tmin-width: var(--default-clickable-area);\n\tmin-height: var(--default-clickable-area);\n\topacity: 1;\n\n\t&--inline {\n\t\tdisplay: inline-flex;\n\t\tmin-width: fit-content;\n\t\tmin-height: fit-content;\n\t\tvertical-align: text-bottom;\n\t}\n\n\t// Icon svg wrapper\n\tspan {\n\t\tline-height: 0;\n\t}\n\n\t&:deep(svg) {\n\t\tfill: currentColor;\n\t\twidth: v-bind('iconSize');\n\t\theight: v-bind('iconSize');\n\t\tmax-width: v-bind('iconSize');\n\t\tmax-height: v-bind('iconSize');\n\t}\n\n\t&--directional:deep(svg:dir(rtl)) {\n\t\ttransform: scaleX(-1);\n\t}\n}\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAoKA,UAAM,QAAQ;AA2Cd,UAAM,WAAW,SAAS,MAAM,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAKzF,UAAA,WAAW,SAAS,MAAM;AAC/B,UAAI,CAAC,MAAM,OAAO,MAAM,MAAM;AAC7B;AAAA,MAAA;AAGD,YAAM,MAAM,UAAU,SAAS,MAAM,GAAG;AAExC,YAAM,cAAc,IAAI,UAAA,EAAY,gBAAgB,KAAK,eAAe;AAEpE,UAAA,YAAY,cAAc,aAAa,GAAG;AAC7C,aAAK,kBAAkB;AAChB,eAAA;AAAA,MAAA;AAGJ,UAAA,YAAY,gBAAgB,IAAI;AACvB,oBAAA,gBAAgB,gBAAgB,IAAI;AAAA,MAAA;AAGjD,aAAO,YAAY,gBAAgB;AAAA,IAAA,CACnC;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import '../assets/NcInputConfirmCancel-9YyvRYjw.css';
|
|
2
|
-
import { r as register, l as t13, a as t } from "./_l10n-
|
|
3
|
-
import {
|
|
2
|
+
import { r as register, l as t13, a as t } from "./_l10n-Bg-fZ9R0.mjs";
|
|
3
|
+
import { I as IconArrowRight } from "./ArrowRight-DRKHUZMH.mjs";
|
|
4
4
|
import { I as IconClose } from "./Close-D6ngJ4t9.mjs";
|
|
5
5
|
import { N as NcButton } from "./NcButton-Byg8-ta1.mjs";
|
|
6
6
|
import { resolveComponent, createElementBlock, openBlock, createElementVNode, withModifiers, withKeys, withDirectives, createVNode, vModelText, withCtx } from "vue";
|
|
@@ -9,7 +9,7 @@ register(t13);
|
|
|
9
9
|
const _sfc_main = {
|
|
10
10
|
name: "NcInputConfirmCancel",
|
|
11
11
|
components: {
|
|
12
|
-
IconArrowRight
|
|
12
|
+
IconArrowRight,
|
|
13
13
|
IconClose,
|
|
14
14
|
NcButton
|
|
15
15
|
},
|
|
@@ -114,4 +114,4 @@ const NcInputConfirmCancel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render",
|
|
|
114
114
|
export {
|
|
115
115
|
NcInputConfirmCancel as N
|
|
116
116
|
};
|
|
117
|
-
//# sourceMappingURL=NcInputConfirmCancel-
|
|
117
|
+
//# sourceMappingURL=NcInputConfirmCancel-C1K1gyQA.mjs.map
|
package/dist/chunks/{NcInputConfirmCancel-DeWD9uc6.mjs.map → NcInputConfirmCancel-C1K1gyQA.mjs.map}
RENAMED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NcInputConfirmCancel-
|
|
1
|
+
{"version":3,"file":"NcInputConfirmCancel-C1K1gyQA.mjs","sources":["../../src/components/NcAppNavigationItem/NcInputConfirmCancel.vue"],"sourcesContent":["<!--\n - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n# Usage\n\n```\n<NcInputConfirmCancel @confirm=\"alert('confirm')\" @cancel=\"alert('cancel')\" />\n```\n</docs>\n<template>\n\t<div class=\"app-navigation-input-confirm\">\n\t\t<form @submit.prevent=\"confirm\"\n\t\t\t@keydown.esc.exact.stop.prevent=\"cancel\"\n\t\t\t@click.stop.prevent>\n\t\t\t<input ref=\"input\"\n\t\t\t\tv-model=\"valueModel\"\n\t\t\t\ttype=\"text\"\n\t\t\t\tclass=\"app-navigation-input-confirm__input\"\n\t\t\t\t:placeholder=\"placeholder\">\n\n\t\t\t<NcButton :aria-label=\"labelConfirm\"\n\t\t\t\ttype=\"submit\"\n\t\t\t\tvariant=\"primary\"\n\t\t\t\t@click.stop.prevent=\"confirm\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconArrowRight :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcButton>\n\n\t\t\t<NcButton :aria-label=\"labelCancel\"\n\t\t\t\ttype=\"reset\"\n\t\t\t\t:variant=\"primary ? 'primary' : 'tertiary'\"\n\t\t\t\t@click.stop.prevent=\"cancel\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconClose :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t</NcButton>\n\t\t</form>\n\t</div>\n</template>\n<script>\nimport { t } from '../../l10n.js'\n\nimport IconArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport IconClose from 'vue-material-design-icons/Close.vue'\nimport NcButton from '../NcButton/index.js'\n\nexport default {\n\tname: 'NcInputConfirmCancel',\n\n\tcomponents: {\n\t\tIconArrowRight,\n\t\tIconClose,\n\t\tNcButton,\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * If this element is used on a primary element set to true for primary styling.\n\t\t */\n\t\tprimary: {\n\t\t\tdefault: false,\n\t\t\ttype: Boolean,\n\t\t},\n\n\t\tplaceholder: {\n\t\t\tdefault: '',\n\t\t\ttype: String,\n\t\t},\n\n\t\tmodelValue: {\n\t\t\tdefault: '',\n\t\t\ttype: String,\n\t\t},\n\t},\n\n\temits: [\n\t\t'cancel',\n\t\t'confirm',\n\t\t'update:modelValue',\n\t],\n\n\tdata() {\n\t\treturn {\n\t\t\tlabelConfirm: t('Confirm changes'),\n\t\t\tlabelCancel: t('Cancel changes'),\n\t\t}\n\t},\n\n\tcomputed: {\n\t\tvalueModel: {\n\t\t\tget() { return this.modelValue },\n\t\t\tset(newValue) {\n\t\t\t\tthis.$emit('update:modelValue', newValue)\n\t\t\t},\n\t\t},\n\t},\n\n\tmethods: {\n\t\tconfirm() {\n\t\t\tthis.$emit('confirm')\n\t\t},\n\t\tcancel() {\n\t\t\tthis.$emit('cancel')\n\t\t},\n\t\tfocusInput() {\n\t\t\tthis.$refs.input.focus()\n\t\t},\n\t},\n}\n</script>\n\n<style scoped lang=\"scss\">\n$input-height: 34px;\n$input-padding: 7px;\n$input-margin: 5px;\n\n.app-navigation-input-confirm {\n\tflex: 1 0 100%;\n\twidth: 100%;\n\n\tform {\n\t\tdisplay: flex;\n\t}\n\n\t&__input {\n\t\theight: $input-height;\n\t\tflex: 1 1 100%;\n\t\tfont-size: 100% !important;\n\t\tmargin: $input-margin !important;\n\t\tmargin-inline-start: -1px - $input-padding !important;\n\t\tpadding: $input-padding !important;\n\n\t\t&:active,\n\t\t&:focus,\n\t\t&:hover {\n\t\t\toutline: none;\n\t\t\tbackground-color: var(--color-main-background);\n\t\t\tcolor: var(--color-main-text);\n\t\t\tborder-color: var(--color-primary-element);\n\t\t}\n\t}\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_createElementVNode","_withModifiers","_withKeys","_createVNode"],"mappings":";;;;;;;AAkDA,MAAK,YAAU;AAAA,EACd,MAAM;AAAA,EAEN,YAAY;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA,IAIN,SAAS;AAAA,MACR,SAAS;AAAA,MACT,MAAM;AAAA,IACN;AAAA,IAED,aAAa;AAAA,MACZ,SAAS;AAAA,MACT,MAAM;AAAA,IACN;AAAA,IAED,YAAY;AAAA,MACX,SAAS;AAAA,MACT,MAAM;AAAA,IACN;AAAA,EACD;AAAA,EAED,OAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,EACA;AAAA,EAED,OAAO;AACN,WAAO;AAAA,MACN,cAAc,EAAE,iBAAiB;AAAA,MACjC,aAAa,EAAE,gBAAgB;AAAA,IAChC;AAAA,EACA;AAAA,EAED,UAAU;AAAA,IACT,YAAY;AAAA,MACX,MAAM;AAAE,eAAO,KAAK;AAAA,MAAY;AAAA,MAChC,IAAI,UAAU;AACb,aAAK,MAAM,qBAAqB,QAAQ;AAAA,MACxC;AAAA,IACD;AAAA,EACD;AAAA,EAED,SAAS;AAAA,IACR,UAAU;AACT,WAAK,MAAM,SAAS;AAAA,IACpB;AAAA,IACD,SAAS;AACR,WAAK,MAAM,QAAQ;AAAA,IACnB;AAAA,IACD,aAAa;AACZ,WAAK,MAAM,MAAM,MAAK;AAAA,IACtB;AAAA,EACD;AACF;AAnGM,MAAA,aAAA,EAAA,OAAM,+BAA8B;AAb1C,MAAA,aAAA,CAAA,aAAA;;;;;AAaC,SAAAA,UAAA,GAAAC,mBA4BM,OA5BN,YA4BM;AAAA,IA3BLC,mBA0BO,QAAA;AAAA,MA1BA,UAAM,OAAA,CAAA,MAAA,OAAA,CAAA,IAdfC,2BAcyB,SAAO,WAAA,SAAA,QAAA,GAAA,IAAA,GAAA,CAAA,SAAA,CAAA;AAAA,MAC5B,WAAO,OAAA,CAAA,MAAA,OAAA,CAAA,IAfXC,SAAAD,cAAA,IAAA,SAeoC,SAAM,UAAA,SAAA,OAAA,GAAA,IAAA,GAAA,CAAA,SAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,CAAA;AAAA,MACtC,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAhBTA,cAgBG,MAAmB;AAAA,MAAA,GAAA,CAAA,QAAA,SAAA,CAAA;AAAA;qBACnBD,mBAI4B,SAAA;AAAA,QAJrB,KAAI;AAAA,QAjBd,uBAAA,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,YAkBa,SAAU,aAAA;AAAA,QACnB,MAAK;AAAA,QACL,OAAM;AAAA,QACL,aAAa,OAAW;AAAA,MArB7B,GAAA,MAAA,GAAA,UAAA,GAAA;AAAA,qBAkBa,SAAU,UAAA;AAAA;MAKpBG,YAOW,qBAAA;AAAA,QAPA,cAAY,MAAY;AAAA,QAClC,MAAK;AAAA,QACL,SAAQ;AAAA,QACP,SA1BLF,cA0ByB,SAAO,SAAA,CAAA,QAAA,SAAA,CAAA;AAAA;QACjB,cACV,MAA6B;AAAA,UAA7BE,YAA6B,2BAAA,EAAZ,MAAM,GAAE,CAAA;AAAA;QA5B9B,GAAA;AAAA;MAgCGA,YAOW,qBAAA;AAAA,QAPA,cAAY,MAAW;AAAA,QACjC,MAAK;AAAA,QACJ,SAAS,OAAO,UAAA,YAAA;AAAA,QAChB,SAnCLF,cAmCyB,SAAM,QAAA,CAAA,QAAA,SAAA,CAAA;AAAA;QAChB,cACV,MAAwB;AAAA,UAAxBE,YAAwB,sBAAA,EAAZ,MAAM,GAAE,CAAA;AAAA;QArCzB,GAAA;AAAA;;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import '../assets/NcListItem-
|
|
2
|
-
import { N as NcActions } from "./NcActions-
|
|
3
|
-
import { N as NcCounterBubble } from "./NcCounterBubble-
|
|
4
|
-
import _sfc_main$1 from "
|
|
1
|
+
import '../assets/NcListItem-9eCenovm.css';
|
|
2
|
+
import { N as NcActions } from "./NcActions-DS88I6qk.mjs";
|
|
3
|
+
import { N as NcCounterBubble } from "./NcCounterBubble-PBdqn9Nf.mjs";
|
|
4
|
+
import { _ as _sfc_main$1 } from "./NcVNodes.vue_vue_type_script_lang-BqUHinRZ.mjs";
|
|
5
5
|
import { resolveComponent, createBlock, openBlock, resolveDynamicComponent, normalizeProps, guardReactiveProps, withCtx, createElementVNode, mergeProps, normalizeClass, createElementBlock, createCommentVNode, withDirectives, withKeys, renderSlot, createTextVNode, toDisplayString, vShow, createVNode, createSlots } from "vue";
|
|
6
6
|
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
|
|
7
7
|
const _sfc_main = {
|
|
@@ -375,8 +375,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
375
375
|
_: 3
|
|
376
376
|
}, 16);
|
|
377
377
|
}
|
|
378
|
-
const NcListItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-
|
|
378
|
+
const NcListItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-66e1fcf5"]]);
|
|
379
379
|
export {
|
|
380
380
|
NcListItem as N
|
|
381
381
|
};
|
|
382
|
-
//# sourceMappingURL=NcListItem-
|
|
382
|
+
//# sourceMappingURL=NcListItem-C2LlJgjL.mjs.map
|