@hoci/components 0.2.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Chizuki
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.cjs

@@ -0,0 +1,222 @@
+'use strict';
+
+const vue = require('vue');
+const core = require('@hoci/core');
+const tslx = require('tslx');
+
+var __defProp$4 = Object.defineProperty;
+var __defProps$4 = Object.defineProperties;
+var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$4(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
+const HiAffix = vue.defineComponent({
+  name: "HiAffix",
+  props: __spreadProps$4(__spreadValues$4({}, core.affixProps), {
+    as: {
+      type: String,
+      default: "div"
+    },
+    wrapperAs: {
+      type: String,
+      default: "div"
+    }
+  }),
+  setup(props, context) {
+    const { classNames, wrapperRef, isFixed, placeholderStyle, fixedStyle } = core.useAffix(props, context);
+    return () => vue.h(
+      props.as,
+      { ref: wrapperRef },
+      [
+        isFixed.value && vue.h("div", { style: placeholderStyle.value }),
+        vue.h("div", { class: classNames.value, style: fixedStyle.value }, vue.renderSlot(context.slots, "default"))
+      ]
+    );
+  }
+});
+
+var __defProp$3 = Object.defineProperty;
+var __defProps$3 = Object.defineProperties;
+var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$3(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
+const HiSelection = vue.defineComponent({
+  name: "HiSelection",
+  props: __spreadProps$3(__spreadValues$3({}, core.selectionProps), {
+    as: {
+      type: String,
+      default: "div"
+    }
+  }),
+  emits: core.selectionEmits,
+  setup(props, context) {
+    const { isActive, changeActive, renderItem } = core.useSelectionList(props, context);
+    const { slots } = context;
+    const slotData = {
+      isActive,
+      changeActive,
+      renderItem
+    };
+    return () => vue.h(props.as, {}, vue.renderSlot(slots, "default", slotData));
+  }
+});
+
+var __defProp$2 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
+const HiItem = vue.defineComponent({
+  name: "HiItem",
+  props: __spreadProps$2(__spreadValues$2({}, core.itemProps), {
+    as: {
+      type: String,
+      default: "div"
+    }
+  }),
+  setup(props, context) {
+    const { render, activate, className, isDisabled, activateEvent } = core.useSelectionItem(
+      props,
+      context
+    );
+    return () => vue.h(
+      props.as,
+      {
+        class: className.value,
+        [`on${vue.capitalize(activateEvent.value)}`]: activate,
+        disabled: isDisabled.value
+      },
+      render()
+    );
+  }
+});
+
+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));
+const HiIcon = vue.defineComponent({
+  props: __spreadProps$1(__spreadValues$1({}, core.iconProps), {
+    as: {
+      type: String,
+      default: "i"
+    }
+  }),
+  setup(props, context) {
+    const { style } = core.useIcon(props, context);
+    return () => {
+      return vue.h(props.as, {
+        style: style.value
+      });
+    };
+  }
+});
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const HiSwitch = vue.defineComponent({
+  name: "HiSwitch",
+  props: __spreadProps(__spreadValues({}, core.switchProps), {
+    as: {
+      type: String,
+      default: "div"
+    }
+  }),
+  emits: core.switchEmits,
+  setup(props, context) {
+    const { slots } = context;
+    const { className, toggle, modelValue, isDisabled } = core.useSwitch(props, context);
+    return () => {
+      return vue.h(
+        props.as,
+        {
+          class: className.value,
+          [`on${tslx.capitalize(props.activateEvent)}`]: toggle
+        },
+        vue.renderSlot(slots, "default", {
+          active: modelValue.value,
+          isDisabled: isDisabled.value
+        })
+      );
+    };
+  }
+});
+
+exports.HiAffix = HiAffix;
+exports.HiIcon = HiIcon;
+exports.HiItem = HiItem;
+exports.HiSelection = HiSelection;
+exports.HiSwitch = HiSwitch;

package/dist/index.d.cts

@@ -0,0 +1,379 @@
+import * as vue from 'vue';
+import * as _hoci_core from '@hoci/core';
+
+declare const HiAffix: vue.DefineComponent<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    wrapperAs: {
+        type: StringConstructor;
+        default: string;
+    };
+    fixedClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offsetType: {
+        type: vue.PropType<"top" | "bottom">;
+        default: string;
+    };
+    target: {
+        type: vue.PropType<string | Window | HTMLElement>;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    wrapperAs: {
+        type: StringConstructor;
+        default: string;
+    };
+    fixedClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    offset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    offsetType: {
+        type: vue.PropType<"top" | "bottom">;
+        default: string;
+    };
+    target: {
+        type: vue.PropType<string | Window | HTMLElement>;
+    };
+    zIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>>, {
+    fixedClass: string;
+    offset: number;
+    offsetType: "top" | "bottom";
+    zIndex: number;
+    as: string;
+    wrapperAs: string;
+}, {}>;
+
+declare const HiSelection: vue.DefineComponent<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: vue.PropType<any>;
+        default: () => null;
+    };
+    activeClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    itemClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    disabledClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    unactiveClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    label: {
+        type: vue.PropType<string | ((val?: any) => string) | null>;
+    };
+    multiple: {
+        type: (NumberConstructor | BooleanConstructor)[];
+        default: () => false;
+    };
+    clearable: {
+        type: BooleanConstructor;
+    };
+    defaultValue: {
+        type: vue.PropType<any>;
+        default: () => null;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+        default: () => "click";
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "load" | "unload" | "update:modelValue")[], "change" | "load" | "unload" | "update:modelValue", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: vue.PropType<any>;
+        default: () => null;
+    };
+    activeClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    itemClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    disabledClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    unactiveClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    label: {
+        type: vue.PropType<string | ((val?: any) => string) | null>;
+    };
+    multiple: {
+        type: (NumberConstructor | BooleanConstructor)[];
+        default: () => false;
+    };
+    clearable: {
+        type: BooleanConstructor;
+    };
+    defaultValue: {
+        type: vue.PropType<any>;
+        default: () => null;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+        default: () => "click";
+    };
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    onLoad?: ((...args: any[]) => any) | undefined;
+    onUnload?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    multiple: number | boolean;
+    modelValue: any;
+    activeClass: string | string[] | Record<string, boolean>;
+    itemClass: string | string[] | Record<string, boolean>;
+    disabledClass: string | string[] | Record<string, boolean>;
+    unactiveClass: string | string[] | Record<string, boolean>;
+    clearable: boolean;
+    defaultValue: any;
+    activateEvent: _hoci_core.ActivateEvent;
+    as: string;
+}, {}>;
+
+declare const HiItem: vue.DefineComponent<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    value: {
+        type: vue.PropType<any>;
+        default(): string;
+    };
+    label: {
+        type: vue.PropType<_hoci_core.ElementLike | ((val: any) => string) | null>;
+    };
+    keepAlive: {
+        type: BooleanConstructor;
+        default: () => true;
+    };
+    key: {
+        type: vue.PropType<string | number | symbol>;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    value: {
+        type: vue.PropType<any>;
+        default(): string;
+    };
+    label: {
+        type: vue.PropType<_hoci_core.ElementLike | ((val: any) => string) | null>;
+    };
+    keepAlive: {
+        type: BooleanConstructor;
+        default: () => true;
+    };
+    key: {
+        type: vue.PropType<string | number | symbol>;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    value: any;
+    disabled: boolean;
+    keepAlive: boolean;
+    as: string;
+}, {}>;
+
+declare const HiIcon: vue.DefineComponent<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    src: {
+        type: StringConstructor;
+        required: true;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    color: {
+        type: StringConstructor;
+    };
+    mask: {
+        type: vue.PropType<boolean | "auto">;
+        default: () => "auto";
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    src: {
+        type: StringConstructor;
+        required: true;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    color: {
+        type: StringConstructor;
+    };
+    mask: {
+        type: vue.PropType<boolean | "auto">;
+        default: () => "auto";
+    };
+}>>, {
+    mask: boolean | "auto";
+    size: string | number;
+    as: string;
+}, {}>;
+
+declare const HiSwitch: vue.DefineComponent<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    class: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        required: true;
+    };
+    activeClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    unactiveClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    as: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    class: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        required: true;
+    };
+    activeClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    unactiveClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+    activateEvent: {
+        type: vue.PropType<_hoci_core.ActivateEvent>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledClass: {
+        type: vue.PropType<string | string[] | Record<string, boolean>>;
+        default: string;
+    };
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    modelValue: boolean;
+    activeClass: string | string[] | Record<string, boolean>;
+    disabledClass: string | string[] | Record<string, boolean>;
+    unactiveClass: string | string[] | Record<string, boolean>;
+    activateEvent: _hoci_core.ActivateEvent;
+    as: string;
+}, {}>;
+
+export { HiAffix, HiIcon, HiItem, HiSelection, HiSwitch };