@onereach/ui-components 2.71.1-beta.2220.0 → 2.71.1-beta.2222.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/bundled/v2/{OrCardCollection-0141a358.js → OrCardCollection-d71d2dcf.js} +1 -1
- package/dist/bundled/v2/{OrCheckbox-dbef9f9a.js → OrCheckbox-4f665252.js} +3 -3
- package/dist/bundled/v2/{OrConfirm-057e997e.js → OrConfirm-2702f4e3.js} +1 -1
- package/dist/bundled/v2/{OrInlineInput-87589946.js → OrInlineInput-eaacc682.js} +2 -2
- package/dist/bundled/v2/{OrInlineTextarea-21b0e6fc.js → OrInlineTextarea-9f292005.js} +2 -2
- package/dist/bundled/v2/{OrInput-82ccfe00.js → OrInput-a7573d82.js} +20 -13
- package/dist/bundled/v2/{OrInputBox-79ec54ad.js → OrInputBox-da25bec2.js} +3 -13
- package/dist/bundled/v2/{OrRadio-cd39b20b.js → OrRadio-a60fc5c0.js} +3 -3
- package/dist/bundled/v2/{OrSearch-53470b0e.js → OrSearch-4395247a.js} +2 -2
- package/dist/bundled/v2/{OrSelect-02fb39f0.js → OrSelect-d7e1dd43.js} +7 -4
- package/dist/bundled/v2/OrSidebar-c95ef614.js +230 -0
- package/dist/bundled/v2/{OrSwitch-237a2081.js → OrSwitch-fe9b7de7.js} +3 -3
- package/dist/bundled/v2/{OrTextarea-5593fbe9.js → OrTextarea-76a2963b.js} +14 -11
- package/dist/bundled/v2/components/index.js +14 -13
- package/dist/bundled/v2/components/or-card-collection-v3/index.js +5 -4
- package/dist/bundled/v2/components/or-checkbox-v3/index.js +1 -1
- package/dist/bundled/v2/components/or-combined-input-v3/OrCombinedInput.stories3.d.ts +27 -0
- package/dist/bundled/v2/components/or-combined-input-v3/OrCombinedInput.vue.d.ts +98 -0
- package/dist/bundled/v2/components/or-combined-input-v3/index.d.ts +2 -0
- package/dist/bundled/v2/components/or-combined-input-v3/index.js +149 -0
- package/dist/bundled/v2/components/or-combined-input-v3/props.d.ts +1 -0
- package/dist/bundled/v2/components/or-combined-input-v3/styles.d.ts +2 -0
- package/dist/bundled/v2/components/or-confirm-v3/index.js +4 -3
- package/dist/bundled/v2/components/or-inline-input-v3/index.js +1 -1
- package/dist/bundled/v2/components/or-inline-textarea-v3/index.js +1 -1
- package/dist/bundled/v2/components/or-input-box-v3/index.js +2 -1
- package/dist/bundled/v2/components/or-input-v3/index.js +3 -2
- package/dist/bundled/v2/components/or-radio-v3/index.js +1 -1
- package/dist/bundled/v2/components/or-search-v3/index.js +4 -3
- package/dist/bundled/v2/components/or-select-v3/index.js +5 -4
- package/dist/bundled/v2/components/or-sidebar-v3/OrSidebar.stories3.d.ts +1 -36
- package/dist/bundled/v2/components/or-sidebar-v3/OrSidebar.vue.d.ts +4 -49
- package/dist/bundled/v2/components/or-sidebar-v3/index.js +1 -13
- package/dist/bundled/v2/components/or-sidebar-v3/styles.d.ts +1 -9
- package/dist/bundled/v2/components/or-switch-v3/index.js +1 -1
- package/dist/bundled/v2/components/or-textarea-v3/index.js +3 -2
- package/dist/bundled/v2/index.js +15 -14
- package/dist/bundled/v2/props-78496a2d.js +12 -0
- package/dist/bundled/v3/{OrCardCollection.vue_vue_type_script_lang-2d78a51a.js → OrCardCollection.vue_vue_type_script_lang-cf3f00f6.js} +1 -1
- package/dist/bundled/v3/{OrConfirm.vue_vue_type_script_lang-9d9a3917.js → OrConfirm.vue_vue_type_script_lang-86fcd480.js} +2 -2
- package/dist/bundled/v3/{OrInlineInput.vue_vue_type_script_lang-67218502.js → OrInlineInput.vue_vue_type_script_lang-0b47a43c.js} +2 -2
- package/dist/bundled/v3/{OrInlineTextarea.vue_vue_type_script_lang-a1831ab8.js → OrInlineTextarea.vue_vue_type_script_lang-71784de5.js} +2 -2
- package/dist/bundled/v3/{OrInput-a4f220ed.js → OrInput-9474b1c1.js} +17 -14
- package/dist/bundled/v3/{OrInput.vue_vue_type_script_lang-607d79d4.js → OrInput.vue_vue_type_script_lang-e7edc5e5.js} +5 -4
- package/dist/bundled/v3/{OrInputBox-eb54d73d.js → OrInputBox-a11eb96c.js} +1 -1
- package/dist/{esm/v2/OrInputBox-4d5a318d.js → bundled/v3/OrInputBox.vue_vue_type_script_lang-c8184afc.js} +5 -56
- package/dist/bundled/v3/{OrSearch.vue_vue_type_script_lang-06f318ca.js → OrSearch.vue_vue_type_script_lang-1b5462df.js} +3 -3
- package/dist/bundled/v3/{OrSelect.vue_vue_type_script_lang-83f15704.js → OrSelect.vue_vue_type_script_lang-0416ad89.js} +11 -7
- package/dist/bundled/v3/OrSidebar.vue_vue_type_script_lang-ce0b152c.js +181 -0
- package/dist/bundled/v3/{OrTextarea.vue_vue_type_script_lang-8e3531cd.js → OrTextarea.vue_vue_type_script_lang-e1a44c0a.js} +5 -4
- package/dist/bundled/v3/components/index.js +13 -12
- package/dist/bundled/v3/components/or-card-collection-v3/index.js +7 -6
- package/dist/bundled/v3/components/or-combined-input-v3/OrCombinedInput.stories3.d.ts +27 -0
- package/dist/bundled/v3/components/or-combined-input-v3/OrCombinedInput.vue.d.ts +98 -0
- package/dist/bundled/v3/components/or-combined-input-v3/index.d.ts +2 -0
- package/dist/bundled/v3/components/or-combined-input-v3/index.js +132 -0
- package/dist/bundled/v3/components/or-combined-input-v3/props.d.ts +1 -0
- package/dist/bundled/v3/components/or-combined-input-v3/styles.d.ts +2 -0
- package/dist/bundled/v3/components/or-confirm-v3/index.js +6 -5
- package/dist/bundled/v3/components/or-inline-input-v3/index.js +1 -1
- package/dist/bundled/v3/components/or-inline-textarea-v3/index.js +1 -1
- package/dist/bundled/v3/components/or-input-box-v3/index.js +2 -1
- package/dist/bundled/v3/components/or-input-v3/index.js +4 -3
- package/dist/bundled/v3/components/or-search-v3/index.js +6 -5
- package/dist/bundled/v3/components/or-select-v3/index.js +6 -5
- package/dist/bundled/v3/components/or-sidebar-v3/OrSidebar.stories3.d.ts +1 -36
- package/dist/bundled/v3/components/or-sidebar-v3/OrSidebar.vue.d.ts +4 -49
- package/dist/bundled/v3/components/or-sidebar-v3/index.js +1 -15
- package/dist/bundled/v3/components/or-sidebar-v3/styles.d.ts +1 -9
- package/dist/bundled/v3/components/or-textarea-v3/index.js +4 -3
- package/dist/bundled/v3/index.js +46 -58
- package/dist/bundled/v3/props-78496a2d.js +12 -0
- package/dist/esm/v2/{OrCardCollection-3c38fc85.js → OrCardCollection-e282dda1.js} +2 -2
- package/dist/esm/v2/{OrCheckbox-567e387c.js → OrCheckbox-ea48d156.js} +3 -3
- package/dist/esm/v2/{OrConfirm-047d4086.js → OrConfirm-826ae4ac.js} +1 -1
- package/dist/esm/v2/{OrInlineInput-10205811.js → OrInlineInput-43e2ef67.js} +2 -2
- package/dist/esm/v2/{OrInlineTextarea-7658611e.js → OrInlineTextarea-80ecac50.js} +2 -2
- package/dist/esm/v2/{OrInput-ada3a970.js → OrInput-dd6591ac.js} +20 -13
- package/dist/esm/v2/OrInputBox-20d65881.js +43 -0
- package/dist/{bundled/v3/OrInputBox.vue_vue_type_script_lang-5ee4ee45.js → esm/v2/OrInputBox.vue_rollup-plugin-vue_script-5253ba98.js} +4 -3
- package/dist/esm/v2/{OrRadio-848ce55d.js → OrRadio-6e10f071.js} +3 -3
- package/dist/esm/v2/{OrSearch-0f08f2f5.js → OrSearch-5de8264e.js} +2 -2
- package/dist/esm/v2/{OrSelect-f8837f5d.js → OrSelect-c58ce21d.js} +7 -4
- package/dist/esm/v2/OrSidebar-fabc7bc9.js +228 -0
- package/dist/esm/v2/{OrSwitch-13b6a7ee.js → OrSwitch-c628d2c5.js} +3 -3
- package/dist/esm/v2/{OrTextarea-6712a150.js → OrTextarea-b4660f09.js} +14 -11
- package/dist/esm/v2/components/index.js +14 -13
- package/dist/esm/v2/components/or-card-collection-v3/index.js +5 -4
- package/dist/esm/v2/components/or-checkbox-v3/index.js +1 -1
- package/dist/esm/v2/components/or-combined-input-v3/OrCombinedInput.stories3.d.ts +27 -0
- package/dist/esm/v2/components/or-combined-input-v3/OrCombinedInput.vue.d.ts +98 -0
- package/dist/esm/v2/components/or-combined-input-v3/index.d.ts +2 -0
- package/dist/esm/v2/components/or-combined-input-v3/index.js +147 -0
- package/dist/esm/v2/components/or-combined-input-v3/props.d.ts +1 -0
- package/dist/esm/v2/components/or-combined-input-v3/styles.d.ts +2 -0
- package/dist/esm/v2/components/or-confirm-v3/index.js +4 -3
- package/dist/esm/v2/components/or-inline-input-v3/index.js +1 -1
- package/dist/esm/v2/components/or-inline-textarea-v3/index.js +1 -1
- package/dist/esm/v2/components/or-input-box-v3/index.js +3 -2
- package/dist/esm/v2/components/or-input-v3/index.js +3 -2
- package/dist/esm/v2/components/or-radio-v3/index.js +1 -1
- package/dist/esm/v2/components/or-search-v3/index.js +4 -3
- package/dist/esm/v2/components/or-select-v3/index.js +5 -4
- package/dist/esm/v2/components/or-sidebar-v3/OrSidebar.stories3.d.ts +1 -36
- package/dist/esm/v2/components/or-sidebar-v3/OrSidebar.vue.d.ts +4 -49
- package/dist/esm/v2/components/or-sidebar-v3/index.js +1 -13
- package/dist/esm/v2/components/or-sidebar-v3/styles.d.ts +1 -9
- package/dist/esm/v2/components/or-switch-v3/index.js +1 -1
- package/dist/esm/v2/components/or-textarea-v3/index.js +3 -2
- package/dist/esm/v2/index.js +14 -13
- package/dist/esm/v3/{OrCardCollection-dbb3e839.js → OrCardCollection-09d4c13a.js} +2 -2
- package/dist/esm/v3/{OrCheckbox-3e139eac.js → OrCheckbox-d1b516c8.js} +3 -2
- package/dist/esm/v3/{OrConfirm-fee3c859.js → OrConfirm-da1f065b.js} +1 -1
- package/dist/esm/v3/{OrInlineInput-507fc99c.js → OrInlineInput-a3404468.js} +2 -2
- package/dist/esm/v3/{OrInlineTextarea-53a9e027.js → OrInlineTextarea-12a7707a.js} +2 -2
- package/dist/esm/v3/{OrInput-9c0426b9.js → OrInput-9143fd14.js} +19 -16
- package/dist/esm/v3/{OrInputBox-6d1b6059.js → OrInputBox-0ebab1b8.js} +1 -1
- package/dist/esm/v3/{OrRadio-54b6d0de.js → OrRadio-ef9d4c6e.js} +3 -2
- package/dist/esm/v3/{OrSearch-9885d178.js → OrSearch-c2fb5abb.js} +2 -2
- package/dist/esm/v3/{OrSelect-8fbd88bc.js → OrSelect-c1bcdd4c.js} +6 -4
- package/dist/esm/v3/OrSidebar-a62972f5.js +206 -0
- package/dist/esm/v3/{OrSwitch-cca30aa0.js → OrSwitch-cc797a48.js} +3 -3
- package/dist/esm/v3/{OrTextarea-bb9ef3f2.js → OrTextarea-26c50ec0.js} +17 -15
- package/dist/esm/v3/components/index.js +13 -13
- package/dist/esm/v3/components/or-card-collection-v3/index.js +4 -4
- package/dist/esm/v3/components/or-checkbox-v3/index.js +1 -1
- package/dist/esm/v3/components/or-combined-input-v3/OrCombinedInput.stories3.d.ts +27 -0
- package/dist/esm/v3/components/or-combined-input-v3/OrCombinedInput.vue.d.ts +98 -0
- package/dist/esm/v3/components/or-combined-input-v3/index.d.ts +2 -0
- package/dist/esm/v3/components/or-combined-input-v3/index.js +132 -0
- package/dist/esm/v3/components/or-combined-input-v3/props.d.ts +1 -0
- package/dist/esm/v3/components/or-combined-input-v3/styles.d.ts +2 -0
- package/dist/esm/v3/components/or-confirm-v3/index.js +3 -3
- package/dist/esm/v3/components/or-inline-input-v3/index.js +1 -1
- package/dist/esm/v3/components/or-inline-textarea-v3/index.js +1 -1
- package/dist/esm/v3/components/or-input-box-v3/index.js +1 -1
- package/dist/esm/v3/components/or-input-v3/index.js +2 -2
- package/dist/esm/v3/components/or-radio-v3/index.js +1 -1
- package/dist/esm/v3/components/or-search-v3/index.js +3 -3
- package/dist/esm/v3/components/or-select-v3/index.js +4 -4
- package/dist/esm/v3/components/or-sidebar-v3/OrSidebar.stories3.d.ts +1 -36
- package/dist/esm/v3/components/or-sidebar-v3/OrSidebar.vue.d.ts +4 -49
- package/dist/esm/v3/components/or-sidebar-v3/index.js +1 -12
- package/dist/esm/v3/components/or-sidebar-v3/styles.d.ts +1 -9
- package/dist/esm/v3/components/or-switch-v3/index.js +1 -1
- package/dist/esm/v3/components/or-textarea-v3/index.js +2 -2
- package/dist/esm/v3/index.js +13 -13
- package/package.json +2 -2
- package/src/components/or-checkbox-v3/OrCheckbox.vue +1 -1
- package/src/components/or-combined-input-v3/OrCombinedInput.docs.mdx +7 -0
- package/src/components/or-combined-input-v3/OrCombinedInput.stories3.ts +202 -0
- package/src/components/or-combined-input-v3/OrCombinedInput.vue +134 -0
- package/src/components/or-combined-input-v3/index.ts +2 -0
- package/src/components/or-combined-input-v3/props.ts +1 -0
- package/src/components/or-combined-input-v3/styles.ts +25 -0
- package/src/components/or-inline-input-v3/styles.ts +2 -2
- package/src/components/or-inline-textarea-v3/styles.ts +2 -2
- package/src/components/or-input-box-v3/styles.ts +1 -1
- package/src/components/or-input-v3/OrInput.vue +28 -22
- package/src/components/or-input-v3/styles.ts +2 -2
- package/src/components/or-radio-v3/OrRadio.vue +1 -1
- package/src/components/or-select-v3/OrSelect.stories3.ts +4 -0
- package/src/components/or-select-v3/styles.ts +4 -1
- package/src/components/or-sidebar-v3/OrSidebar.docs.mdx +0 -6
- package/src/components/or-sidebar-v3/OrSidebar.stories3.ts +10 -230
- package/src/components/or-sidebar-v3/OrSidebar.vue +22 -123
- package/src/components/or-sidebar-v3/styles.ts +9 -164
- package/src/components/or-switch-v3/OrSwitch.vue +1 -1
- package/src/components/or-textarea-v3/OrTextarea.vue +5 -1
- package/src/components/or-textarea-v3/styles.ts +2 -2
- package/dist/bundled/v2/OrSidebar-d445ecdd.js +0 -463
- package/dist/bundled/v2/components/or-sidebar-v3/OrSidebarCollapseButton.stories3.d.ts +0 -12
- package/dist/bundled/v2/components/or-sidebar-v3/OrSidebarCollapseButton.vue.d.ts +0 -53
- package/dist/bundled/v3/OrSidebar.vue_vue_type_script_lang-80e5dc4b.js +0 -355
- package/dist/bundled/v3/components/or-sidebar-v3/OrSidebarCollapseButton.stories3.d.ts +0 -12
- package/dist/bundled/v3/components/or-sidebar-v3/OrSidebarCollapseButton.vue.d.ts +0 -53
- package/dist/esm/v2/OrSidebar-097a4b55.js +0 -460
- package/dist/esm/v2/components/or-sidebar-v3/OrSidebarCollapseButton.stories3.d.ts +0 -12
- package/dist/esm/v2/components/or-sidebar-v3/OrSidebarCollapseButton.vue.d.ts +0 -53
- package/dist/esm/v3/OrSidebar-f6b2050b.js +0 -395
- package/dist/esm/v3/components/or-sidebar-v3/OrSidebarCollapseButton.stories3.d.ts +0 -12
- package/dist/esm/v3/components/or-sidebar-v3/OrSidebarCollapseButton.vue.d.ts +0 -53
- package/src/components/or-sidebar-v3/OrSidebarCollapseButton.stories3.ts +0 -48
- package/src/components/or-sidebar-v3/OrSidebarCollapseButton.vue +0 -74
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
import { useDraggable, useElementBounding } from '@vueuse/core';
|
|
2
|
+
import _ from 'lodash';
|
|
3
|
+
import { defineComponent, ref, computed, watch } from 'vue-demi';
|
|
4
|
+
import { openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, createCommentVNode } from 'vue';
|
|
5
|
+
|
|
6
|
+
var OrSidebarPlacement;
|
|
7
|
+
(function (OrSidebarPlacement) {
|
|
8
|
+
OrSidebarPlacement["left"] = "left";
|
|
9
|
+
OrSidebarPlacement["right"] = "right";
|
|
10
|
+
})(OrSidebarPlacement || (OrSidebarPlacement = {}));
|
|
11
|
+
|
|
12
|
+
const SidebarRoot = [
|
|
13
|
+
// Position
|
|
14
|
+
'relative',
|
|
15
|
+
// Layout
|
|
16
|
+
'flex', 'flex-col', 'shrink-0',
|
|
17
|
+
// Box
|
|
18
|
+
'min-h-0', 'p-0'];
|
|
19
|
+
const SidebarRootSides = {
|
|
20
|
+
[OrSidebarPlacement.left]: [
|
|
21
|
+
// Borders
|
|
22
|
+
'border-r-[1px]', 'border-r-solid', 'border-r-secondary dark:border-r-secondary-dark'],
|
|
23
|
+
[OrSidebarPlacement.right]: [
|
|
24
|
+
// Borders
|
|
25
|
+
'border-l-[1px]', 'border-l-solid', 'border-l-secondary dark:border-l-secondary-dark']
|
|
26
|
+
};
|
|
27
|
+
const SidebarResize = [
|
|
28
|
+
// Position
|
|
29
|
+
'absolute', 'inset-y-none', 'z-[1]',
|
|
30
|
+
// Box
|
|
31
|
+
'w-[12px]', 'h-[100%]',
|
|
32
|
+
// Cursor
|
|
33
|
+
'cursor-ew-resize'];
|
|
34
|
+
const SidebarResizeSides = {
|
|
35
|
+
[OrSidebarPlacement.left]: [
|
|
36
|
+
// Position
|
|
37
|
+
'-right-[1px]',
|
|
38
|
+
// Borders
|
|
39
|
+
'hover:border-r-2', 'hover:border-r-primary hover:dark:border-r-primary-dark',
|
|
40
|
+
// Transition
|
|
41
|
+
'transition-[border-right]'],
|
|
42
|
+
[OrSidebarPlacement.right]: [
|
|
43
|
+
// Position
|
|
44
|
+
'-left-[1px]',
|
|
45
|
+
// Borders
|
|
46
|
+
'hover:border-l-2', 'hover:border-l-primary hover:dark:border-l-primary-dark',
|
|
47
|
+
// Transition
|
|
48
|
+
'transition-[border-left]']
|
|
49
|
+
};
|
|
50
|
+
const SidebarResizingSides = {
|
|
51
|
+
[OrSidebarPlacement.left]: [
|
|
52
|
+
// Borders
|
|
53
|
+
'border-r-2', 'border-r-primary dark:border-r-primary-dark'],
|
|
54
|
+
[OrSidebarPlacement.right]: [
|
|
55
|
+
// Borders
|
|
56
|
+
'border-l-2', 'border-l-primary dark:border-l-primary-dark']
|
|
57
|
+
};
|
|
58
|
+
const SidebarMain = [
|
|
59
|
+
// Layout
|
|
60
|
+
'flex', 'flex-col', 'grow',
|
|
61
|
+
// Box
|
|
62
|
+
'min-h-0'];
|
|
63
|
+
const SidebarHeader = [
|
|
64
|
+
// Sizing
|
|
65
|
+
'p-md'];
|
|
66
|
+
const SidebarContent = [
|
|
67
|
+
// Layout
|
|
68
|
+
'grow', 'overflow-auto',
|
|
69
|
+
// Sizing
|
|
70
|
+
'p-md'];
|
|
71
|
+
const SidebarFooter = [
|
|
72
|
+
// Sizing
|
|
73
|
+
'p-md',
|
|
74
|
+
// Borders
|
|
75
|
+
'border-t-[1px]', 'border-t-solid', 'border-t-secondary dark:border-t-secondary-dark'];
|
|
76
|
+
|
|
77
|
+
var script = defineComponent({
|
|
78
|
+
name: 'OrSidebar',
|
|
79
|
+
props: {
|
|
80
|
+
width: {
|
|
81
|
+
type: Number,
|
|
82
|
+
required: false,
|
|
83
|
+
default: 0,
|
|
84
|
+
validator: value => _.isNumber(value) && value >= 0
|
|
85
|
+
},
|
|
86
|
+
minimumWidth: {
|
|
87
|
+
type: Number,
|
|
88
|
+
required: false,
|
|
89
|
+
default: 350,
|
|
90
|
+
validator: value => _.isNumber(value) && value >= 0
|
|
91
|
+
},
|
|
92
|
+
/**
|
|
93
|
+
* User may put the component on the right or the left side of a container.
|
|
94
|
+
* This property mirrors the resizing behavior (drag direction) and styling (horizontal border) of the sidebar.
|
|
95
|
+
*
|
|
96
|
+
* Note: the property doesn't reposition the component in the parent container.
|
|
97
|
+
* @values left, right
|
|
98
|
+
*/
|
|
99
|
+
side: {
|
|
100
|
+
type: String,
|
|
101
|
+
default: OrSidebarPlacement.right,
|
|
102
|
+
validator: value => _.includes(_.values(OrSidebarPlacement), value)
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
emits: ['change:width'],
|
|
106
|
+
setup(props, {
|
|
107
|
+
emit
|
|
108
|
+
}) {
|
|
109
|
+
// Refs
|
|
110
|
+
const root = ref();
|
|
111
|
+
const resizeBar = ref(null);
|
|
112
|
+
const parentContainer = computed(() => {
|
|
113
|
+
var _a;
|
|
114
|
+
return (_a = root.value) === null || _a === void 0 ? void 0 : _a.parentElement;
|
|
115
|
+
});
|
|
116
|
+
// State
|
|
117
|
+
const startPositionX = ref(0);
|
|
118
|
+
const isResizing = ref(false);
|
|
119
|
+
const localWidth = ref(props.width >= props.minimumWidth ? props.width : props.minimumWidth);
|
|
120
|
+
// Styles
|
|
121
|
+
const sidebarStyle = computed(() => ({
|
|
122
|
+
width: localWidth.value + 'px'
|
|
123
|
+
}));
|
|
124
|
+
const rootStyles = computed(() => ['or-sidebar', ...SidebarRoot, ...SidebarRootSides[props.side]]);
|
|
125
|
+
const resizeStyles = computed(() => [...SidebarResize, ...SidebarResizeSides[props.side], ...(isResizing.value ? SidebarResizingSides[props.side] : [])]);
|
|
126
|
+
const mainStyles = computed(() => [...SidebarMain]);
|
|
127
|
+
const headerStyles = computed(() => [...SidebarHeader]);
|
|
128
|
+
const contentStyles = computed(() => [...SidebarContent]);
|
|
129
|
+
const footerStyles = computed(() => [...SidebarFooter]);
|
|
130
|
+
// Effects
|
|
131
|
+
useDraggable(resizeBar, {
|
|
132
|
+
preventDefault: true,
|
|
133
|
+
onStart: (position, event) => {
|
|
134
|
+
document.body.style.cursor = 'ew-resize';
|
|
135
|
+
document.body.style.userSelect = 'none';
|
|
136
|
+
startPositionX.value = event.x;
|
|
137
|
+
isResizing.value = true;
|
|
138
|
+
},
|
|
139
|
+
onMove: position => {
|
|
140
|
+
const delta = (position.x - startPositionX.value) * (props.side === OrSidebarPlacement.left ? -1 : 1);
|
|
141
|
+
const newWidth = localWidth.value - delta;
|
|
142
|
+
localWidth.value = newWidth > maximumWidth.value ? maximumWidth.value : newWidth < props.minimumWidth ? props.minimumWidth : newWidth;
|
|
143
|
+
startPositionX.value = position.x;
|
|
144
|
+
},
|
|
145
|
+
onEnd: () => {
|
|
146
|
+
document.body.style.cursor = '';
|
|
147
|
+
document.body.style.userSelect = '';
|
|
148
|
+
isResizing.value = false;
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
const {
|
|
152
|
+
width: maximumWidth
|
|
153
|
+
} = useElementBounding(parentContainer);
|
|
154
|
+
watch(() => props.width, newValue => {
|
|
155
|
+
if (newValue !== localWidth.value) {
|
|
156
|
+
localWidth.value = newValue > maximumWidth.value ? maximumWidth.value : newValue < props.minimumWidth ? props.minimumWidth : newValue;
|
|
157
|
+
}
|
|
158
|
+
});
|
|
159
|
+
watch(() => props.minimumWidth, newMinimum => {
|
|
160
|
+
if (newMinimum > localWidth.value) localWidth.value = newMinimum;
|
|
161
|
+
});
|
|
162
|
+
watch(maximumWidth, newMaximum => {
|
|
163
|
+
if (newMaximum < localWidth.value) localWidth.value = newMaximum;
|
|
164
|
+
});
|
|
165
|
+
watch(localWidth, val => emit('change:width', val));
|
|
166
|
+
return {
|
|
167
|
+
root,
|
|
168
|
+
resizeBar,
|
|
169
|
+
isResizing,
|
|
170
|
+
localWidth,
|
|
171
|
+
sidebarStyle,
|
|
172
|
+
rootStyles,
|
|
173
|
+
resizeStyles,
|
|
174
|
+
mainStyles,
|
|
175
|
+
headerStyles,
|
|
176
|
+
contentStyles,
|
|
177
|
+
footerStyles
|
|
178
|
+
};
|
|
179
|
+
}
|
|
180
|
+
});
|
|
181
|
+
|
|
182
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
183
|
+
return openBlock(), createElementBlock("aside", {
|
|
184
|
+
ref: "root",
|
|
185
|
+
class: normalizeClass(_ctx.rootStyles),
|
|
186
|
+
style: normalizeStyle(_ctx.sidebarStyle)
|
|
187
|
+
}, [createElementVNode("div", {
|
|
188
|
+
ref: "resizeBar",
|
|
189
|
+
class: normalizeClass(_ctx.resizeStyles)
|
|
190
|
+
}, null, 2 /* CLASS */), createElementVNode("div", {
|
|
191
|
+
class: normalizeClass(_ctx.mainStyles)
|
|
192
|
+
}, [_ctx.$slots.header ? (openBlock(), createElementBlock("div", {
|
|
193
|
+
key: 0,
|
|
194
|
+
class: normalizeClass(_ctx.headerStyles)
|
|
195
|
+
}, [renderSlot(_ctx.$slots, "header")], 2 /* CLASS */)) : createCommentVNode("v-if", true), createElementVNode("div", {
|
|
196
|
+
class: normalizeClass(_ctx.contentStyles)
|
|
197
|
+
}, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */)], 2 /* CLASS */), _ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
|
|
198
|
+
key: 0,
|
|
199
|
+
class: normalizeClass(_ctx.footerStyles)
|
|
200
|
+
}, [renderSlot(_ctx.$slots, "footer")], 2 /* CLASS */)) : createCommentVNode("v-if", true)], 6 /* CLASS, STYLE */);
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
script.render = render;
|
|
204
|
+
script.__file = "src/components/or-sidebar-v3/OrSidebar.vue";
|
|
205
|
+
|
|
206
|
+
export { OrSidebarPlacement as O, script as s };
|
|
@@ -142,10 +142,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
142
142
|
ref: "root",
|
|
143
143
|
class: normalizeClass(_ctx.rootStyles)
|
|
144
144
|
}, [!_ctx.loading ? withDirectives((openBlock(), createElementBlock("input", mergeProps({
|
|
145
|
-
key: 0
|
|
146
|
-
}, _ctx.$attrs, {
|
|
145
|
+
key: 0,
|
|
147
146
|
id: _ctx.controlId,
|
|
148
|
-
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => _ctx.proxyModelValue = $event)
|
|
147
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => _ctx.proxyModelValue = $event)
|
|
148
|
+
}, _ctx.$attrs, {
|
|
149
149
|
class: _ctx.controlStyles,
|
|
150
150
|
type: "checkbox",
|
|
151
151
|
value: _ctx.inputValue,
|
|
@@ -3,9 +3,9 @@ import { u as useClassAttribute } from './useClassAttribute-47fdb016.js';
|
|
|
3
3
|
import '@vueuse/core';
|
|
4
4
|
import { s as script$1 } from './OrError-ec8c709d.js';
|
|
5
5
|
import { s as script$2 } from './OrHint-74bb732d.js';
|
|
6
|
-
import { s as script$3, a as InputBoxSize } from './OrInputBox-
|
|
6
|
+
import { s as script$3, a as InputBoxSize } from './OrInputBox-0ebab1b8.js';
|
|
7
7
|
import { s as script$4 } from './OrLabel-bdaec602.js';
|
|
8
|
-
import { resolveComponent, openBlock, createElementBlock,
|
|
8
|
+
import { resolveComponent, openBlock, createElementBlock, mergeProps, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, withDirectives, createElementVNode, normalizeClass, vModelText, Fragment, createSlots } from 'vue';
|
|
9
9
|
import { s as styleInject } from './style-inject.es-4c6f2515.js';
|
|
10
10
|
|
|
11
11
|
const TextareaRoot = [
|
|
@@ -14,8 +14,8 @@ const TextareaRoot = [
|
|
|
14
14
|
// Spacing
|
|
15
15
|
'gap-xs'];
|
|
16
16
|
const TextareaControl = [
|
|
17
|
-
//
|
|
18
|
-
'
|
|
17
|
+
// Box
|
|
18
|
+
'w-full',
|
|
19
19
|
// Typography
|
|
20
20
|
'typography-inherit',
|
|
21
21
|
// Theme
|
|
@@ -113,16 +113,17 @@ var script = defineComponent({
|
|
|
113
113
|
}
|
|
114
114
|
});
|
|
115
115
|
|
|
116
|
-
const _hoisted_1 = ["id", "placeholder", "required", "disabled"];
|
|
116
|
+
const _hoisted_1 = ["id", "placeholder", "required", "disabled", "readonly", "maxlength"];
|
|
117
117
|
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
118
118
|
const _component_OrLabel = resolveComponent("OrLabel");
|
|
119
119
|
const _component_OrInputBox = resolveComponent("OrInputBox");
|
|
120
120
|
const _component_OrHint = resolveComponent("OrHint");
|
|
121
121
|
const _component_OrError = resolveComponent("OrError");
|
|
122
|
-
return openBlock(), createElementBlock("div", {
|
|
123
|
-
ref: "root"
|
|
124
|
-
|
|
125
|
-
|
|
122
|
+
return openBlock(), createElementBlock("div", mergeProps({
|
|
123
|
+
ref: "root"
|
|
124
|
+
}, _ctx.$attrs, {
|
|
125
|
+
class: _ctx.rootStyles
|
|
126
|
+
}), [_ctx.label ? (openBlock(), createBlock(_component_OrLabel, {
|
|
126
127
|
key: 0,
|
|
127
128
|
"control-id": _ctx.controlId,
|
|
128
129
|
variant: 'input',
|
|
@@ -139,19 +140,20 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
139
140
|
readonly: _ctx.readonly,
|
|
140
141
|
disabled: _ctx.disabled
|
|
141
142
|
}, {
|
|
142
|
-
default: withCtx(() => [withDirectives(createElementVNode("textarea",
|
|
143
|
+
default: withCtx(() => [withDirectives(createElementVNode("textarea", {
|
|
143
144
|
id: _ctx.controlId,
|
|
144
|
-
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => _ctx.proxyModelValue = $event)
|
|
145
|
-
|
|
146
|
-
class: _ctx.controlStyles,
|
|
145
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = $event => _ctx.proxyModelValue = $event),
|
|
146
|
+
class: normalizeClass(_ctx.controlStyles),
|
|
147
147
|
placeholder: _ctx.placeholder,
|
|
148
148
|
required: _ctx.required,
|
|
149
149
|
disabled: _ctx.disabled,
|
|
150
|
+
readonly: _ctx.readonly,
|
|
151
|
+
maxlength: _ctx.maxLength,
|
|
150
152
|
onKeydown: _cache[1] || (_cache[1] = $event => _ctx.$emit('keydown', $event)),
|
|
151
153
|
onKeyup: _cache[2] || (_cache[2] = $event => _ctx.$emit('keyup', $event)),
|
|
152
154
|
onFocus: _cache[3] || (_cache[3] = $event => _ctx.$emit('focus', $event)),
|
|
153
155
|
onBlur: _cache[4] || (_cache[4] = $event => _ctx.$emit('blur', $event))
|
|
154
|
-
}
|
|
156
|
+
}, null, 42 /* CLASS, PROPS, HYDRATE_EVENTS */, _hoisted_1), [[vModelText, _ctx.proxyModelValue]])]),
|
|
155
157
|
_: 1 /* STABLE */
|
|
156
158
|
}, 8 /* PROPS */, ["size", "invalid", "readonly", "disabled"]), !_ctx.invalid ? (openBlock(), createElementBlock(Fragment, {
|
|
157
159
|
key: 1
|
|
@@ -179,7 +181,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
179
181
|
fn: withCtx(() => [createTextVNode(toDisplayString(_ctx.currentLength) + " / " + toDisplayString(_ctx.maxLength), 1 /* TEXT */)]),
|
|
180
182
|
|
|
181
183
|
key: "0"
|
|
182
|
-
} : undefined]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["disabled"]))],
|
|
184
|
+
} : undefined]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["disabled"]))], 16 /* FULL_PROPS */);
|
|
183
185
|
}
|
|
184
186
|
|
|
185
187
|
var css_248z = "\ntextarea[data-v-10a22fb4] {\n min-width: 0;\n background: none;\n outline: none;\n}\n";
|
|
@@ -6,17 +6,17 @@ export { b as BUTTON_COLOR, d as BUTTON_LOADER_TYPE, c as BUTTON_SIZE, B as BUTT
|
|
|
6
6
|
export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../OrButton-0fa67a0d.js';
|
|
7
7
|
export { s as OrCard } from '../OrCard-e3a5aea4.js';
|
|
8
8
|
export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from '../OrCardCollection-a5e326ef.js';
|
|
9
|
-
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-
|
|
9
|
+
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-09d4c13a.js';
|
|
10
10
|
export { s as OrCardV3 } from '../OrCard-fd92f7c8.js';
|
|
11
11
|
export { a as OrCarousel, s as OrCarouselItem } from '../OrCarouselItem-636d99a1.js';
|
|
12
12
|
export { s as OrCheckbox } from '../OrCheckbox-ed4a19cf.js';
|
|
13
|
-
export { s as OrCheckboxV3 } from '../OrCheckbox-
|
|
13
|
+
export { s as OrCheckboxV3 } from '../OrCheckbox-d1b516c8.js';
|
|
14
14
|
export { s as OrChip, a as OrChips } from '../OrChips-9afba42f.js';
|
|
15
15
|
export { s as OrCode, O as OrCodeLanguages } from '../OrCode-5ed69c23.js';
|
|
16
16
|
export { s as OrCollapse } from '../OrCollapse-445141ab.js';
|
|
17
17
|
export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k as brown, c as cyan, j as deepOrange, d as deepPurple, g as green, i as indigo, l as lightBlue, e as lightGreen, f as lime, o as orange, p as pink, a as purple, r as red, t as teal, w as white, y as yellow } from '../OrColorPicker-189cb097.js';
|
|
18
18
|
export { s as OrConfirm } from '../OrConfirm-f39bd784.js';
|
|
19
|
-
export { C as ConfirmType, s as OrConfirmV3 } from '../OrConfirm-
|
|
19
|
+
export { C as ConfirmType, s as OrConfirmV3 } from '../OrConfirm-da1f065b.js';
|
|
20
20
|
export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from '../OrDateTimePicker-f2e08564.js';
|
|
21
21
|
export { s as OrError } from '../OrError-f90296db.js';
|
|
22
22
|
export { s as OrErrorTagV3 } from '../OrErrorTag-98252eef.js';
|
|
@@ -31,11 +31,11 @@ export { s as OrIcon, O as OrIconColors, a as OrIconType } from '../OrIcon-66950
|
|
|
31
31
|
export { I as IconButtonColor, s as OrIconButtonV3 } from '../OrIconButton-1a89fbf9.js';
|
|
32
32
|
export { I as IconButtonSize, I as IconSize, a as IconVariant, s as OrIconV3 } from '../OrIcon-b195169c.js';
|
|
33
33
|
export { I as InlineInputBoxSize, I as InlineInputSize, s as OrInlineInputBoxV3 } from '../OrInlineInputBox-8049f95a.js';
|
|
34
|
-
export { I as InlineInputType, s as OrInlineInputV3 } from '../OrInlineInput-
|
|
34
|
+
export { I as InlineInputType, s as OrInlineInputV3 } from '../OrInlineInput-a3404468.js';
|
|
35
35
|
export { a as InlineTextEditTrimmingTypes, I as InlineTextEditTypes, s as OrInlineTextEdit } from '../OrInlineTextEdit-1aa477b5.js';
|
|
36
|
-
export { s as OrInlineTextareaV3 } from '../OrInlineTextarea-
|
|
37
|
-
export { a as InputBoxSize, I as InputBoxVariant, a as InputSize, s as OrInputBoxV3, a as SearchSize, a as SelectSize, a as TextareaSize } from '../OrInputBox-
|
|
38
|
-
export { I as InputType, s as OrInputV3 } from '../OrInput-
|
|
36
|
+
export { s as OrInlineTextareaV3 } from '../OrInlineTextarea-12a7707a.js';
|
|
37
|
+
export { a as InputBoxSize, I as InputBoxVariant, a as InputSize, s as OrInputBoxV3, a as SearchSize, a as SelectSize, a as TextareaSize } from '../OrInputBox-0ebab1b8.js';
|
|
38
|
+
export { I as InputType, s as OrInputV3 } from '../OrInput-9143fd14.js';
|
|
39
39
|
export { a as OrInput, b as OrNumberInput, c as OrPassword, d as OrSearch, s as OrTextarea } from '../OrSearch-7cb2c91c.js';
|
|
40
40
|
export { s as OrLabel } from '../OrLabel-876f8729.js';
|
|
41
41
|
export { L as LabelVariant, s as OrLabelV3 } from '../OrLabel-bdaec602.js';
|
|
@@ -59,20 +59,20 @@ export { s as OrProgress, O as OrProgressColors, a as OrProgressTypes } from '..
|
|
|
59
59
|
export { s as OrProgressV3, P as ProgressColor, a as ProgressType } from '../OrProgress-407002e0.js';
|
|
60
60
|
export { s as OrRadio } from '../OrRadio-c3ab11f2.js';
|
|
61
61
|
export { s as OrRadioGroup } from '../OrRadioGroup-00785e41.js';
|
|
62
|
-
export { s as OrRadioV3 } from '../OrRadio-
|
|
63
|
-
export { s as OrSearchV3 } from '../OrSearch-
|
|
62
|
+
export { s as OrRadioV3 } from '../OrRadio-ef9d4c6e.js';
|
|
63
|
+
export { s as OrSearchV3 } from '../OrSearch-c2fb5abb.js';
|
|
64
64
|
export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegmentedControl-171cad78.js';
|
|
65
65
|
export { s as OrSelect } from '../OrSelect-0821b907.js';
|
|
66
|
-
export { s as OrSelectV3 } from '../OrSelect-
|
|
66
|
+
export { s as OrSelectV3 } from '../OrSelect-c1bcdd4c.js';
|
|
67
67
|
export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar-375c85a3.js';
|
|
68
|
-
export { O as OrSidebarPlacement, s as OrSidebarV3 } from '../OrSidebar-
|
|
68
|
+
export { O as OrSidebarPlacement, s as OrSidebarV3 } from '../OrSidebar-a62972f5.js';
|
|
69
69
|
export { s as OrSkeletonCircle, a as OrSkeletonRect, b as OrSkeletonText, O as OrSkeletonTextSizes } from '../OrSkeletonText-2b1610ce.js';
|
|
70
70
|
export { s as OrSkeletonCircleV3, a as OrSkeletonRectV3, b as OrSkeletonTextV3 } from '../OrSkeletonText-3965ff71.js';
|
|
71
71
|
export { s as OrSlider } from '../OrSlider-87e2da8c.js';
|
|
72
72
|
export { s as OrSortHeaderV3 } from '../OrSortHeader-fe1a9cf8.js';
|
|
73
73
|
export { s as OrStepper } from '../OrStepper-f19b4eac.js';
|
|
74
74
|
export { s as OrSwitch } from '../OrSwitch-c333ee32.js';
|
|
75
|
-
export { s as OrSwitchV3 } from '../OrSwitch-
|
|
75
|
+
export { s as OrSwitchV3 } from '../OrSwitch-cc797a48.js';
|
|
76
76
|
export { s as OrTab } from '../OrTab-bc98be02.js';
|
|
77
77
|
export { s as OrTabHeaderItem } from '../OrTabHeaderItem-d668cc59.js';
|
|
78
78
|
export { s as OrTabV3 } from '../OrTab-c131cf60.js';
|
|
@@ -83,7 +83,7 @@ export { s as OrTagV3, a as TagColor, T as TagVariant } from '../OrTag-5d54f37d.
|
|
|
83
83
|
export { s as OrTeleport } from '../OrTeleportVue3-ad639f12.js';
|
|
84
84
|
export { s as OrTeleportV3 } from '../OrTeleport.vue3-8099178c.js';
|
|
85
85
|
export { s as OrTextV3 } from '../OrText-ecb46923.js';
|
|
86
|
-
export { s as OrTextareaV3 } from '../OrTextarea-
|
|
86
|
+
export { s as OrTextareaV3 } from '../OrTextarea-26c50ec0.js';
|
|
87
87
|
export { s as OrTextbox, T as TextboxTypes } from '../OrTextbox-2f33e9c3.js';
|
|
88
88
|
export { s as OrToast, a as OrToastContainer } from '../OrToastContainer-40c4c1c8.js';
|
|
89
89
|
export { P as PositionsX, b as PositionsY, c as ToastType, T as TransitionType, a as useQueue, u as useToast } from '../useToast-4fbe0e5a.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-
|
|
1
|
+
export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-09d4c13a.js';
|
|
2
2
|
import 'vue-demi';
|
|
3
3
|
import '../../useClassAttribute-47fdb016.js';
|
|
4
4
|
import '@vueuse/core';
|
|
@@ -17,10 +17,10 @@ import '../../OrMenu-840038cd.js';
|
|
|
17
17
|
import '../../OrMenuItem-9da279f6.js';
|
|
18
18
|
import '../../OrButton-0fa67a0d.js';
|
|
19
19
|
import '../../OrLoader-b3cf4231.js';
|
|
20
|
-
import '../../OrSearch-
|
|
21
|
-
import '../../OrInput-
|
|
20
|
+
import '../../OrSearch-c2fb5abb.js';
|
|
21
|
+
import '../../OrInput-9143fd14.js';
|
|
22
22
|
import '../../OrError-ec8c709d.js';
|
|
23
23
|
import '../../OrHint-74bb732d.js';
|
|
24
|
-
import '../../OrInputBox-
|
|
24
|
+
import '../../OrInputBox-0ebab1b8.js';
|
|
25
25
|
import '../../OrLabel-bdaec602.js';
|
|
26
26
|
import '../../style-inject.es-4c6f2515.js';
|
|
@@ -0,0 +1,27 @@
|
|
|
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 Default: 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>)>;
|
|
13
|
+
export declare const Addon: 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, {
|
|
14
|
+
[x: string]: ((...args: any[]) => any) | null;
|
|
15
|
+
} | string[], {} & {}, {
|
|
16
|
+
[x: number]: string;
|
|
17
|
+
} | {}, true>)>;
|
|
18
|
+
export declare const Hint: 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, {
|
|
19
|
+
[x: string]: ((...args: any[]) => any) | null;
|
|
20
|
+
} | string[], {} & {}, {
|
|
21
|
+
[x: number]: string;
|
|
22
|
+
} | {}, true>)>;
|
|
23
|
+
export declare const Error: 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, {
|
|
24
|
+
[x: string]: ((...args: any[]) => any) | null;
|
|
25
|
+
} | string[], {} & {}, {
|
|
26
|
+
[x: number]: string;
|
|
27
|
+
} | {}, true>)>;
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { PropType } from 'vue-demi';
|
|
2
|
+
import { CombinedInputSize } 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
|
+
controlGroup: import("@vue/composition-api").ComputedRef<string[]>;
|
|
7
|
+
invalid: import("@vue/composition-api").ComputedRef<boolean>;
|
|
8
|
+
readonly: import("@vue/composition-api").ComputedRef<boolean>;
|
|
9
|
+
}> & import("@vue/composition-api").Data, {}, {}, {
|
|
10
|
+
size: {
|
|
11
|
+
type: PropType<CombinedInputSize>;
|
|
12
|
+
default: CombinedInputSize;
|
|
13
|
+
};
|
|
14
|
+
label: {
|
|
15
|
+
type: StringConstructor;
|
|
16
|
+
default: undefined;
|
|
17
|
+
};
|
|
18
|
+
hint: {
|
|
19
|
+
type: StringConstructor;
|
|
20
|
+
default: undefined;
|
|
21
|
+
};
|
|
22
|
+
error: {
|
|
23
|
+
type: StringConstructor;
|
|
24
|
+
default: undefined;
|
|
25
|
+
};
|
|
26
|
+
required: {
|
|
27
|
+
type: BooleanConstructor;
|
|
28
|
+
default: boolean;
|
|
29
|
+
};
|
|
30
|
+
disabled: {
|
|
31
|
+
type: BooleanConstructor;
|
|
32
|
+
default: boolean;
|
|
33
|
+
};
|
|
34
|
+
disableDefaultStyles: {
|
|
35
|
+
type: BooleanConstructor;
|
|
36
|
+
default: boolean;
|
|
37
|
+
};
|
|
38
|
+
}, import("@vue/composition-api").ExtractPropTypes<{
|
|
39
|
+
size: {
|
|
40
|
+
type: PropType<CombinedInputSize>;
|
|
41
|
+
default: CombinedInputSize;
|
|
42
|
+
};
|
|
43
|
+
label: {
|
|
44
|
+
type: StringConstructor;
|
|
45
|
+
default: undefined;
|
|
46
|
+
};
|
|
47
|
+
hint: {
|
|
48
|
+
type: StringConstructor;
|
|
49
|
+
default: undefined;
|
|
50
|
+
};
|
|
51
|
+
error: {
|
|
52
|
+
type: StringConstructor;
|
|
53
|
+
default: undefined;
|
|
54
|
+
};
|
|
55
|
+
required: {
|
|
56
|
+
type: BooleanConstructor;
|
|
57
|
+
default: boolean;
|
|
58
|
+
};
|
|
59
|
+
disabled: {
|
|
60
|
+
type: BooleanConstructor;
|
|
61
|
+
default: boolean;
|
|
62
|
+
};
|
|
63
|
+
disableDefaultStyles: {
|
|
64
|
+
type: BooleanConstructor;
|
|
65
|
+
default: boolean;
|
|
66
|
+
};
|
|
67
|
+
}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
|
|
68
|
+
size: CombinedInputSize;
|
|
69
|
+
label: string;
|
|
70
|
+
hint: string;
|
|
71
|
+
error: string;
|
|
72
|
+
required: boolean;
|
|
73
|
+
disabled: boolean;
|
|
74
|
+
disableDefaultStyles: boolean;
|
|
75
|
+
} & {}, import("@vue/composition-api").ShallowUnwrapRef<{
|
|
76
|
+
root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
|
|
77
|
+
rootStyles: import("@vue/composition-api").ComputedRef<(string | undefined)[]>;
|
|
78
|
+
controlGroup: import("@vue/composition-api").ComputedRef<string[]>;
|
|
79
|
+
invalid: import("@vue/composition-api").ComputedRef<boolean>;
|
|
80
|
+
readonly: import("@vue/composition-api").ComputedRef<boolean>;
|
|
81
|
+
}>, import("@vue/composition-api").Data, {}, {}, {}, {}, {}, {
|
|
82
|
+
size: CombinedInputSize;
|
|
83
|
+
label: string;
|
|
84
|
+
hint: string;
|
|
85
|
+
error: string;
|
|
86
|
+
required: boolean;
|
|
87
|
+
disabled: boolean;
|
|
88
|
+
disableDefaultStyles: boolean;
|
|
89
|
+
} & {}, {
|
|
90
|
+
size: CombinedInputSize;
|
|
91
|
+
label: string;
|
|
92
|
+
hint: string;
|
|
93
|
+
error: string;
|
|
94
|
+
required: boolean;
|
|
95
|
+
disabled: boolean;
|
|
96
|
+
disableDefaultStyles: boolean;
|
|
97
|
+
}, true>);
|
|
98
|
+
export default _default;
|