lapikit 0.0.0-insiders.de81aed → 0.0.0-insiders.df219d7

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 (106) hide show
  1. package/bin/helper.js +23 -0
  2. package/bin/index.js +65 -0
  3. package/bin/lapikit.js +37 -5
  4. package/bin/modules/plugin.js +223 -0
  5. package/dist/actions/index.d.ts +1 -0
  6. package/dist/actions/index.js +1 -0
  7. package/dist/assets/icons/arrow-down.svelte +12 -0
  8. package/dist/assets/icons/arrow-down.svelte.d.ts +18 -0
  9. package/dist/assets/icons/arrow-up.svelte +12 -0
  10. package/dist/assets/icons/arrow-up.svelte.d.ts +18 -0
  11. package/dist/assets/icons/close-fill.svelte +12 -0
  12. package/dist/assets/icons/close-fill.svelte.d.ts +18 -0
  13. package/dist/assets/icons/loading-fill.svelte +2 -0
  14. package/dist/assets/icons/loading-fill.svelte.d.ts +6 -14
  15. package/dist/components/accordion/accordion.css +113 -0
  16. package/dist/components/accordion/accordion.svelte +37 -0
  17. package/dist/components/accordion/accordion.svelte.d.ts +4 -0
  18. package/dist/components/accordion/accordion.svelte.js +24 -0
  19. package/dist/components/accordion/modules/accordion-item.svelte +94 -0
  20. package/dist/components/accordion/modules/accordion-item.svelte.d.ts +4 -0
  21. package/dist/components/accordion/types.d.ts +33 -0
  22. package/dist/components/accordion/types.js +1 -0
  23. package/dist/components/alert/alert.css +137 -0
  24. package/dist/components/alert/alert.svelte +89 -0
  25. package/dist/components/alert/alert.svelte.d.ts +4 -0
  26. package/dist/components/alert/types.d.ts +28 -0
  27. package/dist/components/alert/types.js +1 -0
  28. package/dist/components/app/app.css +16 -0
  29. package/dist/components/app/app.svelte +31 -2
  30. package/dist/components/appbar/appbar.css +48 -0
  31. package/dist/components/appbar/appbar.svelte +40 -0
  32. package/dist/components/appbar/appbar.svelte.d.ts +4 -0
  33. package/dist/components/appbar/types.d.ts +15 -0
  34. package/dist/components/appbar/types.js +1 -0
  35. package/dist/components/aspect-ratio/aspect-ratio.css +19 -0
  36. package/dist/components/aspect-ratio/aspect-ratio.svelte +47 -0
  37. package/dist/components/aspect-ratio/aspect-ratio.svelte.d.ts +4 -0
  38. package/dist/components/aspect-ratio/types.d.ts +5 -0
  39. package/dist/components/aspect-ratio/types.js +1 -0
  40. package/dist/components/avatar/avatar.css +109 -0
  41. package/dist/components/avatar/avatar.svelte +46 -0
  42. package/dist/components/avatar/avatar.svelte.d.ts +4 -0
  43. package/dist/components/avatar/types.d.ts +22 -0
  44. package/dist/components/avatar/types.js +1 -0
  45. package/dist/components/button/button.css +165 -194
  46. package/dist/components/button/button.svelte +39 -31
  47. package/dist/components/button/button.svelte.d.ts +2 -2
  48. package/dist/components/button/types.d.ts +7 -5
  49. package/dist/components/card/card.css +115 -0
  50. package/dist/components/card/card.svelte +63 -0
  51. package/dist/components/card/card.svelte.d.ts +4 -0
  52. package/dist/components/card/types.d.ts +18 -0
  53. package/dist/components/card/types.js +1 -0
  54. package/dist/components/chip/chip.css +231 -0
  55. package/dist/components/chip/chip.svelte +129 -0
  56. package/dist/components/chip/chip.svelte.d.ts +4 -0
  57. package/dist/components/chip/types.d.ts +31 -0
  58. package/dist/components/chip/types.js +1 -0
  59. package/dist/components/dialog/dialog.css +2 -11
  60. package/dist/components/dialog/types.d.ts +5 -2
  61. package/dist/components/dropdown/dropdown.css +4 -4
  62. package/dist/components/icon/icon.css +14 -11
  63. package/dist/components/index.d.ts +14 -1
  64. package/dist/components/index.js +14 -1
  65. package/dist/components/list/list.css +221 -0
  66. package/dist/components/list/list.svelte +44 -0
  67. package/dist/components/list/list.svelte.d.ts +4 -0
  68. package/dist/components/list/modules/list-item.svelte +76 -0
  69. package/dist/components/list/modules/list-item.svelte.d.ts +4 -0
  70. package/dist/components/list/types.d.ts +33 -0
  71. package/dist/components/list/types.js +1 -0
  72. package/dist/components/modal/modal.css +132 -7
  73. package/dist/components/modal/modal.svelte +92 -38
  74. package/dist/components/modal/types.d.ts +6 -1
  75. package/dist/components/popover/popover.css +4 -4
  76. package/dist/components/separator/separator.css +1 -1
  77. package/dist/components/spacer/spacer.css +3 -0
  78. package/dist/components/spacer/spacer.svelte +7 -0
  79. package/dist/components/spacer/spacer.svelte.d.ts +4 -0
  80. package/dist/components/spacer/types.d.ts +4 -0
  81. package/dist/components/spacer/types.js +1 -0
  82. package/dist/components/textfield/textfield.css +305 -0
  83. package/dist/components/textfield/textfield.svelte +193 -0
  84. package/dist/components/textfield/textfield.svelte.d.ts +4 -0
  85. package/dist/components/textfield/types.d.ts +37 -0
  86. package/dist/components/textfield/types.js +1 -0
  87. package/dist/components/toolbar/toolbar.css +129 -0
  88. package/dist/components/toolbar/toolbar.svelte +47 -0
  89. package/dist/components/toolbar/toolbar.svelte.d.ts +4 -0
  90. package/dist/components/toolbar/types.d.ts +27 -0
  91. package/dist/components/toolbar/types.js +1 -0
  92. package/dist/components/tooltip/tooltip.css +4 -4
  93. package/dist/internal/assets.svelte.js +2 -0
  94. package/dist/internal/ripple.d.ts +12 -0
  95. package/dist/internal/ripple.js +93 -0
  96. package/dist/internal/unit.d.ts +1 -0
  97. package/dist/internal/unit.js +11 -0
  98. package/dist/preset.js +2 -2
  99. package/dist/stores/index.d.ts +9 -3
  100. package/dist/stores/index.js +27 -3
  101. package/dist/style/animation.css +42 -0
  102. package/dist/style/normalize.css +2 -0
  103. package/dist/style/parser/color.js +2 -2
  104. package/dist/style/parser/device.js +31 -19
  105. package/dist/style/variable.css +5 -0
  106. package/package.json +12 -4
@@ -18,3 +18,45 @@
18
18
  transform: rotate(380deg);
19
19
  }
20
20
  }
21
+
22
+ .kit-ripple {
23
+ background-color: currentColor;
24
+ opacity: 0.1;
25
+ position: absolute;
26
+ border-radius: 50%;
27
+ pointer-events: none;
28
+ -webkit-transition: 0.6s;
29
+ transition: 0.6s;
30
+ -webkit-animation: lapikit-ripple var(--ripple-duration, 0.4s) cubic-bezier(0.4, 0, 0.2, 1);
31
+ animation: lapikit-ripple var(--ripple-duration, 0.4s) cubic-bezier(0.4, 0, 0.2, 1);
32
+ border-radius: var(--ripple-radius);
33
+ }
34
+
35
+ .kit-ripple--center {
36
+ top: 50% !important;
37
+ left: 50% !important;
38
+ translate: -50% -50% !important;
39
+ }
40
+
41
+ .kit-ripple--effect {
42
+ position: absolute;
43
+ left: 0;
44
+ right: 0;
45
+ top: 0;
46
+ bottom: 0;
47
+ overflow: hidden;
48
+ background: none;
49
+ pointer-events: none;
50
+ z-index: 999;
51
+ border-radius: var(--ripple-radius);
52
+ }
53
+
54
+ @keyframes lapikit-ripple {
55
+ from {
56
+ scale: 0;
57
+ }
58
+
59
+ to {
60
+ scale: 1;
61
+ }
62
+ }
@@ -4,6 +4,8 @@ html {
4
4
  line-height: 1.5;
5
5
  box-sizing: border-box;
6
6
  font-family: var(--kit-font-family-sans);
7
+ background-color: var(--kit-base);
8
+ color: var(--kit-on-base);
7
9
  }
8
10
 
9
11
  pre,
@@ -38,7 +38,7 @@ export const colors = (config) => {
38
38
  }
39
39
  cssVariables += `}\n`;
40
40
  cssVariables += `.${inversed} {\n`;
41
- cssVariables += `color-scheme: ${used};\n`;
41
+ cssVariables += `color-scheme: ${inversed};\n`;
42
42
  for (const [colorName, colorValue] of Object.entries(schemes[inversed])) {
43
43
  cssVariables += `--kit-${colorName}: ${colorValue};\n`;
44
44
  }
@@ -56,7 +56,7 @@ export const colors = (config) => {
56
56
  }
57
57
  cssVariables += `}\n`;
58
58
  cssVariables += `.${inversed} {\n`;
59
- cssVariables += `color-scheme: ${used};\n`;
59
+ cssVariables += `color-scheme: ${inversed};\n`;
60
60
  for (const [colorName, colorValue] of Object.entries(schemes[inversed])) {
61
61
  cssVariables += `--kit-${colorName}: ${colorValue};\n`;
62
62
  }
@@ -1,3 +1,4 @@
1
+ import { setUnit } from '../../internal/unit.js';
1
2
  export const devices = (config) => {
2
3
  let css = ``;
3
4
  const list = {
@@ -5,24 +6,35 @@ export const devices = (config) => {
5
6
  tablet: config.breakpoints.tabletBreakpoint,
6
7
  laptop: config.breakpoints.laptopBreakpoint
7
8
  };
8
- for (const [key, value] of Object.entries(list)) {
9
- const breakpointValue = config.breakpoints.thresholds[value];
10
- const breakpointValueMax = key !== 'laptop'
11
- ? config.breakpoints.thresholds[key === 'mobile' ? list.tablet : key == 'tablet' ? list.laptop : '']
12
- : undefined;
13
- css += `.device-${key}, .only-on-${key} {\n`;
14
- css += `display: none;\n`;
15
- css += `}\n`;
16
- css += `@media screen and (min-width: ${typeof breakpointValue === 'number' ? breakpointValue + 'px' : breakpointValue}) {\n`;
17
- css += `.device-${key} {\n`;
18
- css += `display: inherit !important;\n`;
19
- css += `}\n`;
20
- css += `}\n`;
21
- css += `@media screen and (min-width: ${typeof breakpointValue === 'number' ? breakpointValue + 'px' : breakpointValue}) ${breakpointValueMax ? `and (max-width: ${typeof breakpointValueMax === 'number' ? breakpointValueMax + 'px' : breakpointValueMax})` : ''}{\n`;
22
- css += `.only-on-${key} {\n`;
23
- css += `display: inherit !important;\n`;
24
- css += `}\n`;
25
- css += `}\n`;
26
- }
9
+ css += `@media screen and (max-width: ${setUnit(config.breakpoints.thresholds[list.mobile])}) {\n`;
10
+ css += `.hidden-mobile {\n`;
11
+ css += `display: none !important;\n`;
12
+ css += `}\n`;
13
+ css += `}\n`;
14
+ css += `@media screen and (min-width: ${setUnit(config.breakpoints.thresholds[list.mobile])}) {\n`;
15
+ css += `.display-mobile {\n`;
16
+ css += `display: none !important;\n`;
17
+ css += `}\n`;
18
+ css += `}\n`;
19
+ css += `@media screen and (min-width: ${setUnit(config.breakpoints.thresholds[list.tablet])}) and (max-width: ${setUnit(config.breakpoints.thresholds[list.laptop])}) {\n`;
20
+ css += `.hidden-tablet {\n`;
21
+ css += `display: none !important;\n`;
22
+ css += `}\n`;
23
+ css += `}\n`;
24
+ css += `@media screen and (max-width: ${setUnit(config.breakpoints.thresholds[list.tablet])}) and (min-width: ${setUnit(config.breakpoints.thresholds[list.laptop])}){\n`;
25
+ css += `.display-tablet {\n`;
26
+ css += `display: none !important;\n`;
27
+ css += `}\n`;
28
+ css += `}\n`;
29
+ css += `@media screen and (min-width: ${setUnit(config.breakpoints.thresholds[list.laptop])}) {\n`;
30
+ css += `.hidden-laptop {\n`;
31
+ css += `display: none !important;\n`;
32
+ css += `}\n`;
33
+ css += `}\n`;
34
+ css += `@media screen and (max-width: ${setUnit(config.breakpoints.thresholds[list.laptop])}) {\n`;
35
+ css += `.display-laptop {\n`;
36
+ css += `display: none !important;\n`;
37
+ css += `}\n`;
38
+ css += `}\n`;
27
39
  return css;
28
40
  };
@@ -4,4 +4,9 @@
4
4
  --kit-dialog-size-md: 37.5rem;
5
5
  --kit-dialog-size-lg: 53.125rem;
6
6
  --kit-dialog-size-xl: 75rem;
7
+ --kit-modal-size-xs: 18.75rem;
8
+ --kit-modal-size-sm: 25rem;
9
+ --kit-modal-size-md: 37.5rem;
10
+ --kit-modal-size-lg: 53.125rem;
11
+ --kit-modal-size-xl: 75rem;
7
12
  }
package/package.json CHANGED
@@ -1,10 +1,11 @@
1
1
  {
2
2
  "name": "lapikit",
3
- "version": "0.0.0-insiders.de81aed",
3
+ "version": "0.0.0-insiders.df219d7",
4
4
  "license": "MIT",
5
5
  "publishConfig": {
6
6
  "access": "public"
7
7
  },
8
+ "homepage": "https://lapikit.dev",
8
9
  "repository": {
9
10
  "type": "git",
10
11
  "url": "git+https://github.com/Nycolaide/lapikit.git",
@@ -35,14 +36,15 @@
35
36
  "**/*.css"
36
37
  ],
37
38
  "bin": {
38
- "lapikit": "bin/lapikit.js"
39
+ "lapikit": "bin/index.js"
39
40
  },
40
41
  "svelte": "./dist/index.js",
41
42
  "types": "./dist/index.d.ts",
42
43
  "type": "module",
43
44
  "exports": {
44
45
  ".": {
45
- "types": "./dist/index.d.ts"
46
+ "types": "./dist/index.d.ts",
47
+ "svelte": "./dist/index.js"
46
48
  },
47
49
  "./components": {
48
50
  "svelte": "./dist/components/index.js",
@@ -54,6 +56,9 @@
54
56
  "./stores": {
55
57
  "default": "./dist/stores/index.js"
56
58
  },
59
+ "./actions": {
60
+ "default": "./dist/actions/index.js"
61
+ },
57
62
  "./css": "./dist/styles.css"
58
63
  },
59
64
  "peerDependencies": {
@@ -85,5 +90,8 @@
85
90
  },
86
91
  "keywords": [
87
92
  "svelte"
88
- ]
93
+ ],
94
+ "dependencies": {
95
+ "prompts": "^2.4.2"
96
+ }
89
97
  }