primevuelab 4.0.0-beta.4

package/toggleswitch/ToggleSwitch.d.ts

@@ -0,0 +1,222 @@
+/**
+ *
+ * ToggleSwitch is used to select a boolean value.
+ *
+ * [Live Demo](https://www.primevuelab.org/toggleswitch/)
+ *
+ * @module toggleswitch
+ *
+ */
+import { ComponentHooks } from '../../../core/src/basecomponent';
+import { PassThroughOptions } from '../passthrough';
+import { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
+
+export declare type ToggleSwitchPassThroughOptionType = ToggleSwitchPassThroughAttributes | ((options: ToggleSwitchPassThroughMethodOptions) => ToggleSwitchPassThroughAttributes | string) | string | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ToggleSwitchPassThroughMethodOptions {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: ToggleSwitchProps;
+    /**
+     * Defines current options.
+     */
+    context: ToggleSwitchContext;
+    /**
+     * Defines valid attributes.
+     */
+    attrs: any;
+    /**
+     * Defines parent options.
+     */
+    parent: any;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ToggleSwitchProps.pt}
+ */
+export interface ToggleSwitchPassThroughOptions {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: ToggleSwitchPassThroughOptionType;
+    /**
+     * Used to pass attributes to the input's DOM element.
+     */
+    input?: ToggleSwitchPassThroughOptionType;
+    /**
+     * Used to pass attributes to the slider's DOM element.
+     */
+    slider?: ToggleSwitchPassThroughOptionType;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ToggleSwitchPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines valid properties in ToggleSwitch component.
+ */
+export interface ToggleSwitchProps {
+    /**
+     * Specifies whether a toggleswitch should be checked or not.
+     * @defaultValue false
+     */
+    modelValue?: boolean | string | undefined;
+    /**
+     * Value in checked state.
+     * @defaultValue true
+     */
+    trueValue?: any;
+    /**
+     * Value in unchecked state.
+     * @defaultValue false
+     */
+    falseValue?: any;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should be disabled.
+     * @defaultValue false
+     */
+    disabled?: boolean | undefined;
+    /**
+     * When present, it specifies that an input field is read-only.
+     * @default false
+     */
+    readonly?: boolean | undefined;
+    /**
+     * Index of the element in tabbing order.
+     */
+    tabindex?: number | undefined;
+    /**
+     * 	Identifier of the underlying input element.
+     */
+    inputId?: string | undefined;
+    /**
+     * Style class of the input field.
+     */
+    inputClass?: string | object | undefined;
+    /**
+     * Inline style of the input field.
+     */
+    inputStyle?: object | undefined;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    ariaLabelledby?: string | undefined;
+    /**
+     * Establishes a string value that labels the component.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * It generates scoped CSS variables using design tokens for the component.
+     */
+    dt?: DesignToken<any>;
+    /**
+     * Used to pass attributes to DOM elements inside the component.
+     * @type {ToggleSwitchPassThroughOptions}
+     */
+    pt?: PassThrough<ToggleSwitchPassThroughOptions>;
+    /**
+     * Used to configure passthrough(pt) options of the component.
+     * @type {PassThroughOptions}
+     */
+    ptOptions?: PassThroughOptions;
+    /**
+     * When enabled, it removes component related styles in the core.
+     * @defaultValue false
+     */
+    unstyled?: boolean;
+}
+
+/**
+ * Defines current options in ToggleSwitch component.
+ */
+export interface ToggleSwitchContext {
+    /**
+     * Current checked state of the item as a boolean.
+     * @defaultValue false
+     */
+    checked: boolean;
+    /**
+     * Current disabled state of the item as a boolean.
+     * @defaultValue false
+     */
+    disabled: boolean;
+}
+
+export interface ToggleSwitchSlots {}
+
+/**
+ * Defines valid emits in ToggleSwitch component.
+ */
+export interface ToggleSwitchEmitsOptions {
+    /**
+     * Emitted when the value changes.
+     * @param {boolean} value - New value.
+     */
+    'update:modelValue'(value: boolean): void;
+    /**
+     * Callback to invoke on value change.
+     * @param {Event} event - Browser event.
+     */
+    change(event: Event): void;
+    /**
+     * Callback to invoke when the component receives focus.
+     * @param {Event} event - Browser event.
+     */
+    focus(event: Event): void;
+    /**
+     * Callback to invoke when the component loses focus.
+     * @param {Event} event - Browser event.
+     */
+    blur(event: Event): void;
+}
+
+export declare type ToggleSwitchEmits = EmitFn<ToggleSwitchEmitsOptions>;
+
+/**
+ * **primevuelab - ToggleSwitch**
+ *
+ * _ToggleSwitch is used to select a boolean value._
+ *
+ * [Live Demo](https://www.primevuelab.org/toggleswitch/)
+ * --- ---
+ * ![primevuelab](https://primefaces.org/cdn/primevuelab/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const ToggleSwitch: DefineComponent<ToggleSwitchProps, ToggleSwitchSlots, ToggleSwitchEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        ToggleSwitch: GlobalComponentConstructor<ToggleSwitchProps, ToggleSwitchSlots, ToggleSwitchEmits>;
+    }
+}
+
+export default ToggleSwitch;

package/toggleswitch/ToggleSwitch.vue

@@ -0,0 +1,66 @@
+<template>
+    <div :class="cx('root')" :style="sx('root')" v-bind="getPTOptions('root')" :data-p-checked="checked" :data-p-disabled="disabled">
+        <input
+            :id="inputId"
+            type="checkbox"
+            role="switch"
+            :class="[cx('input'), inputClass]"
+            :style="inputStyle"
+            :checked="checked"
+            :tabindex="tabindex"
+            :disabled="disabled"
+            :readonly="readonly"
+            :aria-checked="checked"
+            :aria-labelledby="ariaLabelledby"
+            :aria-label="ariaLabel"
+            :aria-invalid="invalid || undefined"
+            @focus="onFocus"
+            @blur="onBlur"
+            @change="onChange"
+            v-bind="getPTOptions('input')"
+        />
+        <span :class="cx('slider')" v-bind="getPTOptions('slider')"></span>
+    </div>
+</template>
+
+<script>
+import BaseToggleSwitch from './BaseToggleSwitch.vue';
+
+export default {
+    name: 'ToggleSwitch',
+    extends: BaseToggleSwitch,
+    inheritAttrs: false,
+    emits: ['update:modelValue', 'change', 'focus', 'blur'],
+    methods: {
+        getPTOptions(key) {
+            const _ptm = key === 'root' ? this.ptmi : this.ptm;
+
+            return _ptm(key, {
+                context: {
+                    checked: this.checked,
+                    disabled: this.disabled
+                }
+            });
+        },
+        onChange(event) {
+            if (!this.disabled && !this.readonly) {
+                const newValue = this.checked ? this.falseValue : this.trueValue;
+
+                this.$emit('update:modelValue', newValue);
+                this.$emit('change', event);
+            }
+        },
+        onFocus(event) {
+            this.$emit('focus', event);
+        },
+        onBlur(event) {
+            this.$emit('blur', event);
+        }
+    },
+    computed: {
+        checked() {
+            return this.modelValue === this.trueValue;
+        }
+    }
+};
+</script>

package/toggleswitch/package.json

@@ -0,0 +1,11 @@
+{
+    "main": "toggleswitch.mjs",
+    "module": "toggleswitch.mjs",
+    "types": "./ToggleSwitch.d.ts",
+    "browser": {
+        "./sfc": "./ToggleSwitch.vue"
+    },
+    "sideEffects": [
+        "*.vue"
+    ]
+}

package/toggleswitch/style/ToggleSwitchStyle.d.ts

@@ -0,0 +1,27 @@
+/**
+ *
+ * ToggleSwitch is used to select a boolean value.
+ *
+ * [Live Demo](https://www.primevuelab.org/toggleswitch/)
+ *
+ * @module toggleswitchstyle
+ *
+ */
+import { BaseStyle } from '../../base/style';
+
+export enum ToggleSwitchClasses {
+    /**
+     * Class name of the root element
+     */
+    root = 'p-toggleswitch',
+    /**
+     * Class name of the input element
+     */
+    input = 'p-toggleswitch-input',
+    /**
+     * Class name of the slider element
+     */
+    slider = 'p-toggleswitch-slider'
+}
+
+export interface ToggleSwitchStyle extends BaseStyle {}

package/toggleswitch/style/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "toggleswitchstyle.mjs",
+    "module": "toggleswitchstyle.mjs",
+    "types": "./ToggleSwitchStyle.d.ts",
+    "sideEffects": false
+}

package/toggleswitch/style/toggleswitchstyle.mjs

@@ -0,0 +1,33 @@
+import BaseStyle from '@primevuelab/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-toggleswitch {\n    display: inline-block;\n    width: ".concat(dt('toggleswitch.width'), ";\n    height: ").concat(dt('toggleswitch.height'), ";\n}\n\n.p-toggleswitch-input {\n    cursor: pointer;\n    appearance: none;\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n    opacity: 0;\n    z-index: 1;\n    outline: 0 none;\n    border-radius: ").concat(dt('toggleswitch.border.radius'), ";\n}\n\n.p-toggleswitch-slider {\n    display: inline-block;\n    cursor: pointer;\n    width: 100%;\n    height: 100%;\n    border-width: ").concat(dt('toggleswitch.border.width'), ";\n    border-style: solid;\n    border-color: ").concat(dt('toggleswitch.border.color'), ";\n    background: ").concat(dt('toggleswitch.background'), ";\n    transition: background ").concat(dt('toggleswitch.transition.duration'), ", color ").concat(dt('toggleswitch.transition.duration'), ", border-color ").concat(dt('toggleswitch.transition.duration'), ", outline-color ").concat(dt('toggleswitch.transition.duration'), ", box-shadow ").concat(dt('toggleswitch.transition.duration'), ";\n    border-radius: ").concat(dt('toggleswitch.border.radius'), ";\n    outline-color: transparent;\n    box-shadow: ").concat(dt('toggleswitch.shadow'), ";\n}\n\n.p-toggleswitch-slider:before {\n    position: absolute;\n    content: \"\";\n    top: 50%;\n    background: ").concat(dt('toggleswitch.handle.background'), ";\n    width: ").concat(dt('toggleswitch.handle.size'), ";\n    height: ").concat(dt('toggleswitch.handle.size'), ";\n    left: ").concat(dt('toggleswitch.gap'), ";\n    margin-top: calc(-1 * calc(").concat(dt('toggleswitch.handle.size'), " / 2));\n    border-radius: ").concat(dt('toggleswitch.handle.border.radius'), ";\n    transition: background ").concat(dt('toggleswitch.transition.duration'), ", left ").concat(dt('toggleswitch.slide.duration'), ";\n}\n\n.p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider {\n    background: ").concat(dt('toggleswitch.checked.background'), ";\n    border-color: ").concat(dt('toggleswitch.checked.border.color'), ";\n}\n\n.p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider:before {\n    background: ").concat(dt('toggleswitch.handle.checked.background'), ";\n    left: calc(").concat(dt('toggleswitch.width'), " - calc(").concat(dt('toggleswitch.handle.size'), " + ").concat(dt('toggleswitch.gap'), "));\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover) .p-toggleswitch-slider {\n    background: ").concat(dt('toggleswitch.hover.background'), ";\n    border-color: ").concat(dt('toggleswitch.hover.border.color'), ";\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover) .p-toggleswitch-slider:before {\n    background: ").concat(dt('toggleswitch.handle.hover.background'), ";\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider {\n    background: ").concat(dt('toggleswitch.checked.hover.background'), ";\n    border-color: ").concat(dt('toggleswitch.checked.hover.border.color'), ";\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider:before {\n    background: ").concat(dt('toggleswitch.handle.checked.hover.background'), ";\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:focus-visible) .p-toggleswitch-slider {\n    box-shadow: ").concat(dt('toggleswitch.focus.ring.shadow'), ";\n    outline: ").concat(dt('toggleswitch.focus.ring.width'), " ").concat(dt('toggleswitch.focus.ring.style'), " ").concat(dt('toggleswitch.focus.ring.color'), ";\n    outline-offset: ").concat(dt('toggleswitch.focus.ring.offset'), ";\n}\n\n.p-toggleswitch.p-invalid > .p-toggleswitch-slider {\n    border-color: ").concat(dt('toggleswitch.invalid.border.color'), ";\n}\n");
+};
+var inlineStyles = {
+  root: {
+    position: 'relative'
+  }
+};
+var classes = {
+  root: function root(_ref2) {
+    var instance = _ref2.instance,
+      props = _ref2.props;
+    return ['p-toggleswitch p-component', {
+      'p-toggleswitch-checked': instance.checked,
+      'p-disabled': props.disabled,
+      'p-invalid': props.invalid
+    }];
+  },
+  input: 'p-toggleswitch-input',
+  slider: 'p-toggleswitch-slider'
+};
+var ToggleSwitchStyle = BaseStyle.extend({
+  name: 'toggleswitch',
+  theme: theme,
+  classes: classes,
+  inlineStyles: inlineStyles
+});
+
+export { ToggleSwitchStyle as default };
+//# sourceMappingURL=toggleswitchstyle.mjs.map

package/toggleswitch/style/toggleswitchstyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggleswitchstyle.mjs","sources":["../../../src/toggleswitch/style/ToggleSwitchStyle.js"],"sourcesContent":["import BaseStyle from '@primevuelab/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-toggleswitch {\n    display: inline-block;\n    width: ${dt('toggleswitch.width')};\n    height: ${dt('toggleswitch.height')};\n}\n\n.p-toggleswitch-input {\n    cursor: pointer;\n    appearance: none;\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n    opacity: 0;\n    z-index: 1;\n    outline: 0 none;\n    border-radius: ${dt('toggleswitch.border.radius')};\n}\n\n.p-toggleswitch-slider {\n    display: inline-block;\n    cursor: pointer;\n    width: 100%;\n    height: 100%;\n    border-width: ${dt('toggleswitch.border.width')};\n    border-style: solid;\n    border-color: ${dt('toggleswitch.border.color')};\n    background: ${dt('toggleswitch.background')};\n    transition: background ${dt('toggleswitch.transition.duration')}, color ${dt('toggleswitch.transition.duration')}, border-color ${dt('toggleswitch.transition.duration')}, outline-color ${dt('toggleswitch.transition.duration')}, box-shadow ${dt(\n        'toggleswitch.transition.duration'\n    )};\n    border-radius: ${dt('toggleswitch.border.radius')};\n    outline-color: transparent;\n    box-shadow: ${dt('toggleswitch.shadow')};\n}\n\n.p-toggleswitch-slider:before {\n    position: absolute;\n    content: \"\";\n    top: 50%;\n    background: ${dt('toggleswitch.handle.background')};\n    width: ${dt('toggleswitch.handle.size')};\n    height: ${dt('toggleswitch.handle.size')};\n    left: ${dt('toggleswitch.gap')};\n    margin-top: calc(-1 * calc(${dt('toggleswitch.handle.size')} / 2));\n    border-radius: ${dt('toggleswitch.handle.border.radius')};\n    transition: background ${dt('toggleswitch.transition.duration')}, left ${dt('toggleswitch.slide.duration')};\n}\n\n.p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider {\n    background: ${dt('toggleswitch.checked.background')};\n    border-color: ${dt('toggleswitch.checked.border.color')};\n}\n\n.p-toggleswitch.p-toggleswitch-checked .p-toggleswitch-slider:before {\n    background: ${dt('toggleswitch.handle.checked.background')};\n    left: calc(${dt('toggleswitch.width')} - calc(${dt('toggleswitch.handle.size')} + ${dt('toggleswitch.gap')}));\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover) .p-toggleswitch-slider {\n    background: ${dt('toggleswitch.hover.background')};\n    border-color: ${dt('toggleswitch.hover.border.color')};\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover) .p-toggleswitch-slider:before {\n    background: ${dt('toggleswitch.handle.hover.background')};\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider {\n    background: ${dt('toggleswitch.checked.hover.background')};\n    border-color: ${dt('toggleswitch.checked.hover.border.color')};\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:hover).p-toggleswitch-checked .p-toggleswitch-slider:before {\n    background: ${dt('toggleswitch.handle.checked.hover.background')};\n}\n\n.p-toggleswitch:not(.p-disabled):has(.p-toggleswitch-input:focus-visible) .p-toggleswitch-slider {\n    box-shadow: ${dt('toggleswitch.focus.ring.shadow')};\n    outline: ${dt('toggleswitch.focus.ring.width')} ${dt('toggleswitch.focus.ring.style')} ${dt('toggleswitch.focus.ring.color')};\n    outline-offset: ${dt('toggleswitch.focus.ring.offset')};\n}\n\n.p-toggleswitch.p-invalid > .p-toggleswitch-slider {\n    border-color: ${dt('toggleswitch.invalid.border.color')};\n}\n`;\n\nconst inlineStyles = {\n    root: { position: 'relative' }\n};\n\nconst classes = {\n    root: ({ instance, props }) => [\n        'p-toggleswitch p-component',\n        {\n            'p-toggleswitch-checked': instance.checked,\n            'p-disabled': props.disabled,\n            'p-invalid': props.invalid\n        }\n    ],\n    input: 'p-toggleswitch-input',\n    slider: 'p-toggleswitch-slider'\n};\n\nexport default BaseStyle.extend({\n    name: 'toggleswitch',\n    theme,\n    classes,\n    inlineStyles\n});\n"],"names":["theme","_ref","dt","concat","inlineStyles","root","position","classes","_ref2","instance","props","checked","disabled","invalid","input","slider","BaseStyle","extend","name"],"mappings":"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"}

package/toggleswitch/toggleswitch.mjs

@@ -0,0 +1,143 @@
+import BaseComponent from '@primevuelab/core/basecomponent';
+import ToggleSwitchStyle from 'primevuelab/toggleswitch/style';
+import { openBlock, createElementBlock, mergeProps, createElementVNode } from 'vue';
+
+var script$1 = {
+  name: 'BaseToggleSwitch',
+  "extends": BaseComponent,
+  props: {
+    modelValue: {
+      type: null,
+      "default": false
+    },
+    trueValue: {
+      type: null,
+      "default": true
+    },
+    falseValue: {
+      type: null,
+      "default": false
+    },
+    invalid: {
+      type: Boolean,
+      "default": false
+    },
+    disabled: {
+      type: Boolean,
+      "default": false
+    },
+    readonly: {
+      type: Boolean,
+      "default": false
+    },
+    tabindex: {
+      type: Number,
+      "default": null
+    },
+    inputId: {
+      type: String,
+      "default": null
+    },
+    inputClass: {
+      type: [String, Object],
+      "default": null
+    },
+    inputStyle: {
+      type: Object,
+      "default": null
+    },
+    ariaLabelledby: {
+      type: String,
+      "default": null
+    },
+    ariaLabel: {
+      type: String,
+      "default": null
+    }
+  },
+  style: ToggleSwitchStyle,
+  provide: function provide() {
+    return {
+      $pcToggleSwitch: this,
+      $parentInstance: this
+    };
+  }
+};
+
+var script = {
+  name: 'ToggleSwitch',
+  "extends": script$1,
+  inheritAttrs: false,
+  emits: ['update:modelValue', 'change', 'focus', 'blur'],
+  methods: {
+    getPTOptions: function getPTOptions(key) {
+      var _ptm = key === 'root' ? this.ptmi : this.ptm;
+      return _ptm(key, {
+        context: {
+          checked: this.checked,
+          disabled: this.disabled
+        }
+      });
+    },
+    onChange: function onChange(event) {
+      if (!this.disabled && !this.readonly) {
+        var newValue = this.checked ? this.falseValue : this.trueValue;
+        this.$emit('update:modelValue', newValue);
+        this.$emit('change', event);
+      }
+    },
+    onFocus: function onFocus(event) {
+      this.$emit('focus', event);
+    },
+    onBlur: function onBlur(event) {
+      this.$emit('blur', event);
+    }
+  },
+  computed: {
+    checked: function checked() {
+      return this.modelValue === this.trueValue;
+    }
+  }
+};
+
+var _hoisted_1 = ["data-p-checked", "data-p-disabled"];
+var _hoisted_2 = ["id", "checked", "tabindex", "disabled", "readonly", "aria-checked", "aria-labelledby", "aria-label", "aria-invalid"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", mergeProps({
+    "class": _ctx.cx('root'),
+    style: _ctx.sx('root')
+  }, $options.getPTOptions('root'), {
+    "data-p-checked": $options.checked,
+    "data-p-disabled": _ctx.disabled
+  }), [createElementVNode("input", mergeProps({
+    id: _ctx.inputId,
+    type: "checkbox",
+    role: "switch",
+    "class": [_ctx.cx('input'), _ctx.inputClass],
+    style: _ctx.inputStyle,
+    checked: $options.checked,
+    tabindex: _ctx.tabindex,
+    disabled: _ctx.disabled,
+    readonly: _ctx.readonly,
+    "aria-checked": $options.checked,
+    "aria-labelledby": _ctx.ariaLabelledby,
+    "aria-label": _ctx.ariaLabel,
+    "aria-invalid": _ctx.invalid || undefined,
+    onFocus: _cache[0] || (_cache[0] = function () {
+      return $options.onFocus && $options.onFocus.apply($options, arguments);
+    }),
+    onBlur: _cache[1] || (_cache[1] = function () {
+      return $options.onBlur && $options.onBlur.apply($options, arguments);
+    }),
+    onChange: _cache[2] || (_cache[2] = function () {
+      return $options.onChange && $options.onChange.apply($options, arguments);
+    })
+  }, $options.getPTOptions('input')), null, 16, _hoisted_2), createElementVNode("span", mergeProps({
+    "class": _ctx.cx('slider')
+  }, $options.getPTOptions('slider')), null, 16)], 16, _hoisted_1);
+}
+
+script.render = render;
+
+export { script as default };
+//# sourceMappingURL=toggleswitch.mjs.map

package/toggleswitch/toggleswitch.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggleswitch.mjs","sources":["../../src/toggleswitch/BaseToggleSwitch.vue","../../src/toggleswitch/ToggleSwitch.vue","../../src/toggleswitch/ToggleSwitch.vue?vue&type=template&id=5f95dadd&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevuelab/core/basecomponent';\nimport ToggleSwitchStyle from 'primevuelab/toggleswitch/style';\n\nexport default {\n    name: 'BaseToggleSwitch',\n    extends: BaseComponent,\n    props: {\n        modelValue: {\n            type: null,\n            default: false\n        },\n        trueValue: {\n            type: null,\n            default: true\n        },\n        falseValue: {\n            type: null,\n            default: false\n        },\n        invalid: {\n            type: Boolean,\n            default: false\n        },\n        disabled: {\n            type: Boolean,\n            default: false\n        },\n        readonly: {\n            type: Boolean,\n            default: false\n        },\n        tabindex: {\n            type: Number,\n            default: null\n        },\n        inputId: {\n            type: String,\n            default: null\n        },\n        inputClass: {\n            type: [String, Object],\n            default: null\n        },\n        inputStyle: {\n            type: Object,\n            default: null\n        },\n        ariaLabelledby: {\n            type: String,\n            default: null\n        },\n        ariaLabel: {\n            type: String,\n            default: null\n        }\n    },\n    style: ToggleSwitchStyle,\n    provide() {\n        return {\n            $pcToggleSwitch: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" :style=\"sx('root')\" v-bind=\"getPTOptions('root')\" :data-p-checked=\"checked\" :data-p-disabled=\"disabled\">\n        <input\n            :id=\"inputId\"\n            type=\"checkbox\"\n            role=\"switch\"\n            :class=\"[cx('input'), inputClass]\"\n            :style=\"inputStyle\"\n            :checked=\"checked\"\n            :tabindex=\"tabindex\"\n            :disabled=\"disabled\"\n            :readonly=\"readonly\"\n            :aria-checked=\"checked\"\n            :aria-labelledby=\"ariaLabelledby\"\n            :aria-label=\"ariaLabel\"\n            :aria-invalid=\"invalid || undefined\"\n            @focus=\"onFocus\"\n            @blur=\"onBlur\"\n            @change=\"onChange\"\n            v-bind=\"getPTOptions('input')\"\n        />\n        <span :class=\"cx('slider')\" v-bind=\"getPTOptions('slider')\"></span>\n    </div>\n</template>\n\n<script>\nimport BaseToggleSwitch from './BaseToggleSwitch.vue';\n\nexport default {\n    name: 'ToggleSwitch',\n    extends: BaseToggleSwitch,\n    inheritAttrs: false,\n    emits: ['update:modelValue', 'change', 'focus', 'blur'],\n    methods: {\n        getPTOptions(key) {\n            const _ptm = key === 'root' ? this.ptmi : this.ptm;\n\n            return _ptm(key, {\n                context: {\n                    checked: this.checked,\n                    disabled: this.disabled\n                }\n            });\n        },\n        onChange(event) {\n            if (!this.disabled && !this.readonly) {\n                const newValue = this.checked ? this.falseValue : this.trueValue;\n\n                this.$emit('update:modelValue', newValue);\n                this.$emit('change', event);\n            }\n        },\n        onFocus(event) {\n            this.$emit('focus', event);\n        },\n        onBlur(event) {\n            this.$emit('blur', event);\n        }\n    },\n    computed: {\n        checked() {\n            return this.modelValue === this.trueValue;\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" :style=\"sx('root')\" v-bind=\"getPTOptions('root')\" :data-p-checked=\"checked\" :data-p-disabled=\"disabled\">\n        <input\n            :id=\"inputId\"\n            type=\"checkbox\"\n            role=\"switch\"\n            :class=\"[cx('input'), inputClass]\"\n            :style=\"inputStyle\"\n            :checked=\"checked\"\n            :tabindex=\"tabindex\"\n            :disabled=\"disabled\"\n            :readonly=\"readonly\"\n            :aria-checked=\"checked\"\n            :aria-labelledby=\"ariaLabelledby\"\n            :aria-label=\"ariaLabel\"\n            :aria-invalid=\"invalid || undefined\"\n            @focus=\"onFocus\"\n            @blur=\"onBlur\"\n            @change=\"onChange\"\n            v-bind=\"getPTOptions('input')\"\n        />\n        <span :class=\"cx('slider')\" v-bind=\"getPTOptions('slider')\"></span>\n    </div>\n</template>\n\n<script>\nimport BaseToggleSwitch from './BaseToggleSwitch.vue';\n\nexport default {\n    name: 'ToggleSwitch',\n    extends: BaseToggleSwitch,\n    inheritAttrs: false,\n    emits: ['update:modelValue', 'change', 'focus', 'blur'],\n    methods: {\n        getPTOptions(key) {\n            const _ptm = key === 'root' ? this.ptmi : this.ptm;\n\n            return _ptm(key, {\n                context: {\n                    checked: this.checked,\n                    disabled: this.disabled\n                }\n            });\n        },\n        onChange(event) {\n            if (!this.disabled && !this.readonly) {\n                const newValue = this.checked ? this.falseValue : this.trueValue;\n\n                this.$emit('update:modelValue', newValue);\n                this.$emit('change', event);\n            }\n        },\n        onFocus(event) {\n            this.$emit('focus', event);\n        },\n        onBlur(event) {\n            this.$emit('blur', event);\n        }\n    },\n    computed: {\n        checked() {\n            return this.modelValue === this.trueValue;\n        }\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","modelValue","type","trueValue","falseValue","invalid","Boolean","disabled","readonly","tabindex","Number","inputId","String","inputClass","Object","inputStyle","ariaLabelledby","ariaLabel","style","ToggleSwitchStyle","provide","$pcToggleSwitch","$parentInstance","BaseToggleSwitch","inheritAttrs","emits","methods","getPTOptions","key","_ptm","ptmi","ptm","context","checked","onChange","event","newValue","$emit","onFocus","onBlur","computed","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","sx","$options","_createElementVNode","id","role","undefined","apply","arguments","_hoisted_2"],"mappings":"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"}

package/toolbar/BaseToolbar.vue

@@ -0,0 +1,22 @@
+<script>
+import BaseComponent from '@primevuelab/core/basecomponent';
+import ToolbarStyle from 'primevuelab/toolbar/style';
+
+export default {
+    name: 'BaseToolbar',
+    extends: BaseComponent,
+    props: {
+        ariaLabelledby: {
+            type: String,
+            default: null
+        }
+    },
+    style: ToolbarStyle,
+    provide() {
+        return {
+            $pcToolbar: this,
+            $parentInstance: this
+        };
+    }
+};
+</script>