npm - maz-ui - Versions diffs - 4.0.0-alpha.3 → 4.0.0-alpha.5 - Mend

maz-ui 4.0.0-alpha.3 → 4.0.0-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (802) hide show

package/dist/components/MazTabsBar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MazTabsBar.mjs","sources":["../../src/components/MazTabsBar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazBadgeColor, MazBadgeRoundedSize } from '@components/MazBadge.vue'\nimport type { MazTabsProvide } from '@components/MazTabs.vue'\nimport { injectStrict } from '@helpers/injectStrict'\nimport { sleep } from '@helpers/sleep'\n\nimport {\n type ComponentPublicInstance,\n computed,\n defineAsyncComponent,\n onBeforeMount,\n onMounted,\n ref,\n type StyleValue,\n watch,\n} from 'vue'\n\nconst props = withDefaults(defineProps<MazTabsBarProps>(), {\n queryParam: 'tab',\n autoScroll: true,\n})\n\nexport interface MazTabsBarProps {\n /** The items to display in the tabs bar /\n items: MazTabsBarItem[]\n /* Will add a query param to the url to keep the selected tab on page refresh /\n persistent?: boolean\n /\n The name of the query param to add to the url\n * @default tab\n /\n queryParam?: string\n /* Will make the tabs bar full width /\n block?: boolean\n /* Will remove the elevation /\n noElevation?: boolean\n /\n Will add a scroll on the tabs bar to show selected element\n * @default true\n */\n autoScroll?: boolean\n}\n\nexport type MazTabsBarItem =\n \| {\n label: string\n disabled?: boolean\n badge?: {\n content: string \| number \| boolean\n color?: MazBadgeColor\n pastel?: boolean\n outline?: boolean\n size?: string\n roundedSize?: MazBadgeRoundedSize\n }\n }\n \| string\n\nconst MazBadge = defineAsyncComponent(() => import('@components/MazBadge.vue'))\n\nconst { currentTab, updateCurrentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nfunction selectTab(tabIndex: number) {\n updateCurrentTab(tabIndex + 1)\n if (props.persistent) {\n addOrUpdateQueryParamTab(tabIndex + 1)\n }\n}\n\nconst tabsBarRef = ref<HTMLDivElement>()\nconst itemRefs = ref<HTMLButtonElement[]>([])\n\nfunction isActiveTab(index: number) {\n return currentTab.value === index + 1\n}\n\nfunction addElementToItemRefs({\n mazBtn,\n index,\n}: {\n mazBtn?: ComponentPublicInstance<any>\n index: number\n}) {\n itemRefs.value[index] = mazBtn && '$el' in mazBtn ? mazBtn.$el : mazBtn\n}\n\nconst normalizedItems = computed(() =>\n props.items.map(item => ({\n label: typeof item === 'string' ? item : item.label,\n disabled: typeof item === 'string' ? false : item.disabled ?? false,\n badge: typeof item === 'string' ? undefined : item.badge,\n })),\n)\n\nconst tabsIndicatorState = ref<StyleValue>()\nconst tabsBarHasScrollAnimation = ref(false)\n\nasync function setIndicatorAndScroll() {\n if (!props.autoScroll) {\n return\n }\n\n await sleep(150)\n\n const tabsBar = tabsBarRef.value\n const activeTab = itemRefs.value[currentTab.value - 1]\n\n if (!tabsBar \|\| !activeTab) {\n return\n }\n\n const scrollOffset = 50\n\n if (\n activeTab.offsetLeft - scrollOffset < tabsBar.scrollLeft\n \|\| activeTab.offsetLeft + activeTab.offsetWidth > tabsBar.scrollLeft + tabsBar.clientWidth\n ) {\n const tabBarPaddingLeft = window.getComputedStyle(tabsBar, 'padding-left').paddingLeft\n const tabsBarPaddingOffset = Number(tabBarPaddingLeft.slice(0, -2))\n\n tabsBar.scrollTo({\n left: activeTab.offsetLeft - tabsBarPaddingOffset - scrollOffset,\n behavior: tabsBarHasScrollAnimation.value ? 'smooth' : 'instant',\n })\n }\n\n if (typeof currentTab.value !== 'number') {\n return\n }\n\n const indicatorWidth = activeTab?.offsetWidth ?? 0\n const indicatorHeight = activeTab?.offsetHeight ?? 0\n const translateXValue = activeTab?.offsetLeft ?? 0\n\n tabsIndicatorState.value = {\n transform: `translateX(${translateXValue}px)`,\n width: `${indicatorWidth}px`,\n height: `${indicatorHeight}px`,\n }\n\n tabsBarHasScrollAnimation.value = true\n}\n\nfunction getTabStyle(index: number, disabled: boolean): StyleValue {\n if (disabled) {\n return {}\n }\n return currentTab.value === index + 1\n ? `color: var(--maz-color-text)`\n : 'color: var(--maz-color-muted)'\n}\n\nonBeforeMount(() => {\n if (currentTab.value < 1 \|\| currentTab.value > normalizedItems.value.length) {\n console.error(\n `[maz-ui](MazTabsBar) The model-value should be between 1 and ${normalizedItems.value.length}`,\n )\n }\n})\n\nonMounted(() => {\n if (props.persistent \|\| currentTab.value) {\n setIndicatorAndScroll()\n }\n})\n\nwatch(\n () => [currentTab.value, normalizedItems.value],\n () => {\n setIndicatorAndScroll()\n },\n)\n\nfunction getQueryParamTab() {\n const urlActuelle = new URL(window.location.href)\n return Number(urlActuelle.searchParams.get(props.queryParam))\n}\n\nfunction addOrUpdateQueryParamTab(tab: number) {\n const urlActuelle = new URL(window.location.href)\n urlActuelle.searchParams.set(props.queryParam, String(tab))\n window.history.replaceState({}, document.title, urlActuelle.toString())\n}\n\nonMounted(() => {\n if (props.persistent) {\n updateCurrentTab(getQueryParamTab() \|\| currentTab.value \|\| 1)\n }\n})\n</script>\n\n<template>\n <div\n ref=\"tabsBarRef\"\n class=\"m-tabs-bar m-reset-css\"\n :class=\"{\n '--block': block,\n '--elevation': !noElevation,\n }\"\n >\n <div\n class=\"m-tabs-bar__indicator\"\n :class=\"{ '--animated': tabsBarHasScrollAnimation }\"\n :style=\"[tabsIndicatorState]\"\n />\n <template v-for=\"(item, index) in normalizedItems\" :key=\"index\">\n <button\n :ref=\"(mazBtn) => addElementToItemRefs({ mazBtn, index })\"\n :class=\"{ '--active': isActiveTab(index), '--disabled': item.disabled }\"\n class=\"m-tabs-bar__item\"\n :disabled=\"item.disabled\"\n :style=\"getTabStyle(index, item.disabled)\"\n @click=\"item.disabled ? undefined : selectTab(index)\"\n >\n <!--\n @slot item - Content of item to display in the tabs bar\n @binding {MazTabsBarItem[]} item - all data of the item\n @binding {boolean} active - `true` if the tab is active\n @binding {number} index - index of the item\n -->\n <slot name=\"item\" :item=\"item\" :active=\"isActiveTab(index)\" :index=\"index\">\n {{ item.label }}\n\n <MazBadge\n v-if=\"item.badge\"\n :color=\"item.badge.color\"\n :pastel=\"item.badge.pastel\"\n :outline=\"item.badge.outline\"\n :rounded-size=\"item.badge.roundedSize\"\n :size=\"item.badge.size ?? '0.7rem'\"\n class=\"m-tabs-bar__item__badge\"\n >\n <!--\n @slot badge-content - Content in the badge\n @binding {string \| number \| boolean} content - content of the badge provided in item\n -->\n <slot name=\"badge-content\" :content=\"item.badge.content\">\n {{ item.badge.content }}\n </slot>\n </MazBadge>\n </slot>\n </button>\n </template>\n </div>\n</template>\n\n<style lang=\"postcss\" scoped>\n.m-tabs-bar {\n @apply maz-relative maz-inline-flex maz-max-w-full maz-gap-1 maz-overflow-x-auto maz-rounded maz-p-2 maz-align-top maz-bg-color dark:maz-border dark:maz-border-color-light;\n\n &.--elevation {\n @apply maz-elevation dark:maz-shadow-none;\n }\n\n &.--block {\n @apply maz-w-full;\n }\n\n &__item {\n @apply maz-relative maz-flex maz-flex-none\n maz-items-center maz-gap-2 maz-rounded maz-px-3\n maz-py-2 maz-text-center maz-font-medium maz-no-underline maz-transition maz-duration-200 maz-ease-in-out;\n\n &:not(.--disabled) {\n @apply maz-cursor-pointer hover:!maz-text-normal;\n }\n\n &.--disabled {\n @apply maz-cursor-not-allowed maz-bg-color-lighter maz-text-gray-400 dark:maz-text-gray-500;\n }\n }\n\n &__indicator {\n @apply maz-absolute maz-left-0 maz-rounded maz-bg-color-light maz-text-center;\n\n &.--animated {\n @apply maz-transition-all maz-duration-300 maz-ease-in-out;\n }\n }\n}\n</style>\n"],"names":["props","__props","MazBadge","defineAsyncComponent","currentTab","updateCurrentTab","injectStrict","selectTab","tabIndex","addOrUpdateQueryParamTab","tabsBarRef","ref","itemRefs","isActiveTab","index","addElementToItemRefs","mazBtn","normalizedItems","computed","item","tabsIndicatorState","tabsBarHasScrollAnimation","setIndicatorAndScroll","sleep","tabsBar","activeTab","scrollOffset","tabBarPaddingLeft","tabsBarPaddingOffset","indicatorWidth","indicatorHeight","translateXValue","getTabStyle","disabled","onBeforeMount","onMounted","watch","getQueryParamTab","urlActuelle","tab"],"mappings":"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"}
1	+ {"version":3,"file":"MazTabsBar.mjs","sources":["../../src/components/MazTabsBar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazBadgeColor, MazBadgeRoundedSize } from './MazBadge.vue'\nimport type { MazTabsProvide } from './MazTabs.vue'\nimport {\n type ComponentPublicInstance,\n computed,\n defineAsyncComponent,\n onBeforeMount,\n onMounted,\n ref,\n type StyleValue,\n watch,\n} from 'vue'\nimport { injectStrict } from '../helpers/injectStrict'\n\nimport { sleep } from '../helpers/sleep'\n\nconst props = withDefaults(defineProps<MazTabsBarProps>(), {\n queryParam: 'tab',\n autoScroll: true,\n})\n\nexport interface MazTabsBarProps {\n /** The items to display in the tabs bar /\n items: MazTabsBarItem[]\n /* Will add a query param to the url to keep the selected tab on page refresh /\n persistent?: boolean\n /\n The name of the query param to add to the url\n * @default tab\n /\n queryParam?: string\n /* Will make the tabs bar full width /\n block?: boolean\n /* Will remove the elevation /\n noElevation?: boolean\n /\n Will add a scroll on the tabs bar to show selected element\n * @default true\n */\n autoScroll?: boolean\n}\n\nexport type MazTabsBarItem =\n \| {\n label: string\n disabled?: boolean\n badge?: {\n content: string \| number \| boolean\n color?: MazBadgeColor\n pastel?: boolean\n outline?: boolean\n size?: string\n roundedSize?: MazBadgeRoundedSize\n }\n }\n \| string\n\nconst MazBadge = defineAsyncComponent(() => import('./MazBadge.vue'))\n\nconst { currentTab, updateCurrentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nfunction selectTab(tabIndex: number) {\n updateCurrentTab(tabIndex + 1)\n if (props.persistent) {\n addOrUpdateQueryParamTab(tabIndex + 1)\n }\n}\n\nconst tabsBarRef = ref<HTMLDivElement>()\nconst itemRefs = ref<HTMLButtonElement[]>([])\n\nfunction isActiveTab(index: number) {\n return currentTab.value === index + 1\n}\n\nfunction addElementToItemRefs({\n mazBtn,\n index,\n}: {\n mazBtn?: ComponentPublicInstance<any>\n index: number\n}) {\n itemRefs.value[index] = mazBtn && '$el' in mazBtn ? mazBtn.$el : mazBtn\n}\n\nconst normalizedItems = computed(() =>\n props.items.map(item => ({\n label: typeof item === 'string' ? item : item.label,\n disabled: typeof item === 'string' ? false : item.disabled ?? false,\n badge: typeof item === 'string' ? undefined : item.badge,\n })),\n)\n\nconst tabsIndicatorState = ref<StyleValue>()\nconst tabsBarHasScrollAnimation = ref(false)\n\nasync function setIndicatorAndScroll() {\n if (!props.autoScroll) {\n return\n }\n\n await sleep(150)\n\n const tabsBar = tabsBarRef.value\n const activeTab = itemRefs.value[currentTab.value - 1]\n\n if (!tabsBar \|\| !activeTab) {\n return\n }\n\n const scrollOffset = 50\n\n if (\n activeTab.offsetLeft - scrollOffset < tabsBar.scrollLeft\n \|\| activeTab.offsetLeft + activeTab.offsetWidth > tabsBar.scrollLeft + tabsBar.clientWidth\n ) {\n const tabBarPaddingLeft = window.getComputedStyle(tabsBar, 'padding-left').paddingLeft\n const tabsBarPaddingOffset = Number(tabBarPaddingLeft.slice(0, -2))\n\n tabsBar.scrollTo({\n left: activeTab.offsetLeft - tabsBarPaddingOffset - scrollOffset,\n behavior: tabsBarHasScrollAnimation.value ? 'smooth' : 'instant',\n })\n }\n\n if (typeof currentTab.value !== 'number') {\n return\n }\n\n const indicatorWidth = activeTab?.offsetWidth ?? 0\n const indicatorHeight = activeTab?.offsetHeight ?? 0\n const translateXValue = activeTab?.offsetLeft ?? 0\n\n tabsIndicatorState.value = {\n transform: `translateX(${translateXValue}px)`,\n width: `${indicatorWidth}px`,\n height: `${indicatorHeight}px`,\n }\n\n tabsBarHasScrollAnimation.value = true\n}\n\nfunction getTabStyle(index: number, disabled: boolean): StyleValue {\n if (disabled) {\n return {}\n }\n return currentTab.value === index + 1\n ? `color: var(--maz-color-text)`\n : 'color: var(--maz-color-muted)'\n}\n\nonBeforeMount(() => {\n if (currentTab.value < 1 \|\| currentTab.value > normalizedItems.value.length) {\n console.error(\n `[maz-ui](MazTabsBar) The model-value should be between 1 and ${normalizedItems.value.length}`,\n )\n }\n})\n\nonMounted(() => {\n if (props.persistent \|\| currentTab.value) {\n setIndicatorAndScroll()\n }\n})\n\nwatch(\n () => [currentTab.value, normalizedItems.value],\n () => {\n setIndicatorAndScroll()\n },\n)\n\nfunction getQueryParamTab() {\n const urlActuelle = new URL(window.location.href)\n return Number(urlActuelle.searchParams.get(props.queryParam))\n}\n\nfunction addOrUpdateQueryParamTab(tab: number) {\n const urlActuelle = new URL(window.location.href)\n urlActuelle.searchParams.set(props.queryParam, String(tab))\n window.history.replaceState({}, document.title, urlActuelle.toString())\n}\n\nonMounted(() => {\n if (props.persistent) {\n updateCurrentTab(getQueryParamTab() \|\| currentTab.value \|\| 1)\n }\n})\n</script>\n\n<template>\n <div\n ref=\"tabsBarRef\"\n class=\"m-tabs-bar m-reset-css\"\n :class=\"{\n '--block': block,\n '--elevation': !noElevation,\n }\"\n >\n <div\n class=\"m-tabs-bar__indicator\"\n :class=\"{ '--animated': tabsBarHasScrollAnimation }\"\n :style=\"[tabsIndicatorState]\"\n />\n <template v-for=\"(item, index) in normalizedItems\" :key=\"index\">\n <button\n :ref=\"(mazBtn) => addElementToItemRefs({ mazBtn, index })\"\n :class=\"{ '--active': isActiveTab(index), '--disabled': item.disabled }\"\n class=\"m-tabs-bar__item\"\n :disabled=\"item.disabled\"\n :style=\"getTabStyle(index, item.disabled)\"\n @click=\"item.disabled ? undefined : selectTab(index)\"\n >\n <!--\n @slot item - Content of item to display in the tabs bar\n @binding {MazTabsBarItem[]} item - all data of the item\n @binding {boolean} active - `true` if the tab is active\n @binding {number} index - index of the item\n -->\n <slot name=\"item\" :item=\"item\" :active=\"isActiveTab(index)\" :index=\"index\">\n {{ item.label }}\n\n <MazBadge\n v-if=\"item.badge\"\n :color=\"item.badge.color\"\n :pastel=\"item.badge.pastel\"\n :outline=\"item.badge.outline\"\n :rounded-size=\"item.badge.roundedSize\"\n :size=\"item.badge.size ?? '0.7rem'\"\n class=\"m-tabs-bar__item__badge\"\n >\n <!--\n @slot badge-content - Content in the badge\n @binding {string \| number \| boolean} content - content of the badge provided in item\n -->\n <slot name=\"badge-content\" :content=\"item.badge.content\">\n {{ item.badge.content }}\n </slot>\n </MazBadge>\n </slot>\n </button>\n </template>\n </div>\n</template>\n\n<style lang=\"postcss\" scoped>\n.m-tabs-bar {\n @apply maz-relative maz-inline-flex maz-max-w-full maz-gap-1 maz-overflow-x-auto maz-rounded maz-p-2 maz-align-top maz-bg-color dark:maz-border dark:maz-border-color-light;\n\n &.--elevation {\n @apply maz-elevation dark:maz-shadow-none;\n }\n\n &.--block {\n @apply maz-w-full;\n }\n\n &__item {\n @apply maz-relative maz-flex maz-flex-none\n maz-items-center maz-gap-2 maz-rounded maz-px-3\n maz-py-2 maz-text-center maz-font-medium maz-no-underline maz-transition maz-duration-200 maz-ease-in-out;\n\n &:not(.--disabled) {\n @apply maz-cursor-pointer hover:!maz-text-normal;\n }\n\n &.--disabled {\n @apply maz-cursor-not-allowed maz-bg-color-lighter maz-text-gray-400 dark:maz-text-gray-500;\n }\n }\n\n &__indicator {\n @apply maz-absolute maz-left-0 maz-rounded maz-bg-color-light maz-text-center;\n\n &.--animated {\n @apply maz-transition-all maz-duration-300 maz-ease-in-out;\n }\n }\n}\n</style>\n"],"names":["props","__props","MazBadge","defineAsyncComponent","currentTab","updateCurrentTab","injectStrict","selectTab","tabIndex","addOrUpdateQueryParamTab","tabsBarRef","ref","itemRefs","isActiveTab","index","addElementToItemRefs","mazBtn","normalizedItems","computed","item","tabsIndicatorState","tabsBarHasScrollAnimation","setIndicatorAndScroll","sleep","tabsBar","activeTab","scrollOffset","tabBarPaddingLeft","tabsBarPaddingOffset","indicatorWidth","indicatorHeight","translateXValue","getTabStyle","disabled","onBeforeMount","onMounted","watch","getQueryParamTab","urlActuelle","tab"],"mappings":"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"}

package/dist/components/MazTabsContentItem.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../assets/MazTabsContentItem.C0ygFU51.css');const e=require("vue"),b=require("../helpers/injectStrict.cjs"),l=require("../chunks/_plugin-vue_export-helper.BHFhmbuH.cjs"),p=e.defineComponent({__name:"MazTabsContentItem",props:{tab:{type:Number,required:!0}},setup(o){const s=o,n=e.ref("maz-tab-transition"),i=e.ref(),{currentTab:a}=b.injectStrict("maz-tabs");e.watch(()=>a.value,(t,r)=>{if(typeof t=="number"&&typeof r=="number"){const m=r<t;n.value=m?"maz-tab-transition":"maz-tab-reverse-transition"}},{immediate:!0});const u=e.computed(()=>s.tab-1),c=e.computed(()=>a.value-1===u.value);return(t,r)=>(e.openBlock(),e.createBlock(e.Transition,{name:n.value},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{ref_key:"MazTabsContentItem",ref:i,class:"m-tabs-content-item m-reset-css"},[e.renderSlot(t.$slots,"default",{},void 0,!0)],512),[[e.vShow,c.value]])]),_:3},8,["name"]))}}),d=l._export_sfc(p,[["__scopeId","data-v-59df8523"]]);exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('../assets/MazTabsContentItem.C9kvAsC7.css');const e=require("vue"),b=require("../helpers/injectStrict.cjs"),l=require("../chunks/_plugin-vue_export-helper.BHFhmbuH.cjs"),p=e.defineComponent({__name:"MazTabsContentItem",props:{tab:{type:Number,required:!0}},setup(o){const s=o,n=e.ref("maz-tab-transition"),i=e.ref(),{currentTab:a}=b.injectStrict("maz-tabs");e.watch(()=>a.value,(t,r)=>{if(typeof t=="number"&&typeof r=="number"){const m=r<t;n.value=m?"maz-tab-transition":"maz-tab-reverse-transition"}},{immediate:!0});const c=e.computed(()=>s.tab-1),u=e.computed(()=>a.value-1===c.value);return(t,r)=>(e.openBlock(),e.createBlock(e.Transition,{name:n.value},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{ref_key:"MazTabsContentItem",ref:i,class:"m-tabs-content-item m-reset-css"},[e.renderSlot(t.$slots,"default",{},void 0,!0)],512),[[e.vShow,u.value]])]),_:3},8,["name"]))}}),d=l._export_sfc(p,[["__scopeId","data-v-cef7113d"]]);exports.default=d;
 //# sourceMappingURL=MazTabsContentItem.cjs.map

package/dist/components/MazTabsContentItem.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MazTabsContentItem.cjs","sources":["../../src/components/MazTabsContentItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazTabsProvide } from '~~@components/~~MazTabs.vue'\nimport { ~~injectStrict~~ } from '~~@helpers/injectStrict~~'\nimport { ~~computed,~~ ~~ref, watch~~ } from '~~vue~~'\n\nconst props = defineProps({\n tab: { type: Number, required: true },\n})\nconst transitionName = ref<string>('maz-tab-transition')\nconst MazTabsContentItem = ref()\n\nconst { currentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nwatch(\n () => currentTab.value,\n (value, oldValue) => {\n if (typeof value === 'number' && typeof oldValue === 'number') {\n const newTabIsBigger = oldValue < value\n transitionName.value = newTabIsBigger ? 'maz-tab-transition' : 'maz-tab-reverse-transition'\n }\n },\n { immediate: true },\n)\n\nconst itemTabNumber = computed(() => {\n return props.tab - 1\n})\n\nconst isCurrentTab = computed(() => {\n return currentTab.value - 1 === itemTabNumber.value\n})\n</script>\n\n<template>\n <Transition :name=\"transitionName\">\n <div v-show=\"isCurrentTab\" ref=\"MazTabsContentItem\" class=\"m-tabs-content-item m-reset-css\">\n <slot />\n </div>\n </Transition>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-tabs-content-item {\n @apply maz-relative maz-top-0 maz-w-full;\n\n flex: 1 0 auto;\n transition: all 500ms cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n</style>\n"],"names":["props","__props","transitionName","ref","MazTabsContentItem","currentTab","injectStrict","watch","value","oldValue","newTabIsBigger","itemTabNumber","computed","isCurrentTab"],"mappings":"0UAKA,MAAMA,EAAQC,EAGRC,EAAiBC,MAAY,oBAAoB,EACjDC,EAAqBD,EAAAA,IAAI,EAEzB,CAAE,WAAAE,CAAA,EAAeC,EAAA,aAA6B,UAAU,EAE9DC,EAAA,MACE,IAAMF,EAAW,MACjB,CAACG,EAAOC,IAAa,CACnB,GAAI,OAAOD,GAAU,UAAY,OAAOC,GAAa,SAAU,CAC7D,MAAMC,EAAiBD,EAAWD,EACnBN,EAAA,MAAQQ,EAAiB,qBAAuB,4BAAA,CAEnE,EACA,CAAE,UAAW,EAAK,CACpB,EAEM,MAAAC,EAAgBC,EAAAA,SAAS,IACtBZ,EAAM,IAAM,CACpB,EAEKa,EAAeD,EAAAA,SAAS,IACrBP,EAAW,MAAQ,IAAMM,EAAc,KAC/C"}
1	+ {"version":3,"file":"MazTabsContentItem.cjs","sources":["../../src/components/MazTabsContentItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazTabsProvide } from './MazTabs.vue'\nimport { computed, ref, watch } from 'vue'\nimport { injectStrict } from '../helpers/injectStrict'\n\nconst props = defineProps({\n tab: { type: Number, required: true },\n})\nconst transitionName = ref<string>('maz-tab-transition')\nconst MazTabsContentItem = ref()\n\nconst { currentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nwatch(\n () => currentTab.value,\n (value, oldValue) => {\n if (typeof value === 'number' && typeof oldValue === 'number') {\n const newTabIsBigger = oldValue < value\n transitionName.value = newTabIsBigger ? 'maz-tab-transition' : 'maz-tab-reverse-transition'\n }\n },\n { immediate: true },\n)\n\nconst itemTabNumber = computed(() => {\n return props.tab - 1\n})\n\nconst isCurrentTab = computed(() => {\n return currentTab.value - 1 === itemTabNumber.value\n})\n</script>\n\n<template>\n <Transition :name=\"transitionName\">\n <div v-show=\"isCurrentTab\" ref=\"MazTabsContentItem\" class=\"m-tabs-content-item m-reset-css\">\n <slot />\n </div>\n </Transition>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-tabs-content-item {\n @apply maz-relative maz-top-0 maz-w-full;\n\n flex: 1 0 auto;\n transition: all 500ms cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n</style>\n"],"names":["props","__props","transitionName","ref","MazTabsContentItem","currentTab","injectStrict","watch","value","oldValue","newTabIsBigger","itemTabNumber","computed","isCurrentTab"],"mappings":"0UAKA,MAAMA,EAAQC,EAGRC,EAAiBC,MAAY,oBAAoB,EACjDC,EAAqBD,EAAAA,IAAI,EAEzB,CAAE,WAAAE,CAAA,EAAeC,EAAA,aAA6B,UAAU,EAE9DC,EAAA,MACE,IAAMF,EAAW,MACjB,CAACG,EAAOC,IAAa,CACnB,GAAI,OAAOD,GAAU,UAAY,OAAOC,GAAa,SAAU,CAC7D,MAAMC,EAAiBD,EAAWD,EACnBN,EAAA,MAAQQ,EAAiB,qBAAuB,4BAAA,CAEnE,EACA,CAAE,UAAW,EAAK,CACpB,EAEM,MAAAC,EAAgBC,EAAAA,SAAS,IACtBZ,EAAM,IAAM,CACpB,EAEKa,EAAeD,EAAAA,SAAS,IACrBP,EAAW,MAAQ,IAAMM,EAAc,KAC/C"}

package/dist/components/MazTabsContentItem.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import { defineComponent as p, ref as r, watch as f, computed as o, openBlock as d, createBlock as l, Transition as _, withCtx as v, withDirectives as T, createElementVNode as z, renderSlot as C, vShow as I } from "vue";
 import { injectStrict as h } from "../helpers/injectStrict.mjs";
 import { _ as w } from "../chunks/_plugin-vue_export-helper.CHgC5LLL.mjs";
-import '../assets/MazTabsContentItem.C0ygFU51.css';const y = /* @__PURE__ */ p({
+import '../assets/MazTabsContentItem.C9kvAsC7.css';const y = /* @__PURE__ */ p({
   __name: "MazTabsContentItem",
   props: {
     tab: { type: Number, required: !0 }
@@ -34,7 +34,7 @@ import '../assets/MazTabsContentItem.C0ygFU51.css';const y = /* @__PURE__ */ p({
       _: 3
     }, 8, ["name"]));
   }
-}), x = /* @__PURE__ */ w(y, [["__scopeId", "data-v-59df8523"]]);
+}), x = /* @__PURE__ */ w(y, [["__scopeId", "data-v-cef7113d"]]);
 export {
   x as default
 };

package/dist/components/MazTabsContentItem.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MazTabsContentItem.mjs","sources":["../../src/components/MazTabsContentItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazTabsProvide } from '~~@components/~~MazTabs.vue'\nimport { ~~injectStrict~~ } from '~~@helpers/injectStrict~~'\nimport { ~~computed,~~ ~~ref, watch~~ } from '~~vue~~'\n\nconst props = defineProps({\n tab: { type: Number, required: true },\n})\nconst transitionName = ref<string>('maz-tab-transition')\nconst MazTabsContentItem = ref()\n\nconst { currentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nwatch(\n () => currentTab.value,\n (value, oldValue) => {\n if (typeof value === 'number' && typeof oldValue === 'number') {\n const newTabIsBigger = oldValue < value\n transitionName.value = newTabIsBigger ? 'maz-tab-transition' : 'maz-tab-reverse-transition'\n }\n },\n { immediate: true },\n)\n\nconst itemTabNumber = computed(() => {\n return props.tab - 1\n})\n\nconst isCurrentTab = computed(() => {\n return currentTab.value - 1 === itemTabNumber.value\n})\n</script>\n\n<template>\n <Transition :name=\"transitionName\">\n <div v-show=\"isCurrentTab\" ref=\"MazTabsContentItem\" class=\"m-tabs-content-item m-reset-css\">\n <slot />\n </div>\n </Transition>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-tabs-content-item {\n @apply maz-relative maz-top-0 maz-w-full;\n\n flex: 1 0 auto;\n transition: all 500ms cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n</style>\n"],"names":["props","__props","transitionName","ref","MazTabsContentItem","currentTab","injectStrict","watch","value","oldValue","newTabIsBigger","itemTabNumber","computed","isCurrentTab"],"mappings":";;;;;;;;;AAKA,UAAMA,IAAQC,GAGRC,IAAiBC,EAAY,oBAAoB,GACjDC,IAAqBD,EAAI,GAEzB,EAAE,YAAAE,EAAA,IAAeC,EAA6B,UAAU;AAE9D,IAAAC;AAAA,MACE,MAAMF,EAAW;AAAA,MACjB,CAACG,GAAOC,MAAa;AACnB,YAAI,OAAOD,KAAU,YAAY,OAAOC,KAAa,UAAU;AAC7D,gBAAMC,IAAiBD,IAAWD;AACnB,UAAAN,EAAA,QAAQQ,IAAiB,uBAAuB;AAAA,QAAA;AAAA,MAEnE;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IACpB;AAEM,UAAAC,IAAgBC,EAAS,MACtBZ,EAAM,MAAM,CACpB,GAEKa,IAAeD,EAAS,MACrBP,EAAW,QAAQ,MAAMM,EAAc,KAC/C;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"MazTabsContentItem.mjs","sources":["../../src/components/MazTabsContentItem.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MazTabsProvide } from './MazTabs.vue'\nimport { computed, ref, watch } from 'vue'\nimport { injectStrict } from '../helpers/injectStrict'\n\nconst props = defineProps({\n tab: { type: Number, required: true },\n})\nconst transitionName = ref<string>('maz-tab-transition')\nconst MazTabsContentItem = ref()\n\nconst { currentTab } = injectStrict<MazTabsProvide>('maz-tabs')\n\nwatch(\n () => currentTab.value,\n (value, oldValue) => {\n if (typeof value === 'number' && typeof oldValue === 'number') {\n const newTabIsBigger = oldValue < value\n transitionName.value = newTabIsBigger ? 'maz-tab-transition' : 'maz-tab-reverse-transition'\n }\n },\n { immediate: true },\n)\n\nconst itemTabNumber = computed(() => {\n return props.tab - 1\n})\n\nconst isCurrentTab = computed(() => {\n return currentTab.value - 1 === itemTabNumber.value\n})\n</script>\n\n<template>\n <Transition :name=\"transitionName\">\n <div v-show=\"isCurrentTab\" ref=\"MazTabsContentItem\" class=\"m-tabs-content-item m-reset-css\">\n <slot />\n </div>\n </Transition>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-tabs-content-item {\n @apply maz-relative maz-top-0 maz-w-full;\n\n flex: 1 0 auto;\n transition: all 500ms cubic-bezier(0.25, 0.8, 0.5, 1);\n}\n</style>\n"],"names":["props","__props","transitionName","ref","MazTabsContentItem","currentTab","injectStrict","watch","value","oldValue","newTabIsBigger","itemTabNumber","computed","isCurrentTab"],"mappings":";;;;;;;;;AAKA,UAAMA,IAAQC,GAGRC,IAAiBC,EAAY,oBAAoB,GACjDC,IAAqBD,EAAI,GAEzB,EAAE,YAAAE,EAAA,IAAeC,EAA6B,UAAU;AAE9D,IAAAC;AAAA,MACE,MAAMF,EAAW;AAAA,MACjB,CAACG,GAAOC,MAAa;AACnB,YAAI,OAAOD,KAAU,YAAY,OAAOC,KAAa,UAAU;AAC7D,gBAAMC,IAAiBD,IAAWD;AACnB,UAAAN,EAAA,QAAQQ,IAAiB,uBAAuB;AAAA,QAAA;AAAA,MAEnE;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IACpB;AAEM,UAAAC,IAAgBC,EAAS,MACtBZ,EAAM,MAAM,CACpB,GAEKa,IAAeD,EAAS,MACrBP,EAAW,QAAQ,MAAMM,EAAc,KAC/C;;;;;;;;;;;;;;;;;"}

package/dist/components/MazTextarea.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";require('../assets/MazTextarea.QTMu0OQv.css');var E=Object.defineProperty;var S=(a,r,o)=>r in a?E(a,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):a[r]=o;var b=(a,r,o)=>S(a,typeof r!="symbol"?r+"":r,o);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),V=require("../helpers/debounce.cjs"),q=require("../composables/useInstanceUniqId.cjs"),T=require("../chunks/_plugin-vue_export-helper.BHFhmbuH.cjs");class M{constructor(r){b(this,"element");this.element=r,this.onFocus=this.onFocus.bind(this),this.autogrow=this.autogrow.bind(this),this.onResize=V.debounce(this.onResize.bind(this),200),this.connect()}connect(){this.element.addEventListener("focus",this.onFocus),this.element.style.resize="none",this.element.style.boxSizing="border-box"}disconnect(){window.removeEventListener("resize",this.onResize),this.element.removeEventListener("input",this.autogrow)}onFocus(){this.autogrow(),this.element.addEventListener("input",this.autogrow),window.addEventListener("resize",this.onResize),this.element.removeEventListener("focus",this.onFocus)}onResize(){this.autogrow()}autogrow(){this.element.style.height="auto",this.element.style.overflow="hidden",this.element.style.height=`${this.element.scrollHeight}px`}}const I=["for"],L=["for"],C={key:1},F={key:2},N=["id","placeholder","name","disabled","required"],_={key:1,class:"m-textarea__append"},$=e.defineComponent({inheritAttrs:!1,__name:"MazTextarea",props:{style:{default:void 0},class:{default:void 0},modelValue:{default:void 0},id:{default:void 0},name:{default:"MazTextarea"},label:{default:void 0},placeholder:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{default:void 0},color:{default:"primary"},roundedSize:{},padding:{type:Boolean,default:!0},transparent:{type:Boolean,default:!1},border:{type:Boolean,default:!0},appendJustify:{default:"end"}},emits:["update:model-value","input","focus","blur","change"],setup(a,{emit:r}){const o=a,n=r;let s;const d=q.useInstanceUniqId({componentName:"MazTextarea",providedId:o.id}),i=e.ref(),l=e.ref(!1),v=e.computed(()=>o.modelValue!==void 0&&o.modelValue!=="");e.onMounted(()=>{i.value&&(s=new M(i.value))}),e.onBeforeUnmount(()=>{s==null||s.disconnect()});const c=e.computed({get:()=>o.modelValue,set:t=>{n("update:model-value",t),n("input",t)}});function y(t){n("focus",t),l.value=!0}function g(t){n("blur",t),l.value=!1}function z(t){n("change",t)}const m=e.useSlots(),u=e.computed(()=>o.label||o.hint||!!m.label),w=e.computed(()=>u.value&&(l.value||v.value||!!o.placeholder)),p=e.computed(()=>!!m.append),f=e.computed(()=>{if(o.error)return"maz-border-danger";if(o.success)return"maz-border-success";if(o.warning)return"maz-border-warning";if(l.value){if(o.color==="black")return"maz-border-black";if(o.color==="danger")return"maz-border-danger";if(o.color==="info")return"maz-border-info";if(o.color==="primary")return"maz-border-primary";if(o.color==="secondary")return"maz-border-secondary";if(o.color==="success")return"maz-border-success";if(o.color==="warning")return"maz-border-warning";if(o.color==="white")return"maz-border-white"}return"--default-border"}),B=e.computed(()=>f.value!=="--default-border");return(t,h)=>(e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["m-textarea m-reset-css",[{"--is-disabled":t.disabled,"--has-label":u.value,"--background-transparent":t.transparent,"--padding":t.padding,"--border":t.border,"--has-border-style":B.value},f.value,t.roundedSize?`--rounded-${t.roundedSize}`:"--rounded",o.class]]),for:e.unref(d),style:e.normalizeStyle([t.style,`--append-justify: ${t.appendJustify}`])},[u.value?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(d),class:e.normalizeClass(["m-textarea__label",[{"maz-text-danger-600":t.error,"maz-text-success-600":t.success,"maz-text-warning-600":t.warning,"--has-state":t.error||t.warning||t.success,"--should-up":w.value}]])},[t.hint?(e.openBlock(),e.createElementBlock("span",C,e.toDisplayString(t.hint),1)):e.renderSlot(t.$slots,"label",{key:0},()=>[e.createTextVNode(e.toDisplayString(t.label),1)],!0),t.required?(e.openBlock(),e.createElementBlock("sup",F,"*")):e.createCommentVNode("",!0)],10,L)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("textarea",e.mergeProps({id:e.unref(d),ref_key:"TextareaElement",ref:i},t.$attrs,{"onUpdate:modelValue":h[0]||(h[0]=k=>c.value=k),placeholder:t.placeholder,name:t.name,disabled:t.disabled,required:t.required,class:{"--has-append":p.value}},e.toHandlers({blur:g,focus:y,change:z},!0)),null,16,N),[[e.vModelText,c.value]]),p.value?(e.openBlock(),e.createElementBlock("div",_,[e.renderSlot(t.$slots,"append",{},void 0,!0)])):e.createCommentVNode("",!0)],14,I))}}),R=T._export_sfc($,[["__scopeId","data-v-179fee42"]]);exports.default=R;
+"use strict";require('../assets/MazTextarea.BML1BVBM.css');var E=Object.defineProperty;var S=(a,r,o)=>r in a?E(a,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):a[r]=o;var b=(a,r,o)=>S(a,typeof r!="symbol"?r+"":r,o);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),V=require("../composables/useInstanceUniqId.cjs"),q=require("../helpers/debounce.cjs"),T=require("../chunks/_plugin-vue_export-helper.BHFhmbuH.cjs");class M{constructor(r){b(this,"element");this.element=r,this.onFocus=this.onFocus.bind(this),this.autogrow=this.autogrow.bind(this),this.onResize=q.debounce(this.onResize.bind(this),200),this.connect()}connect(){this.element.addEventListener("focus",this.onFocus),this.element.style.resize="none",this.element.style.boxSizing="border-box"}disconnect(){window.removeEventListener("resize",this.onResize),this.element.removeEventListener("input",this.autogrow)}onFocus(){this.autogrow(),this.element.addEventListener("input",this.autogrow),window.addEventListener("resize",this.onResize),this.element.removeEventListener("focus",this.onFocus)}onResize(){this.autogrow()}autogrow(){this.element.style.height="auto",this.element.style.overflow="hidden",this.element.style.height=`${this.element.scrollHeight}px`}}const I=["for"],L=["for"],C={key:1},F={key:2},N=["id","placeholder","name","disabled","required"],_={key:1,class:"m-textarea__append"},$=e.defineComponent({inheritAttrs:!1,__name:"MazTextarea",props:{style:{default:void 0},class:{default:void 0},modelValue:{default:void 0},id:{default:void 0},name:{default:"MazTextarea"},label:{default:void 0},placeholder:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},error:{type:Boolean,default:!1},success:{type:Boolean,default:!1},warning:{type:Boolean,default:!1},hint:{default:void 0},color:{default:"primary"},roundedSize:{},padding:{type:Boolean,default:!0},transparent:{type:Boolean,default:!1},border:{type:Boolean,default:!0},appendJustify:{default:"end"}},emits:["update:model-value","input","focus","blur","change"],setup(a,{emit:r}){const o=a,n=r;let s;const d=V.useInstanceUniqId({componentName:"MazTextarea",providedId:o.id}),i=e.ref(),l=e.ref(!1),v=e.computed(()=>o.modelValue!==void 0&&o.modelValue!=="");e.onMounted(()=>{i.value&&(s=new M(i.value))}),e.onBeforeUnmount(()=>{s==null||s.disconnect()});const c=e.computed({get:()=>o.modelValue,set:t=>{n("update:model-value",t),n("input",t)}});function y(t){n("focus",t),l.value=!0}function g(t){n("blur",t),l.value=!1}function z(t){n("change",t)}const m=e.useSlots(),u=e.computed(()=>o.label||o.hint||!!m.label),w=e.computed(()=>u.value&&(l.value||v.value||!!o.placeholder)),p=e.computed(()=>!!m.append),f=e.computed(()=>{if(o.error)return"maz-border-danger";if(o.success)return"maz-border-success";if(o.warning)return"maz-border-warning";if(l.value){if(o.color==="black")return"maz-border-black";if(o.color==="danger")return"maz-border-danger";if(o.color==="info")return"maz-border-info";if(o.color==="primary")return"maz-border-primary";if(o.color==="secondary")return"maz-border-secondary";if(o.color==="success")return"maz-border-success";if(o.color==="warning")return"maz-border-warning";if(o.color==="white")return"maz-border-white"}return"--default-border"}),B=e.computed(()=>f.value!=="--default-border");return(t,h)=>(e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["m-textarea m-reset-css",[{"--is-disabled":t.disabled,"--has-label":u.value,"--background-transparent":t.transparent,"--padding":t.padding,"--border":t.border,"--has-border-style":B.value},f.value,t.roundedSize?`--rounded-${t.roundedSize}`:"--rounded",o.class]]),for:e.unref(d),style:e.normalizeStyle([t.style,`--append-justify: ${t.appendJustify}`])},[u.value?(e.openBlock(),e.createElementBlock("label",{key:0,for:e.unref(d),class:e.normalizeClass(["m-textarea__label",[{"maz-text-danger-600":t.error,"maz-text-success-600":t.success,"maz-text-warning-600":t.warning,"--has-state":t.error||t.warning||t.success,"--should-up":w.value}]])},[t.hint?(e.openBlock(),e.createElementBlock("span",C,e.toDisplayString(t.hint),1)):e.renderSlot(t.$slots,"label",{key:0},()=>[e.createTextVNode(e.toDisplayString(t.label),1)],!0),t.required?(e.openBlock(),e.createElementBlock("sup",F,"*")):e.createCommentVNode("",!0)],10,L)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("textarea",e.mergeProps({id:e.unref(d),ref_key:"TextareaElement",ref:i},t.$attrs,{"onUpdate:modelValue":h[0]||(h[0]=k=>c.value=k),placeholder:t.placeholder,name:t.name,disabled:t.disabled,required:t.required,class:{"--has-append":p.value}},e.toHandlers({blur:g,focus:y,change:z},!0)),null,16,N),[[e.vModelText,c.value]]),p.value?(e.openBlock(),e.createElementBlock("div",_,[e.renderSlot(t.$slots,"append",{},void 0,!0)])):e.createCommentVNode("",!0)],14,I))}}),R=T._export_sfc($,[["__scopeId","data-v-44e79189"]]);exports.default=R;
 //# sourceMappingURL=MazTextarea.cjs.map

package/dist/components/MazTextarea.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MazTextarea.cjs","sources":["../../src/components/MazTextarea/textarea-autogrow.ts","../../src/components/MazTextarea.vue"],"sourcesContent":["import { debounce } from '@helpers/debounce'\n\nexport class TextareaAutogrow {\n private element: HTMLTextAreaElement\n\n constructor(element: HTMLTextAreaElement) {\n this.element = element\n this.onFocus = this.onFocus.bind(this)\n this.autogrow = this.autogrow.bind(this)\n this.onResize = debounce(this.onResize.bind(this), 200)\n this.connect()\n }\n\n private connect() {\n this.element.addEventListener('focus', this.onFocus)\n this.element.style.resize = 'none'\n this.element.style.boxSizing = 'border-box'\n }\n\n public disconnect() {\n window.removeEventListener('resize', this.onResize)\n this.element.removeEventListener('input', this.autogrow)\n }\n\n private onFocus() {\n this.autogrow()\n this.element.addEventListener('input', this.autogrow)\n window.addEventListener('resize', this.onResize)\n this.element.removeEventListener('focus', this.onFocus)\n }\n\n private onResize() {\n this.autogrow()\n }\n\n private autogrow() {\n this.element.style.height = 'auto'\n this.element.style.overflow = 'hidden'\n this.element.style.height = `${this.element.scrollHeight}px`\n }\n}\n","<script lang=\"ts\">\n/* eslint-disable import/first /\nimport type { Color } from '@components/types'\n\nexport interface MazTextareaProps<T extends string \| undefined \| null> {\n /* Style attribut of the component root element /\n style?: HTMLAttributes['style']\n /* Class attribut of the component root element /\n class?: HTMLAttributes['class']\n /* @model The value of the textarea /\n modelValue?: T\n /* The id of the textarea /\n id?: string\n /* The name of the textarea /\n name?: string\n /* The label of the textarea /\n label?: string\n /* The placeholder of the textarea /\n placeholder?: string\n /* If the textarea is required /\n required?: boolean\n /* If the textarea is disabled /\n disabled?: boolean\n /* If the textarea is readonly /\n readonly?: boolean\n /* If the textarea has an error /\n error?: boolean\n /* If the textarea has a success /\n success?: boolean\n /* If the textarea has a warning /\n warning?: boolean\n /* The hint of the textarea /\n hint?: string\n /* The color of the textarea /\n color?: Color\n /\n Size radius of the component's border\n * @values `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'`\n /\n roundedSize?: 'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'\n /\n If the textarea has a padding\n * @default true\n /\n padding?: boolean\n /\n If the textarea has a transparent background\n * @default false\n /\n transparent?: boolean\n /\n If the textarea has no border\n * @default false\n /\n border?: boolean\n /\n The alignment of the append slot\n * @values `'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'`\n * @default 'end'\n /\n appendJustify?: 'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'\n}\n</script>\n\n<script lang=\"ts\" setup generic=\"T extends string \| undefined \| null\">\nimport { TextareaAutogrow } from '@components/MazTextarea/textarea-autogrow'\nimport { useInstanceUniqId } from '@composables/useInstanceUniqId'\nimport { computed, type HTMLAttributes, onBeforeUnmount, onMounted, ref, useSlots } from 'vue'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazTextareaProps<T>>(), {\n style: undefined,\n class: undefined,\n modelValue: undefined,\n id: undefined,\n name: 'MazTextarea',\n label: undefined,\n placeholder: undefined,\n required: false,\n disabled: false,\n readonly: false,\n error: false,\n success: false,\n warning: false,\n hint: undefined,\n color: 'primary',\n padding: true,\n transparent: false,\n border: true,\n appendJustify: 'end',\n})\n\nconst emits = defineEmits<{\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'update:model-value', value?: T): void\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'input', value?: T): void\n /\n Emitted when the textarea is focused\n * @property {Event} value - The event\n /\n (event: 'focus', value: FocusEvent): void\n /\n Emitted when the textarea is blurred\n * @property {Event} value - The event\n /\n (event: 'blur', value: FocusEvent): void\n /\n Emitted when the textarea value change\n * @property {Event} value - The event\n /\n (event: 'change', value: Event): void\n}>()\n\nlet textareaAutogrow: TextareaAutogrow \| undefined\n\nconst instanceId = useInstanceUniqId({\n componentName: 'MazTextarea',\n providedId: props.id,\n})\n\nconst TextareaElement = ref<HTMLTextAreaElement>()\nconst isFocused = ref(false)\nconst hasValue = computed(() => props.modelValue !== undefined && props.modelValue !== '')\n\nonMounted(() => {\n if (TextareaElement.value) {\n textareaAutogrow = new TextareaAutogrow(TextareaElement.value)\n }\n})\n\nonBeforeUnmount(() => {\n textareaAutogrow?.disconnect()\n})\n\nconst inputValue = computed({\n get: () => props.modelValue,\n set: (value) => {\n emits('update:model-value', value)\n emits('input', value)\n },\n})\n\nfunction focus(event: FocusEvent) {\n emits('focus', event)\n isFocused.value = true\n}\n\nfunction blur(event: FocusEvent) {\n emits('blur', event)\n isFocused.value = false\n}\n\nfunction change(event: Event) {\n emits('change', event)\n}\n\nconst slots = useSlots()\n\nconst hasLabelOrHint = computed(() => props.label \|\| props.hint \|\| !!slots.label)\n\nconst shouldUp = computed(\n () => hasLabelOrHint.value && (isFocused.value \|\| hasValue.value \|\| !!props.placeholder),\n)\n\nconst hasAppend = computed(() => !!slots.append)\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst borderStyle = computed(() => {\n if (props.error)\n return 'maz-border-danger'\n if (props.success)\n return 'maz-border-success'\n if (props.warning)\n return 'maz-border-warning'\n if (isFocused.value) {\n if (props.color === 'black')\n return 'maz-border-black'\n if (props.color === 'danger')\n return 'maz-border-danger'\n if (props.color === 'info')\n return 'maz-border-info'\n if (props.color === 'primary')\n return 'maz-border-primary'\n if (props.color === 'secondary')\n return 'maz-border-secondary'\n if (props.color === 'success')\n return 'maz-border-success'\n if (props.color === 'warning')\n return 'maz-border-warning'\n if (props.color === 'white')\n return 'maz-border-white'\n }\n return '--default-border'\n})\n\nconst hasBorderStyle = computed(() => borderStyle.value !== '--default-border')\n</script>\n\n<template>\n <label\n class=\"m-textarea m-reset-css\"\n :for=\"instanceId\"\n :class=\"[\n {\n '--is-disabled': disabled,\n '--has-label': hasLabelOrHint,\n '--background-transparent': transparent,\n '--padding': padding,\n '--border': border,\n '--has-border-style': hasBorderStyle,\n },\n borderStyle,\n roundedSize ? `--rounded-${roundedSize}` : '--rounded',\n props.class,\n ]\"\n :style=\"[style, `--append-justify: ${appendJustify}`]\"\n >\n <!-- eslint-disable vuejs-accessibility/label-has-for -->\n <label\n v-if=\"hasLabelOrHint\"\n :for=\"instanceId\"\n class=\"m-textarea__label\"\n :class=\"[\n {\n 'maz-text-danger-600': error,\n 'maz-text-success-600': success,\n 'maz-text-warning-600': warning,\n '--has-state': error \|\| warning \|\| success,\n '--should-up': shouldUp,\n },\n ]\"\n >\n <!-- @slot Label - Replace the label -->\n <slot v-if=\"!hint\" name=\"label\">\n {{ label }}\n </slot>\n <span v-else>\n {{ hint }}\n </span>\n <sup v-if=\"required\"></sup>\n </label>\n <!-- eslint-enable vuejs-accessibility/label-has-for -->\n\n <textarea\n :id=\"instanceId\"\n ref=\"TextareaElement\"\n v-bind=\"$attrs\"\n v-model=\"inputValue\"\n :placeholder\n :name\n :disabled\n :required\n :class=\"{ '--has-append': hasAppend }\"\n v-on=\"{\n blur,\n focus,\n change,\n }\"\n />\n <div v-if=\"hasAppend\" class=\"m-textarea__append\">\n <!-- @slot Append - Replace the append -->\n <slot name=\"append\" />\n </div>\n </label>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-textarea {\n @apply maz-min-h-[6.25rem] maz-relative maz-flex maz-flex-col maz-align-top maz-text-normal;\n\n &:not(.--background-transparent, .--is-disabled) {\n @apply maz-bg-color dark:maz-bg-color-light;\n }\n\n &.--border:not(.--is-disabled) {\n @apply maz-border maz-border-solid;\n\n &:not(.--has-border-style) {\n @apply maz-border-border dark:maz-border-color-lighter;\n }\n }\n\n &.--padding {\n @apply maz-px-4 maz-py-3;\n }\n\n &.--rounded-sm {\n @apply maz-rounded-sm;\n }\n\n &.--rounded-md {\n @apply maz-rounded-md;\n }\n\n &.--rounded-lg {\n @apply maz-rounded-lg;\n }\n\n &.--rounded-xl {\n @apply maz-rounded-xl;\n }\n\n &.--rounded-full {\n @apply maz-rounded-full;\n }\n\n &.--rounded {\n @apply maz-rounded;\n }\n\n &.--has-label {\n @apply maz-pt-6;\n }\n\n &__append {\n @apply maz-inline-flex;\n\n justify-content: var(--append-justify);\n }\n\n textarea {\n @apply maz-w-full maz-resize-y maz-outline-none maz-bg-transparent;\n\n &.--has-append {\n @apply maz-pb-4;\n }\n }\n\n &.--is-disabled {\n @apply maz-cursor-not-allowed maz-border-border maz-bg-color-lighter maz-text-muted dark:maz-border-color-lighter;\n\n & * {\n @apply maz-cursor-not-allowed maz-text-muted;\n }\n\n & > label {\n @apply maz-text-gray-300 dark:maz-text-gray-600;\n }\n }\n\n &__label {\n @apply maz-pointer-events-none maz-absolute maz-block maz-w-max maz-origin-top-left maz-truncate;\n @apply maz-left-4 maz-top-3 maz-leading-6;\n @apply maz-flex maz-flex-center;\n\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n\n &.--should-up {\n transform: scale(0.8) translateY(-0.65rem);\n }\n\n &:not(.--has-state) {\n @apply maz-text-muted;\n }\n }\n}\n</style>\n"],"names":["TextareaAutogrow","element","__publicField","debounce","props","__props","emits","__emit","textareaAutogrow","instanceId","useInstanceUniqId","TextareaElement","ref","isFocused","hasValue","computed","onMounted","onBeforeUnmount","inputValue","value","focus","event","blur","change","slots","useSlots","hasLabelOrHint","shouldUp","hasAppend","borderStyle","hasBorderStyle"],"mappings":"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"}
1	+ {"version":3,"file":"MazTextarea.cjs","sources":["../../src/components/MazTextarea/textarea-autogrow.ts","../../src/components/MazTextarea.vue"],"sourcesContent":["import { debounce } from '../../helpers/debounce'\n\nexport class TextareaAutogrow {\n private element: HTMLTextAreaElement\n\n constructor(element: HTMLTextAreaElement) {\n this.element = element\n this.onFocus = this.onFocus.bind(this)\n this.autogrow = this.autogrow.bind(this)\n this.onResize = debounce(this.onResize.bind(this), 200)\n this.connect()\n }\n\n private connect() {\n this.element.addEventListener('focus', this.onFocus)\n this.element.style.resize = 'none'\n this.element.style.boxSizing = 'border-box'\n }\n\n public disconnect() {\n window.removeEventListener('resize', this.onResize)\n this.element.removeEventListener('input', this.autogrow)\n }\n\n private onFocus() {\n this.autogrow()\n this.element.addEventListener('input', this.autogrow)\n window.addEventListener('resize', this.onResize)\n this.element.removeEventListener('focus', this.onFocus)\n }\n\n private onResize() {\n this.autogrow()\n }\n\n private autogrow() {\n this.element.style.height = 'auto'\n this.element.style.overflow = 'hidden'\n this.element.style.height = `${this.element.scrollHeight}px`\n }\n}\n","<script lang=\"ts\">\n/* eslint-disable import/first /\nimport type { Color } from './types'\n\nexport interface MazTextareaProps<T extends string \| undefined \| null> {\n /* Style attribut of the component root element /\n style?: HTMLAttributes['style']\n /* Class attribut of the component root element /\n class?: HTMLAttributes['class']\n /* @model The value of the textarea /\n modelValue?: T\n /* The id of the textarea /\n id?: string\n /* The name of the textarea /\n name?: string\n /* The label of the textarea /\n label?: string\n /* The placeholder of the textarea /\n placeholder?: string\n /* If the textarea is required /\n required?: boolean\n /* If the textarea is disabled /\n disabled?: boolean\n /* If the textarea is readonly /\n readonly?: boolean\n /* If the textarea has an error /\n error?: boolean\n /* If the textarea has a success /\n success?: boolean\n /* If the textarea has a warning /\n warning?: boolean\n /* The hint of the textarea /\n hint?: string\n /* The color of the textarea /\n color?: Color\n /\n Size radius of the component's border\n * @values `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'`\n /\n roundedSize?: 'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'\n /\n If the textarea has a padding\n * @default true\n /\n padding?: boolean\n /\n If the textarea has a transparent background\n * @default false\n /\n transparent?: boolean\n /\n If the textarea has no border\n * @default false\n /\n border?: boolean\n /\n The alignment of the append slot\n * @values `'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'`\n * @default 'end'\n /\n appendJustify?: 'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'\n}\n</script>\n\n<script lang=\"ts\" setup generic=\"T extends string \| undefined \| null\">\nimport { computed, type HTMLAttributes, onBeforeUnmount, onMounted, ref, useSlots } from 'vue'\nimport { useInstanceUniqId } from '../composables/useInstanceUniqId'\nimport { TextareaAutogrow } from './MazTextarea/textarea-autogrow'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazTextareaProps<T>>(), {\n style: undefined,\n class: undefined,\n modelValue: undefined,\n id: undefined,\n name: 'MazTextarea',\n label: undefined,\n placeholder: undefined,\n required: false,\n disabled: false,\n readonly: false,\n error: false,\n success: false,\n warning: false,\n hint: undefined,\n color: 'primary',\n padding: true,\n transparent: false,\n border: true,\n appendJustify: 'end',\n})\n\nconst emits = defineEmits<{\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'update:model-value', value?: T): void\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'input', value?: T): void\n /\n Emitted when the textarea is focused\n * @property {Event} value - The event\n /\n (event: 'focus', value: FocusEvent): void\n /\n Emitted when the textarea is blurred\n * @property {Event} value - The event\n /\n (event: 'blur', value: FocusEvent): void\n /\n Emitted when the textarea value change\n * @property {Event} value - The event\n /\n (event: 'change', value: Event): void\n}>()\n\nlet textareaAutogrow: TextareaAutogrow \| undefined\n\nconst instanceId = useInstanceUniqId({\n componentName: 'MazTextarea',\n providedId: props.id,\n})\n\nconst TextareaElement = ref<HTMLTextAreaElement>()\nconst isFocused = ref(false)\nconst hasValue = computed(() => props.modelValue !== undefined && props.modelValue !== '')\n\nonMounted(() => {\n if (TextareaElement.value) {\n textareaAutogrow = new TextareaAutogrow(TextareaElement.value)\n }\n})\n\nonBeforeUnmount(() => {\n textareaAutogrow?.disconnect()\n})\n\nconst inputValue = computed({\n get: () => props.modelValue,\n set: (value) => {\n emits('update:model-value', value)\n emits('input', value)\n },\n})\n\nfunction focus(event: FocusEvent) {\n emits('focus', event)\n isFocused.value = true\n}\n\nfunction blur(event: FocusEvent) {\n emits('blur', event)\n isFocused.value = false\n}\n\nfunction change(event: Event) {\n emits('change', event)\n}\n\nconst slots = useSlots()\n\nconst hasLabelOrHint = computed(() => props.label \|\| props.hint \|\| !!slots.label)\n\nconst shouldUp = computed(\n () => hasLabelOrHint.value && (isFocused.value \|\| hasValue.value \|\| !!props.placeholder),\n)\n\nconst hasAppend = computed(() => !!slots.append)\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst borderStyle = computed(() => {\n if (props.error)\n return 'maz-border-danger'\n if (props.success)\n return 'maz-border-success'\n if (props.warning)\n return 'maz-border-warning'\n if (isFocused.value) {\n if (props.color === 'black')\n return 'maz-border-black'\n if (props.color === 'danger')\n return 'maz-border-danger'\n if (props.color === 'info')\n return 'maz-border-info'\n if (props.color === 'primary')\n return 'maz-border-primary'\n if (props.color === 'secondary')\n return 'maz-border-secondary'\n if (props.color === 'success')\n return 'maz-border-success'\n if (props.color === 'warning')\n return 'maz-border-warning'\n if (props.color === 'white')\n return 'maz-border-white'\n }\n return '--default-border'\n})\n\nconst hasBorderStyle = computed(() => borderStyle.value !== '--default-border')\n</script>\n\n<template>\n <label\n class=\"m-textarea m-reset-css\"\n :for=\"instanceId\"\n :class=\"[\n {\n '--is-disabled': disabled,\n '--has-label': hasLabelOrHint,\n '--background-transparent': transparent,\n '--padding': padding,\n '--border': border,\n '--has-border-style': hasBorderStyle,\n },\n borderStyle,\n roundedSize ? `--rounded-${roundedSize}` : '--rounded',\n props.class,\n ]\"\n :style=\"[style, `--append-justify: ${appendJustify}`]\"\n >\n <!-- eslint-disable vuejs-accessibility/label-has-for -->\n <label\n v-if=\"hasLabelOrHint\"\n :for=\"instanceId\"\n class=\"m-textarea__label\"\n :class=\"[\n {\n 'maz-text-danger-600': error,\n 'maz-text-success-600': success,\n 'maz-text-warning-600': warning,\n '--has-state': error \|\| warning \|\| success,\n '--should-up': shouldUp,\n },\n ]\"\n >\n <!-- @slot Label - Replace the label -->\n <slot v-if=\"!hint\" name=\"label\">\n {{ label }}\n </slot>\n <span v-else>\n {{ hint }}\n </span>\n <sup v-if=\"required\"></sup>\n </label>\n <!-- eslint-enable vuejs-accessibility/label-has-for -->\n\n <textarea\n :id=\"instanceId\"\n ref=\"TextareaElement\"\n v-bind=\"$attrs\"\n v-model=\"inputValue\"\n :placeholder\n :name\n :disabled\n :required\n :class=\"{ '--has-append': hasAppend }\"\n v-on=\"{\n blur,\n focus,\n change,\n }\"\n />\n <div v-if=\"hasAppend\" class=\"m-textarea__append\">\n <!-- @slot Append - Replace the append -->\n <slot name=\"append\" />\n </div>\n </label>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-textarea {\n @apply maz-min-h-[6.25rem] maz-relative maz-flex maz-flex-col maz-align-top maz-text-normal;\n\n &:not(.--background-transparent, .--is-disabled) {\n @apply maz-bg-color dark:maz-bg-color-light;\n }\n\n &.--border:not(.--is-disabled) {\n @apply maz-border maz-border-solid;\n\n &:not(.--has-border-style) {\n @apply maz-border-border dark:maz-border-color-lighter;\n }\n }\n\n &.--padding {\n @apply maz-px-4 maz-py-3;\n }\n\n &.--rounded-sm {\n @apply maz-rounded-sm;\n }\n\n &.--rounded-md {\n @apply maz-rounded-md;\n }\n\n &.--rounded-lg {\n @apply maz-rounded-lg;\n }\n\n &.--rounded-xl {\n @apply maz-rounded-xl;\n }\n\n &.--rounded-full {\n @apply maz-rounded-full;\n }\n\n &.--rounded {\n @apply maz-rounded;\n }\n\n &.--has-label {\n @apply maz-pt-6;\n }\n\n &__append {\n @apply maz-inline-flex;\n\n justify-content: var(--append-justify);\n }\n\n textarea {\n @apply maz-w-full maz-resize-y maz-outline-none maz-bg-transparent;\n\n &.--has-append {\n @apply maz-pb-4;\n }\n }\n\n &.--is-disabled {\n @apply maz-cursor-not-allowed maz-border-border maz-bg-color-lighter maz-text-muted dark:maz-border-color-lighter;\n\n & * {\n @apply maz-cursor-not-allowed maz-text-muted;\n }\n\n & > label {\n @apply maz-text-gray-300 dark:maz-text-gray-600;\n }\n }\n\n &__label {\n @apply maz-pointer-events-none maz-absolute maz-block maz-w-max maz-origin-top-left maz-truncate;\n @apply maz-left-4 maz-top-3 maz-leading-6;\n @apply maz-flex maz-flex-center;\n\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n\n &.--should-up {\n transform: scale(0.8) translateY(-0.65rem);\n }\n\n &:not(.--has-state) {\n @apply maz-text-muted;\n }\n }\n}\n</style>\n"],"names":["TextareaAutogrow","element","__publicField","debounce","props","__props","emits","__emit","textareaAutogrow","instanceId","useInstanceUniqId","TextareaElement","ref","isFocused","hasValue","computed","onMounted","onBeforeUnmount","inputValue","value","focus","event","blur","change","slots","useSlots","hasLabelOrHint","shouldUp","hasAppend","borderStyle","hasBorderStyle"],"mappings":"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"}

package/dist/components/MazTextarea.mjs CHANGED Viewed

@@ -1,14 +1,14 @@
-import '../assets/MazTextarea.QTMu0OQv.css';var $ = Object.defineProperty;
+import '../assets/MazTextarea.BML1BVBM.css';var $ = Object.defineProperty;
 var I = (r, o, t) => o in r ? $(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
 var z = (r, o, t) => I(r, typeof o != "symbol" ? o + "" : o, t);
 import { defineComponent as R, ref as w, computed as a, onMounted as N, onBeforeUnmount as U, useSlots as C, openBlock as n, createElementBlock as l, normalizeClass as B, unref as m, normalizeStyle as H, renderSlot as k, createTextVNode as A, toDisplayString as E, createCommentVNode as p, withDirectives as D, createElementVNode as J, mergeProps as j, toHandlers as O, vModelText as P } from "vue";
-import { debounce as _ } from "../helpers/debounce.mjs";
-import { useInstanceUniqId as G } from "../composables/useInstanceUniqId.mjs";
+import { useInstanceUniqId as _ } from "../composables/useInstanceUniqId.mjs";
+import { debounce as G } from "../helpers/debounce.mjs";
 import { _ as K } from "../chunks/_plugin-vue_export-helper.CHgC5LLL.mjs";
 class Q {
   constructor(o) {
     z(this, "element");
-    this.element = o, this.onFocus = this.onFocus.bind(this), this.autogrow = this.autogrow.bind(this), this.onResize = _(this.onResize.bind(this), 200), this.connect();
+    this.element = o, this.onFocus = this.onFocus.bind(this), this.autogrow = this.autogrow.bind(this), this.onResize = G(this.onResize.bind(this), 200), this.connect();
   }
   connect() {
     this.element.addEventListener("focus", this.onFocus), this.element.style.resize = "none", this.element.style.boxSizing = "border-box";
@@ -58,7 +58,7 @@ const W = ["for"], X = ["for"], Y = { key: 1 }, Z = { key: 2 }, x = ["id", "plac
   setup(r, { emit: o }) {
     const t = r, s = o;
     let d;
-    const u = G({
+    const u = _({
       componentName: "MazTextarea",
       providedId: t.id
     }), c = w(), i = w(!1), S = a(() => t.modelValue !== void 0 && t.modelValue !== "");
@@ -169,7 +169,7 @@ const W = ["for"], X = ["for"], Y = { key: 1 }, Z = { key: 2 }, x = ["id", "plac
       ])) : p("", !0)
     ], 14, W));
   }
-}), le = /* @__PURE__ */ K(te, [["__scopeId", "data-v-179fee42"]]);
+}), le = /* @__PURE__ */ K(te, [["__scopeId", "data-v-44e79189"]]);
 export {
   le as default
 };

package/dist/components/MazTextarea.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MazTextarea.mjs","sources":["../../src/components/MazTextarea/textarea-autogrow.ts","../../src/components/MazTextarea.vue"],"sourcesContent":["import { debounce } from '@helpers/debounce'\n\nexport class TextareaAutogrow {\n private element: HTMLTextAreaElement\n\n constructor(element: HTMLTextAreaElement) {\n this.element = element\n this.onFocus = this.onFocus.bind(this)\n this.autogrow = this.autogrow.bind(this)\n this.onResize = debounce(this.onResize.bind(this), 200)\n this.connect()\n }\n\n private connect() {\n this.element.addEventListener('focus', this.onFocus)\n this.element.style.resize = 'none'\n this.element.style.boxSizing = 'border-box'\n }\n\n public disconnect() {\n window.removeEventListener('resize', this.onResize)\n this.element.removeEventListener('input', this.autogrow)\n }\n\n private onFocus() {\n this.autogrow()\n this.element.addEventListener('input', this.autogrow)\n window.addEventListener('resize', this.onResize)\n this.element.removeEventListener('focus', this.onFocus)\n }\n\n private onResize() {\n this.autogrow()\n }\n\n private autogrow() {\n this.element.style.height = 'auto'\n this.element.style.overflow = 'hidden'\n this.element.style.height = `${this.element.scrollHeight}px`\n }\n}\n","<script lang=\"ts\">\n/* eslint-disable import/first /\nimport type { Color } from '@components/types'\n\nexport interface MazTextareaProps<T extends string \| undefined \| null> {\n /* Style attribut of the component root element /\n style?: HTMLAttributes['style']\n /* Class attribut of the component root element /\n class?: HTMLAttributes['class']\n /* @model The value of the textarea /\n modelValue?: T\n /* The id of the textarea /\n id?: string\n /* The name of the textarea /\n name?: string\n /* The label of the textarea /\n label?: string\n /* The placeholder of the textarea /\n placeholder?: string\n /* If the textarea is required /\n required?: boolean\n /* If the textarea is disabled /\n disabled?: boolean\n /* If the textarea is readonly /\n readonly?: boolean\n /* If the textarea has an error /\n error?: boolean\n /* If the textarea has a success /\n success?: boolean\n /* If the textarea has a warning /\n warning?: boolean\n /* The hint of the textarea /\n hint?: string\n /* The color of the textarea /\n color?: Color\n /\n Size radius of the component's border\n * @values `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'`\n /\n roundedSize?: 'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'\n /\n If the textarea has a padding\n * @default true\n /\n padding?: boolean\n /\n If the textarea has a transparent background\n * @default false\n /\n transparent?: boolean\n /\n If the textarea has no border\n * @default false\n /\n border?: boolean\n /\n The alignment of the append slot\n * @values `'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'`\n * @default 'end'\n /\n appendJustify?: 'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'\n}\n</script>\n\n<script lang=\"ts\" setup generic=\"T extends string \| undefined \| null\">\nimport { TextareaAutogrow } from '@components/MazTextarea/textarea-autogrow'\nimport { useInstanceUniqId } from '@composables/useInstanceUniqId'\nimport { computed, type HTMLAttributes, onBeforeUnmount, onMounted, ref, useSlots } from 'vue'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazTextareaProps<T>>(), {\n style: undefined,\n class: undefined,\n modelValue: undefined,\n id: undefined,\n name: 'MazTextarea',\n label: undefined,\n placeholder: undefined,\n required: false,\n disabled: false,\n readonly: false,\n error: false,\n success: false,\n warning: false,\n hint: undefined,\n color: 'primary',\n padding: true,\n transparent: false,\n border: true,\n appendJustify: 'end',\n})\n\nconst emits = defineEmits<{\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'update:model-value', value?: T): void\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'input', value?: T): void\n /\n Emitted when the textarea is focused\n * @property {Event} value - The event\n /\n (event: 'focus', value: FocusEvent): void\n /\n Emitted when the textarea is blurred\n * @property {Event} value - The event\n /\n (event: 'blur', value: FocusEvent): void\n /\n Emitted when the textarea value change\n * @property {Event} value - The event\n /\n (event: 'change', value: Event): void\n}>()\n\nlet textareaAutogrow: TextareaAutogrow \| undefined\n\nconst instanceId = useInstanceUniqId({\n componentName: 'MazTextarea',\n providedId: props.id,\n})\n\nconst TextareaElement = ref<HTMLTextAreaElement>()\nconst isFocused = ref(false)\nconst hasValue = computed(() => props.modelValue !== undefined && props.modelValue !== '')\n\nonMounted(() => {\n if (TextareaElement.value) {\n textareaAutogrow = new TextareaAutogrow(TextareaElement.value)\n }\n})\n\nonBeforeUnmount(() => {\n textareaAutogrow?.disconnect()\n})\n\nconst inputValue = computed({\n get: () => props.modelValue,\n set: (value) => {\n emits('update:model-value', value)\n emits('input', value)\n },\n})\n\nfunction focus(event: FocusEvent) {\n emits('focus', event)\n isFocused.value = true\n}\n\nfunction blur(event: FocusEvent) {\n emits('blur', event)\n isFocused.value = false\n}\n\nfunction change(event: Event) {\n emits('change', event)\n}\n\nconst slots = useSlots()\n\nconst hasLabelOrHint = computed(() => props.label \|\| props.hint \|\| !!slots.label)\n\nconst shouldUp = computed(\n () => hasLabelOrHint.value && (isFocused.value \|\| hasValue.value \|\| !!props.placeholder),\n)\n\nconst hasAppend = computed(() => !!slots.append)\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst borderStyle = computed(() => {\n if (props.error)\n return 'maz-border-danger'\n if (props.success)\n return 'maz-border-success'\n if (props.warning)\n return 'maz-border-warning'\n if (isFocused.value) {\n if (props.color === 'black')\n return 'maz-border-black'\n if (props.color === 'danger')\n return 'maz-border-danger'\n if (props.color === 'info')\n return 'maz-border-info'\n if (props.color === 'primary')\n return 'maz-border-primary'\n if (props.color === 'secondary')\n return 'maz-border-secondary'\n if (props.color === 'success')\n return 'maz-border-success'\n if (props.color === 'warning')\n return 'maz-border-warning'\n if (props.color === 'white')\n return 'maz-border-white'\n }\n return '--default-border'\n})\n\nconst hasBorderStyle = computed(() => borderStyle.value !== '--default-border')\n</script>\n\n<template>\n <label\n class=\"m-textarea m-reset-css\"\n :for=\"instanceId\"\n :class=\"[\n {\n '--is-disabled': disabled,\n '--has-label': hasLabelOrHint,\n '--background-transparent': transparent,\n '--padding': padding,\n '--border': border,\n '--has-border-style': hasBorderStyle,\n },\n borderStyle,\n roundedSize ? `--rounded-${roundedSize}` : '--rounded',\n props.class,\n ]\"\n :style=\"[style, `--append-justify: ${appendJustify}`]\"\n >\n <!-- eslint-disable vuejs-accessibility/label-has-for -->\n <label\n v-if=\"hasLabelOrHint\"\n :for=\"instanceId\"\n class=\"m-textarea__label\"\n :class=\"[\n {\n 'maz-text-danger-600': error,\n 'maz-text-success-600': success,\n 'maz-text-warning-600': warning,\n '--has-state': error \|\| warning \|\| success,\n '--should-up': shouldUp,\n },\n ]\"\n >\n <!-- @slot Label - Replace the label -->\n <slot v-if=\"!hint\" name=\"label\">\n {{ label }}\n </slot>\n <span v-else>\n {{ hint }}\n </span>\n <sup v-if=\"required\"></sup>\n </label>\n <!-- eslint-enable vuejs-accessibility/label-has-for -->\n\n <textarea\n :id=\"instanceId\"\n ref=\"TextareaElement\"\n v-bind=\"$attrs\"\n v-model=\"inputValue\"\n :placeholder\n :name\n :disabled\n :required\n :class=\"{ '--has-append': hasAppend }\"\n v-on=\"{\n blur,\n focus,\n change,\n }\"\n />\n <div v-if=\"hasAppend\" class=\"m-textarea__append\">\n <!-- @slot Append - Replace the append -->\n <slot name=\"append\" />\n </div>\n </label>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-textarea {\n @apply maz-min-h-[6.25rem] maz-relative maz-flex maz-flex-col maz-align-top maz-text-normal;\n\n &:not(.--background-transparent, .--is-disabled) {\n @apply maz-bg-color dark:maz-bg-color-light;\n }\n\n &.--border:not(.--is-disabled) {\n @apply maz-border maz-border-solid;\n\n &:not(.--has-border-style) {\n @apply maz-border-border dark:maz-border-color-lighter;\n }\n }\n\n &.--padding {\n @apply maz-px-4 maz-py-3;\n }\n\n &.--rounded-sm {\n @apply maz-rounded-sm;\n }\n\n &.--rounded-md {\n @apply maz-rounded-md;\n }\n\n &.--rounded-lg {\n @apply maz-rounded-lg;\n }\n\n &.--rounded-xl {\n @apply maz-rounded-xl;\n }\n\n &.--rounded-full {\n @apply maz-rounded-full;\n }\n\n &.--rounded {\n @apply maz-rounded;\n }\n\n &.--has-label {\n @apply maz-pt-6;\n }\n\n &__append {\n @apply maz-inline-flex;\n\n justify-content: var(--append-justify);\n }\n\n textarea {\n @apply maz-w-full maz-resize-y maz-outline-none maz-bg-transparent;\n\n &.--has-append {\n @apply maz-pb-4;\n }\n }\n\n &.--is-disabled {\n @apply maz-cursor-not-allowed maz-border-border maz-bg-color-lighter maz-text-muted dark:maz-border-color-lighter;\n\n & * {\n @apply maz-cursor-not-allowed maz-text-muted;\n }\n\n & > label {\n @apply maz-text-gray-300 dark:maz-text-gray-600;\n }\n }\n\n &__label {\n @apply maz-pointer-events-none maz-absolute maz-block maz-w-max maz-origin-top-left maz-truncate;\n @apply maz-left-4 maz-top-3 maz-leading-6;\n @apply maz-flex maz-flex-center;\n\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n\n &.--should-up {\n transform: scale(0.8) translateY(-0.65rem);\n }\n\n &:not(.--has-state) {\n @apply maz-text-muted;\n }\n }\n}\n</style>\n"],"names":["TextareaAutogrow","element","__publicField","debounce","props","__props","emits","__emit","textareaAutogrow","instanceId","useInstanceUniqId","TextareaElement","ref","isFocused","hasValue","computed","onMounted","onBeforeUnmount","inputValue","value","focus","event","blur","change","slots","useSlots","hasLabelOrHint","shouldUp","hasAppend","borderStyle","hasBorderStyle"],"mappings":"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"}
1	+ {"version":3,"file":"MazTextarea.mjs","sources":["../../src/components/MazTextarea/textarea-autogrow.ts","../../src/components/MazTextarea.vue"],"sourcesContent":["import { debounce } from '../../helpers/debounce'\n\nexport class TextareaAutogrow {\n private element: HTMLTextAreaElement\n\n constructor(element: HTMLTextAreaElement) {\n this.element = element\n this.onFocus = this.onFocus.bind(this)\n this.autogrow = this.autogrow.bind(this)\n this.onResize = debounce(this.onResize.bind(this), 200)\n this.connect()\n }\n\n private connect() {\n this.element.addEventListener('focus', this.onFocus)\n this.element.style.resize = 'none'\n this.element.style.boxSizing = 'border-box'\n }\n\n public disconnect() {\n window.removeEventListener('resize', this.onResize)\n this.element.removeEventListener('input', this.autogrow)\n }\n\n private onFocus() {\n this.autogrow()\n this.element.addEventListener('input', this.autogrow)\n window.addEventListener('resize', this.onResize)\n this.element.removeEventListener('focus', this.onFocus)\n }\n\n private onResize() {\n this.autogrow()\n }\n\n private autogrow() {\n this.element.style.height = 'auto'\n this.element.style.overflow = 'hidden'\n this.element.style.height = `${this.element.scrollHeight}px`\n }\n}\n","<script lang=\"ts\">\n/* eslint-disable import/first /\nimport type { Color } from './types'\n\nexport interface MazTextareaProps<T extends string \| undefined \| null> {\n /* Style attribut of the component root element /\n style?: HTMLAttributes['style']\n /* Class attribut of the component root element /\n class?: HTMLAttributes['class']\n /* @model The value of the textarea /\n modelValue?: T\n /* The id of the textarea /\n id?: string\n /* The name of the textarea /\n name?: string\n /* The label of the textarea /\n label?: string\n /* The placeholder of the textarea /\n placeholder?: string\n /* If the textarea is required /\n required?: boolean\n /* If the textarea is disabled /\n disabled?: boolean\n /* If the textarea is readonly /\n readonly?: boolean\n /* If the textarea has an error /\n error?: boolean\n /* If the textarea has a success /\n success?: boolean\n /* If the textarea has a warning /\n warning?: boolean\n /* The hint of the textarea /\n hint?: string\n /* The color of the textarea /\n color?: Color\n /\n Size radius of the component's border\n * @values `'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'`\n /\n roundedSize?: 'none' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'full'\n /\n If the textarea has a padding\n * @default true\n /\n padding?: boolean\n /\n If the textarea has a transparent background\n * @default false\n /\n transparent?: boolean\n /\n If the textarea has no border\n * @default false\n /\n border?: boolean\n /\n The alignment of the append slot\n * @values `'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'`\n * @default 'end'\n /\n appendJustify?: 'start' \| 'end' \| 'center' \| 'space-between' \| 'space-around' \| 'space-evenly'\n}\n</script>\n\n<script lang=\"ts\" setup generic=\"T extends string \| undefined \| null\">\nimport { computed, type HTMLAttributes, onBeforeUnmount, onMounted, ref, useSlots } from 'vue'\nimport { useInstanceUniqId } from '../composables/useInstanceUniqId'\nimport { TextareaAutogrow } from './MazTextarea/textarea-autogrow'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazTextareaProps<T>>(), {\n style: undefined,\n class: undefined,\n modelValue: undefined,\n id: undefined,\n name: 'MazTextarea',\n label: undefined,\n placeholder: undefined,\n required: false,\n disabled: false,\n readonly: false,\n error: false,\n success: false,\n warning: false,\n hint: undefined,\n color: 'primary',\n padding: true,\n transparent: false,\n border: true,\n appendJustify: 'end',\n})\n\nconst emits = defineEmits<{\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'update:model-value', value?: T): void\n /\n Emitted when the value of the textarea change\n * @property {string \| undefined} value - The value of the textarea\n /\n (event: 'input', value?: T): void\n /\n Emitted when the textarea is focused\n * @property {Event} value - The event\n /\n (event: 'focus', value: FocusEvent): void\n /\n Emitted when the textarea is blurred\n * @property {Event} value - The event\n /\n (event: 'blur', value: FocusEvent): void\n /\n Emitted when the textarea value change\n * @property {Event} value - The event\n /\n (event: 'change', value: Event): void\n}>()\n\nlet textareaAutogrow: TextareaAutogrow \| undefined\n\nconst instanceId = useInstanceUniqId({\n componentName: 'MazTextarea',\n providedId: props.id,\n})\n\nconst TextareaElement = ref<HTMLTextAreaElement>()\nconst isFocused = ref(false)\nconst hasValue = computed(() => props.modelValue !== undefined && props.modelValue !== '')\n\nonMounted(() => {\n if (TextareaElement.value) {\n textareaAutogrow = new TextareaAutogrow(TextareaElement.value)\n }\n})\n\nonBeforeUnmount(() => {\n textareaAutogrow?.disconnect()\n})\n\nconst inputValue = computed({\n get: () => props.modelValue,\n set: (value) => {\n emits('update:model-value', value)\n emits('input', value)\n },\n})\n\nfunction focus(event: FocusEvent) {\n emits('focus', event)\n isFocused.value = true\n}\n\nfunction blur(event: FocusEvent) {\n emits('blur', event)\n isFocused.value = false\n}\n\nfunction change(event: Event) {\n emits('change', event)\n}\n\nconst slots = useSlots()\n\nconst hasLabelOrHint = computed(() => props.label \|\| props.hint \|\| !!slots.label)\n\nconst shouldUp = computed(\n () => hasLabelOrHint.value && (isFocused.value \|\| hasValue.value \|\| !!props.placeholder),\n)\n\nconst hasAppend = computed(() => !!slots.append)\n\n// eslint-disable-next-line sonarjs/cognitive-complexity\nconst borderStyle = computed(() => {\n if (props.error)\n return 'maz-border-danger'\n if (props.success)\n return 'maz-border-success'\n if (props.warning)\n return 'maz-border-warning'\n if (isFocused.value) {\n if (props.color === 'black')\n return 'maz-border-black'\n if (props.color === 'danger')\n return 'maz-border-danger'\n if (props.color === 'info')\n return 'maz-border-info'\n if (props.color === 'primary')\n return 'maz-border-primary'\n if (props.color === 'secondary')\n return 'maz-border-secondary'\n if (props.color === 'success')\n return 'maz-border-success'\n if (props.color === 'warning')\n return 'maz-border-warning'\n if (props.color === 'white')\n return 'maz-border-white'\n }\n return '--default-border'\n})\n\nconst hasBorderStyle = computed(() => borderStyle.value !== '--default-border')\n</script>\n\n<template>\n <label\n class=\"m-textarea m-reset-css\"\n :for=\"instanceId\"\n :class=\"[\n {\n '--is-disabled': disabled,\n '--has-label': hasLabelOrHint,\n '--background-transparent': transparent,\n '--padding': padding,\n '--border': border,\n '--has-border-style': hasBorderStyle,\n },\n borderStyle,\n roundedSize ? `--rounded-${roundedSize}` : '--rounded',\n props.class,\n ]\"\n :style=\"[style, `--append-justify: ${appendJustify}`]\"\n >\n <!-- eslint-disable vuejs-accessibility/label-has-for -->\n <label\n v-if=\"hasLabelOrHint\"\n :for=\"instanceId\"\n class=\"m-textarea__label\"\n :class=\"[\n {\n 'maz-text-danger-600': error,\n 'maz-text-success-600': success,\n 'maz-text-warning-600': warning,\n '--has-state': error \|\| warning \|\| success,\n '--should-up': shouldUp,\n },\n ]\"\n >\n <!-- @slot Label - Replace the label -->\n <slot v-if=\"!hint\" name=\"label\">\n {{ label }}\n </slot>\n <span v-else>\n {{ hint }}\n </span>\n <sup v-if=\"required\"></sup>\n </label>\n <!-- eslint-enable vuejs-accessibility/label-has-for -->\n\n <textarea\n :id=\"instanceId\"\n ref=\"TextareaElement\"\n v-bind=\"$attrs\"\n v-model=\"inputValue\"\n :placeholder\n :name\n :disabled\n :required\n :class=\"{ '--has-append': hasAppend }\"\n v-on=\"{\n blur,\n focus,\n change,\n }\"\n />\n <div v-if=\"hasAppend\" class=\"m-textarea__append\">\n <!-- @slot Append - Replace the append -->\n <slot name=\"append\" />\n </div>\n </label>\n</template>\n\n<style lang=\"postcss\" scoped>\n .m-textarea {\n @apply maz-min-h-[6.25rem] maz-relative maz-flex maz-flex-col maz-align-top maz-text-normal;\n\n &:not(.--background-transparent, .--is-disabled) {\n @apply maz-bg-color dark:maz-bg-color-light;\n }\n\n &.--border:not(.--is-disabled) {\n @apply maz-border maz-border-solid;\n\n &:not(.--has-border-style) {\n @apply maz-border-border dark:maz-border-color-lighter;\n }\n }\n\n &.--padding {\n @apply maz-px-4 maz-py-3;\n }\n\n &.--rounded-sm {\n @apply maz-rounded-sm;\n }\n\n &.--rounded-md {\n @apply maz-rounded-md;\n }\n\n &.--rounded-lg {\n @apply maz-rounded-lg;\n }\n\n &.--rounded-xl {\n @apply maz-rounded-xl;\n }\n\n &.--rounded-full {\n @apply maz-rounded-full;\n }\n\n &.--rounded {\n @apply maz-rounded;\n }\n\n &.--has-label {\n @apply maz-pt-6;\n }\n\n &__append {\n @apply maz-inline-flex;\n\n justify-content: var(--append-justify);\n }\n\n textarea {\n @apply maz-w-full maz-resize-y maz-outline-none maz-bg-transparent;\n\n &.--has-append {\n @apply maz-pb-4;\n }\n }\n\n &.--is-disabled {\n @apply maz-cursor-not-allowed maz-border-border maz-bg-color-lighter maz-text-muted dark:maz-border-color-lighter;\n\n & * {\n @apply maz-cursor-not-allowed maz-text-muted;\n }\n\n & > label {\n @apply maz-text-gray-300 dark:maz-text-gray-600;\n }\n }\n\n &__label {\n @apply maz-pointer-events-none maz-absolute maz-block maz-w-max maz-origin-top-left maz-truncate;\n @apply maz-left-4 maz-top-3 maz-leading-6;\n @apply maz-flex maz-flex-center;\n\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n\n &.--should-up {\n transform: scale(0.8) translateY(-0.65rem);\n }\n\n &:not(.--has-state) {\n @apply maz-text-muted;\n }\n }\n}\n</style>\n"],"names":["TextareaAutogrow","element","__publicField","debounce","props","__props","emits","__emit","textareaAutogrow","instanceId","useInstanceUniqId","TextareaElement","ref","isFocused","hasValue","computed","onMounted","onBeforeUnmount","inputValue","value","focus","event","blur","change","slots","useSlots","hasLabelOrHint","shouldUp","hasAppend","borderStyle","hasBorderStyle"],"mappings":"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"}

package/dist/composables/useAos.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useAos.cjs","sources":["../../src/composables/useAos.ts"],"sourcesContent":["import type { AosHandler } from '@plugins/aos'\nimport { injectStrict } from '@helpers/injectStrict'\n\nexport function useAos() {\n return injectStrict<AosHandler>('aos')\n}\n"],"names":["useAos","injectStrict"],"mappings":"+HAGO,SAASA,GAAS,CACvB,OAAOC,EAAAA,aAAyB,KAAK,CACvC"}
1	+ {"version":3,"file":"useAos.cjs","sources":["../../src/composables/useAos.ts"],"sourcesContent":["import type { AosHandler } from '../plugins/aos'\nimport { injectStrict } from '../helpers/injectStrict'\n\nexport function useAos() {\n return injectStrict<AosHandler>('aos')\n}\n"],"names":["useAos","injectStrict"],"mappings":"+HAGO,SAASA,GAAS,CACvB,OAAOC,EAAAA,aAAyB,KAAK,CACvC"}

package/dist/composables/useAos.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useAos.mjs","sources":["../../src/composables/useAos.ts"],"sourcesContent":["import type { AosHandler } from '@plugins/aos'\nimport { injectStrict } from '@helpers/injectStrict'\n\nexport function useAos() {\n return injectStrict<AosHandler>('aos')\n}\n"],"names":["useAos","injectStrict"],"mappings":";AAGO,SAASA,IAAS;AACvB,SAAOC,EAAyB,KAAK;AACvC;"}
1	+ {"version":3,"file":"useAos.mjs","sources":["../../src/composables/useAos.ts"],"sourcesContent":["import type { AosHandler } from '../plugins/aos'\nimport { injectStrict } from '../helpers/injectStrict'\n\nexport function useAos() {\n return injectStrict<AosHandler>('aos')\n}\n"],"names":["useAos","injectStrict"],"mappings":";AAGO,SAASA,IAAS;AACvB,SAAOC,EAAyB,KAAK;AACvC;"}

package/dist/composables/useBreakpoints.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useBreakpoints.cjs","sources":["../../~~src/~~tailwindcss/variables/breakpoints.ts","../../src/composables/useBreakpoints.ts"],"sourcesContent":["import type { ThemeConfig } from 'tailwindcss/types/config'\n\nexport const screens = {\n 'mob-s': '320px',\n 'mob-m': '425px',\n 'mob-l': '576px',\n 'tab-s': '640px', // sm\n 'tab-m': '768px', // md\n 'tab-l': '992px',\n 'lap-s': '1024px', // lg\n 'lap-m': '1280px', // xl\n 'lap-l': '1366px',\n 'lap-xl': '1440px', // 2xl\n 'lap-2xl': '1680px',\n 'lap-3xl': '1920px',\n} satisfies ThemeConfig['screens']\n\nexport function getNumericScreensFromTailwind<\n T extends Record<string, string> \| Record<string, number>,\n>(inputScreens: T) {\n const breakpoints: Record<string, number> = {}\n\n for (const [key, value] of Object.entries(inputScreens)) {\n breakpoints[key] = Number.parseInt(value, 10)\n }\n\n return breakpoints as Record<keyof T, number>\n}\n","import { computed } from 'vue'\nimport { getNumericScreensFromTailwind } from '~~../~~tailwindcss/variables/breakpoints'\nimport { useWindowSize, type UseWindowSizeOptions } from './useWindowSize'\n\nexport interface UseBreakpointsOptions extends UseWindowSizeOptions {\n initialWidth?: number\n initialHeight?: number\n /*\n Listen to window `orientationchange` event\n \n @default true\n /\n listenOrientation?: boolean\n\n /\n Whether the scrollbar should be included in the width and height\n * @default true\n /\n includeScrollbar?: boolean\n /\n List of breakpoints in format `{ [key: string]: string }` (e.g. `{ 'sm': '640px', 'md': '768px' }`)\n /\n breakpoints: Record<string, string> \| Record<string, number>\n /\n Is the breakpoint when the screen is considered not medium (tablet - e.g. `md`)\n * @default 'md'\n /\n mediumBreakPoint?: string\n /\n Is the breakpoint when the screen is considered not medium (laptop - e.g. `lg`)\n * @default 'lg'\n */\n largeBreakPoint?: string\n}\n\nexport function useBreakpoints({\n initialWidth = 0,\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n breakpoints,\n mediumBreakPoint = 'md',\n largeBreakPoint = 'lg',\n}: UseBreakpointsOptions) {\n const { width } = useWindowSize({\n initialWidth, // (SSR) mobile first\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n })\n\n const numericBreakpoints = getNumericScreensFromTailwind(breakpoints)\n\n const isLargeScreen = computed(() => width.value >= numericBreakpoints[largeBreakPoint])\n const isMediumScreen = computed(\n () =>\n width.value >= numericBreakpoints[mediumBreakPoint]\n && width.value < numericBreakpoints[largeBreakPoint],\n )\n const isSmallScreen = computed(() => {\n return width.value >= 0 && width.value < numericBreakpoints[mediumBreakPoint]\n })\n\n return {\n width,\n numericBreakpoints,\n isSmallScreen,\n isLargeScreen,\n isMediumScreen,\n breakpoints,\n }\n}\n"],"names":["getNumericScreensFromTailwind","inputScreens","breakpoints","key","value","useBreakpoints","initialWidth","initialHeight","includeScrollbar","internalWindow","listenOrientation","mediumBreakPoint","largeBreakPoint","width","useWindowSize","numericBreakpoints","isLargeScreen","computed","isMediumScreen","isSmallScreen"],"mappings":"wIAiBO,SAASA,EAEdC,EAAiB,CACjB,MAAMC,EAAsC,CAAC,EAE7C,SAAW,CAACC,EAAKC,CAAK,IAAK,OAAO,QAAQH,CAAY,EACpDC,EAAYC,CAAG,EAAI,OAAO,SAASC,EAAO,EAAE,EAGvC,OAAAF,CACT,CCQO,SAASG,EAAe,CAC7B,aAAAC,EAAe,EACf,cAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,kBAAAC,EACA,YAAAR,EACA,iBAAAS,EAAmB,KACnB,gBAAAC,EAAkB,IACpB,EAA0B,CAClB,KAAA,CAAE,MAAAC,CAAM,EAAIC,gBAAc,CAC9B,aAAAR,EACA,cAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,kBAAAC,CAAA,CACD,EAEKK,EAAqBf,EAA8BE,CAAW,EAE9Dc,EAAgBC,EAAAA,SAAS,IAAMJ,EAAM,OAASE,EAAmBH,CAAe,CAAC,EACjFM,EAAiBD,EAAA,SACrB,IACEJ,EAAM,OAASE,EAAmBJ,CAAgB,GAC/CE,EAAM,MAAQE,EAAmBH,CAAe,CACvD,EACMO,EAAgBF,EAAAA,SAAS,IACtBJ,EAAM,OAAS,GAAKA,EAAM,MAAQE,EAAmBJ,CAAgB,CAC7E,EAEM,MAAA,CACL,MAAAE,EACA,mBAAAE,EACA,cAAAI,EACA,cAAAH,EACA,eAAAE,EACA,YAAAhB,CACF,CACF"}
1	+ {"version":3,"file":"useBreakpoints.cjs","sources":["../../tailwindcss/variables/breakpoints.ts","../../src/composables/useBreakpoints.ts"],"sourcesContent":["import type { ThemeConfig } from 'tailwindcss/types/config'\n\nexport const screens = {\n 'mob-s': '320px',\n 'mob-m': '425px',\n 'mob-l': '576px',\n 'tab-s': '640px', // sm\n 'tab-m': '768px', // md\n 'tab-l': '992px',\n 'lap-s': '1024px', // lg\n 'lap-m': '1280px', // xl\n 'lap-l': '1366px',\n 'lap-xl': '1440px', // 2xl\n 'lap-2xl': '1680px',\n 'lap-3xl': '1920px',\n} satisfies ThemeConfig['screens']\n\nexport function getNumericScreensFromTailwind<\n T extends Record<string, string> \| Record<string, number>,\n>(inputScreens: T) {\n const breakpoints: Record<string, number> = {}\n\n for (const [key, value] of Object.entries(inputScreens)) {\n breakpoints[key] = Number.parseInt(value, 10)\n }\n\n return breakpoints as Record<keyof T, number>\n}\n","import { computed } from 'vue'\nimport { getNumericScreensFromTailwind } from '../../tailwindcss/variables/breakpoints'\nimport { useWindowSize, type UseWindowSizeOptions } from './useWindowSize'\n\nexport interface UseBreakpointsOptions extends UseWindowSizeOptions {\n initialWidth?: number\n initialHeight?: number\n /*\n Listen to window `orientationchange` event\n \n @default true\n /\n listenOrientation?: boolean\n\n /\n Whether the scrollbar should be included in the width and height\n * @default true\n /\n includeScrollbar?: boolean\n /\n List of breakpoints in format `{ [key: string]: string }` (e.g. `{ 'sm': '640px', 'md': '768px' }`)\n /\n breakpoints: Record<string, string> \| Record<string, number>\n /\n Is the breakpoint when the screen is considered not medium (tablet - e.g. `md`)\n * @default 'md'\n /\n mediumBreakPoint?: string\n /\n Is the breakpoint when the screen is considered not medium (laptop - e.g. `lg`)\n * @default 'lg'\n */\n largeBreakPoint?: string\n}\n\nexport function useBreakpoints({\n initialWidth = 0,\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n breakpoints,\n mediumBreakPoint = 'md',\n largeBreakPoint = 'lg',\n}: UseBreakpointsOptions) {\n const { width } = useWindowSize({\n initialWidth, // (SSR) mobile first\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n })\n\n const numericBreakpoints = getNumericScreensFromTailwind(breakpoints)\n\n const isLargeScreen = computed(() => width.value >= numericBreakpoints[largeBreakPoint])\n const isMediumScreen = computed(\n () =>\n width.value >= numericBreakpoints[mediumBreakPoint]\n && width.value < numericBreakpoints[largeBreakPoint],\n )\n const isSmallScreen = computed(() => {\n return width.value >= 0 && width.value < numericBreakpoints[mediumBreakPoint]\n })\n\n return {\n width,\n numericBreakpoints,\n isSmallScreen,\n isLargeScreen,\n isMediumScreen,\n breakpoints,\n }\n}\n"],"names":["getNumericScreensFromTailwind","inputScreens","breakpoints","key","value","useBreakpoints","initialWidth","initialHeight","includeScrollbar","internalWindow","listenOrientation","mediumBreakPoint","largeBreakPoint","width","useWindowSize","numericBreakpoints","isLargeScreen","computed","isMediumScreen","isSmallScreen"],"mappings":"wIAiBO,SAASA,EAEdC,EAAiB,CACjB,MAAMC,EAAsC,CAAC,EAE7C,SAAW,CAACC,EAAKC,CAAK,IAAK,OAAO,QAAQH,CAAY,EACpDC,EAAYC,CAAG,EAAI,OAAO,SAASC,EAAO,EAAE,EAGvC,OAAAF,CACT,CCQO,SAASG,EAAe,CAC7B,aAAAC,EAAe,EACf,cAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,kBAAAC,EACA,YAAAR,EACA,iBAAAS,EAAmB,KACnB,gBAAAC,EAAkB,IACpB,EAA0B,CAClB,KAAA,CAAE,MAAAC,CAAM,EAAIC,gBAAc,CAC9B,aAAAR,EACA,cAAAC,EACA,iBAAAC,EACA,eAAAC,EACA,kBAAAC,CAAA,CACD,EAEKK,EAAqBf,EAA8BE,CAAW,EAE9Dc,EAAgBC,EAAAA,SAAS,IAAMJ,EAAM,OAASE,EAAmBH,CAAe,CAAC,EACjFM,EAAiBD,EAAA,SACrB,IACEJ,EAAM,OAASE,EAAmBJ,CAAgB,GAC/CE,EAAM,MAAQE,EAAmBH,CAAe,CACvD,EACMO,EAAgBF,EAAAA,SAAS,IACtBJ,EAAM,OAAS,GAAKA,EAAM,MAAQE,EAAmBJ,CAAgB,CAC7E,EAEM,MAAA,CACL,MAAAE,EACA,mBAAAE,EACA,cAAAI,EACA,cAAAH,EACA,eAAAE,EACA,YAAAhB,CACF,CACF"}

package/dist/composables/useBreakpoints.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useBreakpoints.mjs","sources":["../../~~src/~~tailwindcss/variables/breakpoints.ts","../../src/composables/useBreakpoints.ts"],"sourcesContent":["import type { ThemeConfig } from 'tailwindcss/types/config'\n\nexport const screens = {\n 'mob-s': '320px',\n 'mob-m': '425px',\n 'mob-l': '576px',\n 'tab-s': '640px', // sm\n 'tab-m': '768px', // md\n 'tab-l': '992px',\n 'lap-s': '1024px', // lg\n 'lap-m': '1280px', // xl\n 'lap-l': '1366px',\n 'lap-xl': '1440px', // 2xl\n 'lap-2xl': '1680px',\n 'lap-3xl': '1920px',\n} satisfies ThemeConfig['screens']\n\nexport function getNumericScreensFromTailwind<\n T extends Record<string, string> \| Record<string, number>,\n>(inputScreens: T) {\n const breakpoints: Record<string, number> = {}\n\n for (const [key, value] of Object.entries(inputScreens)) {\n breakpoints[key] = Number.parseInt(value, 10)\n }\n\n return breakpoints as Record<keyof T, number>\n}\n","import { computed } from 'vue'\nimport { getNumericScreensFromTailwind } from '~~../~~tailwindcss/variables/breakpoints'\nimport { useWindowSize, type UseWindowSizeOptions } from './useWindowSize'\n\nexport interface UseBreakpointsOptions extends UseWindowSizeOptions {\n initialWidth?: number\n initialHeight?: number\n /*\n Listen to window `orientationchange` event\n \n @default true\n /\n listenOrientation?: boolean\n\n /\n Whether the scrollbar should be included in the width and height\n * @default true\n /\n includeScrollbar?: boolean\n /\n List of breakpoints in format `{ [key: string]: string }` (e.g. `{ 'sm': '640px', 'md': '768px' }`)\n /\n breakpoints: Record<string, string> \| Record<string, number>\n /\n Is the breakpoint when the screen is considered not medium (tablet - e.g. `md`)\n * @default 'md'\n /\n mediumBreakPoint?: string\n /\n Is the breakpoint when the screen is considered not medium (laptop - e.g. `lg`)\n * @default 'lg'\n */\n largeBreakPoint?: string\n}\n\nexport function useBreakpoints({\n initialWidth = 0,\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n breakpoints,\n mediumBreakPoint = 'md',\n largeBreakPoint = 'lg',\n}: UseBreakpointsOptions) {\n const { width } = useWindowSize({\n initialWidth, // (SSR) mobile first\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n })\n\n const numericBreakpoints = getNumericScreensFromTailwind(breakpoints)\n\n const isLargeScreen = computed(() => width.value >= numericBreakpoints[largeBreakPoint])\n const isMediumScreen = computed(\n () =>\n width.value >= numericBreakpoints[mediumBreakPoint]\n && width.value < numericBreakpoints[largeBreakPoint],\n )\n const isSmallScreen = computed(() => {\n return width.value >= 0 && width.value < numericBreakpoints[mediumBreakPoint]\n })\n\n return {\n width,\n numericBreakpoints,\n isSmallScreen,\n isLargeScreen,\n isMediumScreen,\n breakpoints,\n }\n}\n"],"names":["getNumericScreensFromTailwind","inputScreens","breakpoints","key","value","useBreakpoints","initialWidth","initialHeight","includeScrollbar","internalWindow","listenOrientation","mediumBreakPoint","largeBreakPoint","width","useWindowSize","numericBreakpoints","isLargeScreen","computed","isMediumScreen","isSmallScreen"],"mappings":";;AAiBO,SAASA,EAEdC,GAAiB;AACjB,QAAMC,IAAsC,CAAC;AAE7C,aAAW,CAACC,GAAKC,CAAK,KAAK,OAAO,QAAQH,CAAY;AACpD,IAAAC,EAAYC,CAAG,IAAI,OAAO,SAASC,GAAO,EAAE;AAGvC,SAAAF;AACT;ACQO,SAASG,EAAe;AAAA,EAC7B,cAAAC,IAAe;AAAA,EACf,eAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,aAAAR;AAAA,EACA,kBAAAS,IAAmB;AAAA,EACnB,iBAAAC,IAAkB;AACpB,GAA0B;AAClB,QAAA,EAAE,OAAAC,EAAM,IAAIC,EAAc;AAAA,IAC9B,cAAAR;AAAA;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,mBAAAC;AAAA,EAAA,CACD,GAEKK,IAAqBf,EAA8BE,CAAW,GAE9Dc,IAAgBC,EAAS,MAAMJ,EAAM,SAASE,EAAmBH,CAAe,CAAC,GACjFM,IAAiBD;AAAA,IACrB,MACEJ,EAAM,SAASE,EAAmBJ,CAAgB,KAC/CE,EAAM,QAAQE,EAAmBH,CAAe;AAAA,EACvD,GACMO,IAAgBF,EAAS,MACtBJ,EAAM,SAAS,KAAKA,EAAM,QAAQE,EAAmBJ,CAAgB,CAC7E;AAEM,SAAA;AAAA,IACL,OAAAE;AAAA,IACA,oBAAAE;AAAA,IACA,eAAAI;AAAA,IACA,eAAAH;AAAA,IACA,gBAAAE;AAAA,IACA,aAAAhB;AAAA,EACF;AACF;"}
1	+ {"version":3,"file":"useBreakpoints.mjs","sources":["../../tailwindcss/variables/breakpoints.ts","../../src/composables/useBreakpoints.ts"],"sourcesContent":["import type { ThemeConfig } from 'tailwindcss/types/config'\n\nexport const screens = {\n 'mob-s': '320px',\n 'mob-m': '425px',\n 'mob-l': '576px',\n 'tab-s': '640px', // sm\n 'tab-m': '768px', // md\n 'tab-l': '992px',\n 'lap-s': '1024px', // lg\n 'lap-m': '1280px', // xl\n 'lap-l': '1366px',\n 'lap-xl': '1440px', // 2xl\n 'lap-2xl': '1680px',\n 'lap-3xl': '1920px',\n} satisfies ThemeConfig['screens']\n\nexport function getNumericScreensFromTailwind<\n T extends Record<string, string> \| Record<string, number>,\n>(inputScreens: T) {\n const breakpoints: Record<string, number> = {}\n\n for (const [key, value] of Object.entries(inputScreens)) {\n breakpoints[key] = Number.parseInt(value, 10)\n }\n\n return breakpoints as Record<keyof T, number>\n}\n","import { computed } from 'vue'\nimport { getNumericScreensFromTailwind } from '../../tailwindcss/variables/breakpoints'\nimport { useWindowSize, type UseWindowSizeOptions } from './useWindowSize'\n\nexport interface UseBreakpointsOptions extends UseWindowSizeOptions {\n initialWidth?: number\n initialHeight?: number\n /*\n Listen to window `orientationchange` event\n \n @default true\n /\n listenOrientation?: boolean\n\n /\n Whether the scrollbar should be included in the width and height\n * @default true\n /\n includeScrollbar?: boolean\n /\n List of breakpoints in format `{ [key: string]: string }` (e.g. `{ 'sm': '640px', 'md': '768px' }`)\n /\n breakpoints: Record<string, string> \| Record<string, number>\n /\n Is the breakpoint when the screen is considered not medium (tablet - e.g. `md`)\n * @default 'md'\n /\n mediumBreakPoint?: string\n /\n Is the breakpoint when the screen is considered not medium (laptop - e.g. `lg`)\n * @default 'lg'\n */\n largeBreakPoint?: string\n}\n\nexport function useBreakpoints({\n initialWidth = 0,\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n breakpoints,\n mediumBreakPoint = 'md',\n largeBreakPoint = 'lg',\n}: UseBreakpointsOptions) {\n const { width } = useWindowSize({\n initialWidth, // (SSR) mobile first\n initialHeight,\n includeScrollbar,\n internalWindow,\n listenOrientation,\n })\n\n const numericBreakpoints = getNumericScreensFromTailwind(breakpoints)\n\n const isLargeScreen = computed(() => width.value >= numericBreakpoints[largeBreakPoint])\n const isMediumScreen = computed(\n () =>\n width.value >= numericBreakpoints[mediumBreakPoint]\n && width.value < numericBreakpoints[largeBreakPoint],\n )\n const isSmallScreen = computed(() => {\n return width.value >= 0 && width.value < numericBreakpoints[mediumBreakPoint]\n })\n\n return {\n width,\n numericBreakpoints,\n isSmallScreen,\n isLargeScreen,\n isMediumScreen,\n breakpoints,\n }\n}\n"],"names":["getNumericScreensFromTailwind","inputScreens","breakpoints","key","value","useBreakpoints","initialWidth","initialHeight","includeScrollbar","internalWindow","listenOrientation","mediumBreakPoint","largeBreakPoint","width","useWindowSize","numericBreakpoints","isLargeScreen","computed","isMediumScreen","isSmallScreen"],"mappings":";;AAiBO,SAASA,EAEdC,GAAiB;AACjB,QAAMC,IAAsC,CAAC;AAE7C,aAAW,CAACC,GAAKC,CAAK,KAAK,OAAO,QAAQH,CAAY;AACpD,IAAAC,EAAYC,CAAG,IAAI,OAAO,SAASC,GAAO,EAAE;AAGvC,SAAAF;AACT;ACQO,SAASG,EAAe;AAAA,EAC7B,cAAAC,IAAe;AAAA,EACf,eAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,aAAAR;AAAA,EACA,kBAAAS,IAAmB;AAAA,EACnB,iBAAAC,IAAkB;AACpB,GAA0B;AAClB,QAAA,EAAE,OAAAC,EAAM,IAAIC,EAAc;AAAA,IAC9B,cAAAR;AAAA;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,mBAAAC;AAAA,EAAA,CACD,GAEKK,IAAqBf,EAA8BE,CAAW,GAE9Dc,IAAgBC,EAAS,MAAMJ,EAAM,SAASE,EAAmBH,CAAe,CAAC,GACjFM,IAAiBD;AAAA,IACrB,MACEJ,EAAM,SAASE,EAAmBJ,CAAgB,KAC/CE,EAAM,QAAQE,EAAmBH,CAAe;AAAA,EACvD,GACMO,IAAgBF,EAAS,MACtBJ,EAAM,SAAS,KAAKA,EAAM,QAAQE,EAAmBJ,CAAgB,CAC7E;AAEM,SAAA;AAAA,IACL,OAAAE;AAAA,IACA,oBAAAE;AAAA,IACA,eAAAI;AAAA,IACA,eAAAH;AAAA,IACA,gBAAAE;AAAA,IACA,aAAAhB;AAAA,EACF;AACF;"}

package/dist/composables/useDialog.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDialog.cjs","sources":["../../src/composables/useDialog.ts"],"sourcesContent":["import type { DialogHandler } from '@plugins/dialog/DialogHandler'\nimport { injectStrict } from '@helpers/injectStrict'\n\nexport function useDialog() {\n return injectStrict<DialogHandler>('dialog')\n}\n"],"names":["useDialog","injectStrict"],"mappings":"+HAGO,SAASA,GAAY,CAC1B,OAAOC,EAAAA,aAA4B,QAAQ,CAC7C"}
1	+ {"version":3,"file":"useDialog.cjs","sources":["../../src/composables/useDialog.ts"],"sourcesContent":["import type { DialogHandler } from '../plugins/dialog/DialogHandler'\nimport { injectStrict } from '../helpers/injectStrict'\n\nexport function useDialog() {\n return injectStrict<DialogHandler>('dialog')\n}\n"],"names":["useDialog","injectStrict"],"mappings":"+HAGO,SAASA,GAAY,CAC1B,OAAOC,EAAAA,aAA4B,QAAQ,CAC7C"}

package/dist/composables/useDialog.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDialog.mjs","sources":["../../src/composables/useDialog.ts"],"sourcesContent":["import type { DialogHandler } from '@plugins/dialog/DialogHandler'\nimport { injectStrict } from '@helpers/injectStrict'\n\nexport function useDialog() {\n return injectStrict<DialogHandler>('dialog')\n}\n"],"names":["useDialog","injectStrict"],"mappings":";AAGO,SAASA,IAAY;AAC1B,SAAOC,EAA4B,QAAQ;AAC7C;"}
1	+ {"version":3,"file":"useDialog.mjs","sources":["../../src/composables/useDialog.ts"],"sourcesContent":["import type { DialogHandler } from '../plugins/dialog/DialogHandler'\nimport { injectStrict } from '../helpers/injectStrict'\n\nexport function useDialog() {\n return injectStrict<DialogHandler>('dialog')\n}\n"],"names":["useDialog","injectStrict"],"mappings":";AAGO,SAASA,IAAY;AAC1B,SAAOC,EAA4B,QAAQ;AAC7C;"}

package/dist/composables/useFormField.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../chunks/utils.vGzCTXH5.cjs"),S=require("../helpers/checkAvailability.cjs"),V=require("../helpers/freezeValue.cjs"),y=require("../helpers/isEqual.cjs"),t=require("vue");function I(e,s){const i={formIdentifier:"main-form-validator",...s},{fieldsStates:c,payload:u,options:m,internalSchema:v,errorMessages:E,isSubmitted:g}=l.getContext(i.formIdentifier,"useFormField"),o=l.fieldHasValidation(e,v.value)?(s==null?void 0:s.mode)??m.mode:void 0;i.mode=o;const a=t.computed(()=>c.value[e]);if(c.value[e]=l.updateFieldState({name:e,fieldState:a.value,payload:u.value,schema:v.value,options:{...m,...i}}),i.defaultValue!==void 0&&!y.isEqual(u.value[e],i.defaultValue)){const r=i.defaultValue;u.value[e]=r,c.value[e].initialValue=V.freezeValue(r)}o&&l.setFieldValidationState({name:e,fieldState:a.value,payload:u.value,schema:v.value,setError:o==="aggressive",setErrorIfInvalidAndNotEmpty:o==="lazy"});function n(){l.handleFieldBlur({name:e,fieldState:a.value,payload:u.value,schema:v.value,isSubmitted:g.value})}const F=t.computed(()=>l.getValidationEvents({ref:i.ref,onBlur:n,fieldState:a.value}));if(i.ref&&l.hasModeIncludes(["eager","blur","progressive"],o)){let r=[];const h=f=>{r=l.findInteractiveElements(f),l.addEventToInteractiveElements({interactiveElements:r,onBlur:n,mode:o})};t.onMounted(()=>{const f=l.getInstance(`useFormField of ${e}`);S.checkAvailability(()=>f.refs[i.ref],d=>{const p=d instanceof HTMLElement?d:d==null?void 0:d.$el;p&&h(p)},{errorMessage:`[maz-ui](useFormField) No element found for ref ${i.ref} for field ${e}`})}),t.onUnmounted(()=>{l.removeEventFromInteractiveElements({interactiveElements:r,onBlur:n})})}return{hasError:t.computed(()=>a.value.error),errors:t.computed(()=>a.value.errors),errorMessage:t.computed(()=>E.value[e]),isValid:t.computed(()=>a.value.valid),isDirty:t.computed(()=>a.value.dirty),isBlurred:t.computed(()=>a.value.blurred),isValidated:t.computed(()=>a.value.validated),isValidating:t.computed(()=>a.value.validating),mode:t.computed(()=>a.value.mode),value:t.computed({get:()=>u.value[e],set:r=>u.value[e]=r}),validationEvents:F,onBlur:n}}exports.useFormField=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),l=require("../chunks/utils.K864VNFX.cjs"),S=require("../helpers/checkAvailability.cjs"),V=require("../helpers/freezeValue.cjs"),y=require("../helpers/isEqual.cjs");function I(e,s){const i={formIdentifier:"main-form-validator",...s},{fieldsStates:c,payload:u,options:m,internalSchema:v,errorMessages:E,isSubmitted:g}=l.getContext(i.formIdentifier,"useFormField"),o=l.fieldHasValidation(e,v.value)?(s==null?void 0:s.mode)??m.mode:void 0;i.mode=o;const a=t.computed(()=>c.value[e]);if(c.value[e]=l.updateFieldState({name:e,fieldState:a.value,payload:u.value,schema:v.value,options:{...m,...i}}),i.defaultValue!==void 0&&!y.isEqual(u.value[e],i.defaultValue)){const r=i.defaultValue;u.value[e]=r,c.value[e].initialValue=V.freezeValue(r)}o&&l.setFieldValidationState({name:e,fieldState:a.value,payload:u.value,schema:v.value,setError:o==="aggressive",setErrorIfInvalidAndNotEmpty:o==="lazy"});function n(){l.handleFieldBlur({name:e,fieldState:a.value,payload:u.value,schema:v.value,isSubmitted:g.value})}const F=t.computed(()=>l.getValidationEvents({ref:i.ref,onBlur:n,fieldState:a.value}));if(i.ref&&l.hasModeIncludes(["eager","blur","progressive"],o)){let r=[];const h=f=>{r=l.findInteractiveElements(f),l.addEventToInteractiveElements({interactiveElements:r,onBlur:n,mode:o})};t.onMounted(()=>{const f=l.getInstance(`useFormField of ${e}`);S.checkAvailability(()=>f.refs[i.ref],d=>{const p=d instanceof HTMLElement?d:d==null?void 0:d.$el;p&&h(p)},{errorMessage:`[maz-ui](useFormField) No element found for ref ${i.ref} for field ${e}`})}),t.onUnmounted(()=>{l.removeEventFromInteractiveElements({interactiveElements:r,onBlur:n})})}return{hasError:t.computed(()=>a.value.error),errors:t.computed(()=>a.value.errors),errorMessage:t.computed(()=>E.value[e]),isValid:t.computed(()=>a.value.valid),isDirty:t.computed(()=>a.value.dirty),isBlurred:t.computed(()=>a.value.blurred),isValidated:t.computed(()=>a.value.validated),isValidating:t.computed(()=>a.value.validating),mode:t.computed(()=>a.value.mode),value:t.computed({get:()=>u.value[e],set:r=>u.value[e]=r}),validationEvents:F,onBlur:n}}exports.useFormField=I;
 //# sourceMappingURL=useFormField.cjs.map

package/dist/composables/useFormField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFormField.cjs","sources":["../../src/composables/useFormField.ts"],"sourcesContent":["import type {\n BaseFormPayload,\n ExtractModelKey,\n FormFieldOptions,\n FormSchema,\n ValidationIssues,\n} from '@composables/useFormValidator/types'\nimport ~~type~~ { ~~ComponentPublicInstance~~, ~~ComputedRef~~, ~~WritableComputedRef~~ } from 'vue'\n\nimport {\n addEventToInteractiveElements,\n fieldHasValidation,\n findInteractiveElements,\n getContext,\n getInstance,\n getValidationEvents,\n handleFieldBlur,\n hasModeIncludes,\n removeEventFromInteractiveElements,\n setFieldValidationState,\n updateFieldState,\n} from '@composables/useFormValidator/utils'\nimport { checkAvailability } from '@helpers/checkAvailability'\nimport { freezeValue } from '@helpers/freezeValue'\nimport { isEqual } from '@helpers/isEqual'\~~nimport { computed, onMounted, onUnmounted } from 'vue'\~~n\ninterface UseFormFieldReturn<FieldType> {\n /*\n Indicates if the field has an error\n /\n hasError: ComputedRef<boolean>\n /\n Errors of the field\n /\n errors: ComputedRef<ValidationIssues>\n /\n Error message of the field\n * It's the first error of the field\n /\n errorMessage: ComputedRef<string \| undefined>\n /\n Indicates if the field is valid\n /\n isValid: ComputedRef<boolean>\n /\n Indicates if the field has been modified\n /\n isDirty: ComputedRef<boolean>\n /\n Indicates if the field has been blurred\n /\n isBlurred: ComputedRef<boolean>\n /\n Indicates if the field has been validated\n /\n isValidated: ComputedRef<boolean>\n /\n Indicates if the field is validating\n /\n isValidating: ComputedRef<boolean>\n /\n Validation mode of the field\n /\n mode: ComputedRef<FormFieldOptions<FieldType>['mode']>\n /\n Value of the field\n /\n value: WritableComputedRef<FieldType>\n /\n Validation events of the field\n /\n validationEvents: ComputedRef<ReturnType<typeof getValidationEvents>>\n /\n Function to handle the blur event of the field\n */\n onBlur: () => void\n}\n\nexport function useFormField<\n FieldType extends Model[ExtractModelKey<FormSchema<Model>>],\n Model extends BaseFormPayload = BaseFormPayload,\n>(name: ExtractModelKey<FormSchema<Model>>, options?: FormFieldOptions<FieldType>): UseFormFieldReturn<FieldType> {\n const opts = {\n formIdentifier: 'main-form-validator',\n ...options,\n } satisfies FormFieldOptions<FieldType>\n\n const {\n fieldsStates,\n payload,\n options: formOptions,\n internalSchema,\n errorMessages,\n isSubmitted,\n } = getContext<Model>(opts.formIdentifier, 'useFormField')\n\n const fieldMode = fieldHasValidation(name, internalSchema.value) ? options?.mode ?? formOptions.mode : undefined\n opts.mode = fieldMode\n\n const fieldState = computed(() => fieldsStates.value[name])\n\n fieldsStates.value[name] = updateFieldState<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n options: { ...formOptions, ...opts },\n })\n\n if (opts.defaultValue !== undefined && !isEqual(payload.value[name], opts.defaultValue)) {\n const initialValue = opts.defaultValue\n payload.value[name] = initialValue\n fieldsStates.value[name].initialValue = freezeValue(initialValue)\n }\n\n if (fieldMode) {\n setFieldValidationState<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n setError: fieldMode === 'aggressive',\n setErrorIfInvalidAndNotEmpty: fieldMode === 'lazy',\n })\n }\n\n function onBlur() {\n handleFieldBlur<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n isSubmitted: isSubmitted.value,\n })\n }\n\n const validationEvents = computed(() =>\n getValidationEvents({\n ref: opts.ref,\n onBlur,\n fieldState: fieldState.value,\n }),\n )\n\n if (opts.ref && hasModeIncludes(['eager', 'blur', 'progressive'], fieldMode)) {\n let interactiveElements: HTMLElement[] = []\n\n const handleInteractiveElements = (element: HTMLElement) => {\n interactiveElements = findInteractiveElements(element)\n addEventToInteractiveElements({\n interactiveElements,\n onBlur,\n mode: fieldMode,\n })\n }\n\n onMounted(() => {\n const instance = getInstance<Model>(`useFormField of ${name as string}`)\n\n checkAvailability(() => instance.refs[opts.ref as string] as HTMLElement \| ComponentPublicInstance \| undefined, (element) => {\n const interactiveElement = element instanceof HTMLElement ? element : element?.$el as HTMLElement \| undefined\n if (interactiveElement) {\n handleInteractiveElements(interactiveElement)\n }\n }, {\n errorMessage: `[maz-ui](useFormField) No element found for ref ${opts.ref} for field ${name as string}`,\n })\n })\n\n onUnmounted(() => {\n removeEventFromInteractiveElements({\n interactiveElements,\n onBlur,\n })\n })\n }\n\n return {\n hasError: computed(() => fieldState.value.error),\n errors: computed(() => fieldState.value.errors),\n errorMessage: computed(() => errorMessages.value[name]),\n isValid: computed(() => fieldState.value.valid),\n isDirty: computed(() => fieldState.value.dirty),\n isBlurred: computed(() => fieldState.value.blurred),\n isValidated: computed(() => fieldState.value.validated),\n isValidating: computed(() => fieldState.value.validating),\n mode: computed(() => fieldState.value.mode),\n value: computed({\n get: () => payload.value[name] as FieldType,\n set: value => (payload.value[name] = value),\n }),\n validationEvents,\n onBlur,\n }\n}\n"],"names":["useFormField","name","options","opts","fieldsStates","payload","formOptions","internalSchema","errorMessages","isSubmitted","getContext","fieldMode","fieldHasValidation","fieldState","computed","updateFieldState","isEqual","initialValue","freezeValue","setFieldValidationState","onBlur","handleFieldBlur","validationEvents","getValidationEvents","hasModeIncludes","interactiveElements","handleInteractiveElements","element","findInteractiveElements","addEventToInteractiveElements","onMounted","instance","getInstance","checkAvailability","interactiveElement","onUnmounted","removeEventFromInteractiveElements","value"],"mappings":"~~2QA+EgB~~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"}
1	+ {"version":3,"file":"useFormField.cjs","sources":["../../src/composables/useFormField.ts"],"sourcesContent":["import type { ComponentPublicInstance, ComputedRef, WritableComputedRef } from 'vue'\nimport type {\n BaseFormPayload,\n ExtractModelKey,\n FormFieldOptions,\n FormSchema,\n ValidationIssues,\n} from '../composables/useFormValidator/types'\n\nimport { computed, onMounted, onUnmounted } from 'vue'\n\nimport {\n addEventToInteractiveElements,\n fieldHasValidation,\n findInteractiveElements,\n getContext,\n getInstance,\n getValidationEvents,\n handleFieldBlur,\n hasModeIncludes,\n removeEventFromInteractiveElements,\n setFieldValidationState,\n updateFieldState,\n} from '../composables/useFormValidator/utils'\nimport { checkAvailability } from '../helpers/checkAvailability'\nimport { freezeValue } from '../helpers/freezeValue'\nimport { isEqual } from '../helpers/isEqual'\n\ninterface UseFormFieldReturn<FieldType> {\n /*\n Indicates if the field has an error\n /\n hasError: ComputedRef<boolean>\n /\n Errors of the field\n /\n errors: ComputedRef<ValidationIssues>\n /\n Error message of the field\n * It's the first error of the field\n /\n errorMessage: ComputedRef<string \| undefined>\n /\n Indicates if the field is valid\n /\n isValid: ComputedRef<boolean>\n /\n Indicates if the field has been modified\n /\n isDirty: ComputedRef<boolean>\n /\n Indicates if the field has been blurred\n /\n isBlurred: ComputedRef<boolean>\n /\n Indicates if the field has been validated\n /\n isValidated: ComputedRef<boolean>\n /\n Indicates if the field is validating\n /\n isValidating: ComputedRef<boolean>\n /\n Validation mode of the field\n /\n mode: ComputedRef<FormFieldOptions<FieldType>['mode']>\n /\n Value of the field\n /\n value: WritableComputedRef<FieldType>\n /\n Validation events of the field\n /\n validationEvents: ComputedRef<ReturnType<typeof getValidationEvents>>\n /\n Function to handle the blur event of the field\n */\n onBlur: () => void\n}\n\nexport function useFormField<\n FieldType extends Model[ExtractModelKey<FormSchema<Model>>],\n Model extends BaseFormPayload = BaseFormPayload,\n>(name: ExtractModelKey<FormSchema<Model>>, options?: FormFieldOptions<FieldType>): UseFormFieldReturn<FieldType> {\n const opts = {\n formIdentifier: 'main-form-validator',\n ...options,\n } satisfies FormFieldOptions<FieldType>\n\n const {\n fieldsStates,\n payload,\n options: formOptions,\n internalSchema,\n errorMessages,\n isSubmitted,\n } = getContext<Model>(opts.formIdentifier, 'useFormField')\n\n const fieldMode = fieldHasValidation(name, internalSchema.value) ? options?.mode ?? formOptions.mode : undefined\n opts.mode = fieldMode\n\n const fieldState = computed(() => fieldsStates.value[name])\n\n fieldsStates.value[name] = updateFieldState<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n options: { ...formOptions, ...opts },\n })\n\n if (opts.defaultValue !== undefined && !isEqual(payload.value[name], opts.defaultValue)) {\n const initialValue = opts.defaultValue\n payload.value[name] = initialValue\n fieldsStates.value[name].initialValue = freezeValue(initialValue)\n }\n\n if (fieldMode) {\n setFieldValidationState<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n setError: fieldMode === 'aggressive',\n setErrorIfInvalidAndNotEmpty: fieldMode === 'lazy',\n })\n }\n\n function onBlur() {\n handleFieldBlur<Model>({\n name,\n fieldState: fieldState.value,\n payload: payload.value,\n schema: internalSchema.value,\n isSubmitted: isSubmitted.value,\n })\n }\n\n const validationEvents = computed(() =>\n getValidationEvents({\n ref: opts.ref,\n onBlur,\n fieldState: fieldState.value,\n }),\n )\n\n if (opts.ref && hasModeIncludes(['eager', 'blur', 'progressive'], fieldMode)) {\n let interactiveElements: HTMLElement[] = []\n\n const handleInteractiveElements = (element: HTMLElement) => {\n interactiveElements = findInteractiveElements(element)\n addEventToInteractiveElements({\n interactiveElements,\n onBlur,\n mode: fieldMode,\n })\n }\n\n onMounted(() => {\n const instance = getInstance<Model>(`useFormField of ${name as string}`)\n\n checkAvailability(() => instance.refs[opts.ref as string] as HTMLElement \| ComponentPublicInstance \| undefined, (element) => {\n const interactiveElement = element instanceof HTMLElement ? element : element?.$el as HTMLElement \| undefined\n if (interactiveElement) {\n handleInteractiveElements(interactiveElement)\n }\n }, {\n errorMessage: `[maz-ui](useFormField) No element found for ref ${opts.ref} for field ${name as string}`,\n })\n })\n\n onUnmounted(() => {\n removeEventFromInteractiveElements({\n interactiveElements,\n onBlur,\n })\n })\n }\n\n return {\n hasError: computed(() => fieldState.value.error),\n errors: computed(() => fieldState.value.errors),\n errorMessage: computed(() => errorMessages.value[name]),\n isValid: computed(() => fieldState.value.valid),\n isDirty: computed(() => fieldState.value.dirty),\n isBlurred: computed(() => fieldState.value.blurred),\n isValidated: computed(() => fieldState.value.validated),\n isValidating: computed(() => fieldState.value.validating),\n mode: computed(() => fieldState.value.mode),\n value: computed({\n get: () => payload.value[name] as FieldType,\n set: value => (payload.value[name] = value),\n }),\n validationEvents,\n onBlur,\n }\n}\n"],"names":["useFormField","name","options","opts","fieldsStates","payload","formOptions","internalSchema","errorMessages","isSubmitted","getContext","fieldMode","fieldHasValidation","fieldState","computed","updateFieldState","isEqual","initialValue","freezeValue","setFieldValidationState","onBlur","handleFieldBlur","validationEvents","getValidationEvents","hasModeIncludes","interactiveElements","handleInteractiveElements","element","findInteractiveElements","addEventToInteractiveElements","onMounted","instance","getInstance","checkAvailability","interactiveElement","onUnmounted","removeEventFromInteractiveElements","value"],"mappings":"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"}

package/dist/composables/useFormField.mjs CHANGED Viewed

@@ -1,8 +1,8 @@
-import { e as V, f as S, i as I, j as h, k as y, d as M, g as b, r as $, l as z, m as B, n as k } from "../chunks/utils.Bex2hM45.mjs";
-import { checkAvailability as x } from "../helpers/checkAvailability.mjs";
-import { freezeValue as A } from "../helpers/freezeValue.mjs";
-import { isEqual as H } from "../helpers/isEqual.mjs";
-import { computed as t, onMounted as N, onUnmounted as T } from "vue";
+import { computed as t, onMounted as V, onUnmounted as S } from "vue";
+import { e as I, f as h, i as y, j as M, k as b, d as $, g as z, r as B, l as k, m as x, n as A } from "../chunks/utils.BxNCknPj.mjs";
+import { checkAvailability as H } from "../helpers/checkAvailability.mjs";
+import { freezeValue as N } from "../helpers/freezeValue.mjs";
+import { isEqual as T } from "../helpers/isEqual.mjs";
 function O(e, d) {
   const l = {
     formIdentifier: "main-form-validator",
@@ -14,20 +14,20 @@ function O(e, d) {
     internalSchema: u,
     errorMessages: E,
     isSubmitted: g
-  } = V(l.formIdentifier, "useFormField"), o = S(e, u.value) ? (d == null ? void 0 : d.mode) ?? c.mode : void 0;
+  } = I(l.formIdentifier, "useFormField"), o = h(e, u.value) ? (d == null ? void 0 : d.mode) ?? c.mode : void 0;
   l.mode = o;
   const a = t(() => f.value[e]);
-  if (f.value[e] = I({
+  if (f.value[e] = y({
     name: e,
     fieldState: a.value,
     payload: r.value,
     schema: u.value,
     options: { ...c, ...l }
-  }), l.defaultValue !== void 0 && !H(r.value[e], l.defaultValue)) {
+  }), l.defaultValue !== void 0 && !T(r.value[e], l.defaultValue)) {
     const i = l.defaultValue;
-    r.value[e] = i, f.value[e].initialValue = A(i);
+    r.value[e] = i, f.value[e].initialValue = N(i);
   }
-  o && h({
+  o && M({
     name: e,
     fieldState: a.value,
     payload: r.value,
@@ -36,7 +36,7 @@ function O(e, d) {
     setErrorIfInvalidAndNotEmpty: o === "lazy"
   });
   function v() {
-    z({
+    k({
       name: e,
       fieldState: a.value,
       payload: r.value,
@@ -45,31 +45,31 @@ function O(e, d) {
     });
   }
   const p = t(
-    () => y({
+    () => b({
       ref: l.ref,
       onBlur: v,
       fieldState: a.value
     })
   );
-  if (l.ref && M(["eager", "blur", "progressive"], o)) {
+  if (l.ref && $(["eager", "blur", "progressive"], o)) {
     let i = [];
     const F = (n) => {
-      i = B(n), k({
+      i = x(n), A({
         interactiveElements: i,
         onBlur: v,
         mode: o
       });
     };
-    N(() => {
-      const n = b(`useFormField of ${e}`);
-      x(() => n.refs[l.ref], (s) => {
+    V(() => {
+      const n = z(`useFormField of ${e}`);
+      H(() => n.refs[l.ref], (s) => {
         const m = s instanceof HTMLElement ? s : s == null ? void 0 : s.$el;
         m && F(m);
       }, {
         errorMessage: `[maz-ui](useFormField) No element found for ref ${l.ref} for field ${e}`
       });
-    }), T(() => {
-      $({
+    }), S(() => {
+      B({
         interactiveElements: i,
         onBlur: v
       });