primevuelab 4.0.0-beta.4

package/checkbox/style/checkboxstyle.mjs

@@ -0,0 +1,29 @@
+import BaseStyle from '@primevuelab/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-checkbox {\n    position: relative;\n    display: inline-flex;\n    user-select: none;\n    vertical-align: bottom;\n    width: ".concat(dt('checkbox.width'), ";\n    height: ").concat(dt('checkbox.height'), ";\n}\n\n.p-checkbox-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: 1px solid transparent;\n    border-radius: ").concat(dt('checkbox.border.radius'), ";\n}\n\n.p-checkbox-box {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: ").concat(dt('checkbox.border.radius'), ";\n    border: 1px solid ").concat(dt('checkbox.border.color'), ";\n    background: ").concat(dt('checkbox.background'), ";\n    width: ").concat(dt('checkbox.width'), ";\n    height: ").concat(dt('checkbox.width'), ";\n    transition: background ").concat(dt('checkbox.transition.duration'), ", color ").concat(dt('checkbox.transition.duration'), ", border-color ").concat(dt('checkbox.transition.duration'), ", box-shadow ").concat(dt('checkbox.transition.duration'), ", outline-color ").concat(dt('checkbox.transition.duration'), ";\n    outline-color: transparent;\n    box-shadow: ").concat(dt('checkbox.shadow'), ";\n}\n\n.p-checkbox-icon {\n    transition-duration: ").concat(dt('checkbox.transition.duration'), ";\n    color: ").concat(dt('checkbox.icon.color'), ";\n    font-size: ").concat(dt('checkbox.icon.size'), ";\n    width: ").concat(dt('checkbox.icon.size'), ";\n    height: ").concat(dt('checkbox.icon.size'), ";\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    border-color: ").concat(dt('checkbox.hover.border.color'), ";\n}\n\n.p-checkbox-checked .p-checkbox-box {\n    border-color: ").concat(dt('checkbox.checked.border.color'), ";\n    background: ").concat(dt('checkbox.checked.background'), ";\n}\n\n.p-checkbox-checked .p-checkbox-icon {\n    color: ").concat(dt('checkbox.icon.checked.color'), ";\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    background: ").concat(dt('checkbox.checked.hover.background'), ";\n    border-color: ").concat(dt('checkbox.checked.hover.border.color'), ";\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-icon {\n    color: ").concat(dt('checkbox.icon.checked.hover.color'), ";\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n    border-color: ").concat(dt('checkbox.focus.border.color'), ";\n    box-shadow: ").concat(dt('checkbox.focus.ring.shadow'), ";\n    outline: ").concat(dt('checkbox.focus.ring.width'), " ").concat(dt('checkbox.focus.ring.style'), " ").concat(dt('checkbox.focus.ring.color'), ";\n    outline-offset: ").concat(dt('checkbox.focus.ring.offset'), ";\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n    border-color: ").concat(dt('checkbox.checked.focus.border.color'), ";\n}\n\n.p-checkbox.p-invalid > .p-checkbox-box {\n    border-color: ").concat(dt('checkbox.invalid.border.color'), ";\n}\n\n.p-checkbox.p-variant-filled .p-checkbox-box {\n    background: ").concat(dt('checkbox.filled.background'), ";\n}\n\n.p-checkbox-checked.p-variant-filled .p-checkbox-box {\n    background: ").concat(dt('checkbox.checked.background'), ";\n}\n\n.p-checkbox-checked.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    background: ").concat(dt('checkbox.checked.hover.background'), ";\n}\n\n.p-checkbox.p-disabled {\n    opacity: 1;\n}\n\n.p-checkbox.p-disabled .p-checkbox-box {\n    background: ").concat(dt('checkbox.disabled.background'), ";\n}\n\n.p-checkbox.p-disabled .p-checkbox-box .p-checkbox-icon {\n    color: ").concat(dt('checkbox.icon.disabled.color'), ";\n}\n");
+};
+var classes = {
+  root: function root(_ref2) {
+    var instance = _ref2.instance,
+      props = _ref2.props;
+    return ['p-checkbox p-component', {
+      'p-checkbox-checked': instance.checked,
+      'p-disabled': props.disabled,
+      'p-invalid': props.invalid,
+      'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled' || instance.$primevue.config.inputVariant === 'filled'
+    }];
+  },
+  box: 'p-checkbox-box',
+  input: 'p-checkbox-input',
+  icon: 'p-checkbox-icon'
+};
+var CheckboxStyle = BaseStyle.extend({
+  name: 'checkbox',
+  theme: theme,
+  classes: classes
+});
+
+export { CheckboxStyle as default };
+//# sourceMappingURL=checkboxstyle.mjs.map

package/checkbox/style/checkboxstyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkboxstyle.mjs","sources":["../../../src/checkbox/style/CheckboxStyle.js"],"sourcesContent":["import BaseStyle from '@primevuelab/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-checkbox {\n    position: relative;\n    display: inline-flex;\n    user-select: none;\n    vertical-align: bottom;\n    width: ${dt('checkbox.width')};\n    height: ${dt('checkbox.height')};\n}\n\n.p-checkbox-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: 1px solid transparent;\n    border-radius: ${dt('checkbox.border.radius')};\n}\n\n.p-checkbox-box {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: ${dt('checkbox.border.radius')};\n    border: 1px solid ${dt('checkbox.border.color')};\n    background: ${dt('checkbox.background')};\n    width: ${dt('checkbox.width')};\n    height: ${dt('checkbox.width')};\n    transition: background ${dt('checkbox.transition.duration')}, color ${dt('checkbox.transition.duration')}, border-color ${dt('checkbox.transition.duration')}, box-shadow ${dt('checkbox.transition.duration')}, outline-color ${dt(\n        'checkbox.transition.duration'\n    )};\n    outline-color: transparent;\n    box-shadow: ${dt('checkbox.shadow')};\n}\n\n.p-checkbox-icon {\n    transition-duration: ${dt('checkbox.transition.duration')};\n    color: ${dt('checkbox.icon.color')};\n    font-size: ${dt('checkbox.icon.size')};\n    width: ${dt('checkbox.icon.size')};\n    height: ${dt('checkbox.icon.size')};\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    border-color: ${dt('checkbox.hover.border.color')};\n}\n\n.p-checkbox-checked .p-checkbox-box {\n    border-color: ${dt('checkbox.checked.border.color')};\n    background: ${dt('checkbox.checked.background')};\n}\n\n.p-checkbox-checked .p-checkbox-icon {\n    color: ${dt('checkbox.icon.checked.color')};\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    background: ${dt('checkbox.checked.hover.background')};\n    border-color: ${dt('checkbox.checked.hover.border.color')};\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-icon {\n    color: ${dt('checkbox.icon.checked.hover.color')};\n}\n\n.p-checkbox:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n    border-color: ${dt('checkbox.focus.border.color')};\n    box-shadow: ${dt('checkbox.focus.ring.shadow')};\n    outline: ${dt('checkbox.focus.ring.width')} ${dt('checkbox.focus.ring.style')} ${dt('checkbox.focus.ring.color')};\n    outline-offset: ${dt('checkbox.focus.ring.offset')};\n}\n\n.p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:focus-visible) .p-checkbox-box {\n    border-color: ${dt('checkbox.checked.focus.border.color')};\n}\n\n.p-checkbox.p-invalid > .p-checkbox-box {\n    border-color: ${dt('checkbox.invalid.border.color')};\n}\n\n.p-checkbox.p-variant-filled .p-checkbox-box {\n    background: ${dt('checkbox.filled.background')};\n}\n\n.p-checkbox-checked.p-variant-filled .p-checkbox-box {\n    background: ${dt('checkbox.checked.background')};\n}\n\n.p-checkbox-checked.p-variant-filled:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box {\n    background: ${dt('checkbox.checked.hover.background')};\n}\n\n.p-checkbox.p-disabled {\n    opacity: 1;\n}\n\n.p-checkbox.p-disabled .p-checkbox-box {\n    background: ${dt('checkbox.disabled.background')};\n}\n\n.p-checkbox.p-disabled .p-checkbox-box .p-checkbox-icon {\n    color: ${dt('checkbox.icon.disabled.color')};\n}\n`;\n\nconst classes = {\n    root: ({ instance, props }) => [\n        'p-checkbox p-component',\n        {\n            'p-checkbox-checked': instance.checked,\n            'p-disabled': props.disabled,\n            'p-invalid': props.invalid,\n            'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled' || instance.$primevue.config.inputVariant === 'filled'\n        }\n    ],\n    box: 'p-checkbox-box',\n    input: 'p-checkbox-input',\n    icon: 'p-checkbox-icon'\n};\n\nexport default BaseStyle.extend({\n    name: 'checkbox',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","_ref2","instance","props","checked","disabled","invalid","variant","$primevue","config","inputStyle","inputVariant","box","input","icon","BaseStyle","extend","name"],"mappings":"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"}

package/checkbox/style/package.json

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

package/chip/BaseChip.vue

@@ -0,0 +1,38 @@
+<script>
+import BaseComponent from '@primevuelab/core/basecomponent';
+import ChipStyle from 'primevuelab/chip/style';
+
+export default {
+    name: 'BaseChip',
+    extends: BaseComponent,
+    props: {
+        label: {
+            type: String,
+            default: null
+        },
+        icon: {
+            type: String,
+            default: null
+        },
+        image: {
+            type: String,
+            default: null
+        },
+        removable: {
+            type: Boolean,
+            default: false
+        },
+        removeIcon: {
+            type: String,
+            default: undefined
+        }
+    },
+    style: ChipStyle,
+    provide() {
+        return {
+            $pcChip: this,
+            $parentInstance: this
+        };
+    }
+};
+</script>

package/chip/Chip.d.ts

@@ -0,0 +1,206 @@
+/**
+ *
+ * Chip represents people using icons, labels and images.
+ *
+ * [Live Demo](https://www.primevuelab.org/chip)
+ *
+ * @module chip
+ *
+ */
+import { VNode } from 'vue';
+import { ComponentHooks } from '../../../core/src/basecomponent';
+import { PassThroughOptions } from '../passthrough';
+import { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
+
+export declare type ChipPassThroughOptionType<T = any> = ChipPassThroughAttributes | ((options: ChipPassThroughMethodOptions<T>) => ChipPassThroughAttributes | string) | string | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ChipPassThroughMethodOptions<T> {
+    /**
+     * Defines instance.
+     */
+    instance: any;
+    /**
+     * Defines valid properties.
+     */
+    props: ChipProps;
+    /**
+     * Defines current inline state.
+     */
+    state: ChipState;
+    /**
+     * Defines valid attributes.
+     */
+    attrs: any;
+    /**
+     * Defines parent options.
+     */
+    parent: T;
+    /**
+     * Defines passthrough(pt) options in global config.
+     */
+    global: object | undefined;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ChipProps.pt}
+ */
+export interface ChipPassThroughOptions<T = any> {
+    /**
+     * Used to pass attributes to the root's DOM element.
+     */
+    root?: ChipPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the image's DOM element.
+     */
+    image?: ChipPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the icon's DOM element.
+     */
+    icon?: ChipPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the label' DOM element.
+     */
+    label?: ChipPassThroughOptionType<T>;
+    /**
+     * Used to pass attributes to the removeIcon's DOM element.
+     */
+    removeIcon?: ChipPassThroughOptionType<T>;
+    /**
+     * Used to manage all lifecycle hooks.
+     * @see {@link BaseComponent.ComponentHooks}
+     */
+    hooks?: ComponentHooks;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ChipPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in Chip component.
+ */
+export interface ChipState {
+    /**
+     * Current visible state as a boolean.
+     * @defaultValue true
+     */
+    visible: boolean;
+}
+
+/**
+ * Defines valid properties in Chip component.
+ */
+export interface ChipProps {
+    /**
+     * Defines the text to display.
+     */
+    label?: string;
+    /**
+     * Defines the icon to display.
+     */
+    icon?: string;
+    /**
+     * Defines the image to display.
+     */
+    image?: string;
+    /**
+     * Whether to display a remove icon.
+     * @defaultValue false
+     */
+    removable?: boolean;
+    /**
+     * Icon of the remove element.
+     */
+    removeIcon?: string;
+    /**
+     * 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 {ChipPassThroughOptions}
+     */
+    pt?: PassThrough<ChipPassThroughOptions>;
+    /**
+     * 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 valid slots in Chip component.
+ */
+export interface ChipSlots {
+    /**
+     * Content can easily be customized with the default slot instead of using the built-in modes.
+     */
+    default(): VNode[];
+    /**
+     * Custom icon template.
+     */
+    icon(): VNode[];
+    /**
+     * Custom remove icon template of chip component.
+     * @param {Object} scope - remove icon slot's params.
+     */
+    removeicon(scope: {
+        /**
+         * Remove icon click event
+         * @param {Event} event - Browser event
+         */
+        removeCallback: (event: Event) => void;
+        /**
+         * Remove icon keydown event
+         * @param {Event} event - Browser event
+         */
+        keydownCallback: (event: Event) => void;
+    }): VNode[];
+}
+
+/**
+ * Defines valid properties in Chip component.
+ */
+export interface ChipEmitsOptions {
+    /**
+     * Callback to invoke when a chip is removed.
+     * @param {Event} event - Browser event.
+     */
+    remove(event: Event): void;
+}
+
+export declare type ChipEmits = EmitFn<ChipEmitsOptions>;
+
+/**
+ * **primevuelab - Chip**
+ *
+ * _Chip represents people using icons, labels and images._
+ *
+ * [Live Demo](https://www.primevuelab.org/chip/)
+ * --- ---
+ * ![primevuelab](https://primefaces.org/cdn/primevuelab/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const Chip: DefineComponent<ChipProps, ChipSlots, ChipEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        Chip: GlobalComponentConstructor<ChipProps, ChipSlots, ChipEmits>;
+    }
+}
+
+export default Chip;

package/chip/Chip.vue

@@ -0,0 +1,44 @@
+<template>
+    <div v-if="visible" :class="cx('root')" :aria-label="label" v-bind="ptmi('root')">
+        <slot>
+            <img v-if="image" :src="image" v-bind="ptm('image')" :class="cx('image')" />
+            <component v-else-if="$slots.icon" :is="$slots.icon" :class="cx('icon')" v-bind="ptm('icon')" />
+            <span v-else-if="icon" :class="[cx('icon'), icon]" v-bind="ptm('icon')" />
+            <div v-if="label" :class="cx('label')" v-bind="ptm('label')">{{ label }}</div>
+        </slot>
+        <slot v-if="removable" name="removeicon" :removeCallback="close" :keydownCallback="onKeydown">
+            <component :is="removeIcon ? 'span' : 'TimesCircleIcon'" tabindex="0" :class="[cx('removeIcon'), removeIcon]" @click="close" @keydown="onKeydown" v-bind="ptm('removeIcon')"></component>
+        </slot>
+    </div>
+</template>
+
+<script>
+import TimesCircleIcon from '@primevuelab/icons/timescircle';
+import BaseChip from './BaseChip.vue';
+
+export default {
+    name: 'Chip',
+    extends: BaseChip,
+    inheritAttrs: false,
+    emits: ['remove'],
+    data() {
+        return {
+            visible: true
+        };
+    },
+    methods: {
+        onKeydown(event) {
+            if (event.key === 'Enter' || event.key === 'Backspace') {
+                this.close(event);
+            }
+        },
+        close(event) {
+            this.visible = false;
+            this.$emit('remove', event);
+        }
+    },
+    components: {
+        TimesCircleIcon
+    }
+};
+</script>

package/chip/chip.mjs

@@ -0,0 +1,106 @@
+import TimesCircleIcon from '@primevuelab/icons/timescircle';
+import BaseComponent from '@primevuelab/core/basecomponent';
+import ChipStyle from 'primevuelab/chip/style';
+import { openBlock, createElementBlock, mergeProps, renderSlot, createBlock, resolveDynamicComponent, createCommentVNode, toDisplayString } from 'vue';
+
+var script$1 = {
+  name: 'BaseChip',
+  "extends": BaseComponent,
+  props: {
+    label: {
+      type: String,
+      "default": null
+    },
+    icon: {
+      type: String,
+      "default": null
+    },
+    image: {
+      type: String,
+      "default": null
+    },
+    removable: {
+      type: Boolean,
+      "default": false
+    },
+    removeIcon: {
+      type: String,
+      "default": undefined
+    }
+  },
+  style: ChipStyle,
+  provide: function provide() {
+    return {
+      $pcChip: this,
+      $parentInstance: this
+    };
+  }
+};
+
+var script = {
+  name: 'Chip',
+  "extends": script$1,
+  inheritAttrs: false,
+  emits: ['remove'],
+  data: function data() {
+    return {
+      visible: true
+    };
+  },
+  methods: {
+    onKeydown: function onKeydown(event) {
+      if (event.key === 'Enter' || event.key === 'Backspace') {
+        this.close(event);
+      }
+    },
+    close: function close(event) {
+      this.visible = false;
+      this.$emit('remove', event);
+    }
+  },
+  components: {
+    TimesCircleIcon: TimesCircleIcon
+  }
+};
+
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = ["src"];
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return $data.visible ? (openBlock(), createElementBlock("div", mergeProps({
+    key: 0,
+    "class": _ctx.cx('root'),
+    "aria-label": _ctx.label
+  }, _ctx.ptmi('root')), [renderSlot(_ctx.$slots, "default", {}, function () {
+    return [_ctx.image ? (openBlock(), createElementBlock("img", mergeProps({
+      key: 0,
+      src: _ctx.image
+    }, _ctx.ptm('image'), {
+      "class": _ctx.cx('image')
+    }), null, 16, _hoisted_2)) : _ctx.$slots.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.icon), mergeProps({
+      key: 1,
+      "class": _ctx.cx('icon')
+    }, _ctx.ptm('icon')), null, 16, ["class"])) : _ctx.icon ? (openBlock(), createElementBlock("span", mergeProps({
+      key: 2,
+      "class": [_ctx.cx('icon'), _ctx.icon]
+    }, _ctx.ptm('icon')), null, 16)) : createCommentVNode("", true), _ctx.label ? (openBlock(), createElementBlock("div", mergeProps({
+      key: 3,
+      "class": _ctx.cx('label')
+    }, _ctx.ptm('label')), toDisplayString(_ctx.label), 17)) : createCommentVNode("", true)];
+  }), _ctx.removable ? renderSlot(_ctx.$slots, "removeicon", {
+    key: 0,
+    removeCallback: $options.close,
+    keydownCallback: $options.onKeydown
+  }, function () {
+    return [(openBlock(), createBlock(resolveDynamicComponent(_ctx.removeIcon ? 'span' : 'TimesCircleIcon'), mergeProps({
+      tabindex: "0",
+      "class": [_ctx.cx('removeIcon'), _ctx.removeIcon],
+      onClick: $options.close,
+      onKeydown: $options.onKeydown
+    }, _ctx.ptm('removeIcon')), null, 16, ["class", "onClick", "onKeydown"]))];
+  }) : createCommentVNode("", true)], 16, _hoisted_1)) : createCommentVNode("", true);
+}
+
+script.render = render;
+
+export { script as default };
+//# sourceMappingURL=chip.mjs.map

package/chip/chip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chip.mjs","sources":["../../src/chip/BaseChip.vue","../../src/chip/Chip.vue","../../src/chip/Chip.vue?vue&type=template&id=10f709cc&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevuelab/core/basecomponent';\nimport ChipStyle from 'primevuelab/chip/style';\n\nexport default {\n    name: 'BaseChip',\n    extends: BaseComponent,\n    props: {\n        label: {\n            type: String,\n            default: null\n        },\n        icon: {\n            type: String,\n            default: null\n        },\n        image: {\n            type: String,\n            default: null\n        },\n        removable: {\n            type: Boolean,\n            default: false\n        },\n        removeIcon: {\n            type: String,\n            default: undefined\n        }\n    },\n    style: ChipStyle,\n    provide() {\n        return {\n            $pcChip: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <div v-if=\"visible\" :class=\"cx('root')\" :aria-label=\"label\" v-bind=\"ptmi('root')\">\n        <slot>\n            <img v-if=\"image\" :src=\"image\" v-bind=\"ptm('image')\" :class=\"cx('image')\" />\n            <component v-else-if=\"$slots.icon\" :is=\"$slots.icon\" :class=\"cx('icon')\" v-bind=\"ptm('icon')\" />\n            <span v-else-if=\"icon\" :class=\"[cx('icon'), icon]\" v-bind=\"ptm('icon')\" />\n            <div v-if=\"label\" :class=\"cx('label')\" v-bind=\"ptm('label')\">{{ label }}</div>\n        </slot>\n        <slot v-if=\"removable\" name=\"removeicon\" :removeCallback=\"close\" :keydownCallback=\"onKeydown\">\n            <component :is=\"removeIcon ? 'span' : 'TimesCircleIcon'\" tabindex=\"0\" :class=\"[cx('removeIcon'), removeIcon]\" @click=\"close\" @keydown=\"onKeydown\" v-bind=\"ptm('removeIcon')\"></component>\n        </slot>\n    </div>\n</template>\n\n<script>\nimport TimesCircleIcon from '@primevuelab/icons/timescircle';\nimport BaseChip from './BaseChip.vue';\n\nexport default {\n    name: 'Chip',\n    extends: BaseChip,\n    inheritAttrs: false,\n    emits: ['remove'],\n    data() {\n        return {\n            visible: true\n        };\n    },\n    methods: {\n        onKeydown(event) {\n            if (event.key === 'Enter' || event.key === 'Backspace') {\n                this.close(event);\n            }\n        },\n        close(event) {\n            this.visible = false;\n            this.$emit('remove', event);\n        }\n    },\n    components: {\n        TimesCircleIcon\n    }\n};\n</script>\n","<template>\n    <div v-if=\"visible\" :class=\"cx('root')\" :aria-label=\"label\" v-bind=\"ptmi('root')\">\n        <slot>\n            <img v-if=\"image\" :src=\"image\" v-bind=\"ptm('image')\" :class=\"cx('image')\" />\n            <component v-else-if=\"$slots.icon\" :is=\"$slots.icon\" :class=\"cx('icon')\" v-bind=\"ptm('icon')\" />\n            <span v-else-if=\"icon\" :class=\"[cx('icon'), icon]\" v-bind=\"ptm('icon')\" />\n            <div v-if=\"label\" :class=\"cx('label')\" v-bind=\"ptm('label')\">{{ label }}</div>\n        </slot>\n        <slot v-if=\"removable\" name=\"removeicon\" :removeCallback=\"close\" :keydownCallback=\"onKeydown\">\n            <component :is=\"removeIcon ? 'span' : 'TimesCircleIcon'\" tabindex=\"0\" :class=\"[cx('removeIcon'), removeIcon]\" @click=\"close\" @keydown=\"onKeydown\" v-bind=\"ptm('removeIcon')\"></component>\n        </slot>\n    </div>\n</template>\n\n<script>\nimport TimesCircleIcon from '@primevuelab/icons/timescircle';\nimport BaseChip from './BaseChip.vue';\n\nexport default {\n    name: 'Chip',\n    extends: BaseChip,\n    inheritAttrs: false,\n    emits: ['remove'],\n    data() {\n        return {\n            visible: true\n        };\n    },\n    methods: {\n        onKeydown(event) {\n            if (event.key === 'Enter' || event.key === 'Backspace') {\n                this.close(event);\n            }\n        },\n        close(event) {\n            this.visible = false;\n            this.$emit('remove', event);\n        }\n    },\n    components: {\n        TimesCircleIcon\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","label","type","String","icon","image","removable","Boolean","removeIcon","undefined","style","ChipStyle","provide","$pcChip","$parentInstance","BaseChip","inheritAttrs","emits","data","visible","methods","onKeydown","event","key","close","$emit","components","TimesCircleIcon","$data","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptmi","_renderSlot","src","ptm","$slots","_createBlock","_resolveDynamicComponent","removeCallback","$options","keydownCallback","tabindex","onClick"],"mappings":"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"}

package/chip/package.json

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

package/chip/style/ChipStyle.d.ts

@@ -0,0 +1,35 @@
+/**
+ *
+ * Chip represents people using icons, labels and images.
+ *
+ * [Live Demo](https://www.primevuelab.org/chip)
+ *
+ * @module chipstyle
+ *
+ */
+import { BaseStyle } from '../../base/style';
+
+export enum ChipClasses {
+    /**
+     * Class name of the root element
+     */
+    root = 'p-chip',
+    /**
+     * Class name of the image element
+     */
+    image = 'p-chip-image',
+    /**
+     * Class name of the icon element
+     */
+    icon = 'p-chip-icon',
+    /**
+     * Class name of the label element
+     */
+    label = 'p-chip-label',
+    /**
+     * Class name of the remove icon element
+     */
+    removeIcon = 'p-chip-remove-icon'
+}
+
+export interface ChipStyle extends BaseStyle {}

package/chip/style/chipstyle.mjs

@@ -0,0 +1,21 @@
+import BaseStyle from '@primevuelab/core/base/style';
+
+var theme = function theme(_ref) {
+  var dt = _ref.dt;
+  return "\n.p-chip {\n    display: inline-flex;\n    align-items: center;\n    background: ".concat(dt('chip.background'), ";\n    color: ").concat(dt('chip.color'), ";\n    border-radius: ").concat(dt('chip.border.radius'), ";\n    padding: ").concat(dt('chip.padding.y'), " ").concat(dt('chip.padding.x'), ";\n    gap: ").concat(dt('chip.gap'), ";\n}\n\n.p-chip-icon {\n    color: ").concat(dt('chip.icon.color'), ";\n    font-size: ").concat(dt('chip.icon.font.size'), ";\n    width: ").concat(dt('chip.icon.size'), ";\n    height: ").concat(dt('chip.icon.size'), ";\n}\n\n.p-chip-image {\n    border-radius: 50%;\n    width: ").concat(dt('chip.image.width'), ";\n    height: ").concat(dt('chip.image.height'), ";\n    margin-left: calc(-1 * ").concat(dt('chip.padding.y'), ");\n}\n\n.p-chip:has(.p-chip-remove-icon) {\n    padding-right: ").concat(dt('chip.padding.y'), ";\n}\n\n.p-chip:has(.p-chip-image) {\n    padding-top: calc(").concat(dt('chip.padding.y'), " / 2);\n    padding-bottom: calc(").concat(dt('chip.padding.y'), " / 2);\n}\n\n.p-chip-remove-icon {\n    cursor: pointer;\n    font-size: ").concat(dt('chip.remove.icon.font.size'), ";\n    width: ").concat(dt('chip.remove.icon.size'), ";\n    height: ").concat(dt('chip.remove.icon.size'), ";\n    color: ").concat(dt('chip.remove.icon.color'), ";\n    border-radius: 50%;\n    transition: outline-color ").concat(dt('chip.transition.duration'), ", box-shadow ").concat(dt('chip.transition.duration'), ";\n    outline-color: transparent;\n}\n\n.p-chip-remove-icon:focus-visible {\n    box-shadow: ").concat(dt('chip.remove.icon.focus.ring.shadow'), ";\n    outline: ").concat(dt('chip.remove.icon.focus.ring.width'), " ").concat(dt('chip.remove.icon.focus.ring.style'), " ").concat(dt('chip.remove.icon.focus.ring.color'), ";\n    outline-offset: ").concat(dt('chip.remove.icon.focus.ring.offset'), ";\n}\n");
+};
+var classes = {
+  root: 'p-chip p-component',
+  image: 'p-chip-image',
+  icon: 'p-chip-icon',
+  label: 'p-chip-label',
+  removeIcon: 'p-chip-remove-icon'
+};
+var ChipStyle = BaseStyle.extend({
+  name: 'chip',
+  theme: theme,
+  classes: classes
+});
+
+export { ChipStyle as default };
+//# sourceMappingURL=chipstyle.mjs.map

package/chip/style/chipstyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"chipstyle.mjs","sources":["../../../src/chip/style/ChipStyle.js"],"sourcesContent":["import BaseStyle from '@primevuelab/core/base/style';\n\nconst theme = ({ dt }) => `\n.p-chip {\n    display: inline-flex;\n    align-items: center;\n    background: ${dt('chip.background')};\n    color: ${dt('chip.color')};\n    border-radius: ${dt('chip.border.radius')};\n    padding: ${dt('chip.padding.y')} ${dt('chip.padding.x')};\n    gap: ${dt('chip.gap')};\n}\n\n.p-chip-icon {\n    color: ${dt('chip.icon.color')};\n    font-size: ${dt('chip.icon.font.size')};\n    width: ${dt('chip.icon.size')};\n    height: ${dt('chip.icon.size')};\n}\n\n.p-chip-image {\n    border-radius: 50%;\n    width: ${dt('chip.image.width')};\n    height: ${dt('chip.image.height')};\n    margin-left: calc(-1 * ${dt('chip.padding.y')});\n}\n\n.p-chip:has(.p-chip-remove-icon) {\n    padding-right: ${dt('chip.padding.y')};\n}\n\n.p-chip:has(.p-chip-image) {\n    padding-top: calc(${dt('chip.padding.y')} / 2);\n    padding-bottom: calc(${dt('chip.padding.y')} / 2);\n}\n\n.p-chip-remove-icon {\n    cursor: pointer;\n    font-size: ${dt('chip.remove.icon.font.size')};\n    width: ${dt('chip.remove.icon.size')};\n    height: ${dt('chip.remove.icon.size')};\n    color: ${dt('chip.remove.icon.color')};\n    border-radius: 50%;\n    transition: outline-color ${dt('chip.transition.duration')}, box-shadow ${dt('chip.transition.duration')};\n    outline-color: transparent;\n}\n\n.p-chip-remove-icon:focus-visible {\n    box-shadow: ${dt('chip.remove.icon.focus.ring.shadow')};\n    outline: ${dt('chip.remove.icon.focus.ring.width')} ${dt('chip.remove.icon.focus.ring.style')} ${dt('chip.remove.icon.focus.ring.color')};\n    outline-offset: ${dt('chip.remove.icon.focus.ring.offset')};\n}\n`;\n\nconst classes = {\n    root: 'p-chip p-component',\n    image: 'p-chip-image',\n    icon: 'p-chip-icon',\n    label: 'p-chip-label',\n    removeIcon: 'p-chip-remove-icon'\n};\n\nexport default BaseStyle.extend({\n    name: 'chip',\n    theme,\n    classes\n});\n"],"names":["theme","_ref","dt","concat","classes","root","image","icon","label","removeIcon","BaseStyle","extend","name"],"mappings":";;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAAMC,EAAE,GAAAD,IAAA,CAAFC,EAAE,CAAA;AAAA,EAAA,OAAA,oFAAA,CAAAC,MAAA,CAIDD,EAAE,CAAC,iBAAiB,CAAC,oBAAAC,MAAA,CAC1BD,EAAE,CAAC,YAAY,CAAC,EAAAC,wBAAAA,CAAAA,CAAAA,MAAA,CACRD,EAAE,CAAC,oBAAoB,CAAC,EAAA,kBAAA,CAAA,CAAAC,MAAA,CAC9BD,EAAE,CAAC,gBAAgB,CAAC,OAAAC,MAAA,CAAID,EAAE,CAAC,gBAAgB,CAAC,EAAAC,cAAAA,CAAAA,CAAAA,MAAA,CAChDD,EAAE,CAAC,UAAU,CAAC,EAAA,qCAAA,CAAA,CAAAC,MAAA,CAIZD,EAAE,CAAC,iBAAiB,CAAC,wBAAAC,MAAA,CACjBD,EAAE,CAAC,qBAAqB,CAAC,EAAAC,gBAAAA,CAAAA,CAAAA,MAAA,CAC7BD,EAAE,CAAC,gBAAgB,CAAC,EAAA,iBAAA,CAAA,CAAAC,MAAA,CACnBD,EAAE,CAAC,gBAAgB,CAAC,mEAAAC,MAAA,CAKrBD,EAAE,CAAC,kBAAkB,CAAC,EAAAC,iBAAAA,CAAAA,CAAAA,MAAA,CACrBD,EAAE,CAAC,mBAAmB,CAAC,EAAA,gCAAA,CAAA,CAAAC,MAAA,CACRD,EAAE,CAAC,gBAAgB,CAAC,sEAAAC,MAAA,CAI5BD,EAAE,CAAC,gBAAgB,CAAC,EAAAC,8DAAAA,CAAAA,CAAAA,MAAA,CAIjBD,EAAE,CAAC,gBAAgB,CAAC,EAAA,mCAAA,CAAA,CAAAC,MAAA,CACjBD,EAAE,CAAC,gBAAgB,CAAC,+EAAAC,MAAA,CAK9BD,EAAE,CAAC,4BAA4B,CAAC,EAAAC,gBAAAA,CAAAA,CAAAA,MAAA,CACpCD,EAAE,CAAC,uBAAuB,CAAC,EAAA,iBAAA,CAAA,CAAAC,MAAA,CAC1BD,EAAE,CAAC,uBAAuB,CAAC,oBAAAC,MAAA,CAC5BD,EAAE,CAAC,wBAAwB,CAAC,EAAAC,4DAAAA,CAAAA,CAAAA,MAAA,CAETD,EAAE,CAAC,0BAA0B,CAAC,EAAA,eAAA,CAAA,CAAAC,MAAA,CAAgBD,EAAE,CAAC,0BAA0B,CAAC,oGAAAC,MAAA,CAK1FD,EAAE,CAAC,oCAAoC,CAAC,EAAAC,kBAAAA,CAAAA,CAAAA,MAAA,CAC3CD,EAAE,CAAC,mCAAmC,CAAC,EAAA,GAAA,CAAA,CAAAC,MAAA,CAAID,EAAE,CAAC,mCAAmC,CAAC,OAAAC,MAAA,CAAID,EAAE,CAAC,mCAAmC,CAAC,EAAAC,yBAAAA,CAAAA,CAAAA,MAAA,CACtHD,EAAE,CAAC,oCAAoC,CAAC,EAAA,QAAA,CAAA,CAAA;AAAA,CAE7D,CAAA;AAED,IAAME,OAAO,GAAG;AACZC,EAAAA,IAAI,EAAE,oBAAoB;AAC1BC,EAAAA,KAAK,EAAE,cAAc;AACrBC,EAAAA,IAAI,EAAE,aAAa;AACnBC,EAAAA,KAAK,EAAE,cAAc;AACrBC,EAAAA,UAAU,EAAE,oBAAA;AAChB,CAAC,CAAA;AAED,gBAAeC,SAAS,CAACC,MAAM,CAAC;AAC5BC,EAAAA,IAAI,EAAE,MAAM;AACZZ,EAAAA,KAAK,EAALA,KAAK;AACLI,EAAAA,OAAO,EAAPA,OAAAA;AACJ,CAAC,CAAC;;;;"}

package/chip/style/package.json

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

package/chips/Chips.d.ts

@@ -0,0 +1,90 @@
+/**
+ *
+ * Chips groups a collection of contents in tabs.
+ *
+ * [Live Demo](https://www.primevuelab.org/inputchips/)
+ *
+ * @module chips
+ *
+ */
+import 'vue';
+import * as InputChips from '../inputchips';
+import { DefineComponent, EmitFn, GlobalComponentConstructor } from '../ts-helpers';
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ChipsPassThroughMethodOptions extends InputChips.InputChipsPassThroughMethodOptions {}
+
+/**
+ * Custom shared passthrough(pt) option method.
+ */
+export interface ChipsSharedPassThroughMethodOptions extends InputChips.InputChipsSharedPassThroughMethodOptions {}
+
+/**
+ * Custom add event.
+ * @see {@link ChipsEmitsOptions.add}
+ */
+export interface ChipsAddEvent extends InputChips.InputChipsAddEvent {}
+
+/**
+ * Custom remove event.
+ * @see {@link ChipsEmitsOptions.remove}
+ * @extends ChipsAddEvent
+ */
+export interface ChipsRemoveEvent extends ChipsAddEvent {}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ChipsProps.pt}
+ */
+export interface ChipsPassThroughOptions extends InputChips.InputChipsPassThroughOptions {}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ChipsPassThroughAttributes extends InputChips.InputChipsPassThroughAttributes {}
+
+/**
+ * Defines current inline state in Chips component.
+ */
+export interface ChipsState extends InputChips.InputChipsState {}
+
+/**
+ * Defines valid properties in Chips component.
+ */
+export interface ChipsProps extends InputChips.InputChipsProps {}
+/**
+ * Defines valid slots in Chips slots.
+ */
+export interface ChipsSlots extends InputChips.InputChipsSlots {}
+/**
+ * Defines valid emits in Chips component.
+ */
+export interface ChipsEmitsOptions {}
+
+export declare type ChipsEmits = EmitFn<ChipsEmitsOptions> & InputChips.InputChipsEmits;
+
+/**
+ * @deprecated since v4. Use InputChips component instead.
+ *
+ * **primevuelab - Chips**
+ *
+ * _Chips is used to enter multiple values on an input field._
+ *
+ * [Live Demo](https://www.primevuelab.org/inputchips/)
+ * --- ---
+ * ![primevuelab](https://primefaces.org/cdn/primevuelab/images/logo-100.png)
+ *
+ * @group Component
+ *
+ */
+declare const Chips: DefineComponent<ChipsProps, ChipsSlots, ChipsEmits>;
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        Chips: GlobalComponentConstructor<ChipsProps, ChipsSlots, ChipsEmits>;
+    }
+}
+
+export default Chips;