@synergy-design-system/vue 1.27.0 → 2.0.0

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 (65) hide show
  1. package/README.md +1 -33
  2. package/dist/components/SynVueAlert.vue.d.ts +0 -5
  3. package/dist/components/SynVueBreadcrumbItem.vue.d.ts +0 -2
  4. package/dist/components/SynVueButton.vue.d.ts +0 -8
  5. package/dist/components/SynVueCard.vue.d.ts +8 -6
  6. package/dist/components/SynVueCheckbox.vue.d.ts +0 -9
  7. package/dist/components/SynVueDialog.vue.d.ts +0 -3
  8. package/dist/components/SynVueDivider.vue.d.ts +0 -1
  9. package/dist/components/SynVueDrawer.vue.d.ts +0 -4
  10. package/dist/components/SynVueDropdown.vue.d.ts +0 -13
  11. package/dist/components/SynVueHeader.vue.d.ts +26 -25
  12. package/dist/components/SynVueIcon.vue.d.ts +0 -2
  13. package/dist/components/SynVueIconButton.vue.d.ts +0 -3
  14. package/dist/components/SynVueInput.vue.d.ts +0 -15
  15. package/dist/components/SynVueMenuItem.vue.d.ts +0 -5
  16. package/dist/components/SynVueNavItem.vue.d.ts +0 -4
  17. package/dist/components/SynVueOptgroup.vue.d.ts +0 -1
  18. package/dist/components/SynVueOption.vue.d.ts +0 -4
  19. package/dist/components/SynVuePopup.vue.d.ts +0 -1
  20. package/dist/components/SynVuePrioNav.vue.d.ts +8 -23
  21. package/dist/components/SynVueRadio.vue.d.ts +0 -2
  22. package/dist/components/SynVueRadioButton.vue.d.ts +0 -3
  23. package/dist/components/SynVueRadioGroup.vue.d.ts +0 -6
  24. package/dist/components/SynVueSelect.vue.d.ts +0 -11
  25. package/dist/components/SynVueSideNav.vue.d.ts +0 -5
  26. package/dist/components/SynVueSwitch.vue.d.ts +0 -9
  27. package/dist/components/SynVueTextarea.vue.d.ts +0 -107
  28. package/dist/components/SynVueTooltip.vue.d.ts +0 -5
  29. package/package.json +2 -2
  30. package/src/components/SynVueAlert.vue +0 -26
  31. package/src/components/SynVueBadge.vue +0 -3
  32. package/src/components/SynVueBreadcrumb.vue +0 -3
  33. package/src/components/SynVueBreadcrumbItem.vue +0 -6
  34. package/src/components/SynVueButton.vue +0 -41
  35. package/src/components/SynVueButtonGroup.vue +0 -3
  36. package/src/components/SynVueCard.vue +4 -6
  37. package/src/components/SynVueCheckbox.vue +0 -45
  38. package/src/components/SynVueDialog.vue +0 -14
  39. package/src/components/SynVueDivider.vue +0 -4
  40. package/src/components/SynVueDrawer.vue +0 -16
  41. package/src/components/SynVueDropdown.vue +0 -39
  42. package/src/components/SynVueHeader.vue +37 -39
  43. package/src/components/SynVueIcon.vue +0 -6
  44. package/src/components/SynVueIconButton.vue +0 -17
  45. package/src/components/SynVueInput.vue +0 -70
  46. package/src/components/SynVueMenu.vue +0 -3
  47. package/src/components/SynVueMenuItem.vue +0 -15
  48. package/src/components/SynVueMenuLabel.vue +0 -3
  49. package/src/components/SynVueNavItem.vue +0 -19
  50. package/src/components/SynVueOptgroup.vue +0 -4
  51. package/src/components/SynVueOption.vue +0 -13
  52. package/src/components/SynVuePopup.vue +0 -7
  53. package/src/components/SynVuePrioNav.vue +1 -8
  54. package/src/components/SynVueProgressBar.vue +0 -3
  55. package/src/components/SynVueProgressRing.vue +0 -3
  56. package/src/components/SynVueRadio.vue +0 -6
  57. package/src/components/SynVueRadioButton.vue +0 -14
  58. package/src/components/SynVueRadioGroup.vue +0 -28
  59. package/src/components/SynVueSelect.vue +0 -50
  60. package/src/components/SynVueSideNav.vue +0 -18
  61. package/src/components/SynVueSpinner.vue +0 -3
  62. package/src/components/SynVueSwitch.vue +0 -43
  63. package/src/components/SynVueTag.vue +0 -3
  64. package/src/components/SynVueTextarea.vue +0 -60
  65. package/src/components/SynVueTooltip.vue +0 -18
@@ -31,20 +31,7 @@ import type { SynOption } from '@synergy-design-system/components';
31
31
  // DOM Reference to the element
32
32
  const nativeElement = ref<SynOption>();
33
33
 
34
- // Map methods
35
- const callHandleDisabledChange = (...args: Parameters<SynOption['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
36
- const callHandleSelectedChange = (...args: Parameters<SynOption['handleSelectedChange']>) => nativeElement.value?.handleSelectedChange(...args);
37
- const callHandleValueChange = (...args: Parameters<SynOption['handleValueChange']>) => nativeElement.value?.handleValueChange(...args);
38
- /**
39
- * Returns a plain text label based on the option's content.
40
- */
41
- const callGetTextLabel = (...args: Parameters<SynOption['getTextLabel']>) => nativeElement.value?.getTextLabel(...args);
42
-
43
34
  defineExpose({
44
- callHandleDisabledChange,
45
- callHandleSelectedChange,
46
- callHandleValueChange,
47
- callGetTextLabel,
48
35
  nativeElement,
49
36
  });
50
37
 
@@ -42,14 +42,7 @@ import type { SynPopup, SynRepositionEvent } from '@synergy-design-system/compon
42
42
  // DOM Reference to the element
43
43
  const nativeElement = ref<SynPopup>();
44
44
 
45
- // Map methods
46
- /**
47
- * Forces the popup to recalculate and reposition itself.
48
- */
49
- const callReposition = (...args: Parameters<SynPopup['reposition']>) => nativeElement.value?.reposition(...args);
50
-
51
45
  defineExpose({
52
- callReposition,
53
46
  nativeElement,
54
47
  });
55
48
 
@@ -47,20 +47,13 @@ import type { SynPrioNav } from '@synergy-design-system/components';
47
47
  // DOM Reference to the element
48
48
  const nativeElement = ref<SynPrioNav>();
49
49
 
50
- // Map methods
51
-
52
50
  defineExpose({
53
-
54
51
  nativeElement,
55
52
  });
56
53
 
57
54
  // Map attributes
58
55
  const props = defineProps<{
59
- /**
60
- * The components priority menu label.
61
- This will be shown after the priority menu 3 dots link
62
- */
63
- 'priorityMenuLabel'?: SynPrioNav['priorityMenuLabel'];
56
+
64
57
  }>();
65
58
 
66
59
  // Make sure prop binding only forwards the props that are actually there.
@@ -31,10 +31,7 @@ import type { SynProgressBar } from '@synergy-design-system/components';
31
31
  // DOM Reference to the element
32
32
  const nativeElement = ref<SynProgressBar>();
33
33
 
34
- // Map methods
35
-
36
34
  defineExpose({
37
-
38
35
  nativeElement,
39
36
  });
40
37
 
@@ -31,10 +31,7 @@ import type { SynProgressRing } from '@synergy-design-system/components';
31
31
  // DOM Reference to the element
32
32
  const nativeElement = ref<SynProgressRing>();
33
33
 
34
- // Map methods
35
-
36
34
  defineExpose({
37
-
38
35
  nativeElement,
39
36
  });
40
37
 
@@ -32,13 +32,7 @@ import type { SynBlurEvent, SynFocusEvent, SynRadio } from '@synergy-design-syst
32
32
  // DOM Reference to the element
33
33
  const nativeElement = ref<SynRadio>();
34
34
 
35
- // Map methods
36
- const callHandleCheckedChange = (...args: Parameters<SynRadio['handleCheckedChange']>) => nativeElement.value?.handleCheckedChange(...args);
37
- const callHandleDisabledChange = (...args: Parameters<SynRadio['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
38
-
39
35
  defineExpose({
40
- callHandleCheckedChange,
41
- callHandleDisabledChange,
42
36
  nativeElement,
43
37
  });
44
38
 
@@ -33,21 +33,7 @@ import type { SynBlurEvent, SynFocusEvent, SynRadioButton } from '@synergy-desig
33
33
  // DOM Reference to the element
34
34
  const nativeElement = ref<SynRadioButton>();
35
35
 
36
- // Map methods
37
- const callHandleDisabledChange = (...args: Parameters<SynRadioButton['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
38
- /**
39
- * Sets focus on the radio button.
40
- */
41
- const callFocus = (...args: Parameters<SynRadioButton['focus']>) => nativeElement.value?.focus(...args);
42
- /**
43
- * Removes focus from the radio button.
44
- */
45
- const callBlur = (...args: Parameters<SynRadioButton['blur']>) => nativeElement.value?.blur(...args);
46
-
47
36
  defineExpose({
48
- callHandleDisabledChange,
49
- callFocus,
50
- callBlur,
51
37
  nativeElement,
52
38
  });
53
39
 
@@ -39,35 +39,7 @@ import type {
39
39
  // DOM Reference to the element
40
40
  const nativeElement = ref<SynRadioGroup>();
41
41
 
42
- // Map methods
43
- const callHandleSizeChange = (...args: Parameters<SynRadioGroup['handleSizeChange']>) => nativeElement.value?.handleSizeChange(...args);
44
- const callHandleValueChange = (...args: Parameters<SynRadioGroup['handleValueChange']>) => nativeElement.value?.handleValueChange(...args);
45
- /**
46
- * Checks for validity but does not show a validation message.
47
- * Returns `true` when valid and `false` when invalid.
48
- */
49
- const callCheckValidity = (...args: Parameters<SynRadioGroup['checkValidity']>) => nativeElement.value?.checkValidity(...args);
50
- /**
51
- * Gets the associated form, if one exists.
52
- */
53
- const callGetForm = (...args: Parameters<SynRadioGroup['getForm']>) => nativeElement.value?.getForm(...args);
54
- /**
55
- * Checks for validity and shows the browser's validation message if the control is invalid.
56
- */
57
- const callReportValidity = (...args: Parameters<SynRadioGroup['reportValidity']>) => nativeElement.value?.reportValidity(...args);
58
- /**
59
- * Sets a custom validation message.
60
- * Pass an empty string to restore validity.
61
- */
62
- const callSetCustomValidity = (...args: Parameters<SynRadioGroup['setCustomValidity']>) => nativeElement.value?.setCustomValidity(...args);
63
-
64
42
  defineExpose({
65
- callHandleSizeChange,
66
- callHandleValueChange,
67
- callCheckValidity,
68
- callGetForm,
69
- callReportValidity,
70
- callSetCustomValidity,
71
43
  nativeElement,
72
44
  });
73
45
 
@@ -60,57 +60,7 @@ import type {
60
60
  // DOM Reference to the element
61
61
  const nativeElement = ref<SynSelect>();
62
62
 
63
- // Map methods
64
- const callHandleDisabledChange = (...args: Parameters<SynSelect['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
65
- const callHandleValueChange = (...args: Parameters<SynSelect['handleValueChange']>) => nativeElement.value?.handleValueChange(...args);
66
- const callHandleOpenChange = (...args: Parameters<SynSelect['handleOpenChange']>) => nativeElement.value?.handleOpenChange(...args);
67
- /**
68
- * Shows the listbox.
69
- */
70
- const callShow = (...args: Parameters<SynSelect['show']>) => nativeElement.value?.show(...args);
71
- /**
72
- * Hides the listbox.
73
- */
74
- const callHide = (...args: Parameters<SynSelect['hide']>) => nativeElement.value?.hide(...args);
75
- /**
76
- * Checks for validity but does not show a validation message.
77
- * Returns `true` when valid and `false` when invalid.
78
- */
79
- const callCheckValidity = (...args: Parameters<SynSelect['checkValidity']>) => nativeElement.value?.checkValidity(...args);
80
- /**
81
- * Gets the associated form, if one exists.
82
- */
83
- const callGetForm = (...args: Parameters<SynSelect['getForm']>) => nativeElement.value?.getForm(...args);
84
- /**
85
- * Checks for validity and shows the browser's validation message if the control is invalid.
86
- */
87
- const callReportValidity = (...args: Parameters<SynSelect['reportValidity']>) => nativeElement.value?.reportValidity(...args);
88
- /**
89
- * Sets a custom validation message.
90
- * Pass an empty string to restore validity.
91
- */
92
- const callSetCustomValidity = (...args: Parameters<SynSelect['setCustomValidity']>) => nativeElement.value?.setCustomValidity(...args);
93
- /**
94
- * Sets focus on the control.
95
- */
96
- const callFocus = (...args: Parameters<SynSelect['focus']>) => nativeElement.value?.focus(...args);
97
- /**
98
- * Removes focus from the control.
99
- */
100
- const callBlur = (...args: Parameters<SynSelect['blur']>) => nativeElement.value?.blur(...args);
101
-
102
63
  defineExpose({
103
- callHandleDisabledChange,
104
- callHandleValueChange,
105
- callHandleOpenChange,
106
- callShow,
107
- callHide,
108
- callCheckValidity,
109
- callGetForm,
110
- callReportValidity,
111
- callSetCustomValidity,
112
- callFocus,
113
- callBlur,
114
64
  nativeElement,
115
65
  });
116
66
 
@@ -59,25 +59,7 @@ import type {
59
59
  // DOM Reference to the element
60
60
  const nativeElement = ref<SynSideNav>();
61
61
 
62
- // Map methods
63
- const callHandleModeChange = (...args: Parameters<SynSideNav['handleModeChange']>) => nativeElement.value?.handleModeChange(...args);
64
- const callHandleOpenChange = (...args: Parameters<SynSideNav['handleOpenChange']>) => nativeElement.value?.handleOpenChange(...args);
65
- const callHandleFocusTrapping = (...args: Parameters<SynSideNav['handleFocusTrapping']>) => nativeElement.value?.handleFocusTrapping(...args);
66
- /**
67
- * Shows the side-nav.
68
- */
69
- const callShow = (...args: Parameters<SynSideNav['show']>) => nativeElement.value?.show(...args);
70
- /**
71
- * Hides the side-nav
72
- */
73
- const callHide = (...args: Parameters<SynSideNav['hide']>) => nativeElement.value?.hide(...args);
74
-
75
62
  defineExpose({
76
- callHandleModeChange,
77
- callHandleOpenChange,
78
- callHandleFocusTrapping,
79
- callShow,
80
- callHide,
81
63
  nativeElement,
82
64
  });
83
65
 
@@ -25,10 +25,7 @@ import type { SynSpinner } from '@synergy-design-system/components';
25
25
  // DOM Reference to the element
26
26
  const nativeElement = ref<SynSpinner>();
27
27
 
28
- // Map methods
29
-
30
28
  defineExpose({
31
-
32
29
  nativeElement,
33
30
  });
34
31
 
@@ -40,50 +40,7 @@ import type {
40
40
  // DOM Reference to the element
41
41
  const nativeElement = ref<SynSwitch>();
42
42
 
43
- // Map methods
44
- const callHandleCheckedChange = (...args: Parameters<SynSwitch['handleCheckedChange']>) => nativeElement.value?.handleCheckedChange(...args);
45
- const callHandleDisabledChange = (...args: Parameters<SynSwitch['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
46
- /**
47
- * Simulates a click on the switch.
48
- */
49
- const callClick = (...args: Parameters<SynSwitch['click']>) => nativeElement.value?.click(...args);
50
- /**
51
- * Sets focus on the switch.
52
- */
53
- const callFocus = (...args: Parameters<SynSwitch['focus']>) => nativeElement.value?.focus(...args);
54
- /**
55
- * Removes focus from the switch.
56
- */
57
- const callBlur = (...args: Parameters<SynSwitch['blur']>) => nativeElement.value?.blur(...args);
58
- /**
59
- * Checks for validity but does not show a validation message.
60
- * Returns `true` when valid and `false` when invalid.
61
- */
62
- const callCheckValidity = (...args: Parameters<SynSwitch['checkValidity']>) => nativeElement.value?.checkValidity(...args);
63
- /**
64
- * Gets the associated form, if one exists.
65
- */
66
- const callGetForm = (...args: Parameters<SynSwitch['getForm']>) => nativeElement.value?.getForm(...args);
67
- /**
68
- * Checks for validity and shows the browser's validation message if the control is invalid.
69
- */
70
- const callReportValidity = (...args: Parameters<SynSwitch['reportValidity']>) => nativeElement.value?.reportValidity(...args);
71
- /**
72
- * Sets a custom validation message.
73
- * Pass an empty string to restore validity.
74
- */
75
- const callSetCustomValidity = (...args: Parameters<SynSwitch['setCustomValidity']>) => nativeElement.value?.setCustomValidity(...args);
76
-
77
43
  defineExpose({
78
- callHandleCheckedChange,
79
- callHandleDisabledChange,
80
- callClick,
81
- callFocus,
82
- callBlur,
83
- callCheckValidity,
84
- callGetForm,
85
- callReportValidity,
86
- callSetCustomValidity,
87
44
  nativeElement,
88
45
  });
89
46
 
@@ -30,10 +30,7 @@ import type { SynRemoveEvent, SynTag } from '@synergy-design-system/components';
30
30
  // DOM Reference to the element
31
31
  const nativeElement = ref<SynTag>();
32
32
 
33
- // Map methods
34
-
35
33
  defineExpose({
36
-
37
34
  nativeElement,
38
35
  });
39
36
 
@@ -37,67 +37,7 @@ import type {
37
37
  // DOM Reference to the element
38
38
  const nativeElement = ref<SynTextarea>();
39
39
 
40
- // Map methods
41
- const callHandleDisabledChange = (...args: Parameters<SynTextarea['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
42
- const callHandleRowsChange = (...args: Parameters<SynTextarea['handleRowsChange']>) => nativeElement.value?.handleRowsChange(...args);
43
- const callHandleValueChange = (...args: Parameters<SynTextarea['handleValueChange']>) => nativeElement.value?.handleValueChange(...args);
44
- /**
45
- * Sets focus on the textarea.
46
- */
47
- const callFocus = (...args: Parameters<SynTextarea['focus']>) => nativeElement.value?.focus(...args);
48
- /**
49
- * Removes focus from the textarea.
50
- */
51
- const callBlur = (...args: Parameters<SynTextarea['blur']>) => nativeElement.value?.blur(...args);
52
- /**
53
- * Selects all the text in the textarea.
54
- */
55
- const callSelect = (...args: Parameters<SynTextarea['select']>) => nativeElement.value?.select(...args);
56
- /**
57
- * Gets or sets the textarea's scroll position.
58
- */
59
- const callScrollPosition = (...args: Parameters<SynTextarea['scrollPosition']>) => nativeElement.value?.scrollPosition(...args);
60
- /**
61
- * Sets the start and end positions of the text selection (0-based).
62
- */
63
- const callSetSelectionRange = (...args: Parameters<SynTextarea['setSelectionRange']>) => nativeElement.value?.setSelectionRange(...args);
64
- /**
65
- * Replaces a range of text with a new string.
66
- */
67
- const callSetRangeText = (...args: Parameters<SynTextarea['setRangeText']>) => nativeElement.value?.setRangeText(...args);
68
- /**
69
- * Checks for validity but does not show a validation message.
70
- * Returns `true` when valid and `false` when invalid.
71
- */
72
- const callCheckValidity = (...args: Parameters<SynTextarea['checkValidity']>) => nativeElement.value?.checkValidity(...args);
73
- /**
74
- * Gets the associated form, if one exists.
75
- */
76
- const callGetForm = (...args: Parameters<SynTextarea['getForm']>) => nativeElement.value?.getForm(...args);
77
- /**
78
- * Checks for validity and shows the browser's validation message if the control is invalid.
79
- */
80
- const callReportValidity = (...args: Parameters<SynTextarea['reportValidity']>) => nativeElement.value?.reportValidity(...args);
81
- /**
82
- * Sets a custom validation message.
83
- * Pass an empty string to restore validity.
84
- */
85
- const callSetCustomValidity = (...args: Parameters<SynTextarea['setCustomValidity']>) => nativeElement.value?.setCustomValidity(...args);
86
-
87
40
  defineExpose({
88
- callHandleDisabledChange,
89
- callHandleRowsChange,
90
- callHandleValueChange,
91
- callFocus,
92
- callBlur,
93
- callSelect,
94
- callScrollPosition,
95
- callSetSelectionRange,
96
- callSetRangeText,
97
- callCheckValidity,
98
- callGetForm,
99
- callReportValidity,
100
- callSetCustomValidity,
101
41
  nativeElement,
102
42
  });
103
43
 
@@ -43,25 +43,7 @@ import type {
43
43
  // DOM Reference to the element
44
44
  const nativeElement = ref<SynTooltip>();
45
45
 
46
- // Map methods
47
- const callHandleOpenChange = (...args: Parameters<SynTooltip['handleOpenChange']>) => nativeElement.value?.handleOpenChange(...args);
48
- const callHandleOptionsChange = (...args: Parameters<SynTooltip['handleOptionsChange']>) => nativeElement.value?.handleOptionsChange(...args);
49
- const callHandleDisabledChange = (...args: Parameters<SynTooltip['handleDisabledChange']>) => nativeElement.value?.handleDisabledChange(...args);
50
- /**
51
- * Shows the tooltip.
52
- */
53
- const callShow = (...args: Parameters<SynTooltip['show']>) => nativeElement.value?.show(...args);
54
- /**
55
- * Hides the tooltip
56
- */
57
- const callHide = (...args: Parameters<SynTooltip['hide']>) => nativeElement.value?.hide(...args);
58
-
59
46
  defineExpose({
60
- callHandleOpenChange,
61
- callHandleOptionsChange,
62
- callHandleDisabledChange,
63
- callShow,
64
- callHide,
65
47
  nativeElement,
66
48
  });
67
49