rettangoli-ui 0.1.0-rc1 → 0.1.0-rc3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/README.md +16 -27
  2. package/dist/rettangoli-iife-layout.min.js +360 -284
  3. package/dist/rettangoli-iife-ui.min.js +382 -548
  4. package/package.json +13 -5
  5. package/src/common/BaseElement.js +182 -0
  6. package/src/common.js +190 -0
  7. package/src/components/dialog/dialog.handlers.js +5 -0
  8. package/src/components/dialog/dialog.store.js +24 -0
  9. package/src/components/dialog/dialog.view.yaml +40 -0
  10. package/src/components/form/form.handlers.js +30 -0
  11. package/src/components/form/form.store.js +45 -0
  12. package/src/components/form/form.view.yaml +47 -0
  13. package/src/components/navbar/navbar.examples.yaml +86 -0
  14. package/src/components/navbar/navbar.handlers.js +10 -0
  15. package/src/components/navbar/navbar.store.js +46 -0
  16. package/src/components/navbar/navbar.view.yaml +74 -0
  17. package/src/components/pageOutline/pageOutline.handlers.js +69 -0
  18. package/src/components/pageOutline/pageOutline.store.js +40 -0
  19. package/src/components/pageOutline/pageOutline.view.yaml +34 -0
  20. package/src/components/popover/popover.handlers.js +17 -0
  21. package/src/components/popover/popover.store.js +37 -0
  22. package/src/components/popover/popover.view.yaml +50 -0
  23. package/src/components/select/select.handlers.js +15 -0
  24. package/src/components/select/select.store.js +25 -0
  25. package/src/components/select/select.view.yaml +38 -0
  26. package/src/components/sidebar/sidebar.handlers.js +36 -0
  27. package/src/components/sidebar/sidebar.store.js +125 -0
  28. package/src/components/sidebar/sidebar.view.yaml +186 -0
  29. package/src/entry-iife-layout.js +15 -0
  30. package/src/entry-iife-ui.js +18 -0
  31. package/src/index.js +17 -0
  32. package/src/lib/uhtml.js +9 -0
  33. package/src/primitives/button.js +263 -0
  34. package/src/primitives/image.js +234 -0
  35. package/src/primitives/input.js +208 -0
  36. package/src/primitives/svg.js +95 -0
  37. package/src/primitives/text.js +141 -0
  38. package/src/primitives/textarea.js +103 -0
  39. package/src/primitives/view.js +215 -0
  40. package/src/setup.js +16 -0
  41. package/src/styles/anchorStyles.js +13 -0
  42. package/src/styles/buttonMarginStyles.js +84 -0
  43. package/src/styles/cursorStyles.js +12 -0
  44. package/src/styles/flexChildStyles.js +43 -0
  45. package/src/styles/flexDirectionStyles.js +74 -0
  46. package/src/styles/marginStyles.js +13 -0
  47. package/src/styles/paddingSvgStyles.js +120 -0
  48. package/src/styles/scrollStyles.js +22 -0
  49. package/src/styles/textColorStyles.js +14 -0
  50. package/src/styles/textStyles.js +62 -0
  51. package/src/styles/viewStyles.js +119 -0
package/src/styles/scrollStyles.js ADDED
@@ -0,0 +1,22 @@
1
+
2
+ import { css } from '../common.js'
3
+
4
+ export default css`
5
+ :host([sh]:not([sv])) {
6
+ overflow-x: scroll;
7
+ flex-wrap: nowrap;
8
+ }
9
+ :host([sv]:not([sh])) {
10
+ overflow-y: scroll;
11
+ flex-wrap: nowrap;
12
+ }
13
+ :host([sh][sv]) {
14
+ overflow: scroll;
15
+ flex-wrap: nowrap;
16
+ }
17
+ :host([overflow="hidden"]) {
18
+ overflow: hidden;
19
+ flex-wrap: nowrap;
20
+ }
21
+
22
+ `
package/src/styles/textColorStyles.js ADDED
@@ -0,0 +1,14 @@
1
+ import { generateCSS } from "../common.js";
2
+
3
+ const styles = {
4
+ c: {
5
+ "fg": "--foreground",
6
+ "de": "--destructive",
7
+ "pr-fg": "--primary-foreground",
8
+ "se-fg": "--secondary-foreground",
9
+ "mu-fg": "--muted-foreground",
10
+ "ac-fg": "--accent-foreground",
11
+ },
12
+ };
13
+
14
+ export default generateCSS(styles);
package/src/styles/textStyles.js ADDED
@@ -0,0 +1,62 @@
1
+ import { generateCSS } from "../common.js";
2
+
3
+ const styles = {
4
+ ta: {
5
+ s: 'start',
6
+ c: 'center',
7
+ e: 'end',
8
+ j: 'justify'
9
+ },
10
+ s: {
11
+ h1: `
12
+ font-size: var(--h1-font-size);
13
+ font-weight: var(--h1-font-weight);
14
+ line-height: var(--h1-line-height);
15
+ letter-spacing: var(--h1-letter-spacing);
16
+ `,
17
+ h2: `
18
+ font-size: var(--h2-font-size);
19
+ font-weight: var(--h2-font-weight);
20
+ line-height: var(--h2-line-height);
21
+ letter-spacing: var(--h2-letter-spacing);
22
+ `,
23
+ h3: `
24
+ font-size: var(--h3-font-size);
25
+ font-weight: var(--h3-font-weight);
26
+ line-height: var(--h3-line-height);
27
+ letter-spacing: var(--h3-letter-spacing);
28
+ `,
29
+ h4: `
30
+ font-size: var(--h4-font-size);
31
+ font-weight: var(--h4-font-weight);
32
+ line-height: var(--h4-line-height);
33
+ letter-spacing: var(--h4-letter-spacing);
34
+ `,
35
+ lg: `
36
+ font-size: var(--lg-font-size);
37
+ font-weight: var(--lg-font-weight);
38
+ line-height: var(--lg-line-height);
39
+ letter-spacing: var(--lg-letter-spacing);
40
+ `,
41
+ md: `
42
+ font-size: var(--md-font-size);
43
+ font-weight: var(--md-font-weight);
44
+ line-height: var(--md-line-height);
45
+ letter-spacing: var(--md-letter-spacing);
46
+ `,
47
+ sm: `
48
+ font-size: var(--sm-font-size);
49
+ font-weight: var(--sm-font-weight);
50
+ line-height: var(--sm-line-height);
51
+ letter-spacing: var(--sm-letter-spacing);
52
+ `,
53
+ xs: `
54
+ font-size: var(--xs-font-size);
55
+ font-weight: var(--xs-font-weight);
56
+ line-height: var(--xs-line-height);
57
+ letter-spacing: var(--xs-letter-spacing);
58
+ `,
59
+ },
60
+ };
61
+
62
+ export default generateCSS(styles);
package/src/styles/viewStyles.js ADDED
@@ -0,0 +1,119 @@
1
+ import { generateCSS, spacing } from "../common.js";
2
+
3
+ const borderWidth = {
4
+ xs: "--border-width-xs",
5
+ sm: "--border-width-sm",
6
+ md: "--border-width-md",
7
+ lg: "--border-width-lg",
8
+ xl: "--border-width-xl",
9
+ }
10
+
11
+ const styles = {
12
+ bgc: {
13
+ pr: `
14
+ background-color: var(--primary);
15
+ `,
16
+ se: `
17
+ background-color: var(--secondary);
18
+ `,
19
+ de: `
20
+ background-color: var(--destructive);
21
+ `,
22
+ fg: `
23
+ background-color: var(--foreground);
24
+ `,
25
+ bg: `
26
+ background-color: var(--background);
27
+ `,
28
+ mu: `
29
+ background-color: var(--muted);
30
+ `,
31
+ ac: `
32
+ background-color: var(--accent);
33
+ `,
34
+ bo: `
35
+ background-color: var(--border);
36
+ `,
37
+ },
38
+ pos: {
39
+ rel: "relative",
40
+ abs: "absolute",
41
+ fix: "fixed",
42
+ },
43
+ cor: {
44
+ full: `
45
+ top: 0;
46
+ right: 0;
47
+ bottom: 0;
48
+ left: 0;
49
+ height: 100%;
50
+ `,
51
+ top: `
52
+ top: 0;
53
+ right: 0;
54
+ left: 0;
55
+ `,
56
+ right: `
57
+ top: 0;
58
+ right: 0;
59
+ bottom: 0;
60
+ height: 100%;
61
+ `,
62
+ bottom: `
63
+ right: 0;
64
+ bottom: 0;
65
+ left: 0;
66
+ `,
67
+ left: `
68
+ bottom: 0;
69
+ left: 0;
70
+ top: 0;
71
+ height: 100%;
72
+ `,
73
+ },
74
+ shadow: {
75
+ sm: "--shadow-sm",
76
+ md: "--shadow-md",
77
+ lg: "--shadow-lg",
78
+ },
79
+ pt: spacing,
80
+ pr: spacing,
81
+ pb:spacing,
82
+ pl: spacing,
83
+ p: spacing,
84
+ ph: spacing,
85
+ pv: spacing,
86
+ g: spacing,
87
+ gv: spacing,
88
+ gh: spacing,
89
+ bw: borderWidth,
90
+ bwt: borderWidth,
91
+ bwr: borderWidth,
92
+ bwb: borderWidth,
93
+ bwl: borderWidth,
94
+ bc: {
95
+ p: "--color-primary",
96
+ pc: "--color-primary-container",
97
+ s: "--color-secondary",
98
+ sc: "--color-secondary-container",
99
+ e: "--color-error",
100
+ ec: "--color-error-container",
101
+ su: "--color-surface",
102
+ sucl: "--color-surface-container-low",
103
+ suc: "--color-surface-container",
104
+ such: "--color-surface-container-high",
105
+ isu: "--color-inverse-surface",
106
+ o: "--color-outline",
107
+ ov: "--color-outline-variant",
108
+ },
109
+ br: {
110
+ xs: "--border-radius-xs",
111
+ sm: "--border-radius-sm",
112
+ md: "--border-radius-md",
113
+ lg: "--border-radius-lg",
114
+ xl: "--border-radius-xl",
115
+ f: "--border-radius-f",
116
+ },
117
+ };
118
+
119
+ export default generateCSS(styles)