vueless 0.0.644 → 0.0.645

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vueless",
3
- "version": "0.0.644",
3
+ "version": "0.0.645",
4
4
  "license": "MIT",
5
5
  "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
6
6
  "keywords": [
@@ -157,7 +157,7 @@ const {
157
157
  <slot name="footer-after" />
158
158
  </div>
159
159
 
160
- <div v-if="fixedRounding && !isMobileBreakpoint" v-bind="rightRoundingWrapperAttrs">
160
+ <div v-if="!isMobileBreakpoint" v-bind="rightRoundingWrapperAttrs">
161
161
  <div v-bind="rightRoundingAttrs" />
162
162
  </div>
163
163
  </div>
@@ -15,25 +15,20 @@ export default /*tw*/ {
15
15
  "5xl": "md:w-[75rem] md:max-[1300px]:!w-full",
16
16
  wide: "md:w-full",
17
17
  },
18
- fixedRounding: {
19
- true: "relative pr-0 md:pr-4 md:rounded-none",
20
- false: "md:rounded-r-2xl",
21
- },
22
- },
23
- },
24
- page: {
25
- base: "p-4 md:py-6 md:pl-8 mx-auto min-h-screen w-full",
26
- variants: {
27
18
  gray: {
28
19
  false: "bg-white",
29
20
  true: "bg-gray-50",
30
21
  },
31
- fixedRounding: {
32
- true: "md:pr-4",
33
- false: "md:pr-8",
22
+ rounding: {
23
+ relative: "md:relative md:pr-4 md:rounded-r-dynamic-lg",
24
+ fixed: "md:bg-transparent md:relative md:pr-4 md:rounded-r-dynamic-lg",
34
25
  },
35
26
  },
36
27
  },
28
+ page: {
29
+ base: "p-4 md:py-6 md:pl-8 md:pr-8 mx-auto min-h-screen w-full",
30
+ compoundVariants: [{ rounding: ["fixed", "relative"], class: "md:pr-4" }],
31
+ },
37
32
  header: "flex items-start justify-between mb-4 md:mb-6",
38
33
  headerLeft: "flex items-center gap-4",
39
34
  headerLeftFallback: "flex flex-col gap-0.5",
@@ -43,12 +38,19 @@ export default /*tw*/ {
43
38
  description: "mt-1.5 text-base font-normal text-gray-500",
44
39
  headerRight: "",
45
40
  body: "",
46
- footer: `mb-0 mt-14 justify-between pt-8 md:flex md:items-baseline space-y-4 md:space-y-0 border-t border-gray-200`,
41
+ footer: "mb-0 mt-14 justify-between pt-8 md:flex md:items-baseline space-y-4 md:space-y-0 border-t border-gray-200",
47
42
  footerLeft: "md:flex space-y-4 md:space-x-4 md:space-y-0",
48
43
  footerRight: "md:flex space-y-4 md:space-x-4 md:space-y-0",
49
- rightRoundingWrapper: "absolute right-4",
44
+ rightRoundingWrapper: {
45
+ base: "absolute right-4",
46
+ variants: {
47
+ rounding: {
48
+ none: "hidden",
49
+ },
50
+ },
51
+ },
50
52
  rightRounding: {
51
- base: "fixed top-0 w-4 rounded-r-2xl bg-white h-screen",
53
+ base: "fixed top-0 w-4 rounded-r-dynamic-lg h-screen",
52
54
  variants: {
53
55
  gray: {
54
56
  false: "bg-white",
@@ -57,10 +59,10 @@ export default /*tw*/ {
57
59
  },
58
60
  },
59
61
  defaults: {
62
+ rounding: "none",
60
63
  titleSize: "md",
61
64
  size: "wide",
62
65
  gray: false,
63
- fixedRounding: false,
64
66
  /* icons */
65
67
  backIcon: "arrow_back",
66
68
  },
@@ -37,14 +37,14 @@ export interface Props {
37
37
  backLabel?: string;
38
38
 
39
39
  /**
40
- * Sets background light gray (useful if the page contains nested cards).
40
+ * Show rounding block on the right side of the component.
41
41
  */
42
- gray?: boolean;
42
+ rounding?: "none" | "fixed" | "relative";
43
43
 
44
44
  /**
45
- * Stick right page rounding.
45
+ * Sets background light gray (useful if the page contains nested cards).
46
46
  */
47
- fixedRounding?: boolean;
47
+ gray?: boolean;
48
48
 
49
49
  /**
50
50
  * Component config object.
@@ -51,7 +51,7 @@ export default /*tw*/ {
51
51
  ],
52
52
  },
53
53
  defaults: {
54
- rows: "1",
54
+ rows: "2",
55
55
  size: "md",
56
56
  inputmode: "text",
57
57
  labelAlign: "topInside",