@onereach/ui-components 2.63.0-beta.1896.0 → 2.63.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.
- package/dist/v2/{OrConfirm-8d149ece.js → OrConfirm-24e2a1a2.js} +1 -1
- package/dist/v2/{OrIconButton-5883eba0.js → OrIconButton-2088a37f.js} +1 -1
- package/dist/v2/{OrInlineInput-16a343c1.js → OrInlineInput-f00cba5e.js} +6 -5
- package/dist/v2/{OrInlineTextarea-f154bdf5.js → OrInlineTextarea-75de33d0.js} +6 -5
- package/dist/v2/{OrInput-4a50fe57.js → OrInput-24028f23.js} +7 -5
- package/dist/v2/{OrModal-64c5ae2e.js → OrModal-a1452b11.js} +1 -1
- package/dist/v2/{OrNotification-9c164908.js → OrNotification-ac420f39.js} +1 -1
- package/dist/v2/{OrSearch-a247f072.js → OrSearch-978a3a6e.js} +1 -1
- package/dist/v2/OrSegmentedControl-17df63b8.js +236 -0
- package/dist/v2/{OrSelect-bb223cce.js → OrSelect-c6d0a69e.js} +13 -33
- package/dist/v2/{OrTabs-b4a9740b.js → OrTabs-f2a60b41.js} +1 -1
- package/dist/v2/{OrTag-ab03c4f7.js → OrTag-1ced4e58.js} +1 -1
- package/dist/v2/{OrTooltip-caeac590.js → OrTooltip-afe7030b.js} +33 -3
- package/dist/v2/components/index.d.ts +1 -0
- package/dist/v2/components/{or-rich-text-editor-v3/OrRichTextEditor.stories3.d.ts → or-segmented-control-v3/OrSegmentedControl.stories3.d.ts} +1 -1
- package/dist/v2/components/or-segmented-control-v3/OrSegmentedControl.vue.d.ts +77 -0
- package/dist/v2/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue.d.ts +47 -0
- package/dist/v2/components/or-segmented-control-v3/components/or-segmented-control-item/styles.d.ts +3 -0
- package/dist/v2/components/or-segmented-control-v3/index.d.ts +3 -0
- package/dist/v2/components/or-segmented-control-v3/props.d.ts +4 -0
- package/dist/v2/components/or-segmented-control-v3/styles.d.ts +3 -0
- package/dist/v2/components/or-segmented-control-v3/types.d.ts +4 -0
- package/dist/v2/components/or-select-v3/OrSelect.vue.d.ts +2 -2
- package/dist/v2/components/or-tooltip-v3/styles.d.ts +2 -0
- package/dist/v2/directives/index.d.ts +2 -0
- package/dist/v2/dropdown-open-0d314aa4.js +28 -0
- package/dist/v2/index.d.ts +1 -0
- package/dist/v2/index.js +15 -13
- package/dist/v2/index2.js +15 -13
- package/dist/v2/index20.js +4 -4
- package/dist/v2/index31.js +2 -2
- package/dist/v2/index34.js +3 -3
- package/dist/v2/index36.js +3 -3
- package/dist/v2/index38.js +3 -3
- package/dist/v2/index50.js +3 -3
- package/dist/v2/index52.js +3 -3
- package/dist/v2/index62.js +12 -306
- package/dist/v2/index63.js +2 -19
- package/dist/v2/index65.js +6 -5
- package/dist/v2/index78.js +1 -1
- package/dist/v2/index80.js +3 -3
- package/dist/v2/index88.js +3 -3
- package/dist/v2/index91.js +1 -1
- package/dist/v2/index92.js +1 -6
- package/dist/v2/index93.js +5 -1
- package/dist/v2/index94.js +3 -0
- package/dist/v2/{types-fb93ea4e.js → types-89aad7fb.js} +1 -1
- package/dist/v3/{OrConfirm-456ddee1.js → OrConfirm-371630a4.js} +1 -1
- package/dist/v3/{OrIconButton-b8066b5d.js → OrIconButton-5fb3a9aa.js} +1 -1
- package/dist/v3/{OrInlineInput-280768ba.js → OrInlineInput-bac4abdd.js} +4 -3
- package/dist/v3/{OrInlineTextarea-0f63f344.js → OrInlineTextarea-d1ec1bba.js} +4 -3
- package/dist/v3/{OrInput-3eef7945.js → OrInput-256d2530.js} +6 -3
- package/dist/v3/{OrModal-f67d37d3.js → OrModal-3a43b7e7.js} +1 -1
- package/dist/v3/{OrNotification-fefa1cb4.js → OrNotification-433d16f7.js} +1 -1
- package/dist/v3/{OrSearch-15a70678.js → OrSearch-375eab55.js} +1 -1
- package/dist/v3/OrSegmentedControl-2bbc0f22.js +184 -0
- package/dist/v3/{OrSelect-63ada65d.js → OrSelect-52cfb10d.js} +12 -32
- package/dist/v3/{OrTabs-194ca950.js → OrTabs-ac0be933.js} +1 -1
- package/dist/v3/{OrTag-144b4ab8.js → OrTag-deaff080.js} +1 -1
- package/dist/v3/{OrTooltip-30e05f9e.js → OrTooltip-36c6728c.js} +33 -3
- package/dist/v3/components/index.d.ts +1 -0
- package/dist/v3/components/{or-rich-text-editor-v3/OrRichTextEditor.stories3.d.ts → or-segmented-control-v3/OrSegmentedControl.stories3.d.ts} +1 -1
- package/dist/v3/components/or-segmented-control-v3/OrSegmentedControl.vue.d.ts +77 -0
- package/dist/v3/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue.d.ts +47 -0
- package/dist/v3/components/or-segmented-control-v3/components/or-segmented-control-item/styles.d.ts +3 -0
- package/dist/v3/components/or-segmented-control-v3/index.d.ts +3 -0
- package/dist/v3/components/or-segmented-control-v3/props.d.ts +4 -0
- package/dist/v3/components/or-segmented-control-v3/styles.d.ts +3 -0
- package/dist/v3/components/or-segmented-control-v3/types.d.ts +4 -0
- package/dist/v3/components/or-select-v3/OrSelect.vue.d.ts +2 -2
- package/dist/v3/components/or-tooltip-v3/styles.d.ts +2 -0
- package/dist/v3/directives/index.d.ts +2 -0
- package/dist/v3/dropdown-open-0d314aa4.js +28 -0
- package/dist/v3/index.d.ts +1 -0
- package/dist/v3/index.js +15 -13
- package/dist/v3/index2.js +15 -13
- package/dist/v3/index20.js +4 -4
- package/dist/v3/index31.js +2 -2
- package/dist/v3/index34.js +3 -3
- package/dist/v3/index36.js +3 -3
- package/dist/v3/index38.js +3 -3
- package/dist/v3/index50.js +3 -3
- package/dist/v3/index52.js +3 -3
- package/dist/v3/index62.js +12 -280
- package/dist/v3/index63.js +2 -18
- package/dist/v3/index65.js +6 -5
- package/dist/v3/index78.js +1 -1
- package/dist/v3/index80.js +3 -3
- package/dist/v3/index88.js +3 -3
- package/dist/v3/index91.js +1 -1
- package/dist/v3/index92.js +1 -6
- package/dist/v3/index93.js +5 -1
- package/dist/v3/index94.js +3 -0
- package/dist/v3/{types-a2a8f948.js → types-d5d4ab32.js} +1 -1
- package/package.json +4 -9
- package/src/components/index.ts +1 -0
- package/src/components/or-avatar-v3/OrAvatar.docs.mdx +4 -0
- package/src/components/or-bottom-sheet-v3/OrBottomSheet.docs.mdx +4 -0
- package/src/components/or-button-v3/OrButton.docs.mdx +4 -0
- package/src/components/or-card-v3/OrCard.docs.mdx +4 -0
- package/src/components/or-checkbox-v3/OrCheckbox.docs.mdx +4 -0
- package/src/components/or-checkbox-v3/OrCheckbox.stories3.ts +1 -1
- package/src/components/or-confirm-v3/OrConfirm.docs.mdx +4 -0
- package/src/components/or-error-tag-v3/OrErrorTag.docs.mdx +5 -0
- package/src/components/or-error-v3/OrError.docs.mdx +4 -0
- package/src/components/or-expansion-panel-v3/OrExpansionPanel.docs.mdx +4 -0
- package/src/components/or-fab-v3/OrFab.docs.mdx +4 -0
- package/src/components/or-hint-v3/OrHint.docs.mdx +4 -0
- package/src/components/or-icon-button-v3/OrIconButton.docs.mdx +4 -0
- package/src/components/or-icon-v3/OrIcon.docs.mdx +4 -0
- package/src/components/or-inline-input-v3/OrInlineInput.docs.mdx +4 -0
- package/src/components/or-inline-input-v3/OrInlineInput.vue +2 -2
- package/src/components/or-inline-textarea-v3/OrInlineTextarea.docs.mdx +4 -0
- package/src/components/or-inline-textarea-v3/OrInlineTextarea.vue +2 -2
- package/src/components/or-input-v3/OrInput.docs.mdx +4 -0
- package/src/components/or-input-v3/OrInput.vue +21 -19
- package/src/components/or-label-v3/OrLabel.docs.mdx +4 -0
- package/src/components/or-link-v3/OrLink.docs.mdx +4 -0
- package/src/components/or-loader-v3/OrLoader.docs.mdx +4 -0
- package/src/components/or-menu-item-v3/OrMenuItem.docs.mdx +4 -0
- package/src/components/or-menu-v3/OrMenu.docs.mdx +4 -0
- package/src/components/or-modal-v3/OrModal.docs.mdx +4 -0
- package/src/components/or-notification-v3/OrNotification.docs.mdx +4 -0
- package/src/components/or-overlay-v3/OrOverlay.docs.mdx +4 -0
- package/src/components/or-popover-v3/OrPopover.docs.mdx +4 -0
- package/src/components/or-progress-v3/OrProgress.docs.mdx +4 -0
- package/src/components/or-radio-v3/OrRadio.docs.mdx +4 -0
- package/src/components/or-radio-v3/OrRadio.stories3.ts +1 -1
- package/src/components/or-search-v3/OrSearch.docs.mdx +4 -0
- package/src/components/or-segmented-control-v3/OrSegmentedControl.docs.mdx +7 -0
- package/src/components/or-segmented-control-v3/OrSegmentedControl.stories3.ts +106 -0
- package/src/components/or-segmented-control-v3/OrSegmentedControl.vue +107 -0
- package/src/components/or-segmented-control-v3/components/or-segmented-control-item/OrSegmentedControlItem.vue +64 -0
- package/src/components/or-segmented-control-v3/components/or-segmented-control-item/styles.ts +50 -0
- package/src/components/or-segmented-control-v3/index.ts +3 -0
- package/src/components/or-segmented-control-v3/props.ts +4 -0
- package/src/components/or-segmented-control-v3/styles.ts +24 -0
- package/src/components/or-segmented-control-v3/types.ts +4 -0
- package/src/components/or-select-v3/OrSelect.docs.mdx +4 -0
- package/src/components/or-select-v3/OrSelect.vue +9 -6
- package/src/components/or-sidebar-v3/OrSidebar.docs.mdx +4 -0
- package/src/components/or-skeleton-v3/OrSkeleton.docs.mdx +8 -0
- package/src/components/or-switch-v3/OrSwitch.docs.mdx +4 -0
- package/src/components/or-switch-v3/OrSwitch.stories3.ts +1 -1
- package/src/components/or-tab-v3/OrTab.docs.mdx +4 -0
- package/src/components/or-tabs-v3/OrTabs.docs.mdx +4 -0
- package/src/components/or-tabs-v3/OrTabs.stories3.ts +9 -4
- package/src/components/or-tabs-v3/OrTabs.vue +1 -1
- package/src/components/or-tag-v3/OrTag.docs.mdx +4 -0
- package/src/components/or-teleport-v3/OrTeleport.docs.mdx +4 -0
- package/src/components/or-text-v3/OrText.docs.mdx +4 -0
- package/src/components/or-textarea-v3/OrTextarea.docs.mdx +4 -0
- package/src/components/or-tooltip-v3/OrTooltip.docs.mdx +3 -0
- package/src/components/or-tooltip-v3/OrTooltip.vue +3 -2
- package/src/components/or-tooltip-v3/styles.ts +55 -0
- package/src/directives/index.ts +2 -0
- package/src/hooks/useClassAttribute.ts +1 -1
- package/src/index.ts +1 -0
- package/dist/v2/components/or-rich-text-editor-v3/OrRichTextEditor.vue.d.ts +0 -111
- package/dist/v2/components/or-rich-text-editor-v3/index.d.ts +0 -1
- package/dist/v2/components/or-rich-text-editor-v3/styles.d.ts +0 -7
- package/dist/v3/components/or-rich-text-editor-v3/OrRichTextEditor.vue.d.ts +0 -111
- package/dist/v3/components/or-rich-text-editor-v3/index.d.ts +0 -1
- package/dist/v3/components/or-rich-text-editor-v3/styles.d.ts +0 -7
- package/src/components/or-rich-text-editor-v3/OrRichTextEditor.docs.mdx +0 -16
- package/src/components/or-rich-text-editor-v3/OrRichTextEditor.stories3.ts +0 -57
- package/src/components/or-rich-text-editor-v3/OrRichTextEditor.vue +0 -295
- package/src/components/or-rich-text-editor-v3/index.ts +0 -1
- package/src/components/or-rich-text-editor-v3/styles.ts +0 -71
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed, watch } from 'vue-demi';
|
|
2
2
|
import { _ as __vue_component__$2, a as ButtonColor } from './OrButton-eb895669.js';
|
|
3
3
|
import { _ as __vue_component__$1 } from './OrOverlay-4838a9b0.js';
|
|
4
|
-
import { _ as __vue_component__$3 } from './OrInput-
|
|
4
|
+
import { _ as __vue_component__$3 } from './OrInput-24028f23.js';
|
|
5
5
|
import { useMagicKeys, whenever } from '@vueuse/core';
|
|
6
6
|
import { logicAnd } from '@vueuse/math';
|
|
7
7
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
@@ -2,7 +2,7 @@ import { defineComponent, ref, computed } from 'vue-demi';
|
|
|
2
2
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
3
|
import '@vueuse/core';
|
|
4
4
|
import { _ as __vue_component__$1 } from './OrIcon-124f3bad.js';
|
|
5
|
-
import { _ as __vue_component__$2 } from './OrTooltip-
|
|
5
|
+
import { _ as __vue_component__$2 } from './OrTooltip-afe7030b.js';
|
|
6
6
|
import './OrPopover-9080fc00.js';
|
|
7
7
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
8
8
|
|
|
@@ -3,7 +3,7 @@ import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
|
3
3
|
import '@vueuse/core';
|
|
4
4
|
import { _ as __vue_component__$1 } from './OrError-be656098.js';
|
|
5
5
|
import { _ as __vue_component__$2 } from './OrHint-44356417.js';
|
|
6
|
-
import { _ as __vue_component__$3 } from './OrIconButton-
|
|
6
|
+
import { _ as __vue_component__$3 } from './OrIconButton-2088a37f.js';
|
|
7
7
|
import { _ as __vue_component__$4, I as InlineInputBoxSize } from './OrInlineInputBox-6a15ea2b.js';
|
|
8
8
|
import { s as styleInject } from './style-inject.es-4c6f2515.js';
|
|
9
9
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
@@ -129,14 +129,15 @@ var script = defineComponent({
|
|
|
129
129
|
activated.value = false;
|
|
130
130
|
}
|
|
131
131
|
function reset() {
|
|
132
|
+
var _a;
|
|
132
133
|
if (draftModelValue.value !== proxyModelValue.value) {
|
|
133
|
-
draftModelValue.value = proxyModelValue.value;
|
|
134
|
+
draftModelValue.value = (_a = proxyModelValue.value) !== null && _a !== void 0 ? _a : '';
|
|
134
135
|
}
|
|
135
136
|
activated.value = false;
|
|
136
137
|
}
|
|
137
138
|
// Effects
|
|
138
139
|
watch(proxyModelValue, value => {
|
|
139
|
-
draftModelValue.value = value;
|
|
140
|
+
draftModelValue.value = value !== null && value !== void 0 ? value : '';
|
|
140
141
|
}, {
|
|
141
142
|
immediate: true
|
|
142
143
|
});
|
|
@@ -160,7 +161,7 @@ var script = defineComponent({
|
|
|
160
161
|
}
|
|
161
162
|
});
|
|
162
163
|
|
|
163
|
-
var css_248z = "input[data-v-
|
|
164
|
+
var css_248z = "input[data-v-a3435312]{min-width:0;background:0 0;outline:0}input[type=number][data-v-a3435312]::-webkit-inner-spin-button{display:none}input[type=search][data-v-a3435312]::-webkit-search-cancel-button{display:none}";
|
|
164
165
|
styleInject(css_248z);
|
|
165
166
|
|
|
166
167
|
/* script */
|
|
@@ -333,7 +334,7 @@ var __vue_staticRenderFns__ = [];
|
|
|
333
334
|
/* style */
|
|
334
335
|
const __vue_inject_styles__ = undefined;
|
|
335
336
|
/* scoped */
|
|
336
|
-
const __vue_scope_id__ = "data-v-
|
|
337
|
+
const __vue_scope_id__ = "data-v-a3435312";
|
|
337
338
|
/* module identifier */
|
|
338
339
|
const __vue_module_identifier__ = undefined;
|
|
339
340
|
/* functional template */
|
|
@@ -3,7 +3,7 @@ import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
|
3
3
|
import '@vueuse/core';
|
|
4
4
|
import { _ as __vue_component__$1 } from './OrError-be656098.js';
|
|
5
5
|
import { _ as __vue_component__$2 } from './OrHint-44356417.js';
|
|
6
|
-
import { _ as __vue_component__$3 } from './OrIconButton-
|
|
6
|
+
import { _ as __vue_component__$3 } from './OrIconButton-2088a37f.js';
|
|
7
7
|
import { _ as __vue_component__$4 } from './OrInlineInputBox-6a15ea2b.js';
|
|
8
8
|
import { s as styleInject } from './style-inject.es-4c6f2515.js';
|
|
9
9
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
@@ -115,14 +115,15 @@ var script = defineComponent({
|
|
|
115
115
|
activated.value = false;
|
|
116
116
|
}
|
|
117
117
|
function reset() {
|
|
118
|
+
var _a;
|
|
118
119
|
if (draftModelValue.value !== proxyModelValue.value) {
|
|
119
|
-
draftModelValue.value = proxyModelValue.value;
|
|
120
|
+
draftModelValue.value = (_a = proxyModelValue.value) !== null && _a !== void 0 ? _a : '';
|
|
120
121
|
}
|
|
121
122
|
activated.value = false;
|
|
122
123
|
}
|
|
123
124
|
// Effects
|
|
124
125
|
watch(proxyModelValue, value => {
|
|
125
|
-
draftModelValue.value = value;
|
|
126
|
+
draftModelValue.value = value !== null && value !== void 0 ? value : '';
|
|
126
127
|
}, {
|
|
127
128
|
immediate: true
|
|
128
129
|
});
|
|
@@ -146,7 +147,7 @@ var script = defineComponent({
|
|
|
146
147
|
}
|
|
147
148
|
});
|
|
148
149
|
|
|
149
|
-
var css_248z = "textarea[data-v-
|
|
150
|
+
var css_248z = "textarea[data-v-314d21b0]{min-width:0;background:0 0;outline:0}";
|
|
150
151
|
styleInject(css_248z);
|
|
151
152
|
|
|
152
153
|
/* script */
|
|
@@ -245,7 +246,7 @@ var __vue_staticRenderFns__ = [];
|
|
|
245
246
|
/* style */
|
|
246
247
|
const __vue_inject_styles__ = undefined;
|
|
247
248
|
/* scoped */
|
|
248
|
-
const __vue_scope_id__ = "data-v-
|
|
249
|
+
const __vue_scope_id__ = "data-v-314d21b0";
|
|
249
250
|
/* module identifier */
|
|
250
251
|
const __vue_module_identifier__ = undefined;
|
|
251
252
|
/* functional template */
|
|
@@ -3,7 +3,7 @@ import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
|
3
3
|
import '@vueuse/core';
|
|
4
4
|
import { _ as __vue_component__$1 } from './OrError-be656098.js';
|
|
5
5
|
import { _ as __vue_component__$2 } from './OrHint-44356417.js';
|
|
6
|
-
import { _ as __vue_component__$4 } from './OrIconButton-
|
|
6
|
+
import { _ as __vue_component__$4 } from './OrIconButton-2088a37f.js';
|
|
7
7
|
import { _ as __vue_component__$3 } from './OrIcon-124f3bad.js';
|
|
8
8
|
import { _ as __vue_component__$5, a as InputBoxSize } from './OrInputBox-208dceac.js';
|
|
9
9
|
import { _ as __vue_component__$6 } from './OrLabel-5670468e.js';
|
|
@@ -143,7 +143,7 @@ var script = defineComponent({
|
|
|
143
143
|
}
|
|
144
144
|
});
|
|
145
145
|
|
|
146
|
-
var css_248z = "input[data-v-
|
|
146
|
+
var css_248z = "input[data-v-61c8b450]{min-width:0;background:0 0;outline:0}input[type=number][data-v-61c8b450]::-webkit-inner-spin-button{display:none}input[type=search][data-v-61c8b450]::-webkit-search-cancel-button{display:none}";
|
|
147
147
|
styleInject(css_248z);
|
|
148
148
|
|
|
149
149
|
/* script */
|
|
@@ -302,7 +302,9 @@ var __vue_render__ = function () {
|
|
|
302
302
|
_vm.proxyModelValue = $event.target.value;
|
|
303
303
|
}
|
|
304
304
|
}
|
|
305
|
-
}, 'input', _vm.$attrs, false)), _vm._v(" "),
|
|
305
|
+
}, 'input', _vm.$attrs, false)), _vm._v(" "), _c('div', {
|
|
306
|
+
class: ['-m-xs', 'ml-none']
|
|
307
|
+
}, [_vm.type === 'password' ? [_c('OrIconButton', {
|
|
306
308
|
attrs: {
|
|
307
309
|
"icon": {
|
|
308
310
|
icon: _vm.disclosed ? 'visibility_off' : 'visibility',
|
|
@@ -334,7 +336,7 @@ var __vue_render__ = function () {
|
|
|
334
336
|
"icon": 'search',
|
|
335
337
|
"variant": 'outlined'
|
|
336
338
|
}
|
|
337
|
-
})]] : _vm._e()], 2), _vm._v(" "), !_vm.invalid ? [_c('OrHint', {
|
|
339
|
+
})]] : _vm._e()], 2)]), _vm._v(" "), !_vm.invalid ? [_c('OrHint', {
|
|
338
340
|
attrs: {
|
|
339
341
|
"disabled": _vm.disabled
|
|
340
342
|
},
|
|
@@ -363,7 +365,7 @@ var __vue_staticRenderFns__ = [];
|
|
|
363
365
|
/* style */
|
|
364
366
|
const __vue_inject_styles__ = undefined;
|
|
365
367
|
/* scoped */
|
|
366
|
-
const __vue_scope_id__ = "data-v-
|
|
368
|
+
const __vue_scope_id__ = "data-v-61c8b450";
|
|
367
369
|
/* module identifier */
|
|
368
370
|
const __vue_module_identifier__ = undefined;
|
|
369
371
|
/* functional template */
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed, watch } from 'vue-demi';
|
|
2
2
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
3
|
import '@vueuse/core';
|
|
4
|
-
import { _ as __vue_component__$2 } from './OrIconButton-
|
|
4
|
+
import { _ as __vue_component__$2 } from './OrIconButton-2088a37f.js';
|
|
5
5
|
import { _ as __vue_component__$1 } from './OrOverlay-4838a9b0.js';
|
|
6
6
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
7
7
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed } from 'vue-demi';
|
|
2
2
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
3
|
import '@vueuse/core';
|
|
4
|
-
import { _ as __vue_component__$2 } from './OrIconButton-
|
|
4
|
+
import { _ as __vue_component__$2 } from './OrIconButton-2088a37f.js';
|
|
5
5
|
import { _ as __vue_component__$1 } from './OrIcon-124f3bad.js';
|
|
6
6
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
7
7
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed } from 'vue-demi';
|
|
2
2
|
import { debouncedWatch } from '@vueuse/core';
|
|
3
3
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
4
|
-
import { _ as __vue_component__$1 } from './OrInput-
|
|
4
|
+
import { _ as __vue_component__$1 } from './OrInput-24028f23.js';
|
|
5
5
|
import { a as InputBoxSize } from './OrInputBox-208dceac.js';
|
|
6
6
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
7
7
|
|
|
@@ -0,0 +1,236 @@
|
|
|
1
|
+
import { defineComponent, ref, computed } from 'vue-demi';
|
|
2
|
+
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
|
+
import '@vueuse/core';
|
|
4
|
+
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
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
|
+
/* script */
|
|
67
|
+
const __vue_script__$1 = script$1;
|
|
68
|
+
|
|
69
|
+
/* template */
|
|
70
|
+
var __vue_render__$1 = function () {
|
|
71
|
+
var _vm = this;
|
|
72
|
+
var _h = _vm.$createElement;
|
|
73
|
+
var _c = _vm._self._c || _h;
|
|
74
|
+
return _c('div', _vm._b({
|
|
75
|
+
ref: "root",
|
|
76
|
+
class: _vm.rootStyles,
|
|
77
|
+
attrs: {
|
|
78
|
+
"selected": _vm.selected ? '' : null,
|
|
79
|
+
"disabled": _vm.disabled ? '' : null
|
|
80
|
+
},
|
|
81
|
+
on: {
|
|
82
|
+
"click": function ($event) {
|
|
83
|
+
return _vm.$emit('click', $event);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
}, 'div', _vm.$attrs, false), [_c('div', {
|
|
87
|
+
class: ['truncate']
|
|
88
|
+
}, [_vm._t("default")], 2)]);
|
|
89
|
+
};
|
|
90
|
+
var __vue_staticRenderFns__$1 = [];
|
|
91
|
+
|
|
92
|
+
/* style */
|
|
93
|
+
const __vue_inject_styles__$1 = undefined;
|
|
94
|
+
/* scoped */
|
|
95
|
+
const __vue_scope_id__$1 = undefined;
|
|
96
|
+
/* module identifier */
|
|
97
|
+
const __vue_module_identifier__$1 = undefined;
|
|
98
|
+
/* functional template */
|
|
99
|
+
const __vue_is_functional_template__$1 = false;
|
|
100
|
+
/* style inject */
|
|
101
|
+
|
|
102
|
+
/* style inject SSR */
|
|
103
|
+
|
|
104
|
+
/* style inject shadow dom */
|
|
105
|
+
|
|
106
|
+
const __vue_component__$1 = /*#__PURE__*/normalizeComponent({
|
|
107
|
+
render: __vue_render__$1,
|
|
108
|
+
staticRenderFns: __vue_staticRenderFns__$1
|
|
109
|
+
}, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, false, undefined, undefined, undefined);
|
|
110
|
+
|
|
111
|
+
var SegmentedControlSize;
|
|
112
|
+
(function (SegmentedControlSize) {
|
|
113
|
+
SegmentedControlSize["M"] = "m";
|
|
114
|
+
SegmentedControlSize["S"] = "s";
|
|
115
|
+
})(SegmentedControlSize || (SegmentedControlSize = {}));
|
|
116
|
+
|
|
117
|
+
const SegmentedControlRoot = [
|
|
118
|
+
// Layout
|
|
119
|
+
'grid', 'grid-flow-col', 'auto-cols-fr',
|
|
120
|
+
// Shape
|
|
121
|
+
'rounded-md',
|
|
122
|
+
// Spacing
|
|
123
|
+
'px-[2px]', 'py-[2px]',
|
|
124
|
+
// Theme
|
|
125
|
+
'theme-background-surface-variant', 'dark:theme-background-surface-variant-dark'];
|
|
126
|
+
const SegmentedControlRootSizes = {
|
|
127
|
+
'm': [],
|
|
128
|
+
's': []
|
|
129
|
+
};
|
|
130
|
+
|
|
131
|
+
var script = defineComponent({
|
|
132
|
+
name: 'OrSegmentedControl',
|
|
133
|
+
components: {
|
|
134
|
+
OrSegmentedControlItem: __vue_component__$1
|
|
135
|
+
},
|
|
136
|
+
inheritAttrs: false,
|
|
137
|
+
props: {
|
|
138
|
+
options: {
|
|
139
|
+
type: Array,
|
|
140
|
+
default: []
|
|
141
|
+
},
|
|
142
|
+
modelValue: {
|
|
143
|
+
type: String,
|
|
144
|
+
default: undefined
|
|
145
|
+
},
|
|
146
|
+
value: {
|
|
147
|
+
type: String,
|
|
148
|
+
default: undefined
|
|
149
|
+
},
|
|
150
|
+
size: {
|
|
151
|
+
type: String,
|
|
152
|
+
default: SegmentedControlSize.M
|
|
153
|
+
},
|
|
154
|
+
disabled: {
|
|
155
|
+
type: Boolean,
|
|
156
|
+
default: false
|
|
157
|
+
}
|
|
158
|
+
},
|
|
159
|
+
emits: ['update:modelValue', 'input'],
|
|
160
|
+
expose: ['root'],
|
|
161
|
+
setup(props, context) {
|
|
162
|
+
// Refs
|
|
163
|
+
const root = ref();
|
|
164
|
+
// Styles
|
|
165
|
+
const classAttribute = useClassAttribute();
|
|
166
|
+
const rootStyles = computed(() => ['or-segmented-control', ...SegmentedControlRoot, ...SegmentedControlRootSizes[props.size], classAttribute.value]);
|
|
167
|
+
// State
|
|
168
|
+
const proxyModelValue = computed({
|
|
169
|
+
get: () => {
|
|
170
|
+
var _a;
|
|
171
|
+
return (_a = props.modelValue) !== null && _a !== void 0 ? _a : props.value; // TODO: Remove Vue 2 fallback
|
|
172
|
+
},
|
|
173
|
+
|
|
174
|
+
set: value => {
|
|
175
|
+
context.emit('input', value);
|
|
176
|
+
context.emit('update:modelValue', value);
|
|
177
|
+
}
|
|
178
|
+
});
|
|
179
|
+
return {
|
|
180
|
+
root,
|
|
181
|
+
rootStyles,
|
|
182
|
+
proxyModelValue
|
|
183
|
+
};
|
|
184
|
+
}
|
|
185
|
+
});
|
|
186
|
+
|
|
187
|
+
/* script */
|
|
188
|
+
const __vue_script__ = script;
|
|
189
|
+
|
|
190
|
+
/* template */
|
|
191
|
+
var __vue_render__ = function () {
|
|
192
|
+
var _vm = this;
|
|
193
|
+
var _h = _vm.$createElement;
|
|
194
|
+
var _c = _vm._self._c || _h;
|
|
195
|
+
return _c('div', _vm._b({
|
|
196
|
+
ref: "root",
|
|
197
|
+
class: _vm.rootStyles
|
|
198
|
+
}, 'div', _vm.$attrs, false), _vm._l(_vm.options, function (option) {
|
|
199
|
+
return _c('OrSegmentedControlItem', {
|
|
200
|
+
key: option.value,
|
|
201
|
+
attrs: {
|
|
202
|
+
"size": _vm.size,
|
|
203
|
+
"selected": option.value === _vm.proxyModelValue,
|
|
204
|
+
"disabled": _vm.disabled
|
|
205
|
+
},
|
|
206
|
+
on: {
|
|
207
|
+
"click": function ($event) {
|
|
208
|
+
$event.stopPropagation();
|
|
209
|
+
_vm.proxyModelValue = option.value;
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
}, [_vm._v("\n " + _vm._s(option.label) + "\n ")]);
|
|
213
|
+
}), 1);
|
|
214
|
+
};
|
|
215
|
+
var __vue_staticRenderFns__ = [];
|
|
216
|
+
|
|
217
|
+
/* style */
|
|
218
|
+
const __vue_inject_styles__ = undefined;
|
|
219
|
+
/* scoped */
|
|
220
|
+
const __vue_scope_id__ = undefined;
|
|
221
|
+
/* module identifier */
|
|
222
|
+
const __vue_module_identifier__ = undefined;
|
|
223
|
+
/* functional template */
|
|
224
|
+
const __vue_is_functional_template__ = false;
|
|
225
|
+
/* style inject */
|
|
226
|
+
|
|
227
|
+
/* style inject SSR */
|
|
228
|
+
|
|
229
|
+
/* style inject shadow dom */
|
|
230
|
+
|
|
231
|
+
const __vue_component__ = /*#__PURE__*/normalizeComponent({
|
|
232
|
+
render: __vue_render__,
|
|
233
|
+
staticRenderFns: __vue_staticRenderFns__
|
|
234
|
+
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
|
|
235
|
+
|
|
236
|
+
export { SegmentedControlSize as S, __vue_component__ as _ };
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { defineComponent, getCurrentInstance, ref, computed, onMounted, watch } from 'vue-demi';
|
|
2
|
+
import { D as DropdownClose, a as DropdownOpen } from './dropdown-open-0d314aa4.js';
|
|
2
3
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
4
|
import { u as useOverflow } from './useOverflow-ac506c65.js';
|
|
4
5
|
import '@vueuse/core';
|
|
@@ -8,38 +9,13 @@ import { _ as __vue_component__$3 } from './OrExpansionPanel-ce82a6fd.js';
|
|
|
8
9
|
import { _ as __vue_component__$4 } from './OrHint-44356417.js';
|
|
9
10
|
import { _ as __vue_component__$5 } from './OrIcon-124f3bad.js';
|
|
10
11
|
import { _ as __vue_component__$7, a as InputBoxSize } from './OrInputBox-208dceac.js';
|
|
11
|
-
import { _ as __vue_component__$6 } from './OrInput-
|
|
12
|
+
import { _ as __vue_component__$6 } from './OrInput-24028f23.js';
|
|
12
13
|
import { _ as __vue_component__$8 } from './OrLabel-5670468e.js';
|
|
13
14
|
import { _ as __vue_component__$9 } from './OrMenuItem-3a28db7b.js';
|
|
14
15
|
import { _ as __vue_component__$a } from './OrPopover-9080fc00.js';
|
|
15
|
-
import { _ as __vue_component__$b } from './OrTag-
|
|
16
|
+
import { _ as __vue_component__$b } from './OrTag-1ced4e58.js';
|
|
16
17
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
17
18
|
|
|
18
|
-
const created$1 = (element, binding) => {
|
|
19
|
-
element.addEventListener('keydown', event => {
|
|
20
|
-
event.preventDefault();
|
|
21
|
-
if (['Escape'].includes(event.key)) {
|
|
22
|
-
binding.value(event);
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
};
|
|
26
|
-
const DropdownClose = {
|
|
27
|
-
[isVue3 ? 'created' : 'bind']: created$1
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
const created = (element, binding) => {
|
|
31
|
-
element.addEventListener('keydown', event => {
|
|
32
|
-
event.preventDefault();
|
|
33
|
-
if (['Enter', ' '].includes(event.key)) {
|
|
34
|
-
binding.value(event);
|
|
35
|
-
}
|
|
36
|
-
});
|
|
37
|
-
element.addEventListener('click', binding.value);
|
|
38
|
-
};
|
|
39
|
-
const DropdownOpen = {
|
|
40
|
-
[isVue3 ? 'created' : 'bind']: created
|
|
41
|
-
};
|
|
42
|
-
|
|
43
19
|
const SelectRoot = [
|
|
44
20
|
// Layout
|
|
45
21
|
'flex', 'flex-col',
|
|
@@ -247,11 +223,15 @@ var script = defineComponent({
|
|
|
247
223
|
};
|
|
248
224
|
});
|
|
249
225
|
// Methods
|
|
250
|
-
function
|
|
226
|
+
function toggle() {
|
|
251
227
|
if (!readonly.value && !props.disabled) {
|
|
252
228
|
const popoverInstance = popover.value;
|
|
253
229
|
if (popoverInstance) {
|
|
254
|
-
|
|
230
|
+
if (popoverState.value === 'open') {
|
|
231
|
+
popoverInstance.close();
|
|
232
|
+
} else {
|
|
233
|
+
popoverInstance.open();
|
|
234
|
+
}
|
|
255
235
|
}
|
|
256
236
|
}
|
|
257
237
|
}
|
|
@@ -293,7 +273,7 @@ var script = defineComponent({
|
|
|
293
273
|
internalSearchOptions,
|
|
294
274
|
resolvedSearchOptions,
|
|
295
275
|
groupedOptions,
|
|
296
|
-
|
|
276
|
+
toggle,
|
|
297
277
|
close,
|
|
298
278
|
deselect,
|
|
299
279
|
innerItems,
|
|
@@ -331,8 +311,8 @@ var __vue_render__ = function () {
|
|
|
331
311
|
directives: [{
|
|
332
312
|
name: "dropdown-open",
|
|
333
313
|
rawName: "v-dropdown-open",
|
|
334
|
-
value: _vm.
|
|
335
|
-
expression: "
|
|
314
|
+
value: _vm.toggle,
|
|
315
|
+
expression: "toggle"
|
|
336
316
|
}, {
|
|
337
317
|
name: "dropdown-close",
|
|
338
318
|
rawName: "v-dropdown-close",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { defineComponent, ref, computed, watchPostEffect, unref } from 'vue-demi';
|
|
2
2
|
import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
3
3
|
import '@vueuse/core';
|
|
4
|
-
import { _ as __vue_component__$1 } from './OrIconButton-
|
|
4
|
+
import { _ as __vue_component__$1 } from './OrIconButton-2088a37f.js';
|
|
5
5
|
import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
|
|
6
6
|
|
|
7
7
|
var TagVariant;
|
|
@@ -11,11 +11,41 @@ const TooltipBody = [
|
|
|
11
11
|
// Box
|
|
12
12
|
'max-w-max', 'rounded-sm',
|
|
13
13
|
// Sizing
|
|
14
|
-
'px-sm', 'py-xs',
|
|
14
|
+
'mx-sm', 'my-sm', 'px-sm', 'py-xs',
|
|
15
15
|
// Typography
|
|
16
16
|
'typography-caption-regular',
|
|
17
17
|
// Theme
|
|
18
18
|
'bg-inverse-surface', 'dark:bg-inverse-surface-dark', 'text-inverse-on-surface', 'dark:text-inverse-on-surface-dark'];
|
|
19
|
+
const TooltipBodyPlacements = {
|
|
20
|
+
'top': [],
|
|
21
|
+
'top-start': [
|
|
22
|
+
// Sizing
|
|
23
|
+
'ml-none'],
|
|
24
|
+
'top-end': [
|
|
25
|
+
// Sizing
|
|
26
|
+
'mr-none'],
|
|
27
|
+
'bottom': [],
|
|
28
|
+
'bottom-start': [
|
|
29
|
+
// Sizing
|
|
30
|
+
'ml-none'],
|
|
31
|
+
'bottom-end': [
|
|
32
|
+
// Sizing
|
|
33
|
+
'mr-none'],
|
|
34
|
+
'left': [],
|
|
35
|
+
'left-start': [
|
|
36
|
+
// Sizing
|
|
37
|
+
'mt-none'],
|
|
38
|
+
'left-end': [
|
|
39
|
+
// Sizing
|
|
40
|
+
'mb-none'],
|
|
41
|
+
'right': [],
|
|
42
|
+
'right-start': [
|
|
43
|
+
// Sizing
|
|
44
|
+
'mt-none'],
|
|
45
|
+
'right-end': [
|
|
46
|
+
// Sizing
|
|
47
|
+
'mb-none']
|
|
48
|
+
};
|
|
19
49
|
|
|
20
50
|
var script = defineComponent({
|
|
21
51
|
name: 'OrTooltip',
|
|
@@ -35,7 +65,7 @@ var script = defineComponent({
|
|
|
35
65
|
},
|
|
36
66
|
emits: ['update:state'],
|
|
37
67
|
expose: ['root', 'open', 'close'],
|
|
38
|
-
setup() {
|
|
68
|
+
setup(props) {
|
|
39
69
|
// Refs
|
|
40
70
|
const root = ref();
|
|
41
71
|
const popover = ref();
|
|
@@ -46,7 +76,7 @@ var script = defineComponent({
|
|
|
46
76
|
// Styles
|
|
47
77
|
const classAttribute = useClassAttribute();
|
|
48
78
|
const rootStyles = computed(() => ['or-tooltip', ...TooltipRoot, classAttribute.value]);
|
|
49
|
-
const bodyStyles = computed(() => [...TooltipBody]);
|
|
79
|
+
const bodyStyles = computed(() => [...TooltipBody, ...TooltipBodyPlacements[props.placement]]);
|
|
50
80
|
// Methods
|
|
51
81
|
function open() {
|
|
52
82
|
const popoverInstance = popover.value;
|
|
@@ -58,6 +58,7 @@ export * from './or-radio';
|
|
|
58
58
|
export * from './or-radio-group';
|
|
59
59
|
export * from './or-radio-v3';
|
|
60
60
|
export * from './or-search-v3';
|
|
61
|
+
export * from './or-segmented-control-v3';
|
|
61
62
|
export * from './or-select';
|
|
62
63
|
export * from './or-select-v3';
|
|
63
64
|
export * from './or-sidebar';
|
|
@@ -5,7 +5,7 @@ declare const _default: Meta<import("vue").ComponentOptions<import("vue").defaul
|
|
|
5
5
|
[x: number]: string;
|
|
6
6
|
} | {}, true>)>;
|
|
7
7
|
export default _default;
|
|
8
|
-
export declare const
|
|
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
9
|
[x: string]: ((...args: any[]) => any) | null;
|
|
10
10
|
} | string[], {} & {}, {
|
|
11
11
|
[x: number]: string;
|