UNPKG

maz-ui

Version:

A standalone components library for Vue.Js 3 & Nuxt.Js 3

56 lines (55 loc) 2.39 kB
import { defineComponent, ref, watch, createElementBlock, openBlock, Fragment, renderList, createBlock, withModifiers, normalizeClass, withCtx, createTextVNode, toDisplayString } from "vue"; import MazBtn from "../components/MazBtn.js"; import { _ as _export_sfc } from "./_plugin-vue_export-helper.B--vMWp3.js"; import '../assets/MazPickerShortcuts.CCyYVPVa.css';const _hoisted_1 = { class: "maz-picker-shortcuts" }, _sfc_main = /* @__PURE__ */ defineComponent({ __name: "MazPickerShortcuts", props: { color: {}, modelValue: {}, shortcuts: { type: [Array, Boolean] }, double: { type: Boolean }, shortcut: {}, disabled: { type: Boolean } }, emits: ["update:model-value"], setup(__props, { emit: __emit }) { const props = __props, emits = __emit, selectedShortcut = ref(props.shortcut); function selectShortcut(value, identifier) { selectedShortcut.value = identifier, emits("update:model-value", value); } return watch( () => props.modelValue, (value) => { value?.end || (selectedShortcut.value = void 0); } ), watch( () => props.shortcut, (shortcut) => { const newShortcut = props.shortcuts && props.shortcuts.find(({ identifier }) => shortcut === identifier); if (newShortcut) { const { value, identifier } = newShortcut; selectShortcut(value, identifier); } }, { immediate: !0 } ), (_ctx, _cache) => (openBlock(), createElementBlock("div", _hoisted_1, [ (openBlock(!0), createElementBlock(Fragment, null, renderList(__props.shortcuts, ({ identifier, label, value }) => (openBlock(), createBlock(MazBtn, { key: identifier, type: "button", size: "sm", disabled: __props.disabled, color: identifier === selectedShortcut.value ? props.color : "transparent", class: normalizeClass({ "--is-selected": identifier === selectedShortcut.value }), onClick: withModifiers(($event) => selectShortcut(value, identifier), ["stop"]) }, { default: withCtx(() => [ createTextVNode(toDisplayString(label), 1) ]), _: 2 }, 1032, ["disabled", "color", "class", "onClick"]))), 128)) ])); } }), MazPickerShortcuts = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-849a6bf8"]]); export { MazPickerShortcuts as default };