@adyen/bento-vue2 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/README.md +43 -5
  2. package/dist/@types/components/alert/alert.types.d.ts +3 -3
  3. package/dist/@types/components/alert/alert.vue.d.ts +21 -8
  4. package/dist/@types/components/alert/index.d.ts +1 -1
  5. package/dist/@types/components/card/card.vue.d.ts +1 -1
  6. package/dist/@types/components/checkbox/checkbox.vue.d.ts +6 -4
  7. package/dist/@types/components/checkbox/components/checkbox-group/checkbox-group.types.d.ts +11 -0
  8. package/dist/@types/components/checkbox/components/checkbox-group/checkbox-group.vue.d.ts +58 -0
  9. package/dist/@types/components/checkbox/components/checkbox-group/index.d.ts +2 -0
  10. package/dist/@types/components/checkbox/index.d.ts +1 -0
  11. package/dist/@types/components/controls-group/controls-group.vue.d.ts +49 -0
  12. package/dist/@types/components/controls-group/index.d.ts +1 -0
  13. package/dist/@types/components/data-grid/data-grid.types.d.ts +1 -0
  14. package/dist/@types/components/data-grid/data-grid.vue.d.ts +12 -0
  15. package/dist/@types/components/focus-trap/focus-trap.types.d.ts +4 -4
  16. package/dist/@types/components/focus-trap/focus-trap.utils.d.ts +2 -2
  17. package/dist/@types/components/focus-trap/focus-trap.vue.d.ts +5 -5
  18. package/dist/@types/components/focus-trap/index.d.ts +1 -1
  19. package/dist/@types/components/popper-container/popper-container.vue.d.ts +9 -0
  20. package/dist/@types/components/{radio-button → radio-group/components/radio-button}/radio-button.vue.d.ts +5 -4
  21. package/dist/@types/components/radio-group/index.d.ts +2 -0
  22. package/dist/@types/components/radio-group/radio-group.types.d.ts +11 -0
  23. package/dist/@types/components/radio-group/radio-group.vue.d.ts +58 -0
  24. package/dist/@types/components/textarea/textarea.vue.d.ts +3 -3
  25. package/dist/@types/components.d.ts +6 -4
  26. package/dist/@types/index.d.ts +2 -1
  27. package/dist/index.js +1796 -1023
  28. package/dist/index.js.map +1 -1
  29. package/package.json +4 -4
  30. package/dist/@types/components/radio-button/index.d.ts +0 -1
package/README.md CHANGED
@@ -29,7 +29,9 @@ npm install @adyen/bento-vue2
29
29
  In order to use the compoent via the `BentoVue` plugin, the following steps must be reproduced:
30
30
 
31
31
  1. Load the plugin globally in **Vue**
32
- 2. Use the library defined components in your application
32
+ 2. Import the `font.css` file.
33
+ 3. Initialize `vue-i18n`.
34
+ 4. Use the library defined components in your application
33
35
 
34
36
  #### Load plugin and register components
35
37
 
@@ -42,22 +44,58 @@ import BentoVue from '@adyen/bento-vue2';
42
44
  Vue.use(BentoVue);
43
45
  ```
44
46
 
47
+ #### Import the fonts
48
+
49
+ When using the default theme, you will need to include the required `Inter` font in your project application. This can
50
+ easily be done by simply importing the `font.css` file.
51
+
52
+ NOTE: make sure the builder your are using (e.g. `webpack` , `vite`, etc...) is able to process font files.
53
+
54
+ ```javascript
55
+ import '@adyen/bento-vue2/fonts.css';
56
+ ```
57
+
58
+ #### Initialize `vue-i18n`
59
+
60
+ Some Bento components require translations for which the `vue-i18n` package was used so it has to be initialized like
61
+ this:
62
+
63
+ ```diff
64
+ import Vue from 'vue';
65
+ + import VueI18n from 'vue-i18n';
66
+ +
67
+ + Vue.use(VueI18n);
68
+ +
69
+ + const i18n = new VueI18n({
70
+ + locale: 'en-US',
71
+ + fallbackLocale: 'en-US',
72
+ + fallbackRoot: false,
73
+ + });
74
+
75
+ const app = new Vue({
76
+ el: '#app',
77
+ router,
78
+ template: '<router-view />',
79
+ + i18n,
80
+ });
81
+ ```
82
+
45
83
  #### Use the components
46
84
 
47
85
  Inside the `.vue` components of your application, you can simply use the available components:
48
86
 
49
87
  ```javascript
50
88
  <template>
51
- <b-button @click="onClickHandler">
89
+ <bento-button @click="onClickHandler">
52
90
  {{ buttonLabel }}
53
- </b-button>
91
+ </bento-button>
54
92
  </template>
55
93
 
56
94
  <script>
57
- import { BButton } from '@adyen/bento-vue2'
95
+ import { BentoButton } from '@adyen/bento-vue2'
58
96
 
59
97
  export default {
60
- components: { BButton },
98
+ components: { BentoButton },
61
99
  data: () => ({
62
100
  buttonLabel: 'Button text'
63
101
  }),
@@ -1,6 +1,6 @@
1
- export declare enum AdlAlertSeverityOption {
1
+ export declare enum BentoAlertSeverityOption {
2
2
  WARNING = "warning",
3
- ERROR = "error",
4
- INFO = "info",
3
+ CRITICAL = "critical",
4
+ HIGHLIGHT = "highlight",
5
5
  SUCCESS = "success"
6
6
  }
@@ -1,34 +1,47 @@
1
1
  import { PropType } from 'vue';
2
- import { AdlAlertSeverityOption } from '@/components/alert/alert.types';
2
+ import { BentoAlertSeverityOption } from '@/components/alert/alert.types';
3
3
  import { BentoButtonVariant } from '@/components/button/button.types';
4
+ import { BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';
4
5
  declare const _default: import("vue").DefineComponent<{
5
6
  severity: {
6
- type: PropType<AdlAlertSeverityOption>;
7
- default: AdlAlertSeverityOption;
7
+ type: PropType<BentoAlertSeverityOption>;
8
+ default: BentoAlertSeverityOption;
8
9
  };
9
10
  closeButton: {
10
11
  type: BooleanConstructor;
11
12
  default: boolean;
12
13
  };
14
+ inline: {
15
+ type: BooleanConstructor;
16
+ default: boolean;
17
+ };
13
18
  }, {
14
19
  alertConditionalClasses: import("vue").ComputedRef<{
15
- [x: string]: AdlAlertSeverityOption;
20
+ [x: string]: boolean | BentoAlertSeverityOption;
21
+ 'b-alert--inline': boolean;
16
22
  }>;
17
23
  computedRole: import("vue").ComputedRef<"alert" | "status">;
18
24
  onCloseButtonClick: () => void;
19
25
  BentoButtonVariant: typeof BentoButtonVariant;
20
- AdlAlertSeverityOption: typeof AdlAlertSeverityOption;
26
+ BentoAlertSeverityOption: typeof BentoAlertSeverityOption;
27
+ BentoTypographyVariant: typeof BentoTypographyVariant;
28
+ BentoTypographyElement: typeof BentoTypographyElement;
21
29
  }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "close-alert"[], string, Readonly<import("vue").ExtractPropTypes<{
22
30
  severity: {
23
- type: PropType<AdlAlertSeverityOption>;
24
- default: AdlAlertSeverityOption;
31
+ type: PropType<BentoAlertSeverityOption>;
32
+ default: BentoAlertSeverityOption;
25
33
  };
26
34
  closeButton: {
27
35
  type: BooleanConstructor;
28
36
  default: boolean;
29
37
  };
38
+ inline: {
39
+ type: BooleanConstructor;
40
+ default: boolean;
41
+ };
30
42
  }>>, {
31
- severity: AdlAlertSeverityOption;
43
+ inline: boolean;
44
+ severity: BentoAlertSeverityOption;
32
45
  closeButton: boolean;
33
46
  }>;
34
47
  export default _default;
@@ -1,2 +1,2 @@
1
- export { default as AdlAlert } from './alert.vue';
1
+ export { default as BentoAlert } from './alert.vue';
2
2
  export * from './alert.types';
@@ -22,7 +22,7 @@ declare const _default: import("vue").DefineComponent<{
22
22
  showImage: import("vue").ComputedRef<boolean>;
23
23
  showFooter: import("vue").ComputedRef<boolean>;
24
24
  onClickCard: () => void;
25
- }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
25
+ }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "click"[], string, Readonly<import("vue").ExtractPropTypes<{
26
26
  title: {
27
27
  type: StringConstructor;
28
28
  required: true;
@@ -23,17 +23,19 @@ declare const _default: import("vue").DefineComponent<{
23
23
  default: any;
24
24
  };
25
25
  }, {
26
- computedAriaLabel: import("vue").ComputedRef<string>;
27
26
  ariaChecked: import("vue").ComputedRef<"mixed" | (boolean | "false" | "true")>;
28
- isCheckboxGroup: import("vue").ComputedRef<boolean>;
29
- isChecked: import("vue").ComputedRef<boolean>;
30
- isIndeterminate: import("vue").ComputedRef<boolean>;
27
+ computedAriaLabel: import("vue").ComputedRef<string>;
31
28
  conditionalClass: import("vue").ComputedRef<{
32
29
  'b-checkbox--disabled': boolean;
33
30
  }>;
34
31
  conditionalClassOutline: import("vue").ComputedRef<{
35
32
  'b-checkbox__outline--unchecked': boolean;
36
33
  }>;
34
+ defaultSlot: import("vue").ComputedRef<string>;
35
+ descriptionSlot: import("vue").ComputedRef<string>;
36
+ isCheckboxGroup: import("vue").ComputedRef<boolean>;
37
+ isChecked: import("vue").ComputedRef<boolean>;
38
+ isIndeterminate: import("vue").ComputedRef<boolean>;
37
39
  BentoTypographyElement: typeof BentoTypographyElement;
38
40
  BentoTypographyVariant: typeof BentoTypographyVariant;
39
41
  onChange: (event: Event) => void;
@@ -0,0 +1,11 @@
1
+ export declare enum BentoCheckboxGroupVariant {
2
+ HORIZONTAL = "horizontal",
3
+ VERTICAL = "vertical"
4
+ }
5
+ export interface BentoCheckboxGroupItem {
6
+ value: string | number;
7
+ label: string;
8
+ description?: string;
9
+ disabled?: boolean;
10
+ }
11
+ export type BentoCheckboxGroupItems = Array<BentoCheckboxGroupItem>;
@@ -0,0 +1,58 @@
1
+ import { PropType } from 'vue';
2
+ import { BentoCheckboxGroupItems, BentoCheckboxGroupVariant } from './checkbox-group.types';
3
+ declare const _default: import("vue").DefineComponent<{
4
+ items: {
5
+ type: PropType<BentoCheckboxGroupItems>;
6
+ required: true;
7
+ };
8
+ variant: {
9
+ type: PropType<BentoCheckboxGroupVariant>;
10
+ default: BentoCheckboxGroupVariant;
11
+ validator: (value: BentoCheckboxGroupVariant) => boolean;
12
+ };
13
+ formId: {
14
+ type: StringConstructor;
15
+ default: any;
16
+ };
17
+ disabled: {
18
+ type: BooleanConstructor;
19
+ default: boolean;
20
+ };
21
+ label: {
22
+ type: StringConstructor;
23
+ required: true;
24
+ };
25
+ }, {
26
+ conditionalClasses: import("vue").ComputedRef<{
27
+ 'b-checkbox-group--horizontal': boolean;
28
+ }>;
29
+ modelValue: import("vue").Ref<any[]>;
30
+ onInput: (value: any) => void;
31
+ }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "input"[], string, Readonly<import("vue").ExtractPropTypes<{
32
+ items: {
33
+ type: PropType<BentoCheckboxGroupItems>;
34
+ required: true;
35
+ };
36
+ variant: {
37
+ type: PropType<BentoCheckboxGroupVariant>;
38
+ default: BentoCheckboxGroupVariant;
39
+ validator: (value: BentoCheckboxGroupVariant) => boolean;
40
+ };
41
+ formId: {
42
+ type: StringConstructor;
43
+ default: any;
44
+ };
45
+ disabled: {
46
+ type: BooleanConstructor;
47
+ default: boolean;
48
+ };
49
+ label: {
50
+ type: StringConstructor;
51
+ required: true;
52
+ };
53
+ }>>, {
54
+ disabled: boolean;
55
+ variant: BentoCheckboxGroupVariant;
56
+ formId: string;
57
+ }>;
58
+ export default _default;
@@ -0,0 +1,2 @@
1
+ export { default as BentoCheckboxGroup } from './checkbox-group.vue';
2
+ export { BentoCheckboxGroupVariant } from './checkbox-group.types';
@@ -1,2 +1,3 @@
1
1
  export { default as BentoCheckbox } from './checkbox.vue';
2
2
  export * from './checkbox.types';
3
+ export * from './components/checkbox-group';
@@ -0,0 +1,49 @@
1
+ import { BentoTypographyElement } from '@/components/typography';
2
+ declare const _default: import("vue").DefineComponent<{
3
+ label: {
4
+ type: StringConstructor;
5
+ required: true;
6
+ };
7
+ showLabel: {
8
+ type: BooleanConstructor;
9
+ default: boolean;
10
+ };
11
+ form: {
12
+ type: StringConstructor;
13
+ default: any;
14
+ };
15
+ disabled: {
16
+ type: BooleanConstructor;
17
+ default: boolean;
18
+ };
19
+ }, {
20
+ BentoTypographyElement: typeof BentoTypographyElement;
21
+ conditionalClasses: import("vue").ComputedRef<{
22
+ 'b-controls-group--disabled': boolean;
23
+ }>;
24
+ legendConditionalClasses: import("vue").ComputedRef<{
25
+ 'b-controls-group__label--hidden': boolean;
26
+ }>;
27
+ }, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
28
+ label: {
29
+ type: StringConstructor;
30
+ required: true;
31
+ };
32
+ showLabel: {
33
+ type: BooleanConstructor;
34
+ default: boolean;
35
+ };
36
+ form: {
37
+ type: StringConstructor;
38
+ default: any;
39
+ };
40
+ disabled: {
41
+ type: BooleanConstructor;
42
+ default: boolean;
43
+ };
44
+ }>>, {
45
+ form: string;
46
+ disabled: boolean;
47
+ showLabel: boolean;
48
+ }>;
49
+ export default _default;
@@ -0,0 +1 @@
1
+ export { default as ControlsGroup } from './controls-group.vue';
@@ -10,6 +10,7 @@ export interface BentoColumn {
10
10
  minWidth?: number;
11
11
  flex?: number;
12
12
  sortable?: boolean;
13
+ numeric?: boolean;
13
14
  padding?: {
14
15
  left?: boolean;
15
16
  right?: boolean;
@@ -30,6 +30,10 @@ declare const _default: import("vue").DefineComponent<{
30
30
  type: PropType<BentoDatagridIsDataItemDisabledFn>;
31
31
  default: () => false;
32
32
  };
33
+ loading: {
34
+ type: BooleanConstructor;
35
+ default: boolean;
36
+ };
33
37
  outline: {
34
38
  type: BooleanConstructor;
35
39
  default: boolean;
@@ -119,6 +123,7 @@ declare const _default: import("vue").DefineComponent<{
119
123
  minWidth?: number;
120
124
  flex?: number;
121
125
  sortable?: boolean;
126
+ numeric?: boolean;
122
127
  padding?: {
123
128
  left?: boolean;
124
129
  right?: boolean;
@@ -139,6 +144,7 @@ declare const _default: import("vue").DefineComponent<{
139
144
  'b-data-grid__column--sortable': boolean;
140
145
  'b-data-grid__column--padding-left-unset': boolean;
141
146
  'b-data-grid__column--padding-right-unset': boolean;
147
+ 'b-data-grid__column--numeric': boolean;
142
148
  };
143
149
  conditionalRowClasses: (row: BentoDatagridDataItem) => {
144
150
  'b-data-grid__row--disabled': boolean;
@@ -147,6 +153,7 @@ declare const _default: import("vue").DefineComponent<{
147
153
  [x: string]: boolean;
148
154
  'b-data-grid__cell--padding-left-unset': boolean;
149
155
  'b-data-grid__cell--padding-right-unset': boolean;
156
+ 'b-data-grid__cell--numeric': boolean;
150
157
  'b-data-grid__cell--condensed': boolean;
151
158
  };
152
159
  conditionalColumnSeperatorClasses: import("vue").ComputedRef<{
@@ -215,6 +222,10 @@ declare const _default: import("vue").DefineComponent<{
215
222
  type: PropType<BentoDatagridIsDataItemDisabledFn>;
216
223
  default: () => false;
217
224
  };
225
+ loading: {
226
+ type: BooleanConstructor;
227
+ default: boolean;
228
+ };
218
229
  outline: {
219
230
  type: BooleanConstructor;
220
231
  default: boolean;
@@ -298,6 +309,7 @@ declare const _default: import("vue").DefineComponent<{
298
309
  };
299
310
  }>>, {
300
311
  outline: boolean;
312
+ loading: boolean;
301
313
  condensed: boolean;
302
314
  filters: import("../filter-bar").BentoFilterBarModel;
303
315
  getDataItemId: BentoDatagridGetDataItemIdFn;
@@ -1,16 +1,16 @@
1
- export declare enum AdlFocusTrapArrowNavigationDirection {
1
+ export declare enum BentoFocusTrapArrowNavigationDirection {
2
2
  VERTICAL = "vertical",
3
3
  HORIZONTAL = "horizontal"
4
4
  }
5
- export declare enum AdlFocusTrapVerticalNavigationEvent {
5
+ export declare enum BentoFocusTrapVerticalNavigationEvent {
6
6
  ARROW_UP = "arrowup",
7
7
  ARROW_DOWN = "arrowdown"
8
8
  }
9
- export declare enum AdlFocusTrapHorizontalNavigationEvent {
9
+ export declare enum BentoFocusTrapHorizontalNavigationEvent {
10
10
  ARROW_LEFT = "arrowleft",
11
11
  ARROW_RIGHT = "arrowright"
12
12
  }
13
- export interface AdlFocusTrapFocusableIn {
13
+ export interface BentoFocusTrapFocusableIn {
14
14
  node: HTMLElement;
15
15
  index: number;
16
16
  lockItem: boolean;
@@ -1,7 +1,7 @@
1
- import { AdlFocusTrapHorizontalNavigationEvent, AdlFocusTrapVerticalNavigationEvent } from './focus-trap.types';
1
+ import { BentoFocusTrapHorizontalNavigationEvent, BentoFocusTrapVerticalNavigationEvent } from './focus-trap.types';
2
2
  export declare const deferAction: (callback: FrameRequestCallback) => number;
3
3
  export declare const getNextFocusableElement: (factor: any, element: any) => HTMLElement;
4
- export declare const getArrowType: (event: KeyboardEvent, arrowOrder: AdlFocusTrapVerticalNavigationEvent[] | AdlFocusTrapHorizontalNavigationEvent[]) => {
4
+ export declare const getArrowType: (event: KeyboardEvent, arrowOrder: BentoFocusTrapVerticalNavigationEvent[] | BentoFocusTrapHorizontalNavigationEvent[]) => {
5
5
  isArrowNext: boolean;
6
6
  isArrowPrev: boolean;
7
7
  };
@@ -1,8 +1,8 @@
1
1
  import { PropType } from 'vue';
2
- import { AdlFocusTrapArrowNavigationDirection, AdlFocusTrapHorizontalNavigationEvent, AdlFocusTrapVerticalNavigationEvent } from './focus-trap.types';
2
+ import { BentoFocusTrapArrowNavigationDirection, BentoFocusTrapHorizontalNavigationEvent, BentoFocusTrapVerticalNavigationEvent } from './focus-trap.types';
3
3
  declare const _default: import("vue").DefineComponent<{
4
4
  arrowNavigation: {
5
- type: PropType<AdlFocusTrapArrowNavigationDirection>;
5
+ type: PropType<BentoFocusTrapArrowNavigationDirection>;
6
6
  default: any;
7
7
  validator: (value: unknown) => boolean;
8
8
  };
@@ -15,7 +15,7 @@ declare const _default: import("vue").DefineComponent<{
15
15
  }, {
16
16
  isHorizontalArrowNavigation(): boolean;
17
17
  isVerticalArrowNavigation(): boolean;
18
- arrowOrder(): AdlFocusTrapVerticalNavigationEvent[] | AdlFocusTrapHorizontalNavigationEvent[];
18
+ arrowOrder(): BentoFocusTrapVerticalNavigationEvent[] | BentoFocusTrapHorizontalNavigationEvent[];
19
19
  }, {
20
20
  setFocusInside(): Promise<void>;
21
21
  onBlur(): void;
@@ -24,7 +24,7 @@ declare const _default: import("vue").DefineComponent<{
24
24
  disable(): void;
25
25
  }, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
26
26
  arrowNavigation: {
27
- type: PropType<AdlFocusTrapArrowNavigationDirection>;
27
+ type: PropType<BentoFocusTrapArrowNavigationDirection>;
28
28
  default: any;
29
29
  validator: (value: unknown) => boolean;
30
30
  };
@@ -34,6 +34,6 @@ declare const _default: import("vue").DefineComponent<{
34
34
  };
35
35
  }>>, {
36
36
  disabled: boolean;
37
- arrowNavigation: AdlFocusTrapArrowNavigationDirection;
37
+ arrowNavigation: BentoFocusTrapArrowNavigationDirection;
38
38
  }>;
39
39
  export default _default;
@@ -1 +1 @@
1
- export { default as AdlFocusTrap } from './focus-trap.vue';
1
+ export { default as BentoFocusTrap } from './focus-trap.vue';
@@ -37,6 +37,10 @@ declare const _default: import("vue").DefineComponent<{
37
37
  type: BooleanConstructor;
38
38
  default: boolean;
39
39
  };
40
+ disabledFocusTrap: {
41
+ type: BooleanConstructor;
42
+ default: boolean;
43
+ };
40
44
  modifiers: {
41
45
  type: ArrayConstructor;
42
46
  default: any;
@@ -97,6 +101,10 @@ declare const _default: import("vue").DefineComponent<{
97
101
  type: BooleanConstructor;
98
102
  default: boolean;
99
103
  };
104
+ disabledFocusTrap: {
105
+ type: BooleanConstructor;
106
+ default: boolean;
107
+ };
100
108
  modifiers: {
101
109
  type: ArrayConstructor;
102
110
  default: any;
@@ -119,6 +127,7 @@ declare const _default: import("vue").DefineComponent<{
119
127
  arrow: any;
120
128
  matchWidth: boolean;
121
129
  fixedPositioning: boolean;
130
+ disabledFocusTrap: boolean;
122
131
  fallbackPosition: FallbackPositionProp;
123
132
  ariaRole: PopperContainerAriaRole;
124
133
  }>;
@@ -16,12 +16,13 @@ declare const _default: import("vue").DefineComponent<{
16
16
  }, {
17
17
  ariaLabel: ComputedRef<string>;
18
18
  isChecked: ComputedRef<boolean>;
19
- shouldShowDescription: ComputedRef<boolean>;
20
- shouldShowLabel: ComputedRef<boolean>;
21
- shouldShowSubLabel: ComputedRef<boolean>;
19
+ shouldShowDescription: ComputedRef<string>;
20
+ shouldShowLabel: ComputedRef<string>;
21
+ shouldShowSubLabel: ComputedRef<string>;
22
22
  conditionalClass: ComputedRef<{
23
- 'b-input-radio--disabled': boolean;
23
+ 'b-radio-button--disabled': boolean;
24
24
  }>;
25
+ radioButtonId: string;
25
26
  onClick: () => void;
26
27
  BentoTypographyVariant: typeof BentoTypographyVariant;
27
28
  BentoTypographyElement: typeof BentoTypographyElement;
@@ -0,0 +1,2 @@
1
+ export { default as BentoRadioGroup } from './radio-group.vue';
2
+ export { BentoRadioGroupVariant } from './radio-group.types';
@@ -0,0 +1,11 @@
1
+ export declare enum BentoRadioGroupVariant {
2
+ HORIZONTAL = "horizontal",
3
+ VERTICAL = "vertical"
4
+ }
5
+ export interface BentoRadioGroupItem {
6
+ value: string | number;
7
+ label: string;
8
+ description?: string;
9
+ disabled?: boolean;
10
+ }
11
+ export type BentoRadioGroupItems = Array<BentoRadioGroupItem>;
@@ -0,0 +1,58 @@
1
+ import { PropType } from 'vue';
2
+ import { BentoRadioGroupItems, BentoRadioGroupVariant } from './radio-group.types';
3
+ declare const _default: import("vue").DefineComponent<{
4
+ items: {
5
+ type: PropType<BentoRadioGroupItems>;
6
+ required: true;
7
+ };
8
+ variant: {
9
+ type: PropType<BentoRadioGroupVariant>;
10
+ default: BentoRadioGroupVariant;
11
+ validator: (value: BentoRadioGroupVariant) => boolean;
12
+ };
13
+ formId: {
14
+ type: StringConstructor;
15
+ default: any;
16
+ };
17
+ disabled: {
18
+ type: BooleanConstructor;
19
+ default: boolean;
20
+ };
21
+ label: {
22
+ type: StringConstructor;
23
+ required: true;
24
+ };
25
+ }, {
26
+ conditionalClasses: import("vue").ComputedRef<{
27
+ 'b-radio-group--horizontal': boolean;
28
+ }>;
29
+ inputValue: import("vue").Ref<string | number>;
30
+ onInput: (value: any) => void;
31
+ }, {}, {}, {}, import("vue/types/v3-component-options").ComponentOptionsMixin, import("vue/types/v3-component-options").ComponentOptionsMixin, "input"[], string, Readonly<import("vue").ExtractPropTypes<{
32
+ items: {
33
+ type: PropType<BentoRadioGroupItems>;
34
+ required: true;
35
+ };
36
+ variant: {
37
+ type: PropType<BentoRadioGroupVariant>;
38
+ default: BentoRadioGroupVariant;
39
+ validator: (value: BentoRadioGroupVariant) => boolean;
40
+ };
41
+ formId: {
42
+ type: StringConstructor;
43
+ default: any;
44
+ };
45
+ disabled: {
46
+ type: BooleanConstructor;
47
+ default: boolean;
48
+ };
49
+ label: {
50
+ type: StringConstructor;
51
+ required: true;
52
+ };
53
+ }>>, {
54
+ disabled: boolean;
55
+ variant: BentoRadioGroupVariant;
56
+ formId: string;
57
+ }>;
58
+ export default _default;
@@ -15,9 +15,9 @@ declare const _default: import("vue").DefineComponent<{
15
15
  type: StringConstructor;
16
16
  default: string;
17
17
  };
18
- }, {}, {}, {}, {
19
- onInput(event: Event): void;
20
- }, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
18
+ }, {
19
+ onInput: (event: Event) => void;
20
+ }, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "input"[], string, Readonly<import("vue").ExtractPropTypes<{
21
21
  label: {
22
22
  type: StringConstructor;
23
23
  default: string;
@@ -2,7 +2,6 @@ import {
2
2
  // ADL
3
3
  // AdlAccordion,
4
4
  // AdlAccordionItem,
5
- // AdlAlert,
6
5
  // AdlBadge,
7
6
  // AdlCard,
8
7
  // AdlCardImage,
@@ -16,10 +15,12 @@ import {
16
15
  // AdlTextarea,
17
16
 
18
17
  // Bento
18
+ BentoAlert,
19
19
  BentoButton,
20
20
  BentoButtonActions,
21
21
  BentoButtonGroup,
22
22
  BentoCheckbox,
23
+ BentoCheckboxGroup,
23
24
  BentoClickOutside,
24
25
  BentoDataGrid,
25
26
  BentoInputField,
@@ -28,7 +29,7 @@ import {
28
29
  BentoLoadingIndicator,
29
30
  BentoPagination,
30
31
  BentoPopover,
31
- BentoRadioButton,
32
+ BentoRadioGroup,
32
33
  BentoStatus,
33
34
  BentoTag,
34
35
  BentoToggle,
@@ -40,7 +41,6 @@ declare module 'vue' {
40
41
  // ADL
41
42
  // AdlAccordion: typeof AdlAccordion;
42
43
  // AdlAccordionItem: typeof AdlAccordionItem;
43
- // AdlAlert: typeof AdlAlert;
44
44
  // AdlBadge: typeof AdlBadge;
45
45
  // AdlCard: typeof AdlCard;
46
46
  // AdlCardImage: typeof AdlCardImage;
@@ -54,10 +54,12 @@ declare module 'vue' {
54
54
  // AdlTextarea: typeof AdlTextarea;
55
55
 
56
56
  // Bento
57
+ BentoAlert: typeof BentoAlert;
57
58
  BentoButton: typeof BentoButton;
58
59
  BentoButtonGroup: typeof BentoButtonGroup;
59
60
  BentoButtonActions: typeof BentoButtonActions;
60
61
  BentoCheckbox: typeof BentoCheckbox;
62
+ BentoCheckboxGroup: typeof BentoCheckboxGroup;
61
63
  BentoClickOutside: typeof BentoClickOutside;
62
64
  BentoDataGrid: typeof BentoDataGrid;
63
65
  BentoInputField: typeof BentoInputField;
@@ -66,7 +68,7 @@ declare module 'vue' {
66
68
  BentoLoadingIndicator: typeof BentoLoadingIndicator;
67
69
  BentoPagination: typeof BentoPagination;
68
70
  BentoPopover: typeof BentoPopover;
69
- BentoRadioButton: typeof BentoRadioButton;
71
+ BentoRadioGroup: typeof BentoRadioGroup;
70
72
  BentoStatus: typeof BentoStatus;
71
73
  BentoTag: typeof BentoTag;
72
74
  BentoToggle: typeof BentoToggle;
@@ -1,4 +1,5 @@
1
1
  import BentoVue from './install';
2
+ export * from './components/alert';
2
3
  export * from './components/button';
3
4
  export * from './components/data-grid';
4
5
  export * from './components/checkbox';
@@ -9,7 +10,7 @@ export * from './components/loading-indicator';
9
10
  export * from './components/link';
10
11
  export * from './components/pagination';
11
12
  export * from './components/popover';
12
- export * from './components/radio-button';
13
+ export * from './components/radio-group';
13
14
  export * from './components/status';
14
15
  export * from './components/tag';
15
16
  export * from './components/toggle';