@aotearoan/neon/dist/components/user-input/toggle/NeonToggle.es.js

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

import { defineComponent as m, useAttrs as s, computed as p } from "vue";
import { NeonSize as c } from "../../../model/common/size/NeonSize.es.js";
import { NeonFunctionalColor as f } from "../../../model/common/color/NeonFunctionalColor.es.js";
import { NeonToggleStyle as r } from "../../../model/user-input/toggle/NeonToggleStyle.es.js";
import { NeonOrientation as y } from "../../../model/common/layout/NeonOrientation.es.js";
import g from "../../presentation/icon/NeonIcon.vue.es.js";
const A = m({
  name: "NeonToggle",
  components: {
    NeonIcon: g
  },
  props: {
    /**
     * The name of the radio button group.
     */
    name: { type: String, required: !0 },
    /**
     * The key of the selected option.
     */
    modelValue: { type: String, required: !0 },
    /**
     * The list of options to present to the user.
     */
    model: { type: Array, required: !0 },
    /**
     * The style of toggle to display to the user.
     */
    toggleStyle: { type: String, default: () => r.Toggle },
    /**
     * The size of the toggle.
     */
    size: { type: String, default: () => c.Medium },
    /**
     * The orientation of the toggle if the style is a radio button group.
     */
    orientation: { type: String, default: () => y.Vertical },
    /**
     * The color of the toggle.
     */
    color: { type: String, default: () => f.Primary },
    /**
     * Whether the toggle is disabled.
     */
    disabled: { type: Boolean, default: !1 }
  },
  emits: [
    /**
     * Emitted when the selected value changes.
     * @type {string} The key of the selected model item.
     */
    "update:modelValue"
  ],
  setup(t, { emit: n, slots: i }) {
    const l = s(), o = (e) => {
      n("update:modelValue", e);
    }, a = (e) => {
      !t.disabled && !e.disabled && t.modelValue !== e.key && o(e.key);
    }, d = p(() => {
      const { onClick: e, ...u } = l;
      return u;
    });
    return {
      selectOption: (e) => {
        !t.disabled && !e.disabled && o(e.key);
      },
      onInput: a,
      sanitizedAttributes: d,
      slots: i,
      NeonToggleStyle: r
    };
  }
});
export {
  A as default
};
//# sourceMappingURL=NeonToggle.es.js.map