From f2921594ebf08278418abe95b6a9d9797c97a7cc Mon Sep 17 00:00:00 2001 From: tugcekucukoglu Date: Fri, 16 Feb 2024 12:16:05 +0300 Subject: [PATCH] Fixed #5292 - New ButtonSet component --- components/lib/buttonset/BaseButtonSet.vue | 15 +++ components/lib/buttonset/ButtonSet.d.ts | 113 ++++++++++++++++++ components/lib/buttonset/ButtonSet.vue | 15 +++ components/lib/buttonset/package.json | 9 ++ .../lib/buttonset/style/ButtonSetStyle.d.ts | 3 + .../lib/buttonset/style/ButtonSetStyle.js | 10 ++ components/lib/buttonset/style/package.json | 6 + nuxt-vite.config.js | 1 + 8 files changed, 172 insertions(+) create mode 100644 components/lib/buttonset/BaseButtonSet.vue create mode 100644 components/lib/buttonset/ButtonSet.d.ts create mode 100644 components/lib/buttonset/ButtonSet.vue create mode 100644 components/lib/buttonset/package.json create mode 100644 components/lib/buttonset/style/ButtonSetStyle.d.ts create mode 100644 components/lib/buttonset/style/ButtonSetStyle.js create mode 100644 components/lib/buttonset/style/package.json diff --git a/components/lib/buttonset/BaseButtonSet.vue b/components/lib/buttonset/BaseButtonSet.vue new file mode 100644 index 000000000..a9fce3558 --- /dev/null +++ b/components/lib/buttonset/BaseButtonSet.vue @@ -0,0 +1,15 @@ + diff --git a/components/lib/buttonset/ButtonSet.d.ts b/components/lib/buttonset/ButtonSet.d.ts new file mode 100644 index 000000000..40f14ec5d --- /dev/null +++ b/components/lib/buttonset/ButtonSet.d.ts @@ -0,0 +1,113 @@ +/** + * + * A set of Buttons can be displayed together using the ButtonSet component. + * + * [Live Demo](https://www.primevue.org/button/) + * + * @module buttonset + * + */ +import { VNode } from 'vue'; +import { ComponentHooks } from '../basecomponent'; +import { PassThroughOptions } from '../passthrough'; +import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers'; + +export declare type ButtonSetPassThroughOptionType = ButtonSetPassThroughAttributes | ((options: ButtonSetPassThroughMethodOptions) => ButtonSetPassThroughAttributes | string) | string | null | undefined; + +/** + * Custom passthrough(pt) option method. + */ +export interface ButtonSetPassThroughMethodOptions { + /** + * Defines instance. + */ + instance: any; + /** + * Defines valid properties. + */ + props: ButtonSetProps; + /** + * Defines passthrough(pt) options in global config. + */ + global: object | undefined; +} + +/** + * Custom passthrough(pt) options. + * @see {@link ButtonSetProps.pt} + */ +export interface ButtonSetPassThroughOptions { + /** + * Used to pass attributes to the root's DOM element. + */ + root?: ButtonSetPassThroughOptionType; + /** + * Used to manage all lifecycle hooks. + * @see {@link BaseComponent.ComponentHooks} + */ + hooks?: ComponentHooks; +} + +/** + * Custom passthrough attributes for each DOM elements + */ +export interface ButtonSetPassThroughAttributes { + [key: string]: any; +} + +/** + * Defines valid properties in ButtonSet component. + */ +export interface ButtonSetProps { + /** + * Used to pass attributes to DOM elements inside the component. + * @type {ButtonSetPassThroughOptions} + */ + pt?: PassThrough; + /** + * 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 ButtonSet component. + */ +export interface ButtonSetSlots { + /** + * Default slot to detect Button components. + */ + default(): VNode[]; +} + +/** + * Defines valid emits in ButtonSet component. + */ +export interface ButtonSetEmits {} + +/** + * **PrimeVue - ButtonSet** + * + * _A set of Buttons can be displayed together using the ButtonSet component._ + * + * [Live Demo](https://www.primevue.org/button/) + * --- --- + * ![PrimeVue](https://primefaces.org/cdn/primevue/images/logo-100.png) + * + * @group Component + */ +declare class ButtonSet extends ClassComponent {} + +declare module '@vue/runtime-core' { + interface GlobalComponents { + ButtonSet: GlobalComponentConstructor; + } +} + +export default ButtonSet; diff --git a/components/lib/buttonset/ButtonSet.vue b/components/lib/buttonset/ButtonSet.vue new file mode 100644 index 000000000..8878435ac --- /dev/null +++ b/components/lib/buttonset/ButtonSet.vue @@ -0,0 +1,15 @@ + + + diff --git a/components/lib/buttonset/package.json b/components/lib/buttonset/package.json new file mode 100644 index 000000000..cd10c1f8f --- /dev/null +++ b/components/lib/buttonset/package.json @@ -0,0 +1,9 @@ +{ + "main": "./buttonset.cjs.js", + "module": "./buttonset.esm.js", + "unpkg": "./buttonset.min.js", + "types": "./ButtonSet.d.ts", + "browser": { + "./sfc": "./ButtonSet.vue" + } +} diff --git a/components/lib/buttonset/style/ButtonSetStyle.d.ts b/components/lib/buttonset/style/ButtonSetStyle.d.ts new file mode 100644 index 000000000..fcffcf8e9 --- /dev/null +++ b/components/lib/buttonset/style/ButtonSetStyle.d.ts @@ -0,0 +1,3 @@ +import { BaseStyle } from '../../base/style'; + +export interface ButtonStyle extends BaseStyle {} diff --git a/components/lib/buttonset/style/ButtonSetStyle.js b/components/lib/buttonset/style/ButtonSetStyle.js new file mode 100644 index 000000000..93b3d8336 --- /dev/null +++ b/components/lib/buttonset/style/ButtonSetStyle.js @@ -0,0 +1,10 @@ +import BaseStyle from 'primevue/base/style'; + +const classes = { + root: 'p-buttonset p-component' +}; + +export default BaseStyle.extend({ + name: 'buttonset', + classes +}); diff --git a/components/lib/buttonset/style/package.json b/components/lib/buttonset/style/package.json new file mode 100644 index 000000000..15395b99e --- /dev/null +++ b/components/lib/buttonset/style/package.json @@ -0,0 +1,6 @@ +{ + "main": "./buttonsetstyle.cjs.js", + "module": "./buttonsetstyle.esm.js", + "unpkg": "./buttonsetstyle.min.js", + "types": "./ButtonSetStyle.d.ts" +} diff --git a/nuxt-vite.config.js b/nuxt-vite.config.js index b6f54658a..147990b62 100644 --- a/nuxt-vite.config.js +++ b/nuxt-vite.config.js @@ -17,6 +17,7 @@ const STYLE_ALIAS = { 'primevue/blockui/style': path.resolve(__dirname, './components/lib/blockui/style/BlockUIStyle.js'), 'primevue/breadcrumb/style': path.resolve(__dirname, './components/lib/breadcrumb/style/BreadcrumbStyle.js'), 'primevue/button/style': path.resolve(__dirname, './components/lib/button/style/ButtonStyle.js'), + 'primevue/buttonset/style': path.resolve(__dirname, './components/lib/buttonset/style/ButtonSetStyle.js'), 'primevue/calendar/style': path.resolve(__dirname, './components/lib/calendar/style/CalendarStyle.js'), 'primevue/card/style': path.resolve(__dirname, './components/lib/card/style/CardStyle.js'), 'primevue/carousel/style': path.resolve(__dirname, './components/lib/carousel/style/CarouselStyle.js'),