@onereach/ui-components 2.62.7-beta.1932.0 → 2.62.7

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 (117) hide show
  1. package/dist/v2/{OrInlineInput-f00cba5e.js → OrInlineInput-8455f9da.js} +4 -5
  2. package/dist/v2/{OrInlineTextarea-75de33d0.js → OrInlineTextarea-1127e512.js} +4 -5
  3. package/dist/v2/{OrTabs-f2a60b41.js → OrTabs-b4a9740b.js} +1 -1
  4. package/dist/v2/components/index.d.ts +0 -1
  5. package/dist/v2/index.js +3 -4
  6. package/dist/v2/index2.js +3 -4
  7. package/dist/v2/index34.js +1 -1
  8. package/dist/v2/index36.js +1 -1
  9. package/dist/v2/index63.js +16 -2
  10. package/dist/v2/index64.js +24 -15
  11. package/dist/v2/index65.js +4 -26
  12. package/dist/v2/index66.js +1 -2
  13. package/dist/v2/index67.js +4 -3
  14. package/dist/v2/index68.js +4 -3
  15. package/dist/v2/index69.js +10 -3
  16. package/dist/v2/index70.js +6 -3
  17. package/dist/v2/index71.js +2 -13
  18. package/dist/v2/index72.js +6 -4
  19. package/dist/v2/index73.js +4 -6
  20. package/dist/v2/index74.js +1 -2
  21. package/dist/v2/index75.js +3 -3
  22. package/dist/v2/index76.js +4 -3
  23. package/dist/v2/index77.js +15 -4
  24. package/dist/v2/index78.js +11 -14
  25. package/dist/v2/index79.js +13 -11
  26. package/dist/v2/index80.js +2 -14
  27. package/dist/v2/index81.js +2 -2
  28. package/dist/v2/index82.js +3 -2
  29. package/dist/v2/index83.js +6 -1
  30. package/dist/v2/index84.js +20 -7
  31. package/dist/v2/index85.js +9 -12
  32. package/dist/v2/index86.js +1 -18
  33. package/dist/v2/index87.js +18 -2
  34. package/dist/v2/index88.js +2 -18
  35. package/dist/v2/index89.js +10 -2
  36. package/dist/v2/index90.js +11 -9
  37. package/dist/v2/index91.js +1 -12
  38. package/dist/v2/index92.js +6 -1
  39. package/dist/v2/index93.js +1 -5
  40. package/dist/v3/{OrInlineInput-bac4abdd.js → OrInlineInput-a080b0a3.js} +2 -3
  41. package/dist/v3/{OrInlineTextarea-d1ec1bba.js → OrInlineTextarea-08767485.js} +2 -3
  42. package/dist/v3/{OrTabs-ac0be933.js → OrTabs-194ca950.js} +1 -1
  43. package/dist/v3/components/index.d.ts +0 -1
  44. package/dist/v3/index.js +3 -4
  45. package/dist/v3/index2.js +3 -4
  46. package/dist/v3/index34.js +1 -1
  47. package/dist/v3/index36.js +1 -1
  48. package/dist/v3/index63.js +15 -2
  49. package/dist/v3/index64.js +22 -13
  50. package/dist/v3/index65.js +3 -24
  51. package/dist/v3/index66.js +1 -2
  52. package/dist/v3/index67.js +4 -3
  53. package/dist/v3/index68.js +4 -3
  54. package/dist/v3/index69.js +9 -3
  55. package/dist/v3/index70.js +4 -3
  56. package/dist/v3/index71.js +2 -10
  57. package/dist/v3/index72.js +5 -3
  58. package/dist/v3/index73.js +3 -5
  59. package/dist/v3/index74.js +1 -2
  60. package/dist/v3/index75.js +3 -3
  61. package/dist/v3/index76.js +4 -3
  62. package/dist/v3/index77.js +14 -4
  63. package/dist/v3/index78.js +10 -13
  64. package/dist/v3/index79.js +12 -10
  65. package/dist/v3/index80.js +1 -13
  66. package/dist/v3/index81.js +1 -1
  67. package/dist/v3/index82.js +3 -1
  68. package/dist/v3/index83.js +6 -1
  69. package/dist/v3/index84.js +16 -6
  70. package/dist/v3/index85.js +9 -12
  71. package/dist/v3/index86.js +1 -15
  72. package/dist/v3/index87.js +17 -2
  73. package/dist/v3/index88.js +2 -17
  74. package/dist/v3/index89.js +8 -2
  75. package/dist/v3/index90.js +9 -6
  76. package/dist/v3/index91.js +1 -11
  77. package/dist/v3/index92.js +6 -1
  78. package/dist/v3/index93.js +1 -5
  79. package/package.json +4 -3
  80. package/src/components/index.ts +0 -1
  81. package/src/components/or-checkbox-v3/OrCheckbox.stories3.ts +1 -1
  82. package/src/components/or-inline-input-v3/OrInlineInput.vue +2 -2
  83. package/src/components/or-inline-textarea-v3/OrInlineTextarea.vue +2 -2
  84. package/src/components/or-radio-v3/OrRadio.stories3.ts +1 -1
  85. package/src/components/or-switch-v3/OrSwitch.stories3.ts +1 -1
  86. package/src/components/or-tabs-v3/OrTabs.stories3.ts +4 -9
  87. package/src/components/or-tabs-v3/OrTabs.vue +1 -1
  88. package/src/hooks/useClassAttribute.ts +1 -1
  89. package/dist/v2/OrSegmentedControl-17df63b8.js +0 -236
  90. package/dist/v2/components/or-segmented-control-v3/OrSegmentedControl.stories3.d.ts +0 -12
  91. package/dist/v2/components/or-segmented-control-v3/OrSegmentedControl.vue.d.ts +0 -77
  92. package/dist/v2/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue.d.ts +0 -47
  93. package/dist/v2/components/or-segmented-control-v3/components/or-segmented-control-item/styles.d.ts +0 -3
  94. package/dist/v2/components/or-segmented-control-v3/index.d.ts +0 -3
  95. package/dist/v2/components/or-segmented-control-v3/props.d.ts +0 -4
  96. package/dist/v2/components/or-segmented-control-v3/styles.d.ts +0 -3
  97. package/dist/v2/components/or-segmented-control-v3/types.d.ts +0 -4
  98. package/dist/v2/index94.js +0 -3
  99. package/dist/v3/OrSegmentedControl-2bbc0f22.js +0 -184
  100. package/dist/v3/components/or-segmented-control-v3/OrSegmentedControl.stories3.d.ts +0 -12
  101. package/dist/v3/components/or-segmented-control-v3/OrSegmentedControl.vue.d.ts +0 -77
  102. package/dist/v3/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue.d.ts +0 -47
  103. package/dist/v3/components/or-segmented-control-v3/components/or-segmented-control-item/styles.d.ts +0 -3
  104. package/dist/v3/components/or-segmented-control-v3/index.d.ts +0 -3
  105. package/dist/v3/components/or-segmented-control-v3/props.d.ts +0 -4
  106. package/dist/v3/components/or-segmented-control-v3/styles.d.ts +0 -3
  107. package/dist/v3/components/or-segmented-control-v3/types.d.ts +0 -4
  108. package/dist/v3/index94.js +0 -3
  109. package/src/components/or-segmented-control-v3/OrSegmentedControl.docs.mdx +0 -7
  110. package/src/components/or-segmented-control-v3/OrSegmentedControl.stories3.ts +0 -106
  111. package/src/components/or-segmented-control-v3/OrSegmentedControl.vue +0 -107
  112. package/src/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue +0 -64
  113. package/src/components/or-segmented-control-v3/components/or-segmented-control-item/styles.ts +0 -50
  114. package/src/components/or-segmented-control-v3/index.ts +0 -3
  115. package/src/components/or-segmented-control-v3/props.ts +0 -4
  116. package/src/components/or-segmented-control-v3/styles.ts +0 -24
  117. package/src/components/or-segmented-control-v3/types.ts +0 -4
@@ -1,77 +0,0 @@
1
- import { PropType } from 'vue-demi';
2
- import { SegmentedControlSize } from './props';
3
- import { SegmentedControlOption } from './types';
4
- declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
5
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
6
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
7
- proxyModelValue: import("@vue/composition-api").WritableComputedRef<string>;
8
- }> & import("@vue/composition-api").Data, {}, {}, {
9
- options: {
10
- type: PropType<SegmentedControlOption[]>;
11
- default: SegmentedControlOption[];
12
- };
13
- modelValue: {
14
- type: StringConstructor;
15
- default: undefined;
16
- };
17
- value: {
18
- type: StringConstructor;
19
- default: undefined;
20
- };
21
- size: {
22
- type: PropType<SegmentedControlSize>;
23
- default: SegmentedControlSize;
24
- };
25
- disabled: {
26
- type: BooleanConstructor;
27
- default: boolean;
28
- };
29
- }, import("@vue/composition-api").ExtractPropTypes<{
30
- options: {
31
- type: PropType<SegmentedControlOption[]>;
32
- default: SegmentedControlOption[];
33
- };
34
- modelValue: {
35
- type: StringConstructor;
36
- default: undefined;
37
- };
38
- value: {
39
- type: StringConstructor;
40
- default: undefined;
41
- };
42
- size: {
43
- type: PropType<SegmentedControlSize>;
44
- default: SegmentedControlSize;
45
- };
46
- disabled: {
47
- type: BooleanConstructor;
48
- default: boolean;
49
- };
50
- }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
51
- options: SegmentedControlOption[];
52
- modelValue: string;
53
- value: string;
54
- size: SegmentedControlSize;
55
- disabled: boolean;
56
- } & {} & {
57
- [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
58
- }, import("@vue/composition-api").ShallowUnwrapRef<{
59
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
60
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
61
- proxyModelValue: import("@vue/composition-api").WritableComputedRef<string>;
62
- }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
63
- options: SegmentedControlOption[];
64
- modelValue: string;
65
- value: string;
66
- size: SegmentedControlSize;
67
- disabled: boolean;
68
- } & {} & {
69
- [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
70
- }, {
71
- options: SegmentedControlOption[];
72
- modelValue: string;
73
- value: string;
74
- size: SegmentedControlSize;
75
- disabled: boolean;
76
- }, true>);
77
- export default _default;
@@ -1,47 +0,0 @@
1
- import { PropType } from 'vue-demi';
2
- import { SegmentedControlSize } from '../../props';
3
- declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
4
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
5
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
6
- }> & import("@vue/composition-api").Data, {}, {}, {
7
- size: {
8
- type: PropType<SegmentedControlSize>;
9
- required: true;
10
- };
11
- selected: {
12
- type: BooleanConstructor;
13
- default: boolean;
14
- };
15
- disabled: {
16
- type: BooleanConstructor;
17
- default: boolean;
18
- };
19
- }, import("@vue/composition-api").ExtractPropTypes<{
20
- size: {
21
- type: PropType<SegmentedControlSize>;
22
- required: true;
23
- };
24
- selected: {
25
- type: BooleanConstructor;
26
- default: boolean;
27
- };
28
- disabled: {
29
- type: BooleanConstructor;
30
- default: boolean;
31
- };
32
- }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
33
- size: SegmentedControlSize;
34
- selected: boolean;
35
- disabled: boolean;
36
- } & {}, import("@vue/composition-api").ShallowUnwrapRef<{
37
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
38
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
39
- }>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
40
- size: SegmentedControlSize;
41
- selected: boolean;
42
- disabled: boolean;
43
- } & {}, {
44
- selected: boolean;
45
- disabled: boolean;
46
- }, true>);
47
- export default _default;
@@ -1,3 +0,0 @@
1
- import { SegmentedControlSize } from '../../props';
2
- export declare const SegmentedControlItemRoot: string[];
3
- export declare const SegmentedControlItemRootSizes: Record<SegmentedControlSize, string[]>;
@@ -1,3 +0,0 @@
1
- export { default as OrSegmentedControlV3 } from './OrSegmentedControl.vue';
2
- export * from './props';
3
- export * from './types';
@@ -1,4 +0,0 @@
1
- export declare enum SegmentedControlSize {
2
- M = "m",
3
- S = "s"
4
- }
@@ -1,3 +0,0 @@
1
- import { SegmentedControlSize } from './props';
2
- export declare const SegmentedControlRoot: string[];
3
- export declare const SegmentedControlRootSizes: Record<SegmentedControlSize, string[]>;
@@ -1,4 +0,0 @@
1
- export interface SegmentedControlOption {
2
- value: string;
3
- label: string;
4
- }
@@ -1,3 +0,0 @@
1
- export { u as useResponsive } from './useResponsive-a02e95b7.js';
2
- import '@vueuse/core';
3
- import 'vue-demi';
@@ -1,184 +0,0 @@
1
- import { defineComponent, ref, computed } from 'vue-demi';
2
- import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
3
- import '@vueuse/core';
4
- import { openBlock, createElementBlock, mergeProps, createElementVNode, renderSlot, normalizeClass, resolveComponent, Fragment, renderList, createBlock, withModifiers, withCtx, createTextVNode, toDisplayString } from 'vue';
5
-
6
- const SegmentedControlItemRoot = [
7
- // Layout
8
- 'flex', 'items-center', 'justify-center',
9
- // Shape
10
- 'rounded-md',
11
- // Interactivity
12
- 'interactivity-auto',
13
- // Theme
14
- 'theme-foreground-default', 'dark:theme-foreground-default-dark',
15
- // Theme (selected)
16
- 'selected:theme-background-default', 'dark:selected:theme-background-default-dark',
17
- // Theme (selected, enabled)
18
- 'selected:enabled:shadow-card', 'dark:selected:enabled:shadow-card-dark'];
19
- const SegmentedControlItemRootSizes = {
20
- 'm': [
21
- // Box
22
- 'h-[44px] md:h-[36px]',
23
- // Spacing
24
- 'px-sm+ md:px-sm+',
25
- // Typography
26
- 'typography-body-2-regular'],
27
- 's': [
28
- // Box
29
- 'h-[36px] md:h-[32px]',
30
- // Spacing
31
- 'px-sm+ md:px-sm',
32
- // Typography
33
- 'typography-caption-regular']
34
- };
35
-
36
- var script$1 = defineComponent({
37
- name: 'OrSegmentedControlItem',
38
- inheritAttrs: false,
39
- props: {
40
- size: {
41
- type: String,
42
- required: true
43
- },
44
- selected: {
45
- type: Boolean,
46
- default: false
47
- },
48
- disabled: {
49
- type: Boolean,
50
- default: false
51
- }
52
- },
53
- setup(props) {
54
- // Refs
55
- const root = ref();
56
- // Styles
57
- const classAttribute = useClassAttribute();
58
- const rootStyles = computed(() => ['or-segmented-control-item', ...SegmentedControlItemRoot, ...SegmentedControlItemRootSizes[props.size], classAttribute.value]);
59
- return {
60
- root,
61
- rootStyles
62
- };
63
- }
64
- });
65
-
66
- const _hoisted_1 = ["selected", "disabled"];
67
- const _hoisted_2 = {
68
- class: /*#__PURE__*/normalizeClass(['truncate'])
69
- };
70
- function render$1(_ctx, _cache, $props, $setup, $data, $options) {
71
- return openBlock(), createElementBlock("div", mergeProps({
72
- ref: "root"
73
- }, _ctx.$attrs, {
74
- class: _ctx.rootStyles,
75
- selected: _ctx.selected ? '' : null,
76
- disabled: _ctx.disabled ? '' : null,
77
- onClick: _cache[0] || (_cache[0] = $event => _ctx.$emit('click', $event))
78
- }), [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default")])], 16 /* FULL_PROPS */, _hoisted_1);
79
- }
80
-
81
- script$1.render = render$1;
82
- script$1.__file = "src/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue";
83
-
84
- var SegmentedControlSize;
85
- (function (SegmentedControlSize) {
86
- SegmentedControlSize["M"] = "m";
87
- SegmentedControlSize["S"] = "s";
88
- })(SegmentedControlSize || (SegmentedControlSize = {}));
89
-
90
- const SegmentedControlRoot = [
91
- // Layout
92
- 'grid', 'grid-flow-col', 'auto-cols-fr',
93
- // Shape
94
- 'rounded-md',
95
- // Spacing
96
- 'px-[2px]', 'py-[2px]',
97
- // Theme
98
- 'theme-background-surface-variant', 'dark:theme-background-surface-variant-dark'];
99
- const SegmentedControlRootSizes = {
100
- 'm': [],
101
- 's': []
102
- };
103
-
104
- var script = defineComponent({
105
- name: 'OrSegmentedControl',
106
- components: {
107
- OrSegmentedControlItem: script$1
108
- },
109
- inheritAttrs: false,
110
- props: {
111
- options: {
112
- type: Array,
113
- default: []
114
- },
115
- modelValue: {
116
- type: String,
117
- default: undefined
118
- },
119
- value: {
120
- type: String,
121
- default: undefined
122
- },
123
- size: {
124
- type: String,
125
- default: SegmentedControlSize.M
126
- },
127
- disabled: {
128
- type: Boolean,
129
- default: false
130
- }
131
- },
132
- emits: ['update:modelValue', 'input'],
133
- expose: ['root'],
134
- setup(props, context) {
135
- // Refs
136
- const root = ref();
137
- // Styles
138
- const classAttribute = useClassAttribute();
139
- const rootStyles = computed(() => ['or-segmented-control', ...SegmentedControlRoot, ...SegmentedControlRootSizes[props.size], classAttribute.value]);
140
- // State
141
- const proxyModelValue = computed({
142
- get: () => {
143
- var _a;
144
- return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.value; // TODO: Remove Vue 2 fallback
145
- },
146
-
147
- set: value => {
148
- context.emit('input', value);
149
- context.emit('update:modelValue', value);
150
- }
151
- });
152
- return {
153
- root,
154
- rootStyles,
155
- proxyModelValue
156
- };
157
- }
158
- });
159
-
160
- function render(_ctx, _cache, $props, $setup, $data, $options) {
161
- const _component_OrSegmentedControlItem = resolveComponent("OrSegmentedControlItem");
162
- return openBlock(), createElementBlock("div", mergeProps({
163
- ref: "root"
164
- }, _ctx.$attrs, {
165
- class: _ctx.rootStyles
166
- }), [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, option => {
167
- return openBlock(), createBlock(_component_OrSegmentedControlItem, {
168
- key: option.value,
169
- size: _ctx.size,
170
- selected: option.value === _ctx.proxyModelValue,
171
- disabled: _ctx.disabled,
172
- onClick: withModifiers($event => _ctx.proxyModelValue = option.value, ["stop"])
173
- }, {
174
- default: withCtx(() => [createTextVNode(toDisplayString(option.label), 1 /* TEXT */)]),
175
-
176
- _: 2 /* DYNAMIC */
177
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["size", "selected", "disabled", "onClick"]);
178
- }), 128 /* KEYED_FRAGMENT */))], 16 /* FULL_PROPS */);
179
- }
180
-
181
- script.render = render;
182
- script.__file = "src/components/or-segmented-control-v3/OrSegmentedControl.vue";
183
-
184
- export { SegmentedControlSize as S, script as s };
@@ -1,12 +0,0 @@
1
- import { Meta, StoryFn } from '@storybook/vue3';
2
- declare const _default: Meta<import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<unknown>, import("@vue/composition-api").MethodOptions, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>, import("@vue/composition-api").ExtractPropTypes<import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
3
- [x: string]: ((...args: any[]) => any) | null;
4
- } | string[], {} & {}, {
5
- [x: number]: string;
6
- } | {}, true>)>;
7
- export default _default;
8
- export declare const Base: StoryFn<import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<unknown>, import("@vue/composition-api").MethodOptions, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>, import("@vue/composition-api").ExtractPropTypes<import("@vue/composition-api").ComponentPropsOptions<import("@vue/composition-api").Data>>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
9
- [x: string]: ((...args: any[]) => any) | null;
10
- } | string[], {} & {}, {
11
- [x: number]: string;
12
- } | {}, true>)>;
@@ -1,77 +0,0 @@
1
- import { PropType } from 'vue-demi';
2
- import { SegmentedControlSize } from './props';
3
- import { SegmentedControlOption } from './types';
4
- declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
5
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
6
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
7
- proxyModelValue: import("@vue/composition-api").WritableComputedRef<string>;
8
- }> & import("@vue/composition-api").Data, {}, {}, {
9
- options: {
10
- type: PropType<SegmentedControlOption[]>;
11
- default: SegmentedControlOption[];
12
- };
13
- modelValue: {
14
- type: StringConstructor;
15
- default: undefined;
16
- };
17
- value: {
18
- type: StringConstructor;
19
- default: undefined;
20
- };
21
- size: {
22
- type: PropType<SegmentedControlSize>;
23
- default: SegmentedControlSize;
24
- };
25
- disabled: {
26
- type: BooleanConstructor;
27
- default: boolean;
28
- };
29
- }, import("@vue/composition-api").ExtractPropTypes<{
30
- options: {
31
- type: PropType<SegmentedControlOption[]>;
32
- default: SegmentedControlOption[];
33
- };
34
- modelValue: {
35
- type: StringConstructor;
36
- default: undefined;
37
- };
38
- value: {
39
- type: StringConstructor;
40
- default: undefined;
41
- };
42
- size: {
43
- type: PropType<SegmentedControlSize>;
44
- default: SegmentedControlSize;
45
- };
46
- disabled: {
47
- type: BooleanConstructor;
48
- default: boolean;
49
- };
50
- }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
51
- options: SegmentedControlOption[];
52
- modelValue: string;
53
- value: string;
54
- size: SegmentedControlSize;
55
- disabled: boolean;
56
- } & {} & {
57
- [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
58
- }, import("@vue/composition-api").ShallowUnwrapRef<{
59
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
60
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
61
- proxyModelValue: import("@vue/composition-api").WritableComputedRef<string>;
62
- }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
63
- options: SegmentedControlOption[];
64
- modelValue: string;
65
- value: string;
66
- size: SegmentedControlSize;
67
- disabled: boolean;
68
- } & {} & {
69
- [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
70
- }, {
71
- options: SegmentedControlOption[];
72
- modelValue: string;
73
- value: string;
74
- size: SegmentedControlSize;
75
- disabled: boolean;
76
- }, true>);
77
- export default _default;
@@ -1,47 +0,0 @@
1
- import { PropType } from 'vue-demi';
2
- import { SegmentedControlSize } from '../../props';
3
- declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
4
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
5
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
6
- }> & import("@vue/composition-api").Data, {}, {}, {
7
- size: {
8
- type: PropType<SegmentedControlSize>;
9
- required: true;
10
- };
11
- selected: {
12
- type: BooleanConstructor;
13
- default: boolean;
14
- };
15
- disabled: {
16
- type: BooleanConstructor;
17
- default: boolean;
18
- };
19
- }, import("@vue/composition-api").ExtractPropTypes<{
20
- size: {
21
- type: PropType<SegmentedControlSize>;
22
- required: true;
23
- };
24
- selected: {
25
- type: BooleanConstructor;
26
- default: boolean;
27
- };
28
- disabled: {
29
- type: BooleanConstructor;
30
- default: boolean;
31
- };
32
- }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
33
- size: SegmentedControlSize;
34
- selected: boolean;
35
- disabled: boolean;
36
- } & {}, import("@vue/composition-api").ShallowUnwrapRef<{
37
- root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
38
- rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
39
- }>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
40
- size: SegmentedControlSize;
41
- selected: boolean;
42
- disabled: boolean;
43
- } & {}, {
44
- selected: boolean;
45
- disabled: boolean;
46
- }, true>);
47
- export default _default;
@@ -1,3 +0,0 @@
1
- import { SegmentedControlSize } from '../../props';
2
- export declare const SegmentedControlItemRoot: string[];
3
- export declare const SegmentedControlItemRootSizes: Record<SegmentedControlSize, string[]>;
@@ -1,3 +0,0 @@
1
- export { default as OrSegmentedControlV3 } from './OrSegmentedControl.vue';
2
- export * from './props';
3
- export * from './types';
@@ -1,4 +0,0 @@
1
- export declare enum SegmentedControlSize {
2
- M = "m",
3
- S = "s"
4
- }
@@ -1,3 +0,0 @@
1
- import { SegmentedControlSize } from './props';
2
- export declare const SegmentedControlRoot: string[];
3
- export declare const SegmentedControlRootSizes: Record<SegmentedControlSize, string[]>;
@@ -1,4 +0,0 @@
1
- export interface SegmentedControlOption {
2
- value: string;
3
- label: string;
4
- }
@@ -1,3 +0,0 @@
1
- export { u as useResponsive } from './useResponsive-a02e95b7.js';
2
- import '@vueuse/core';
3
- import 'vue-demi';
@@ -1,7 +0,0 @@
1
- import { DocsPage } from '@storybook/addon-docs';
2
-
3
- ```ts
4
- import { OrSegmentedControlV3 as OrSegmentedControl } from '@onereach/ui-components';
5
- ```
6
-
7
- <DocsPage />
@@ -1,106 +0,0 @@
1
- import { action } from '@storybook/addon-actions';
2
- import { Meta, StoryFn } from '@storybook/vue3';
3
- import { ref, watch } from 'vue-demi';
4
- import OrSegmentedControlDocs from './OrSegmentedControl.docs.mdx';
5
- import OrSegmentedControl from './OrSegmentedControl.vue';
6
- import { SegmentedControlSize } from './props';
7
- import { SegmentedControlOption } from './types';
8
-
9
- export default {
10
- title: 'Components/Forms/Segmented Control',
11
- component: OrSegmentedControl,
12
-
13
- argTypes: {
14
- // Props
15
- options: {
16
- control: { type: 'object' },
17
- },
18
-
19
- modelValue: {
20
- control: { type: 'text' },
21
- },
22
-
23
- value: { // TODO: Remove Vue 2 fallback
24
- table: { disable: true },
25
- },
26
-
27
- size: {
28
- control: { type: 'select' },
29
- options: Object.values(SegmentedControlSize),
30
- },
31
-
32
- disabled: {
33
- control: { type: 'boolean' },
34
- },
35
-
36
- // Events
37
- 'update:modelValue': {
38
- table: { disable: true },
39
- },
40
-
41
- input: {
42
- table: { disable: true },
43
- },
44
- },
45
-
46
- parameters: {
47
- layout: 'centered',
48
-
49
- docs: {
50
- page: OrSegmentedControlDocs,
51
- },
52
-
53
- design: {
54
- type: 'figma',
55
- url: 'https://www.figma.com/file/o7DdkaznUW2PtX4wiSuhhQ/Core?node-id=410%3A2097&t=7N93DAotOYMOX2kx-1',
56
- },
57
- },
58
- } as Meta<typeof OrSegmentedControl>;
59
-
60
- const Template: StoryFn<typeof OrSegmentedControl> = (args) => ({
61
- components: {
62
- OrSegmentedControl,
63
- },
64
-
65
- setup() {
66
- // State
67
- const model = ref<string>();
68
-
69
- // Effects
70
- watch(model, (value) => {
71
- console.debug(value);
72
- });
73
-
74
- return {
75
- args,
76
- model,
77
- onUpdateModelValue: action('update:modelValue'),
78
- onInput: action('input'),
79
- };
80
- },
81
-
82
- template: `
83
- <OrSegmentedControl
84
- v-model="model"
85
- v-bind="args"
86
- @update:modelValue="onUpdateModelValue"
87
- @input="onInput"
88
- />
89
- `,
90
- });
91
-
92
- export const Base = Template.bind({});
93
-
94
- Base.args = {
95
- // Props
96
- options: Array.from<string, SegmentedControlOption>([
97
- 'Alfa',
98
- 'Bravo',
99
- 'Charlie',
100
- 'Delta',
101
- 'Echo',
102
- ], (item) => ({
103
- value: item.toLowerCase(),
104
- label: item,
105
- })),
106
- };