ablok-components 0.0.18 → 0.0.21

package/dist/ablok-components.es.js

@@ -1,9 +1,22 @@
-import { defineComponent, resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, createElementVNode, renderSlot, computed, createBlock, createCommentVNode, unref, toDisplayString, withDirectives, isRef, vModelDynamic, createTextVNode, ref, watch, onBeforeMount, Fragment, renderList, getCurrentInstance, inject, markRaw, reactive, effectScope, isReactive, toRaw, onUnmounted, nextTick, toRefs, getCurrentScope, onScopeDispose, shallowRef, withModifiers } from "vue";
-var baseIcon_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}\n")();
+import { defineComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, computed, resolveComponent, createBlock, createCommentVNode, unref, toDisplayString, withDirectives, isRef, vModelDynamic, createTextVNode, ref, watch, onBeforeMount, Fragment, renderList, withModifiers } from "vue";
+var svgIcon_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".svg-icon{display:inline-block}.svg-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.svg-icon--xxl svg{width:12rem;height:12rem}.svg-icon--xl svg{width:8rem;height:8rem}.svg-icon--large svg{width:4rem;height:4rem}\n")();
+const _hoisted_1$6 = {
+  class: "icon",
+  preserveAspectRatio: "xMaxYMin"
+};
+const _hoisted_2$5 = ["xlink:href"];
 const _sfc_main$6 = /* @__PURE__ */ defineComponent({
-  __name: "base-icon",
+  __name: "svg-icon",
   props: {
-    id: {
+    basePath: {
+      type: String,
+      default: "/static/symbol-defs.svg"
+    },
+    prefix: {
+      type: String,
+      default: "icon-"
+    },
+    symbol: {
       type: String,
       default: ""
     },
@@ -14,16 +27,19 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      const _component_SvgSprite = resolveComponent("SvgSprite");
-      return openBlock(), createElementBlock("span", {
-        class: normalizeClass(["base-icon", {
-          [`base-icon--${__props.size}`]: __props.size
+      return openBlock(), createElementBlock("i", {
+        class: normalizeClass(["svg-icon", {
+          [`svg-icon--${__props.size}`]: __props.size
         }])
       }, [
-        createVNode(_component_SvgSprite, {
-          symbol: `icon-${__props.id}`,
-          role: "presentation"
-        }, null, 8, ["symbol"])
+        (openBlock(), createElementBlock("svg", _hoisted_1$6, [
+          createElementVNode("use", {
+            "xlink:href": `${__props.basePath}#${__props.prefix}${__props.symbol}`,
+            "xmlns:xlink": "http://www.w3.org/1999/xlink",
+            x: "0",
+            y: "0"
+          }, null, 8, _hoisted_2$5)
+        ]))
       ], 2);
     };
   }
@@ -31,7 +47,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
 var loadingSpinner_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".loading-spinner{min-width:2rem}\n")();
 const _hoisted_1$5 = { class: "loading-spinner d-block" };
 const _hoisted_2$4 = { class: "loading-spinner__animation" };
-const _hoisted_3$1 = {
+const _hoisted_3$2 = {
   class: "d-block",
   version: "1.1",
   id: "L9",
@@ -43,8 +59,8 @@ const _hoisted_3$1 = {
   "enable-background": "new 0 0 0 0",
   "xml:space": "preserve"
 };
-const _hoisted_4 = ["fill"];
-const _hoisted_5 = /* @__PURE__ */ createElementVNode("animateTransform", {
+const _hoisted_4$2 = ["fill"];
+const _hoisted_5$1 = /* @__PURE__ */ createElementVNode("animateTransform", {
   attributeName: "transform",
   attributeType: "XML",
   type: "rotate",
@@ -53,8 +69,8 @@ const _hoisted_5 = /* @__PURE__ */ createElementVNode("animateTransform", {
   to: "360 50 50",
   repeatCount: "indefinite"
 }, null, -1);
-const _hoisted_6 = [
-  _hoisted_5
+const _hoisted_6$1 = [
+  _hoisted_5$1
 ];
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "loading-spinner",
@@ -68,11 +84,11 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("span", _hoisted_1$5, [
         createElementVNode("span", _hoisted_2$4, [
-          (openBlock(), createElementBlock("svg", _hoisted_3$1, [
+          (openBlock(), createElementBlock("svg", _hoisted_3$2, [
             createElementVNode("path", {
               fill: __props.color,
               d: "M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"
-            }, _hoisted_6, 8, _hoisted_4)
+            }, _hoisted_6$1, 8, _hoisted_4$2)
           ]))
         ]),
         renderSlot(_ctx.$slots, "default")
@@ -104,13 +120,13 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       return props.caption && !props.fab;
     });
     return (_ctx, _cache) => {
-      const _component_base_icon = resolveComponent("base-icon");
+      const _component_svg_icon = resolveComponent("svg-icon");
       return openBlock(), createElementBlock("button", {
         type: __props.type,
         disabled: __props.disabled,
         href: __props.href,
         to: __props.to,
-        class: normalizeClass(["base-button", {
+        class: normalizeClass(["base-button btn btn-primary", {
           disabled: __props.disabled,
           pending: __props.pending,
           rounded: __props.rounded,
@@ -123,7 +139,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         }])
       }, [
         renderSlot(_ctx.$slots, "default", {}, () => [
-          __props.icon ? (openBlock(), createBlock(_component_base_icon, {
+          __props.icon ? (openBlock(), createBlock(_component_svg_icon, {
             key: 0,
             id: __props.icon,
             class: "base-button__caption"
@@ -141,8 +157,9 @@ function uniqueId() {
   return (new Date().valueOf() + Math.random()).toString(36);
 }
 const _hoisted_1$3 = { class: "base-input" };
-const _hoisted_2$3 = ["type", "name", "id", "label", "placeholder", "pattern", "disabled", "read-only", "required", "maxlength", "checked"];
-const _hoisted_3 = ["for"];
+const _hoisted_2$3 = { class: "input-group" };
+const _hoisted_3$1 = ["type", "name", "id", "label", "placeholder", "pattern", "disabled", "read-only", "required", "maxlength", "checked", "aria-label"];
+const _hoisted_4$1 = ["for"];
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   __name: "base-input",
   props: {
@@ -211,27 +228,33 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$3, [
-        withDirectives(createElementVNode("input", {
-          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(model) ? model.value = $event : null),
-          type: __props.type,
-          name: __props.name,
-          id: __props.id,
-          label: `${__props.label}${__props.required ? " *" : ""}`,
-          placeholder: __props.placeholder,
-          pattern: __props.pattern,
-          disabled: __props.disabled,
-          "read-only": __props.readOnly,
-          required: __props.required,
-          maxlength: __props.maxlength,
-          checked: __props.checked
-        }, null, 8, _hoisted_2$3), [
-          [vModelDynamic, unref(model)]
+        createElementVNode("div", _hoisted_2$3, [
+          renderSlot(_ctx.$slots, "input-prepend"),
+          withDirectives(createElementVNode("input", {
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(model) ? model.value = $event : null),
+            type: __props.type,
+            name: __props.name,
+            id: __props.id,
+            label: `${__props.label}${__props.required ? " *" : ""}`,
+            placeholder: __props.placeholder,
+            pattern: __props.pattern,
+            disabled: __props.disabled,
+            "read-only": __props.readOnly,
+            required: __props.required,
+            maxlength: __props.maxlength,
+            checked: __props.checked,
+            class: "form-control",
+            "aria-label": __props.label
+          }, null, 8, _hoisted_3$1), [
+            [vModelDynamic, unref(model)]
+          ]),
+          renderSlot(_ctx.$slots, "input-append")
         ]),
         createElementVNode("label", { for: __props.id }, [
           renderSlot(_ctx.$slots, "label", {}, () => [
             createTextVNode(toDisplayString(__props.label), 1)
           ])
-        ], 8, _hoisted_3)
+        ], 8, _hoisted_4$1)
       ]);
     };
   }
@@ -396,631 +419,133 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-/*!
-  * pinia v2.0.14
-  * (c) 2022 Eduardo San Martin Morote
-  * @license MIT
-  */
-let activePinia;
-const setActivePinia = (pinia) => activePinia = pinia;
-const piniaSymbol = Symbol();
-function isPlainObject(o) {
-  return o && typeof o === "object" && Object.prototype.toString.call(o) === "[object Object]" && typeof o.toJSON !== "function";
-}
-var MutationType;
-(function(MutationType2) {
-  MutationType2["direct"] = "direct";
-  MutationType2["patchObject"] = "patch object";
-  MutationType2["patchFunction"] = "patch function";
-})(MutationType || (MutationType = {}));
-const noop$1 = () => {
+const _hoisted_1 = { class: "input input-dropdown" };
+const _hoisted_2 = { class: "dropdown" };
+const _hoisted_3 = {
+  class: "btn-group",
+  role: "group"
 };
-function addSubscription(subscriptions, callback, detached, onCleanup = noop$1) {
-  subscriptions.push(callback);
-  const removeSubscription = () => {
-    const idx = subscriptions.indexOf(callback);
-    if (idx > -1) {
-      subscriptions.splice(idx, 1);
-      onCleanup();
-    }
-  };
-  if (!detached && getCurrentInstance()) {
-    onUnmounted(removeSubscription);
-  }
-  return removeSubscription;
-}
-function triggerSubscriptions(subscriptions, ...args) {
-  subscriptions.slice().forEach((callback) => {
-    callback(...args);
-  });
-}
-function mergeReactiveObjects(target, patchToApply) {
-  for (const key in patchToApply) {
-    if (!patchToApply.hasOwnProperty(key))
-      continue;
-    const subPatch = patchToApply[key];
-    const targetValue = target[key];
-    if (isPlainObject(targetValue) && isPlainObject(subPatch) && target.hasOwnProperty(key) && !isRef(subPatch) && !isReactive(subPatch)) {
-      target[key] = mergeReactiveObjects(targetValue, subPatch);
-    } else {
-      target[key] = subPatch;
-    }
-  }
-  return target;
-}
-const skipHydrateSymbol = Symbol();
-function shouldHydrate(obj) {
-  return !isPlainObject(obj) || !obj.hasOwnProperty(skipHydrateSymbol);
-}
-const { assign } = Object;
-function isComputed(o) {
-  return !!(isRef(o) && o.effect);
-}
-function createOptionsStore(id, options, pinia, hot) {
-  const { state, actions, getters } = options;
-  const initialState = pinia.state.value[id];
-  let store;
-  function setup() {
-    if (!initialState && true) {
-      {
-        pinia.state.value[id] = state ? state() : {};
-      }
-    }
-    const localState = toRefs(pinia.state.value[id]);
-    return assign(localState, actions, Object.keys(getters || {}).reduce((computedGetters, name) => {
-      computedGetters[name] = markRaw(computed(() => {
-        setActivePinia(pinia);
-        const store2 = pinia._s.get(id);
-        return getters[name].call(store2, store2);
-      }));
-      return computedGetters;
-    }, {}));
-  }
-  store = createSetupStore(id, setup, options, pinia, hot, true);
-  store.$reset = function $reset() {
-    const newState = state ? state() : {};
-    this.$patch(($state) => {
-      assign($state, newState);
-    });
-  };
-  return store;
-}
-function createSetupStore($id, setup, options = {}, pinia, hot, isOptionsStore) {
-  let scope;
-  const optionsForPlugin = assign({ actions: {} }, options);
-  const $subscribeOptions = {
-    deep: true
-  };
-  let isListening;
-  let isSyncListening;
-  let subscriptions = markRaw([]);
-  let actionSubscriptions = markRaw([]);
-  let debuggerEvents;
-  const initialState = pinia.state.value[$id];
-  if (!isOptionsStore && !initialState && true) {
-    {
-      pinia.state.value[$id] = {};
-    }
-  }
-  ref({});
-  let activeListener;
-  function $patch(partialStateOrMutator) {
-    let subscriptionMutation;
-    isListening = isSyncListening = false;
-    if (typeof partialStateOrMutator === "function") {
-      partialStateOrMutator(pinia.state.value[$id]);
-      subscriptionMutation = {
-        type: MutationType.patchFunction,
-        storeId: $id,
-        events: debuggerEvents
-      };
-    } else {
-      mergeReactiveObjects(pinia.state.value[$id], partialStateOrMutator);
-      subscriptionMutation = {
-        type: MutationType.patchObject,
-        payload: partialStateOrMutator,
-        storeId: $id,
-        events: debuggerEvents
-      };
-    }
-    const myListenerId = activeListener = Symbol();
-    nextTick().then(() => {
-      if (activeListener === myListenerId) {
-        isListening = true;
-      }
-    });
-    isSyncListening = true;
-    triggerSubscriptions(subscriptions, subscriptionMutation, pinia.state.value[$id]);
-  }
-  const $reset = noop$1;
-  function $dispose() {
-    scope.stop();
-    subscriptions = [];
-    actionSubscriptions = [];
-    pinia._s.delete($id);
-  }
-  function wrapAction(name, action) {
-    return function() {
-      setActivePinia(pinia);
-      const args = Array.from(arguments);
-      const afterCallbackList = [];
-      const onErrorCallbackList = [];
-      function after(callback) {
-        afterCallbackList.push(callback);
-      }
-      function onError(callback) {
-        onErrorCallbackList.push(callback);
-      }
-      triggerSubscriptions(actionSubscriptions, {
-        args,
-        name,
-        store,
-        after,
-        onError
-      });
-      let ret;
-      try {
-        ret = action.apply(this && this.$id === $id ? this : store, args);
-      } catch (error) {
-        triggerSubscriptions(onErrorCallbackList, error);
-        throw error;
-      }
-      if (ret instanceof Promise) {
-        return ret.then((value) => {
-          triggerSubscriptions(afterCallbackList, value);
-          return value;
-        }).catch((error) => {
-          triggerSubscriptions(onErrorCallbackList, error);
-          return Promise.reject(error);
-        });
-      }
-      triggerSubscriptions(afterCallbackList, ret);
-      return ret;
-    };
-  }
-  const partialStore = {
-    _p: pinia,
-    $id,
-    $onAction: addSubscription.bind(null, actionSubscriptions),
-    $patch,
-    $reset,
-    $subscribe(callback, options2 = {}) {
-      const removeSubscription = addSubscription(subscriptions, callback, options2.detached, () => stopWatcher());
-      const stopWatcher = scope.run(() => watch(() => pinia.state.value[$id], (state) => {
-        if (options2.flush === "sync" ? isSyncListening : isListening) {
-          callback({
-            storeId: $id,
-            type: MutationType.direct,
-            events: debuggerEvents
-          }, state);
-        }
-      }, assign({}, $subscribeOptions, options2)));
-      return removeSubscription;
+const _hoisted_4 = ["id", "disabled"];
+const _hoisted_5 = ["aria-labelledby"];
+const _hoisted_6 = ["onClick"];
+const _hoisted_7 = ["for"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "input-dropdown",
+  props: {
+    modelValue: {
+      type: [String, Number, Boolean, Object],
+      default: ""
     },
-    $dispose
-  };
-  const store = reactive(assign({}, partialStore));
-  pinia._s.set($id, store);
-  const setupStore = pinia._e.run(() => {
-    scope = effectScope();
-    return scope.run(() => setup());
-  });
-  for (const key in setupStore) {
-    const prop = setupStore[key];
-    if (isRef(prop) && !isComputed(prop) || isReactive(prop)) {
-      if (!isOptionsStore) {
-        if (initialState && shouldHydrate(prop)) {
-          if (isRef(prop)) {
-            prop.value = initialState[key];
-          } else {
-            mergeReactiveObjects(prop, initialState[key]);
-          }
-        }
-        {
-          pinia.state.value[$id][key] = prop;
-        }
-      }
-    } else if (typeof prop === "function") {
-      const actionValue = wrapAction(key, prop);
-      {
-        setupStore[key] = actionValue;
-      }
-      optionsForPlugin.actions[key] = prop;
-    } else
-      ;
-  }
-  {
-    assign(store, setupStore);
-    assign(toRaw(store), setupStore);
-  }
-  Object.defineProperty(store, "$state", {
-    get: () => pinia.state.value[$id],
-    set: (state) => {
-      $patch(($state) => {
-        assign($state, state);
-      });
-    }
-  });
-  pinia._p.forEach((extender) => {
-    {
-      assign(store, scope.run(() => extender({
-        store,
-        app: pinia._a,
-        pinia,
-        options: optionsForPlugin
-      })));
-    }
-  });
-  if (initialState && isOptionsStore && options.hydrate) {
-    options.hydrate(store.$state, initialState);
-  }
-  isListening = true;
-  isSyncListening = true;
-  return store;
-}
-function defineStore(idOrOptions, setup, setupOptions) {
-  let id;
-  let options;
-  const isSetupStore = typeof setup === "function";
-  if (typeof idOrOptions === "string") {
-    id = idOrOptions;
-    options = isSetupStore ? setupOptions : setup;
-  } else {
-    options = idOrOptions;
-    id = idOrOptions.id;
-  }
-  function useStore(pinia, hot) {
-    const currentInstance = getCurrentInstance();
-    pinia = pinia || currentInstance && inject(piniaSymbol);
-    if (pinia)
-      setActivePinia(pinia);
-    pinia = activePinia;
-    if (!pinia._s.has(id)) {
-      if (isSetupStore) {
-        createSetupStore(id, setup, options, pinia);
-      } else {
-        createOptionsStore(id, options, pinia);
-      }
-    }
-    const store = pinia._s.get(id);
-    return store;
-  }
-  useStore.$id = id;
-  return useStore;
-}
-function tryOnScopeDispose(fn) {
-  if (getCurrentScope()) {
-    onScopeDispose(fn);
-    return true;
-  }
-  return false;
-}
-var _a;
-const isClient = typeof window !== "undefined";
-const isString = (val) => typeof val === "string";
-const noop = () => {
-};
-isClient && ((_a = window == null ? void 0 : window.navigator) == null ? void 0 : _a.userAgent) && /iP(ad|hone|od)/.test(window.navigator.userAgent);
-function createFilterWrapper(filter, fn) {
-  function wrapper(...args) {
-    filter(() => fn.apply(this, args), { fn, thisArg: this, args });
-  }
-  return wrapper;
-}
-const bypassFilter = (invoke) => {
-  return invoke();
-};
-function pausableFilter(extendFilter = bypassFilter) {
-  const isActive = ref(true);
-  function pause() {
-    isActive.value = false;
-  }
-  function resume() {
-    isActive.value = true;
-  }
-  const eventFilter = (...args) => {
-    if (isActive.value)
-      extendFilter(...args);
-  };
-  return { isActive, pause, resume, eventFilter };
-}
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __objRest$5 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$5.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$5.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function watchWithFilter(source, cb, options = {}) {
-  const _a2 = options, {
-    eventFilter = bypassFilter
-  } = _a2, watchOptions = __objRest$5(_a2, [
-    "eventFilter"
-  ]);
-  return watch(source, createFilterWrapper(eventFilter, cb), watchOptions);
-}
-var __defProp$1 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-var __objRest$1 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-function watchPausable(source, cb, options = {}) {
-  const _a2 = options, {
-    eventFilter: filter
-  } = _a2, watchOptions = __objRest$1(_a2, [
-    "eventFilter"
-  ]);
-  const { eventFilter, pause, resume, isActive } = pausableFilter(filter);
-  const stop = watchWithFilter(source, cb, __spreadProps$1(__spreadValues$1({}, watchOptions), {
-    eventFilter
-  }));
-  return { stop, pause, resume, isActive };
-}
-function unrefElement(elRef) {
-  var _a2;
-  const plain = unref(elRef);
-  return (_a2 = plain == null ? void 0 : plain.$el) != null ? _a2 : plain;
-}
-const defaultWindow = isClient ? window : void 0;
-isClient ? window.document : void 0;
-isClient ? window.navigator : void 0;
-isClient ? window.location : void 0;
-function useEventListener(...args) {
-  let target;
-  let event;
-  let listener;
-  let options;
-  if (isString(args[0])) {
-    [event, listener, options] = args;
-    target = defaultWindow;
-  } else {
-    [target, event, listener, options] = args;
-  }
-  if (!target)
-    return noop;
-  let cleanup = noop;
-  const stopWatch = watch(() => unrefElement(target), (el) => {
-    cleanup();
-    if (!el)
-      return;
-    el.addEventListener(event, listener, options);
-    cleanup = () => {
-      el.removeEventListener(event, listener, options);
-      cleanup = noop;
-    };
-  }, { immediate: true, flush: "post" });
-  const stop = () => {
-    stopWatch();
-    cleanup();
-  };
-  tryOnScopeDispose(stop);
-  return stop;
-}
-const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
-const globalKey = "__vueuse_ssr_handlers__";
-_global[globalKey] = _global[globalKey] || {};
-const handlers = _global[globalKey];
-function getSSRHandler(key, fallback) {
-  return handlers[key] || fallback;
-}
-function guessSerializerType(rawInit) {
-  return rawInit == null ? "any" : rawInit instanceof Set ? "set" : rawInit instanceof Map ? "map" : rawInit instanceof Date ? "date" : typeof rawInit === "boolean" ? "boolean" : typeof rawInit === "string" ? "string" : typeof rawInit === "object" ? "object" : Array.isArray(rawInit) ? "object" : !Number.isNaN(rawInit) ? "number" : "any";
-}
-const StorageSerializers = {
-  boolean: {
-    read: (v) => v === "true",
-    write: (v) => String(v)
-  },
-  object: {
-    read: (v) => JSON.parse(v),
-    write: (v) => JSON.stringify(v)
-  },
-  number: {
-    read: (v) => Number.parseFloat(v),
-    write: (v) => String(v)
-  },
-  any: {
-    read: (v) => v,
-    write: (v) => String(v)
-  },
-  string: {
-    read: (v) => v,
-    write: (v) => String(v)
-  },
-  map: {
-    read: (v) => new Map(JSON.parse(v)),
-    write: (v) => JSON.stringify(Array.from(v.entries()))
-  },
-  set: {
-    read: (v) => new Set(JSON.parse(v)),
-    write: (v) => JSON.stringify(Array.from(v))
-  },
-  date: {
-    read: (v) => new Date(v),
-    write: (v) => v.toISOString()
-  }
-};
-function useStorage(key, initialValue, storage, options = {}) {
-  var _a2;
-  const {
-    flush = "pre",
-    deep = true,
-    listenToStorageChanges = true,
-    writeDefaults = true,
-    shallow,
-    window: window2 = defaultWindow,
-    eventFilter,
-    onError = (e) => {
-      console.error(e);
-    }
-  } = options;
-  const data = (shallow ? shallowRef : ref)(initialValue);
-  if (!storage) {
-    try {
-      storage = getSSRHandler("getDefaultStorage", () => {
-        var _a22;
-        return (_a22 = defaultWindow) == null ? void 0 : _a22.localStorage;
-      })();
-    } catch (e) {
-      onError(e);
-    }
-  }
-  if (!storage)
-    return data;
-  const rawInit = unref(initialValue);
-  const type = guessSerializerType(rawInit);
-  const serializer = (_a2 = options.serializer) != null ? _a2 : StorageSerializers[type];
-  const { pause: pauseWatch, resume: resumeWatch } = watchPausable(data, () => write(data.value), { flush, deep, eventFilter });
-  if (window2 && listenToStorageChanges)
-    useEventListener(window2, "storage", update);
-  update();
-  return data;
-  function write(v) {
-    try {
-      if (v == null)
-        storage.removeItem(key);
-      else
-        storage.setItem(key, serializer.write(v));
-    } catch (e) {
-      onError(e);
-    }
-  }
-  function read(event) {
-    if (event && event.key !== key)
-      return;
-    pauseWatch();
-    try {
-      const rawValue = event ? event.newValue : storage.getItem(key);
-      if (rawValue == null) {
-        if (writeDefaults && rawInit !== null)
-          storage.setItem(key, serializer.write(rawInit));
-        return rawInit;
-      } else if (typeof rawValue !== "string") {
-        return rawValue;
-      } else {
-        return serializer.read(rawValue);
-      }
-    } catch (e) {
-      onError(e);
-    } finally {
-      resumeWatch();
-    }
-  }
-  function update(event) {
-    if (event && event.key !== key)
-      return;
-    data.value = read(event);
-  }
-}
-var SwipeDirection;
-(function(SwipeDirection2) {
-  SwipeDirection2["UP"] = "UP";
-  SwipeDirection2["RIGHT"] = "RIGHT";
-  SwipeDirection2["DOWN"] = "DOWN";
-  SwipeDirection2["LEFT"] = "LEFT";
-  SwipeDirection2["NONE"] = "NONE";
-})(SwipeDirection || (SwipeDirection = {}));
-const useAuthUserStore = defineStore("auth/user", {
-  state: () => ({
-    firstName: useStorage("firstName", ""),
-    lastName: "",
-    userId: null
-  }),
-  getters: {
-    fullName: (state) => `${state.firstName} ${state.lastName}`,
-    loggedIn: (state) => state.userId !== null,
-    fullUserDetails(state) {
-      return {
-        ...state,
-        fullName: this.fullName
-      };
-    }
-  },
-  actions: {
-    updateUser(payload) {
-      this.firstName = payload.firstName;
-      this.lastName = payload.lastName;
-      this.userId = payload.userId;
+    name: {
+      type: String,
+      default: () => uniqueId()
+    },
+    id: {
+      type: String,
+      default: () => uniqueId()
     },
-    clearUser() {
-      this.$reset();
+    label: {
+      type: String,
+      default: ""
+    },
+    placeholder: {
+      type: String,
+      default: "Please select"
+    },
+    options: {
+      type: Array,
+      default: []
+    },
+    variant: {
+      type: String,
+      default: ""
+    },
+    color: {
+      type: String,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    required: {
+      type: Boolean,
+      default: false
+    },
+    resetOption: {
+      type: Boolean,
+      default: true
     }
-  }
-});
-var baseForm_vue_vue_type_style_index_0_lang = /* @__PURE__ */ (() => ".base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}\n")();
-const _hoisted_1 = { class: "base-form" };
-const _hoisted_2 = ["onSubmit"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "base-form",
-  props: {
-    id: null,
-    name: null,
-    variant: null,
-    disabled: { type: Boolean },
-    pending: { type: Boolean }
   },
-  setup(__props) {
-    const authUserStore = useAuthUserStore();
-    computed(() => authUserStore.firstName);
-    computed(() => authUserStore.fullName);
-    function input(event) {
-      authUserStore.updateUser({
-        firstName: event.target.value
-      });
-      console.log("input", event);
-    }
-    function reset(event) {
-      console.log("reset", event);
-    }
-    function submit(event) {
-      console.log("submit", event);
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    computed({
+      get() {
+        return props.modelValue;
+      },
+      set(update) {
+        emit("update:modelValue", update);
+      }
+    });
+    function select(update) {
+      emit("update:modelValue", update);
     }
+    const extendedOptions = computed(() => {
+      return [
+        {
+          text: "Please select"
+        },
+        ...props.options.map((option) => typeof option === "string" ? { value: option, text: option } : option)
+      ];
+    });
+    const selectedOption = computed(() => {
+      return [...props.options].find((option) => JSON.stringify(option.value) === JSON.stringify(props.modelValue));
+    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("form", {
-          ref: "form",
-          onInput: input,
-          onReset: reset,
-          onSubmit: withModifiers(submit, ["prevent"])
-        }, [
-          renderSlot(_ctx.$slots, "default")
-        ], 40, _hoisted_2)
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("button", {
+              class: normalizeClass(["btn dropdown-toggle", {
+                [`button-${__props.variant}`]: __props.variant,
+                [`button-${__props.color}`]: __props.color,
+                [`button-${__props.disabled}`]: __props.disabled
+              }]),
+              type: "button",
+              id: __props.id,
+              "data-bs-toggle": "dropdown",
+              "aria-expanded": "false",
+              disabled: __props.disabled
+            }, toDisplayString(unref(selectedOption) ? unref(selectedOption).text : __props.placeholder), 11, _hoisted_4),
+            createElementVNode("ul", {
+              class: "dropdown-menu",
+              "aria-labelledby": __props.id
+            }, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(unref(extendedOptions), (option, index) => {
+                return openBlock(), createElementBlock("li", { key: index }, [
+                  renderSlot(_ctx.$slots, "option", {}, () => [
+                    createElementVNode("a", {
+                      class: "dropdown-item",
+                      onClick: withModifiers(($event) => select(option.value), ["prevent"])
+                    }, toDisplayString(option.text), 9, _hoisted_6)
+                  ])
+                ]);
+              }), 128))
+            ], 8, _hoisted_5)
+          ])
+        ]),
+        createElementVNode("label", { for: __props.id }, [
+          renderSlot(_ctx.$slots, "label", {}, () => [
+            createTextVNode(toDisplayString(__props.label), 1)
+          ])
+        ], 8, _hoisted_7)
       ]);
     };
   }
 });
-export { _sfc_main$4 as BaseButton, _sfc_main as BaseForm, _sfc_main$6 as BaseIcon, _sfc_main$3 as BaseInput, _sfc_main$2 as CheckGroup, _sfc_main$5 as LoadingSpinner, _sfc_main$1 as RadioGroup };
+export { _sfc_main$4 as BaseButton, _sfc_main$3 as BaseInput, _sfc_main$2 as CheckGroup, _sfc_main as InputDropdown, _sfc_main$5 as LoadingSpinner, _sfc_main$1 as RadioGroup, _sfc_main$6 as SvgIcon };

package/dist/ablok-components.umd.js

@@ -1,9 +1,4 @@
-(function(b,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(b=typeof globalThis!="undefined"?globalThis:b||self,t(b.AblokComponents={},b.Vue))})(this,function(b,t){"use strict";var tt=(()=>`.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}
-`)();const ne=t.defineComponent({__name:"base-icon",props:{id:{type:String,default:""},size:{type:String,default:"default"}},setup(e){return(a,o)=>{const n=t.resolveComponent("SvgSprite");return t.openBlock(),t.createElementBlock("span",{class:t.normalizeClass(["base-icon",{[`base-icon--${e.size}`]:e.size}])},[t.createVNode(n,{symbol:`icon-${e.id}`,role:"presentation"},null,8,["symbol"])],2)}}});var nt=(()=>`.loading-spinner{min-width:2rem}
-`)();const oe={class:"loading-spinner d-block"},ae={class:"loading-spinner__animation"},re={class:"d-block",version:"1.1",id:"L9",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100","enable-background":"new 0 0 0 0","xml:space":"preserve"},le=["fill"],ie=[t.createElementVNode("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"1s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"},null,-1)],se=t.defineComponent({__name:"loading-spinner",props:{color:{type:String,default:"#fff"}},setup(e){return(a,o)=>(t.openBlock(),t.createElementBlock("span",oe,[t.createElementVNode("span",ae,[(t.openBlock(),t.createElementBlock("svg",re,[t.createElementVNode("path",{fill:e.color,d:"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"},ie,8,le)]))]),t.renderSlot(a.$slots,"default")]))}});var at=(()=>`.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}
-`)();const ce=["type","disabled","href","to"],de=t.defineComponent({__name:"base-button",props:{type:null,caption:null,variant:null,size:null,icon:null,href:null,to:null,disabled:{type:Boolean},pending:{type:Boolean},outlined:{type:Boolean},rounded:{type:Boolean},fab:{type:Boolean}},setup(e){const a=e,o=t.computed(()=>a.caption&&!a.fab);return(n,r)=>{const l=t.resolveComponent("base-icon");return t.openBlock(),t.createElementBlock("button",{type:e.type,disabled:e.disabled,href:e.href,to:e.to,class:t.normalizeClass(["base-button",{disabled:e.disabled,pending:e.pending,rounded:e.rounded,outlined:e.outlined,fab:e.fab,"x-large":e.size==="x-large",large:e.size==="large",small:e.size==="small","x-small":e.size==="x-small"}])},[t.renderSlot(n.$slots,"default",{},()=>[e.icon?(t.openBlock(),t.createBlock(l,{key:0,id:e.icon,class:"base-button__caption"},null,8,["id"])):t.createCommentVNode("",!0),t.unref(o)?(t.openBlock(),t.createElementBlock("span",{key:1,class:t.normalizeClass(["base-button__caption",{"icon-padding":e.icon}])},t.toDisplayString(e.caption),3)):t.createCommentVNode("",!0)])],10,ce)}}});function $(){return(new Date().valueOf()+Math.random()).toString(36)}const ue={class:"base-input"},fe=["type","name","id","label","placeholder","pattern","disabled","read-only","required","maxlength","checked"],me=["for"],pe=t.defineComponent({__name:"base-input",props:{modelValue:{type:[String,Number,Boolean],default:""},type:{type:String,default:"text"},name:{type:String,default:()=>$()},id:{type:String,default:()=>$()},label:{type:String,default:""},placeholder:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1},maxlength:{type:Number},pattern:{type:String,default:null},checked:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(e,{emit:a}){const o=e,n=t.computed({get(){return o.modelValue},set(r){a("update:modelValue",r)}});return(r,l)=>(t.openBlock(),t.createElementBlock("div",ue,[t.withDirectives(t.createElementVNode("input",{"onUpdate:modelValue":l[0]||(l[0]=s=>t.isRef(n)?n.value=s:null),type:e.type,name:e.name,id:e.id,label:`${e.label}${e.required?" *":""}`,placeholder:e.placeholder,pattern:e.pattern,disabled:e.disabled,"read-only":e.readOnly,required:e.required,maxlength:e.maxlength,checked:e.checked},null,8,fe),[[t.vModelDynamic,t.unref(n)]]),t.createElementVNode("label",{for:e.id},[t.renderSlot(r.$slots,"label",{},()=>[t.createTextVNode(t.toDisplayString(e.label),1)])],8,me)]))}}),be={class:"radio-group"},ye=["for"],ge=t.defineComponent({__name:"check-group",props:{modelValue:{default:[]},options:{type:Array,default:[]},name:{type:String,default:()=>$()},id:{type:String,default:()=>$()},label:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1}},emits:["change","update:modelValue"],setup(e,{emit:a}){const o=e,n=t.ref([]);return t.watch(()=>o.modelValue,(r,l)=>{n.value=o.options.map(s=>s.value?o.modelValue.some(i=>i["value "]===s.value):o.modelValue.some(i=>i===s))},{immediate:!0}),t.watch(n,(r,l)=>{const s=r.reduce((i,d,m)=>{const p=d&&o.options[m]?[o.options[m]||o.options[m]]:[];return[...i,...p]},[]);a("update:modelValue",s)},{deep:!0}),t.onBeforeMount(()=>{}),(r,l)=>{const s=t.resolveComponent("base-input");return t.openBlock(),t.createElementBlock("div",be,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.options,(i,d)=>(t.openBlock(),t.createBlock(s,{key:d,modelValue:t.unref(n)[d],"onUpdate:modelValue":m=>t.unref(n)[d]=m,type:"checkbox",name:e.name,id:`${e.id}-${d}`,label:`${i.text||i}${e.required?" *":""}`,disabled:e.disabled,"read-only":e.readOnly,required:e.required},null,8,["modelValue","onUpdate:modelValue","name","id","label","disabled","read-only","required"]))),128)),t.createElementVNode("label",{for:e.id},[t.renderSlot(r.$slots,"label",{},()=>[t.createTextVNode(t.toDisplayString(e.label),1)])],8,ye)])}}}),he={class:"radio-group"},we=["for"],Se=t.defineComponent({__name:"radio-group",props:{modelValue:{default:!1},options:{type:Array,default:[]},name:{type:String,default:()=>$()},id:{type:String,default:()=>$()},label:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1}},emits:["change","update:modelValue"],setup(e,{emit:a}){const o=e;t.ref(o.options.map(r=>r.value===o.modelValue));function n(r){a("update:modelValue",r)}return t.onBeforeMount(()=>{}),(r,l)=>{const s=t.resolveComponent("base-input");return t.openBlock(),t.createElementBlock("div",he,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.options,(i,d)=>(t.openBlock(),t.createBlock(s,{key:d,type:"radio",name:e.name,id:`${e.id}-${d}`,value:i.value||i,label:`${i.text||i}${e.required?" *":""}`,checked:i.value?i.value===e.modelValue:i===e.modelValue,disabled:e.disabled,"read-only":e.readOnly,required:e.required,onChange:m=>n(i)},null,8,["name","id","value","label","checked","disabled","read-only","required","onChange"]))),128)),t.createElementVNode("label",{for:e.id},[t.renderSlot(r.$slots,"label",{},()=>[t.createTextVNode(t.toDisplayString(e.label),1)])],8,we)])}}});/*!
-  * pinia v2.0.14
-  * (c) 2022 Eduardo San Martin Morote
-  * @license MIT
-  */let W;const F=e=>W=e,_e=Symbol();function I(e){return e&&typeof e=="object"&&Object.prototype.toString.call(e)==="[object Object]"&&typeof e.toJSON!="function"}var x;(function(e){e.direct="direct",e.patchObject="patch object",e.patchFunction="patch function"})(x||(x={}));const J=()=>{};function H(e,a,o,n=J){e.push(a);const r=()=>{const l=e.indexOf(a);l>-1&&(e.splice(l,1),n())};return!o&&t.getCurrentInstance()&&t.onUnmounted(r),r}function N(e,...a){e.slice().forEach(o=>{o(...a)})}function R(e,a){for(const o in a){if(!a.hasOwnProperty(o))continue;const n=a[o],r=e[o];I(r)&&I(n)&&e.hasOwnProperty(o)&&!t.isRef(n)&&!t.isReactive(n)?e[o]=R(r,n):e[o]=n}return e}const ke=Symbol();function Be(e){return!I(e)||!e.hasOwnProperty(ke)}const{assign:k}=Object;function $e(e){return!!(t.isRef(e)&&e.effect)}function Ne(e,a,o,n){const{state:r,actions:l,getters:s}=a,i=o.state.value[e];let d;function m(){i||(o.state.value[e]=r?r():{});const p=t.toRefs(o.state.value[e]);return k(p,l,Object.keys(s||{}).reduce((_,g)=>(_[g]=t.markRaw(t.computed(()=>{F(o);const h=o._s.get(e);return s[g].call(h,h)})),_),{}))}return d=G(e,m,a,o,n,!0),d.$reset=function(){const _=r?r():{};this.$patch(g=>{k(g,_)})},d}function G(e,a,o={},n,r,l){let s;const i=k({actions:{}},o),d={deep:!0};let m,p,_=t.markRaw([]),g=t.markRaw([]),h;const S=n.state.value[e];!l&&!S&&(n.state.value[e]={}),t.ref({});let v;function O(c){let f;m=p=!1,typeof c=="function"?(c(n.state.value[e]),f={type:x.patchFunction,storeId:e,events:h}):(R(n.state.value[e],c),f={type:x.patchObject,payload:c,storeId:e,events:h});const B=v=Symbol();t.nextTick().then(()=>{v===B&&(m=!0)}),p=!0,N(_,f,n.state.value[e])}const D=J;function T(){s.stop(),_=[],g=[],n._s.delete(e)}function U(c,f){return function(){F(n);const B=Array.from(arguments),E=[],C=[];function Ze(w){E.push(w)}function et(w){C.push(w)}N(g,{args:B,name:c,store:y,after:Ze,onError:et});let P;try{P=f.apply(this&&this.$id===e?this:y,B)}catch(w){throw N(C,w),w}return P instanceof Promise?P.then(w=>(N(E,w),w)).catch(w=>(N(C,w),Promise.reject(w))):(N(E,P),P)}}const M={_p:n,$id:e,$onAction:H.bind(null,g),$patch:O,$reset:D,$subscribe(c,f={}){const B=H(_,c,f.detached,()=>E()),E=s.run(()=>t.watch(()=>n.state.value[e],C=>{(f.flush==="sync"?p:m)&&c({storeId:e,type:x.direct,events:h},C)},k({},d,f)));return B},$dispose:T},y=t.reactive(k({},M));n._s.set(e,y);const u=n._e.run(()=>(s=t.effectScope(),s.run(()=>a())));for(const c in u){const f=u[c];if(t.isRef(f)&&!$e(f)||t.isReactive(f))l||(S&&Be(f)&&(t.isRef(f)?f.value=S[c]:R(f,S[c])),n.state.value[e][c]=f);else if(typeof f=="function"){const B=U(c,f);u[c]=B,i.actions[c]=f}}return k(y,u),k(t.toRaw(y),u),Object.defineProperty(y,"$state",{get:()=>n.state.value[e],set:c=>{O(f=>{k(f,c)})}}),n._p.forEach(c=>{k(y,s.run(()=>c({store:y,app:n._a,pinia:n,options:i})))}),S&&l&&o.hydrate&&o.hydrate(y.$state,S),m=!0,p=!0,y}function Oe(e,a,o){let n,r;const l=typeof a=="function";typeof e=="string"?(n=e,r=l?o:a):(r=e,n=e.id);function s(i,d){const m=t.getCurrentInstance();return i=i||m&&t.inject(_e),i&&F(i),i=W,i._s.has(n)||(l?G(n,a,r,i):Ne(n,r,i)),i._s.get(n)}return s.$id=n,s}function xe(e){return t.getCurrentScope()?(t.onScopeDispose(e),!0):!1}var K;const V=typeof window!="undefined",Ve=e=>typeof e=="string",z=()=>{};V&&((K=window==null?void 0:window.navigator)==null?void 0:K.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function Ee(e,a){function o(...n){e(()=>a.apply(this,n),{fn:a,thisArg:this,args:n})}return o}const X=e=>e();function Ce(e=X){const a=t.ref(!0);function o(){a.value=!1}function n(){a.value=!0}return{isActive:a,pause:o,resume:n,eventFilter:(...l)=>{a.value&&e(...l)}}}var Q=Object.getOwnPropertySymbols,Pe=Object.prototype.hasOwnProperty,je=Object.prototype.propertyIsEnumerable,ve=(e,a)=>{var o={};for(var n in e)Pe.call(e,n)&&a.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&Q)for(var n of Q(e))a.indexOf(n)<0&&je.call(e,n)&&(o[n]=e[n]);return o};function Fe(e,a,o={}){const n=o,{eventFilter:r=X}=n,l=ve(n,["eventFilter"]);return t.watch(e,Ee(r,a),l)}var Ie=Object.defineProperty,Re=Object.defineProperties,ze=Object.getOwnPropertyDescriptors,j=Object.getOwnPropertySymbols,Y=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable,ee=(e,a,o)=>a in e?Ie(e,a,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[a]=o,qe=(e,a)=>{for(var o in a||(a={}))Y.call(a,o)&&ee(e,o,a[o]);if(j)for(var o of j(a))Z.call(a,o)&&ee(e,o,a[o]);return e},Le=(e,a)=>Re(e,ze(a)),Ae=(e,a)=>{var o={};for(var n in e)Y.call(e,n)&&a.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&j)for(var n of j(e))a.indexOf(n)<0&&Z.call(e,n)&&(o[n]=e[n]);return o};function De(e,a,o={}){const n=o,{eventFilter:r}=n,l=Ae(n,["eventFilter"]),{eventFilter:s,pause:i,resume:d,isActive:m}=Ce(r);return{stop:Fe(e,a,Le(qe({},l),{eventFilter:s})),pause:i,resume:d,isActive:m}}function Te(e){var a;const o=t.unref(e);return(a=o==null?void 0:o.$el)!=null?a:o}const q=V?window:void 0;V&&window.document,V&&window.navigator,V&&window.location;function Ue(...e){let a,o,n,r;if(Ve(e[0])?([o,n,r]=e,a=q):[a,o,n,r]=e,!a)return z;let l=z;const s=t.watch(()=>Te(a),d=>{l(),d&&(d.addEventListener(o,n,r),l=()=>{d.removeEventListener(o,n,r),l=z})},{immediate:!0,flush:"post"}),i=()=>{s(),l()};return xe(i),i}const L=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},A="__vueuse_ssr_handlers__";L[A]=L[A]||{};const Me=L[A];function We(e,a){return Me[e]||a}function Je(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"||Array.isArray(e)?"object":Number.isNaN(e)?"any":"number"}const He={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}};function Ge(e,a,o,n={}){var r;const{flush:l="pre",deep:s=!0,listenToStorageChanges:i=!0,writeDefaults:d=!0,shallow:m,window:p=q,eventFilter:_,onError:g=u=>{console.error(u)}}=n,h=(m?t.shallowRef:t.ref)(a);if(!o)try{o=We("getDefaultStorage",()=>{var u;return(u=q)==null?void 0:u.localStorage})()}catch(u){g(u)}if(!o)return h;const S=t.unref(a),v=Je(S),O=(r=n.serializer)!=null?r:He[v],{pause:D,resume:T}=De(h,()=>U(h.value),{flush:l,deep:s,eventFilter:_});return p&&i&&Ue(p,"storage",y),y(),h;function U(u){try{u==null?o.removeItem(e):o.setItem(e,O.write(u))}catch(c){g(c)}}function M(u){if(!(u&&u.key!==e)){D();try{const c=u?u.newValue:o.getItem(e);return c==null?(d&&S!==null&&o.setItem(e,O.write(S)),S):typeof c!="string"?c:O.read(c)}catch(c){g(c)}finally{T()}}}function y(u){u&&u.key!==e||(h.value=M(u))}}var te;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(te||(te={}));const Ke=Oe("auth/user",{state:()=>({firstName:Ge("firstName",""),lastName:"",userId:null}),getters:{fullName:e=>`${e.firstName} ${e.lastName}`,loggedIn:e=>e.userId!==null,fullUserDetails(e){return{...e,fullName:this.fullName}}},actions:{updateUser(e){this.firstName=e.firstName,this.lastName=e.lastName,this.userId=e.userId},clearUser(){this.$reset()}}});var rt=(()=>`.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}
-`)();const Xe={class:"base-form"},Qe=["onSubmit"],Ye=t.defineComponent({__name:"base-form",props:{id:null,name:null,variant:null,disabled:{type:Boolean},pending:{type:Boolean}},setup(e){const a=Ke();t.computed(()=>a.firstName),t.computed(()=>a.fullName);function o(l){a.updateUser({firstName:l.target.value}),console.log("input",l)}function n(l){console.log("reset",l)}function r(l){console.log("submit",l)}return(l,s)=>(t.openBlock(),t.createElementBlock("div",Xe,[t.createElementVNode("form",{ref:"form",onInput:o,onReset:n,onSubmit:t.withModifiers(r,["prevent"])},[t.renderSlot(l.$slots,"default")],40,Qe)]))}});b.BaseButton=de,b.BaseForm=Ye,b.BaseIcon=ne,b.BaseInput=pe,b.CheckGroup=ge,b.LoadingSpinner=se,b.RadioGroup=Se,Object.defineProperties(b,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.AblokComponents={},r.Vue))})(this,function(r,e){"use strict";var J=(()=>`.svg-icon{display:inline-block}.svg-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.svg-icon--xxl svg{width:12rem;height:12rem}.svg-icon--xl svg{width:8rem;height:8rem}.svg-icon--large svg{width:4rem;height:4rem}
+`)();const b={class:"icon",preserveAspectRatio:"xMaxYMin"},p=["xlink:href"],g=e.defineComponent({__name:"svg-icon",props:{basePath:{type:String,default:"/static/symbol-defs.svg"},prefix:{type:String,default:"icon-"},symbol:{type:String,default:""},size:{type:String,default:"default"}},setup(t){return(d,l)=>(e.openBlock(),e.createElementBlock("i",{class:e.normalizeClass(["svg-icon",{[`svg-icon--${t.size}`]:t.size}])},[(e.openBlock(),e.createElementBlock("svg",b,[e.createElementVNode("use",{"xlink:href":`${t.basePath}#${t.prefix}${t.symbol}`,"xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0",y:"0"},null,8,p)]))],2))}});var X=(()=>`.loading-spinner{min-width:2rem}
+`)();const y={class:"loading-spinner d-block"},h={class:"loading-spinner__animation"},k={class:"d-block",version:"1.1",id:"L9",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100","enable-background":"new 0 0 0 0","xml:space":"preserve"},B=["fill"],S=[e.createElementVNode("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"1s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"},null,-1)],$=e.defineComponent({__name:"loading-spinner",props:{color:{type:String,default:"#fff"}},setup(t){return(d,l)=>(e.openBlock(),e.createElementBlock("span",y,[e.createElementVNode("span",h,[(e.openBlock(),e.createElementBlock("svg",k,[e.createElementVNode("path",{fill:t.color,d:"M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50"},S,8,B)]))]),e.renderSlot(d.$slots,"default")]))}});var H=(()=>`.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}
+`)();const V=["type","disabled","href","to"],x=e.defineComponent({__name:"base-button",props:{type:null,caption:null,variant:null,size:null,icon:null,href:null,to:null,disabled:{type:Boolean},pending:{type:Boolean},outlined:{type:Boolean},rounded:{type:Boolean},fab:{type:Boolean}},setup(t){const d=t,l=e.computed(()=>d.caption&&!d.fab);return(i,a)=>{const c=e.resolveComponent("svg-icon");return e.openBlock(),e.createElementBlock("button",{type:t.type,disabled:t.disabled,href:t.href,to:t.to,class:e.normalizeClass(["base-button btn btn-primary",{disabled:t.disabled,pending:t.pending,rounded:t.rounded,outlined:t.outlined,fab:t.fab,"x-large":t.size==="x-large",large:t.size==="large",small:t.size==="small","x-small":t.size==="x-small"}])},[e.renderSlot(i.$slots,"default",{},()=>[t.icon?(e.openBlock(),e.createBlock(c,{key:0,id:t.icon,class:"base-button__caption"},null,8,["id"])):e.createCommentVNode("",!0),e.unref(l)?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(["base-button__caption",{"icon-padding":t.icon}])},e.toDisplayString(t.caption),3)):e.createCommentVNode("",!0)])],10,V)}}});function m(){return(new Date().valueOf()+Math.random()).toString(36)}const w={class:"base-input"},E={class:"input-group"},N=["type","name","id","label","placeholder","pattern","disabled","read-only","required","maxlength","checked","aria-label"],C=["for"],q=e.defineComponent({__name:"base-input",props:{modelValue:{type:[String,Number,Boolean],default:""},type:{type:String,default:"text"},name:{type:String,default:()=>m()},id:{type:String,default:()=>m()},label:{type:String,default:""},placeholder:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1},maxlength:{type:Number},pattern:{type:String,default:null},checked:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(t,{emit:d}){const l=t,i=e.computed({get(){return l.modelValue},set(a){d("update:modelValue",a)}});return(a,c)=>(e.openBlock(),e.createElementBlock("div",w,[e.createElementVNode("div",E,[e.renderSlot(a.$slots,"input-prepend"),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":c[0]||(c[0]=n=>e.isRef(i)?i.value=n:null),type:t.type,name:t.name,id:t.id,label:`${t.label}${t.required?" *":""}`,placeholder:t.placeholder,pattern:t.pattern,disabled:t.disabled,"read-only":t.readOnly,required:t.required,maxlength:t.maxlength,checked:t.checked,class:"form-control","aria-label":t.label},null,8,N),[[e.vModelDynamic,e.unref(i)]]),e.renderSlot(a.$slots,"input-append")]),e.createElementVNode("label",{for:t.id},[e.renderSlot(a.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],8,C)]))}}),z={class:"radio-group"},O=["for"],M=e.defineComponent({__name:"check-group",props:{modelValue:{default:[]},options:{type:Array,default:[]},name:{type:String,default:()=>m()},id:{type:String,default:()=>m()},label:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1}},emits:["change","update:modelValue"],setup(t,{emit:d}){const l=t,i=e.ref([]);return e.watch(()=>l.modelValue,(a,c)=>{i.value=l.options.map(n=>n.value?l.modelValue.some(o=>o["value "]===n.value):l.modelValue.some(o=>o===n))},{immediate:!0}),e.watch(i,(a,c)=>{const n=a.reduce((o,s,u)=>{const f=s&&l.options[u]?[l.options[u]||l.options[u]]:[];return[...o,...f]},[]);d("update:modelValue",n)},{deep:!0}),e.onBeforeMount(()=>{}),(a,c)=>{const n=e.resolveComponent("base-input");return e.openBlock(),e.createElementBlock("div",z,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,(o,s)=>(e.openBlock(),e.createBlock(n,{key:s,modelValue:e.unref(i)[s],"onUpdate:modelValue":u=>e.unref(i)[s]=u,type:"checkbox",name:t.name,id:`${t.id}-${s}`,label:`${o.text||o}${t.required?" *":""}`,disabled:t.disabled,"read-only":t.readOnly,required:t.required},null,8,["modelValue","onUpdate:modelValue","name","id","label","disabled","read-only","required"]))),128)),e.createElementVNode("label",{for:t.id},[e.renderSlot(a.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],8,O)])}}}),D={class:"radio-group"},T=["for"],L=e.defineComponent({__name:"radio-group",props:{modelValue:{default:!1},options:{type:Array,default:[]},name:{type:String,default:()=>m()},id:{type:String,default:()=>m()},label:{type:String,default:""},variant:{type:String,default:""},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1}},emits:["change","update:modelValue"],setup(t,{emit:d}){const l=t;e.ref(l.options.map(a=>a.value===l.modelValue));function i(a){d("update:modelValue",a)}return e.onBeforeMount(()=>{}),(a,c)=>{const n=e.resolveComponent("base-input");return e.openBlock(),e.createElementBlock("div",D,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,(o,s)=>(e.openBlock(),e.createBlock(n,{key:s,type:"radio",name:t.name,id:`${t.id}-${s}`,value:o.value||o,label:`${o.text||o}${t.required?" *":""}`,checked:o.value?o.value===t.modelValue:o===t.modelValue,disabled:t.disabled,"read-only":t.readOnly,required:t.required,onChange:u=>i(o)},null,8,["name","id","value","label","checked","disabled","read-only","required","onChange"]))),128)),e.createElementVNode("label",{for:t.id},[e.renderSlot(a.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],8,T)])}}}),A={class:"input input-dropdown"},I={class:"dropdown"},P={class:"btn-group",role:"group"},j=["id","disabled"],F=["aria-labelledby"],R=["onClick"],U=["for"],G=e.defineComponent({__name:"input-dropdown",props:{modelValue:{type:[String,Number,Boolean,Object],default:""},name:{type:String,default:()=>m()},id:{type:String,default:()=>m()},label:{type:String,default:""},placeholder:{type:String,default:"Please select"},options:{type:Array,default:[]},variant:{type:String,default:""},color:{type:String,default:""},disabled:{type:Boolean,default:!1},multiple:{type:Boolean,default:!1},required:{type:Boolean,default:!1},resetOption:{type:Boolean,default:!0}},emits:["update:modelValue"],setup(t,{emit:d}){const l=t;e.computed({get(){return l.modelValue},set(n){d("update:modelValue",n)}});function i(n){d("update:modelValue",n)}const a=e.computed(()=>[{text:"Please select"},...l.options.map(n=>typeof n=="string"?{value:n,text:n}:n)]),c=e.computed(()=>[...l.options].find(n=>JSON.stringify(n.value)===JSON.stringify(l.modelValue)));return(n,o)=>(e.openBlock(),e.createElementBlock("div",A,[e.createElementVNode("div",I,[e.createElementVNode("div",P,[e.createElementVNode("button",{class:e.normalizeClass(["btn dropdown-toggle",{[`button-${t.variant}`]:t.variant,[`button-${t.color}`]:t.color,[`button-${t.disabled}`]:t.disabled}]),type:"button",id:t.id,"data-bs-toggle":"dropdown","aria-expanded":"false",disabled:t.disabled},e.toDisplayString(e.unref(c)?e.unref(c).text:t.placeholder),11,j),e.createElementVNode("ul",{class:"dropdown-menu","aria-labelledby":t.id},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(a),(s,u)=>(e.openBlock(),e.createElementBlock("li",{key:u},[e.renderSlot(n.$slots,"option",{},()=>[e.createElementVNode("a",{class:"dropdown-item",onClick:e.withModifiers(f=>i(s.value),["prevent"])},e.toDisplayString(s.text),9,R)])]))),128))],8,F)])]),e.createElementVNode("label",{for:t.id},[e.renderSlot(n.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])],8,U)]))}});r.BaseButton=x,r.BaseInput=q,r.CheckGroup=M,r.InputDropdown=G,r.LoadingSpinner=$,r.RadioGroup=L,r.SvgIcon=g,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/components/base-input.vue.d.ts

@@ -105,15 +105,15 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    id: string;
     checked: boolean;
     required: boolean;
     type: string;
     label: string;
     pattern: string;
     modelValue: string | number | boolean;
-    name: string;
+    id: string;
     variant: string;
+    name: string;
     disabled: boolean;
     placeholder: string;
     readOnly: boolean;

package/dist/components/check-group.vue.d.ts

@@ -75,13 +75,13 @@ declare const _default: import("vue").DefineComponent<{
     onChange?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    id: string;
+    options: any[];
     required: boolean;
     label: string;
     modelValue: never[];
-    name: string;
-    options: any[];
+    id: string;
     variant: string;
+    name: string;
     disabled: boolean;
     readOnly: boolean;
 }>;

package/dist/components/input-dropdown.vue.d.ts

@@ -0,0 +1,141 @@
+declare const _default: import("vue").DefineComponent<{
+    modelValue: {
+        type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    id: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    options: {
+        type: {
+            (arrayLength: number): any[];
+            (...items: any[]): any[];
+            new (arrayLength: number): any[];
+            new (...items: any[]): any[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: never[];
+    };
+    variant: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    resetOption: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: (BooleanConstructor | ObjectConstructor | StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    id: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    options: {
+        type: {
+            (arrayLength: number): any[];
+            (...items: any[]): any[];
+            new (arrayLength: number): any[];
+            new (...items: any[]): any[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: never[];
+    };
+    variant: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    resetOption: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    options: any[];
+    required: boolean;
+    label: string;
+    modelValue: string | number | boolean | Record<string, any>;
+    id: string;
+    variant: string;
+    color: string;
+    name: string;
+    disabled: boolean;
+    placeholder: string;
+    multiple: boolean;
+    resetOption: boolean;
+}>;
+export default _default;

package/dist/components/radio-group.vue.d.ts

@@ -75,13 +75,13 @@ declare const _default: import("vue").DefineComponent<{
     onChange?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    id: string;
+    options: any[];
     required: boolean;
     label: string;
     modelValue: boolean;
-    name: string;
-    options: any[];
+    id: string;
     variant: string;
+    name: string;
     disabled: boolean;
     readOnly: boolean;
 }>;

package/dist/components/{base-icon.vue.d.ts → svg-icon.vue.d.ts}

@@ -1,5 +1,13 @@
 declare const _default: import("vue").DefineComponent<{
-    id: {
+    basePath: {
+        type: StringConstructor;
+        default: string;
+    };
+    prefix: {
+        type: StringConstructor;
+        default: string;
+    };
+    symbol: {
         type: StringConstructor;
         default: string;
     };
@@ -8,7 +16,15 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    id: {
+    basePath: {
+        type: StringConstructor;
+        default: string;
+    };
+    prefix: {
+        type: StringConstructor;
+        default: string;
+    };
+    symbol: {
         type: StringConstructor;
         default: string;
     };
@@ -17,7 +33,9 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
 }>>, {
-    id: string;
+    symbol: string;
     size: string;
+    prefix: string;
+    basePath: string;
 }>;
 export default _default;

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-export { default as BaseIcon } from "./components/base-icon.vue";
+export { default as SvgIcon } from "./components/svg-icon.vue";
 export { default as LoadingSpinner } from "./components/loading-spinner.vue";
 export { default as BaseButton } from "./components/base-button.vue";
 export { default as BaseInput } from "./components/base-input.vue";
 export { default as CheckGroup } from "./components/check-group.vue";
 export { default as RadioGroup } from "./components/radio-group.vue";
-export { default as BaseForm } from "./components/base-form.vue";
+export { default as InputDropdown } from "./components/input-dropdown.vue";

package/dist/main.d.ts

@@ -1 +1,2 @@
-export {};
+import "bootstrap/dist/css/bootstrap.min.css";
+import "bootstrap";

package/dist/style.css

@@ -1 +1 @@
-.base-icon{display:inline-block}.base-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.base-icon--xxl svg{width:12rem;height:12rem}.base-icon--xl svg{width:8rem;height:8rem}.base-icon--large svg{width:4rem;height:4rem}.loading-spinner{min-width:2rem}.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}
+.svg-icon{display:inline-block}.svg-icon svg{display:block;stroke-width:0;stroke:currentColor;fill:currentColor;width:1.5em;height:1.5em}.svg-icon--xxl svg{width:12rem;height:12rem}.svg-icon--xl svg{width:8rem;height:8rem}.svg-icon--large svg{width:4rem;height:4rem}.loading-spinner{min-width:2rem}.base-button{display:flex;justify-content:center;align-items:center;box-sizing:border-box;transition:all .2s ease;text-decoration:none;width:100%;margin:0;padding:1.036em 1.625em;appearance:none;outline:none;border:none;border-radius:.4375em;font-size:.875em;line-height:1.125em;text-transform:uppercase;font-weight:700}@media screen and (min-width: 600px){.base-button{width:auto}}.base-button .icon{width:16px;height:16px;margin-top:-1px}.base-button.s-collapsed>.caption{display:none}.base-button.s-pending{background-repeat:no-repeat;background-position:center center}.base-button.s-pending .caption{margin-left:25px;visibility:hidden}@media screen and (min-width: 600px){.base-button.s-pending{background-position:1.625em center}.base-button.s-pending .caption{visibility:visible}}.base-button[readonly],.base-button[disabled]{cursor:not-allowed}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ablok-components",
   "private": false,
-  "version": "0.0.18",
+  "version": "0.0.21",
   "scripts": {
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build",

package/dist/store/index.d.ts

@@ -1,26 +0,0 @@
-interface State {
-    firstName: string;
-    lastName: string;
-    userId: number | null;
-}
-export declare const useAuthUserStore: import("pinia").StoreDefinition<"auth/user", State, {
-    fullName: (state: {
-        firstName: string;
-        lastName: string;
-        userId: number | null;
-    } & import("pinia").PiniaCustomStateProperties<State>) => string;
-    loggedIn: (state: {
-        firstName: string;
-        lastName: string;
-        userId: number | null;
-    } & import("pinia").PiniaCustomStateProperties<State>) => boolean;
-    fullUserDetails(state: {
-        firstName: string;
-        lastName: string;
-        userId: number | null;
-    } & import("pinia").PiniaCustomStateProperties<State>): any;
-}, {
-    updateUser(payload: any): void;
-    clearUser(): void;
-}>;
-export {};