vueless 0.0.237 → 0.0.239
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/package.json +2 -2
- package/ui.button/index.stories.js +4 -4
- package/ui.container-col/Docs.mdx +16 -0
- package/ui.container-col/composables/attrs.composable.js +33 -0
- package/ui.container-col/configs/default.config.js +46 -0
- package/ui.container-col/constants/index.js +5 -0
- package/ui.container-col/index.stories.js +64 -0
- package/ui.container-col/index.vue +80 -0
- package/ui.container-divider/configs/default.config.js +1 -1
- package/ui.container-group/configs/default.config.js +0 -42
- package/ui.container-group/index.stories.js +7 -4
- package/ui.container-group/index.vue +3 -49
- package/ui.container-groups/index.stories.js +6 -3
- package/ui.container-row/index.stories.js +7 -7
- package/ui.container-row/index.vue +1 -1
- package/ui.dropdown-button/index.stories.js +4 -4
- package/ui.form-checkbox/index.stories.js +7 -7
- package/ui.form-color-picker/index.stories.js +4 -4
- package/ui.form-input/index.stories.js +4 -4
- package/ui.form-input/index.vue +12 -12
- package/ui.form-input-money/index.stories.js +4 -4
- package/ui.form-input-number/index.stories.js +4 -4
- package/ui.form-label/index.stories.js +4 -4
- package/ui.form-radio-group/index.stories.js +4 -4
- package/ui.form-select/configs/default.config.js +1 -1
- package/ui.form-switch/configs/default.config.js +3 -4
- package/ui.form-textarea/configs/default.config.js +1 -2
- package/ui.form-textarea/index.stories.js +4 -4
- package/ui.form-textarea/index.vue +13 -13
- package/ui.image-avatar/index.stories.js +10 -10
- package/ui.loader-rendering/index.stories.js +4 -4
- package/ui.loader-top/index.stories.js +4 -4
- package/ui.navigation-progress/index.stories.js +9 -9
- package/ui.other-dot/index.stories.js +7 -7
- package/ui.text-alert/index.stories.js +4 -4
- package/ui.text-badge/index.stories.js +4 -4
- package/ui.text-header/index.stories.js +4 -4
- package/ui.text-notify/index.stories.js +4 -4
- package/web-types.json +81 -47
|
@@ -2,7 +2,7 @@ import { getArgTypes, getSlotNames, getSlotsFragment } from "../service.storyboo
|
|
|
2
2
|
|
|
3
3
|
import UAlert from "../ui.text-alert";
|
|
4
4
|
import URow from "../ui.container-row";
|
|
5
|
-
import
|
|
5
|
+
import UCol from "../ui.container-col";
|
|
6
6
|
import UIcon from "../ui.image-icon";
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -36,7 +36,7 @@ const DefaultTemplate = (args) => ({
|
|
|
36
36
|
});
|
|
37
37
|
|
|
38
38
|
const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
39
|
-
components: { UAlert,
|
|
39
|
+
components: { UAlert, UCol },
|
|
40
40
|
setup() {
|
|
41
41
|
const options = argTypes[args.enum].options;
|
|
42
42
|
let prefixedOptions = options;
|
|
@@ -52,7 +52,7 @@ const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
|
52
52
|
return { args, options: argTypes[args.enum].options, prefixedOptions };
|
|
53
53
|
},
|
|
54
54
|
template: `
|
|
55
|
-
<
|
|
55
|
+
<UCol align="stretch">
|
|
56
56
|
<UAlert
|
|
57
57
|
v-for="(option, index) in options"
|
|
58
58
|
:key="index"
|
|
@@ -60,7 +60,7 @@ const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
|
60
60
|
:[args.enum]="option"
|
|
61
61
|
:title="prefixedOptions[index]"
|
|
62
62
|
/>
|
|
63
|
-
</
|
|
63
|
+
</UCol>
|
|
64
64
|
`,
|
|
65
65
|
});
|
|
66
66
|
|
|
@@ -3,7 +3,7 @@ import { getArgTypes, getSlotNames, getSlotsFragment } from "../service.storyboo
|
|
|
3
3
|
import UBadge from "../ui.text-badge";
|
|
4
4
|
import UIcon from "../ui.image-icon";
|
|
5
5
|
import URow from "../ui.container-row";
|
|
6
|
-
import
|
|
6
|
+
import UCol from "../ui.container-col";
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
9
|
* The `UBadge` component. | [View on GitHub](https://github.com/vuelessjs/vueless/tree/main/src/ui.text-badge)
|
|
@@ -35,7 +35,7 @@ const DefaultTemplate = (args) => ({
|
|
|
35
35
|
});
|
|
36
36
|
|
|
37
37
|
const ColorsTemplate = (args, { argTypes } = {}) => ({
|
|
38
|
-
components: { UBadge, URow,
|
|
38
|
+
components: { UBadge, URow, UCol },
|
|
39
39
|
setup() {
|
|
40
40
|
return {
|
|
41
41
|
args,
|
|
@@ -44,7 +44,7 @@ const ColorsTemplate = (args, { argTypes } = {}) => ({
|
|
|
44
44
|
};
|
|
45
45
|
},
|
|
46
46
|
template: `
|
|
47
|
-
<
|
|
47
|
+
<UCol>
|
|
48
48
|
<URow v-for="(variant, index) in variants" :key="index">
|
|
49
49
|
<UBadge
|
|
50
50
|
v-for="(color, index) in colors"
|
|
@@ -55,7 +55,7 @@ const ColorsTemplate = (args, { argTypes } = {}) => ({
|
|
|
55
55
|
:key="index"
|
|
56
56
|
/>
|
|
57
57
|
</URow>
|
|
58
|
-
</
|
|
58
|
+
</UCol>
|
|
59
59
|
`,
|
|
60
60
|
});
|
|
61
61
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { getArgTypes, getSlotNames, getSlotsFragment } from "../service.storybook";
|
|
2
2
|
|
|
3
3
|
import UHeader from "../ui.text-header";
|
|
4
|
-
import
|
|
4
|
+
import UCol from "../ui.container-col";
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* The `UHeader` component. | [View on GitHub](https://github.com/vuelessjs/vueless/tree/main/src/ui.text-header)
|
|
@@ -33,7 +33,7 @@ const DefaultTemplate = (args) => ({
|
|
|
33
33
|
});
|
|
34
34
|
|
|
35
35
|
const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
36
|
-
components: { UHeader,
|
|
36
|
+
components: { UHeader, UCol },
|
|
37
37
|
setup() {
|
|
38
38
|
return {
|
|
39
39
|
args,
|
|
@@ -41,7 +41,7 @@ const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
|
41
41
|
};
|
|
42
42
|
},
|
|
43
43
|
template: `
|
|
44
|
-
<
|
|
44
|
+
<UCol>
|
|
45
45
|
<UHeader
|
|
46
46
|
v-for="(option, index) in options"
|
|
47
47
|
:key="index"
|
|
@@ -49,7 +49,7 @@ const EnumVariantTemplate = (args, { argTypes } = {}) => ({
|
|
|
49
49
|
:[args.enum]="option"
|
|
50
50
|
:label="'Header ' + option"
|
|
51
51
|
/>
|
|
52
|
-
</
|
|
52
|
+
</UCol>
|
|
53
53
|
`,
|
|
54
54
|
});
|
|
55
55
|
|
|
@@ -2,7 +2,7 @@ import { notify } from "./services";
|
|
|
2
2
|
|
|
3
3
|
import UNotify from "../ui.text-notify";
|
|
4
4
|
import UButton from "../ui.button";
|
|
5
|
-
import
|
|
5
|
+
import UCol from "../ui.container-col";
|
|
6
6
|
|
|
7
7
|
import { getArgTypes, getSlotsFragment } from "../service.storybook";
|
|
8
8
|
|
|
@@ -47,7 +47,7 @@ const DefaultTemplate = (args) => ({
|
|
|
47
47
|
});
|
|
48
48
|
|
|
49
49
|
const TypesTemplate = (args) => ({
|
|
50
|
-
components: { UNotify, UButton,
|
|
50
|
+
components: { UNotify, UButton, UCol },
|
|
51
51
|
setup() {
|
|
52
52
|
function onClick(type) {
|
|
53
53
|
if (type === "success") {
|
|
@@ -80,11 +80,11 @@ const TypesTemplate = (args) => ({
|
|
|
80
80
|
template: `
|
|
81
81
|
<UNotify class="m-4" />
|
|
82
82
|
|
|
83
|
-
<
|
|
83
|
+
<UCol>
|
|
84
84
|
<UButton label="Success" color="green" @click="onClick('success')"/>
|
|
85
85
|
<UButton label="Warning" color="orange" @click="onClick('warning')"/>
|
|
86
86
|
<UButton label="Error" color="red" @click="onClick('error')"/>
|
|
87
|
-
</
|
|
87
|
+
</UCol>
|
|
88
88
|
`,
|
|
89
89
|
});
|
|
90
90
|
|
package/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"framework": "vue",
|
|
3
3
|
"name": "vueless",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.239",
|
|
5
5
|
"contributions": {
|
|
6
6
|
"html": {
|
|
7
7
|
"description-markup": "markdown",
|
|
@@ -1644,6 +1644,85 @@
|
|
|
1644
1644
|
"symbol": "default"
|
|
1645
1645
|
}
|
|
1646
1646
|
},
|
|
1647
|
+
{
|
|
1648
|
+
"name": "UCol",
|
|
1649
|
+
"description": "",
|
|
1650
|
+
"attributes": [
|
|
1651
|
+
{
|
|
1652
|
+
"name": "gap",
|
|
1653
|
+
"description": "The distance between nested elements.",
|
|
1654
|
+
"value": {
|
|
1655
|
+
"kind": "expression",
|
|
1656
|
+
"type": "'none' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
|
|
1657
|
+
},
|
|
1658
|
+
"default": "md"
|
|
1659
|
+
},
|
|
1660
|
+
{
|
|
1661
|
+
"name": "align",
|
|
1662
|
+
"description": "Nested items align (flex align-items).",
|
|
1663
|
+
"value": {
|
|
1664
|
+
"kind": "expression",
|
|
1665
|
+
"type": "'start' | 'end' | 'center' | 'stretch' | 'baseline'"
|
|
1666
|
+
},
|
|
1667
|
+
"default": "start"
|
|
1668
|
+
},
|
|
1669
|
+
{
|
|
1670
|
+
"name": "justify",
|
|
1671
|
+
"description": "Nested items horizontally align (flex justify-content).",
|
|
1672
|
+
"value": {
|
|
1673
|
+
"kind": "expression",
|
|
1674
|
+
"type": "'start' | 'end' | 'center' | 'around' | 'evenly' | 'between'"
|
|
1675
|
+
},
|
|
1676
|
+
"default": "start"
|
|
1677
|
+
},
|
|
1678
|
+
{
|
|
1679
|
+
"name": "reverse",
|
|
1680
|
+
"description": "Reverse nested items order.",
|
|
1681
|
+
"value": {
|
|
1682
|
+
"kind": "expression",
|
|
1683
|
+
"type": "boolean"
|
|
1684
|
+
},
|
|
1685
|
+
"default": "false"
|
|
1686
|
+
},
|
|
1687
|
+
{
|
|
1688
|
+
"name": "wrap",
|
|
1689
|
+
"description": "Allow items to wrap (flex flex-wrap).",
|
|
1690
|
+
"value": {
|
|
1691
|
+
"kind": "expression",
|
|
1692
|
+
"type": "boolean"
|
|
1693
|
+
},
|
|
1694
|
+
"default": "false"
|
|
1695
|
+
},
|
|
1696
|
+
{
|
|
1697
|
+
"name": "config",
|
|
1698
|
+
"description": "Component ui config object.",
|
|
1699
|
+
"value": {
|
|
1700
|
+
"kind": "expression",
|
|
1701
|
+
"type": "object"
|
|
1702
|
+
},
|
|
1703
|
+
"default": "{}"
|
|
1704
|
+
},
|
|
1705
|
+
{
|
|
1706
|
+
"name": "dataCy",
|
|
1707
|
+
"description": "Data-cy attribute for automated testing.",
|
|
1708
|
+
"value": {
|
|
1709
|
+
"kind": "expression",
|
|
1710
|
+
"type": "string"
|
|
1711
|
+
},
|
|
1712
|
+
"default": "\"\""
|
|
1713
|
+
}
|
|
1714
|
+
],
|
|
1715
|
+
"slots": [
|
|
1716
|
+
{
|
|
1717
|
+
"name": "default",
|
|
1718
|
+
"description": "Use it to add something inside."
|
|
1719
|
+
}
|
|
1720
|
+
],
|
|
1721
|
+
"source": {
|
|
1722
|
+
"module": "./src/ui.container-col/index.vue",
|
|
1723
|
+
"symbol": "default"
|
|
1724
|
+
}
|
|
1725
|
+
},
|
|
1647
1726
|
{
|
|
1648
1727
|
"name": "UColorPicker",
|
|
1649
1728
|
"description": "",
|
|
@@ -3557,51 +3636,6 @@
|
|
|
3557
3636
|
},
|
|
3558
3637
|
"default": "\"\""
|
|
3559
3638
|
},
|
|
3560
|
-
{
|
|
3561
|
-
"name": "gap",
|
|
3562
|
-
"description": "The distance between nested elements.",
|
|
3563
|
-
"value": {
|
|
3564
|
-
"kind": "expression",
|
|
3565
|
-
"type": "'none' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
|
|
3566
|
-
},
|
|
3567
|
-
"default": "md"
|
|
3568
|
-
},
|
|
3569
|
-
{
|
|
3570
|
-
"name": "align",
|
|
3571
|
-
"description": "Nested items align (flex align-items).",
|
|
3572
|
-
"value": {
|
|
3573
|
-
"kind": "expression",
|
|
3574
|
-
"type": "'start' | 'end' | 'center' | 'stretch' | 'baseline'"
|
|
3575
|
-
},
|
|
3576
|
-
"default": "start"
|
|
3577
|
-
},
|
|
3578
|
-
{
|
|
3579
|
-
"name": "justify",
|
|
3580
|
-
"description": "Nested items horizontally align (flex justify-content).",
|
|
3581
|
-
"value": {
|
|
3582
|
-
"kind": "expression",
|
|
3583
|
-
"type": "'start' | 'end' | 'center' | 'around' | 'evenly' | 'between'"
|
|
3584
|
-
},
|
|
3585
|
-
"default": "start"
|
|
3586
|
-
},
|
|
3587
|
-
{
|
|
3588
|
-
"name": "reverse",
|
|
3589
|
-
"description": "Reverse nested items order.",
|
|
3590
|
-
"value": {
|
|
3591
|
-
"kind": "expression",
|
|
3592
|
-
"type": "boolean"
|
|
3593
|
-
},
|
|
3594
|
-
"default": "false"
|
|
3595
|
-
},
|
|
3596
|
-
{
|
|
3597
|
-
"name": "wrap",
|
|
3598
|
-
"description": "Allow items to wrap (flex flex-wrap).",
|
|
3599
|
-
"value": {
|
|
3600
|
-
"kind": "expression",
|
|
3601
|
-
"type": "boolean"
|
|
3602
|
-
},
|
|
3603
|
-
"default": "false"
|
|
3604
|
-
},
|
|
3605
3639
|
{
|
|
3606
3640
|
"name": "upperlined",
|
|
3607
3641
|
"description": "Show line above the header.",
|
|
@@ -7916,7 +7950,7 @@
|
|
|
7916
7950
|
"kind": "expression",
|
|
7917
7951
|
"type": "string"
|
|
7918
7952
|
},
|
|
7919
|
-
"default": "
|
|
7953
|
+
"default": "\"\""
|
|
7920
7954
|
},
|
|
7921
7955
|
{
|
|
7922
7956
|
"name": "rows",
|