lapikit 0.5.9 → 0.6.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.
Files changed (214) hide show
  1. package/dist/@types/actions.d.ts +6 -0
  2. package/dist/@types/index.d.ts +1 -0
  3. package/dist/@types/index.js +1 -0
  4. package/dist/actions.d.ts +2 -0
  5. package/dist/actions.js +2 -0
  6. package/dist/components/dialog/dialog.svelte +1 -2
  7. package/dist/{@legacy/stores/components.d.ts → components/modal/modal.d.ts} +1 -2
  8. package/dist/{@legacy/stores/components.js → components/modal/modal.js} +1 -1
  9. package/dist/components/modal/modal.svelte +1 -1
  10. package/dist/components/textfield/textfield.svelte.d.ts +1 -1
  11. package/dist/constants.d.ts +2 -2
  12. package/dist/constants.js +2 -2
  13. package/dist/utils/outside.d.ts +1 -0
  14. package/dist/utils/outside.js +5 -0
  15. package/dist/{@legacy/stores → utils}/themes.d.ts +1 -0
  16. package/dist/{@legacy/actions/use-theme.js → utils/themes.js} +4 -1
  17. package/package.json +11 -32
  18. package/dist/@legacy/actions/accordion.svelte.d.ts +0 -9
  19. package/dist/@legacy/actions/index.d.ts +0 -2
  20. package/dist/@legacy/actions/index.js +0 -2
  21. package/dist/@legacy/actions/use-theme.d.ts +0 -1
  22. package/dist/@legacy/assets/icons/arrow-down.svelte +0 -12
  23. package/dist/@legacy/assets/icons/arrow-down.svelte.d.ts +0 -18
  24. package/dist/@legacy/assets/icons/arrow-up.svelte +0 -12
  25. package/dist/@legacy/assets/icons/arrow-up.svelte.d.ts +0 -18
  26. package/dist/@legacy/assets/icons/close-fill.svelte +0 -12
  27. package/dist/@legacy/assets/icons/close-fill.svelte.d.ts +0 -18
  28. package/dist/@legacy/assets/icons/loading-fill.svelte +0 -31
  29. package/dist/@legacy/assets/icons/loading-fill.svelte.d.ts +0 -18
  30. package/dist/@legacy/components/accordion/accordion.css +0 -36
  31. package/dist/@legacy/components/accordion/accordion.svelte +0 -39
  32. package/dist/@legacy/components/accordion/accordion.svelte.d.ts +0 -4
  33. package/dist/@legacy/components/accordion/modules/accordion-item.css +0 -68
  34. package/dist/@legacy/components/accordion/modules/accordion-item.svelte +0 -94
  35. package/dist/@legacy/components/accordion/modules/accordion-item.svelte.d.ts +0 -4
  36. package/dist/@legacy/components/accordion/types.d.ts +0 -33
  37. package/dist/@legacy/components/alert/alert.css +0 -130
  38. package/dist/@legacy/components/alert/alert.svelte +0 -89
  39. package/dist/@legacy/components/alert/alert.svelte.d.ts +0 -4
  40. package/dist/@legacy/components/alert/types.d.ts +0 -28
  41. package/dist/@legacy/components/alert/types.js +0 -1
  42. package/dist/@legacy/components/app/app.css +0 -26
  43. package/dist/@legacy/components/app/app.svelte +0 -79
  44. package/dist/@legacy/components/app/app.svelte.d.ts +0 -4
  45. package/dist/@legacy/components/app/types.d.ts +0 -10
  46. package/dist/@legacy/components/app/types.js +0 -1
  47. package/dist/@legacy/components/appbar/appbar.css +0 -38
  48. package/dist/@legacy/components/appbar/appbar.svelte +0 -40
  49. package/dist/@legacy/components/appbar/appbar.svelte.d.ts +0 -4
  50. package/dist/@legacy/components/appbar/types.d.ts +0 -15
  51. package/dist/@legacy/components/appbar/types.js +0 -1
  52. package/dist/@legacy/components/aspect-ratio/aspect-ratio.css +0 -19
  53. package/dist/@legacy/components/aspect-ratio/aspect-ratio.svelte +0 -25
  54. package/dist/@legacy/components/aspect-ratio/aspect-ratio.svelte.d.ts +0 -4
  55. package/dist/@legacy/components/aspect-ratio/types.d.ts +0 -5
  56. package/dist/@legacy/components/aspect-ratio/types.js +0 -1
  57. package/dist/@legacy/components/avatar/avatar.css +0 -102
  58. package/dist/@legacy/components/avatar/avatar.svelte +0 -46
  59. package/dist/@legacy/components/avatar/avatar.svelte.d.ts +0 -4
  60. package/dist/@legacy/components/avatar/types.d.ts +0 -22
  61. package/dist/@legacy/components/avatar/types.js +0 -1
  62. package/dist/@legacy/components/button/button.css +0 -240
  63. package/dist/@legacy/components/button/button.svelte +0 -102
  64. package/dist/@legacy/components/button/button.svelte.d.ts +0 -4
  65. package/dist/@legacy/components/button/types.d.ts +0 -29
  66. package/dist/@legacy/components/button/types.js +0 -1
  67. package/dist/@legacy/components/card/card.css +0 -105
  68. package/dist/@legacy/components/card/card.svelte +0 -67
  69. package/dist/@legacy/components/card/card.svelte.d.ts +0 -4
  70. package/dist/@legacy/components/card/types.d.ts +0 -20
  71. package/dist/@legacy/components/card/types.js +0 -1
  72. package/dist/@legacy/components/chip/chip.css +0 -224
  73. package/dist/@legacy/components/chip/chip.svelte +0 -131
  74. package/dist/@legacy/components/chip/chip.svelte.d.ts +0 -4
  75. package/dist/@legacy/components/chip/types.d.ts +0 -32
  76. package/dist/@legacy/components/chip/types.js +0 -1
  77. package/dist/@legacy/components/dialog/dialog.css +0 -129
  78. package/dist/@legacy/components/dialog/dialog.svelte +0 -67
  79. package/dist/@legacy/components/dialog/dialog.svelte.d.ts +0 -4
  80. package/dist/@legacy/components/dialog/types.d.ts +0 -24
  81. package/dist/@legacy/components/dialog/types.js +0 -1
  82. package/dist/@legacy/components/dropdown/dropdown.css +0 -13
  83. package/dist/@legacy/components/dropdown/dropdown.svelte +0 -115
  84. package/dist/@legacy/components/dropdown/dropdown.svelte.d.ts +0 -4
  85. package/dist/@legacy/components/dropdown/types.d.ts +0 -26
  86. package/dist/@legacy/components/dropdown/types.js +0 -1
  87. package/dist/@legacy/components/icon/icon.css +0 -78
  88. package/dist/@legacy/components/icon/icon.svelte +0 -49
  89. package/dist/@legacy/components/icon/icon.svelte.d.ts +0 -4
  90. package/dist/@legacy/components/icon/types.d.ts +0 -16
  91. package/dist/@legacy/components/icon/types.js +0 -1
  92. package/dist/@legacy/components/index.d.ts +0 -22
  93. package/dist/@legacy/components/index.js +0 -23
  94. package/dist/@legacy/components/list/list.css +0 -149
  95. package/dist/@legacy/components/list/list.svelte +0 -44
  96. package/dist/@legacy/components/list/list.svelte.d.ts +0 -4
  97. package/dist/@legacy/components/list/modules/list-item.css +0 -67
  98. package/dist/@legacy/components/list/modules/list-item.svelte +0 -76
  99. package/dist/@legacy/components/list/modules/list-item.svelte.d.ts +0 -4
  100. package/dist/@legacy/components/list/types.d.ts +0 -33
  101. package/dist/@legacy/components/list/types.js +0 -1
  102. package/dist/@legacy/components/modal/modal.css +0 -137
  103. package/dist/@legacy/components/modal/modal.svelte +0 -118
  104. package/dist/@legacy/components/modal/modal.svelte.d.ts +0 -4
  105. package/dist/@legacy/components/modal/types.d.ts +0 -26
  106. package/dist/@legacy/components/modal/types.js +0 -1
  107. package/dist/@legacy/components/popover/popover.css +0 -13
  108. package/dist/@legacy/components/popover/popover.svelte +0 -73
  109. package/dist/@legacy/components/popover/popover.svelte.d.ts +0 -4
  110. package/dist/@legacy/components/popover/types.d.ts +0 -20
  111. package/dist/@legacy/components/popover/types.js +0 -1
  112. package/dist/@legacy/components/separator/separator.css +0 -42
  113. package/dist/@legacy/components/separator/separator.svelte +0 -37
  114. package/dist/@legacy/components/separator/separator.svelte.d.ts +0 -4
  115. package/dist/@legacy/components/separator/types.d.ts +0 -15
  116. package/dist/@legacy/components/separator/types.js +0 -1
  117. package/dist/@legacy/components/spacer/spacer.css +0 -3
  118. package/dist/@legacy/components/spacer/spacer.svelte +0 -7
  119. package/dist/@legacy/components/spacer/spacer.svelte.d.ts +0 -4
  120. package/dist/@legacy/components/spacer/types.d.ts +0 -4
  121. package/dist/@legacy/components/spacer/types.js +0 -1
  122. package/dist/@legacy/components/textfield/textfield.css +0 -298
  123. package/dist/@legacy/components/textfield/textfield.svelte +0 -193
  124. package/dist/@legacy/components/textfield/textfield.svelte.d.ts +0 -4
  125. package/dist/@legacy/components/textfield/types.d.ts +0 -37
  126. package/dist/@legacy/components/textfield/types.js +0 -1
  127. package/dist/@legacy/components/toolbar/toolbar.css +0 -106
  128. package/dist/@legacy/components/toolbar/toolbar.svelte +0 -47
  129. package/dist/@legacy/components/toolbar/toolbar.svelte.d.ts +0 -4
  130. package/dist/@legacy/components/toolbar/types.d.ts +0 -27
  131. package/dist/@legacy/components/toolbar/types.js +0 -1
  132. package/dist/@legacy/components/tooltip/tooltip.css +0 -116
  133. package/dist/@legacy/components/tooltip/tooltip.svelte +0 -113
  134. package/dist/@legacy/components/tooltip/tooltip.svelte.d.ts +0 -4
  135. package/dist/@legacy/components/tooltip/types.d.ts +0 -23
  136. package/dist/@legacy/components/tooltip/types.js +0 -1
  137. package/dist/@legacy/index.d.ts +0 -3
  138. package/dist/@legacy/index.js +0 -24
  139. package/dist/@legacy/internal/config/presets.d.ts +0 -149
  140. package/dist/@legacy/internal/config/presets.js +0 -169
  141. package/dist/@legacy/internal/config/variables.d.ts +0 -3
  142. package/dist/@legacy/internal/config/variables.js +0 -3
  143. package/dist/@legacy/internal/core/actions/assets.svelte.d.ts +0 -8
  144. package/dist/@legacy/internal/core/actions/assets.svelte.js +0 -54
  145. package/dist/@legacy/internal/core/actions/dropdown.svelte.d.ts +0 -7
  146. package/dist/@legacy/internal/core/actions/dropdown.svelte.js +0 -148
  147. package/dist/@legacy/internal/core/actions/popover.svelte.d.ts +0 -7
  148. package/dist/@legacy/internal/core/actions/popover.svelte.js +0 -134
  149. package/dist/@legacy/internal/core/actions/tooltip.svelte.d.ts +0 -7
  150. package/dist/@legacy/internal/core/actions/tooltip.svelte.js +0 -131
  151. package/dist/@legacy/internal/core/animations/ripple.d.ts +0 -12
  152. package/dist/@legacy/internal/core/animations/ripple.js +0 -96
  153. package/dist/@legacy/internal/core/bin/ansi.d.ts +0 -40
  154. package/dist/@legacy/internal/core/bin/ansi.js +0 -44
  155. package/dist/@legacy/internal/core/bin/terminal.d.ts +0 -1
  156. package/dist/@legacy/internal/core/bin/terminal.js +0 -12
  157. package/dist/@legacy/internal/core/css.d.ts +0 -1
  158. package/dist/@legacy/internal/core/css.js +0 -16
  159. package/dist/@legacy/internal/core/formatter/component.d.ts +0 -5
  160. package/dist/@legacy/internal/core/formatter/component.js +0 -60
  161. package/dist/@legacy/internal/core/formatter/device.d.ts +0 -5
  162. package/dist/@legacy/internal/core/formatter/device.js +0 -66
  163. package/dist/@legacy/internal/core/formatter/index.d.ts +0 -7
  164. package/dist/@legacy/internal/core/formatter/index.js +0 -35
  165. package/dist/@legacy/internal/core/formatter/style.d.ts +0 -4
  166. package/dist/@legacy/internal/core/formatter/style.js +0 -15
  167. package/dist/@legacy/internal/core/formatter/theme.d.ts +0 -5
  168. package/dist/@legacy/internal/core/formatter/theme.js +0 -44
  169. package/dist/@legacy/internal/core/formatter/typography.d.ts +0 -5
  170. package/dist/@legacy/internal/core/formatter/typography.js +0 -12
  171. package/dist/@legacy/internal/core/minify.d.ts +0 -1
  172. package/dist/@legacy/internal/core/minify.js +0 -10
  173. package/dist/@legacy/internal/core/standard-colors.d.ts +0 -75
  174. package/dist/@legacy/internal/core/standard-colors.js +0 -75
  175. package/dist/@legacy/internal/core/x11-colors.d.ts +0 -4
  176. package/dist/@legacy/internal/core/x11-colors.js +0 -151
  177. package/dist/@legacy/internal/helpers/colors.d.ts +0 -1
  178. package/dist/@legacy/internal/helpers/colors.js +0 -50
  179. package/dist/@legacy/internal/helpers/convert.d.ts +0 -1
  180. package/dist/@legacy/internal/helpers/convert.js +0 -17
  181. package/dist/@legacy/internal/helpers/deep-merge.d.ts +0 -44
  182. package/dist/@legacy/internal/helpers/deep-merge.js +0 -80
  183. package/dist/@legacy/internal/helpers/outside.d.ts +0 -9
  184. package/dist/@legacy/internal/helpers/outside.js +0 -34
  185. package/dist/@legacy/internal/helpers/parser.d.ts +0 -10
  186. package/dist/@legacy/internal/helpers/parser.js +0 -93
  187. package/dist/@legacy/internal/helpers/scroll.d.ts +0 -1
  188. package/dist/@legacy/internal/helpers/scroll.js +0 -5
  189. package/dist/@legacy/internal/plugins/vite.d.ts +0 -8
  190. package/dist/@legacy/internal/plugins/vite.js +0 -33
  191. package/dist/@legacy/internal/types/components.d.ts +0 -14
  192. package/dist/@legacy/internal/types/components.js +0 -1
  193. package/dist/@legacy/internal/types/configuration.d.ts +0 -63
  194. package/dist/@legacy/internal/types/configuration.js +0 -1
  195. package/dist/@legacy/internal/types/index.d.ts +0 -2
  196. package/dist/@legacy/internal/types/index.js +0 -2
  197. package/dist/@legacy/stores/breakpoints.d.ts +0 -6
  198. package/dist/@legacy/stores/breakpoints.js +0 -14
  199. package/dist/@legacy/stores/devices.d.ts +0 -6
  200. package/dist/@legacy/stores/devices.js +0 -9
  201. package/dist/@legacy/stores/index.d.ts +0 -5
  202. package/dist/@legacy/stores/index.js +0 -5
  203. package/dist/@legacy/stores/themes.js +0 -4
  204. package/dist/@legacy/stores/viewport.d.ts +0 -7
  205. package/dist/@legacy/stores/viewport.js +0 -7
  206. package/dist/@legacy/styles/animation.css +0 -33
  207. package/dist/@legacy/styles/keyframes.css +0 -30
  208. package/dist/@legacy/styles/reset.css +0 -133
  209. package/dist/@legacy/styles.css +0 -0
  210. package/dist/@legacy/styles.css.d.ts +0 -4
  211. package/dist/@legacy/themes.css +0 -0
  212. package/dist/@legacy/themes.css.d.ts +0 -4
  213. /package/dist/{@legacy/components/accordion/types.js → @types/actions.js} +0 -0
  214. /package/dist/{@legacy/actions → components/accordion}/accordion.svelte.js +0 -0
@@ -1,44 +0,0 @@
1
- const color = {
2
- red: (text) => `\x1b[31m${text}\x1b[0m`,
3
- green: (text) => `\x1b[32m${text}\x1b[0m`,
4
- yellow: (text) => `\x1b[33m${text}\x1b[0m`,
5
- blue: (text) => `\x1b[34m${text}\x1b[0m`,
6
- purple: (text) => `\x1b[35m${text}\x1b[0m`,
7
- cyan: (text) => `\x1b[36m${text}\x1b[0m`
8
- };
9
- const variant = {
10
- bold: (text) => `\x1b[1m${text}\x1b[0m`,
11
- underline: (text) => `\x1b[4m${text}\x1b[0m`,
12
- inverse: (text) => `\x1b[7m${text}\x1b[0m`
13
- };
14
- const bold = {
15
- red: (text) => `\x1b[1m\x1b[31m${text}\x1b[0m`,
16
- green: (text) => `\x1b[1m\x1b[32m${text}\x1b[0m`,
17
- yellow: (text) => `\x1b[1m\x1b[33m${text}\x1b[0m`,
18
- blue: (text) => `\x1b[1m\x1b[34m${text}\x1b[0m`,
19
- purple: (text) => `\x1b[1m\x1b[35m${text}\x1b[0m`,
20
- cyan: (text) => `\x1b[1m\x1b[36m${text}\x1b[0m`
21
- };
22
- const inverse = {
23
- red: (text) => `\x1b[7m\x1b[31m${text}\x1b[0m`,
24
- green: (text) => `\x1b[7m\x1b[32m${text}\x1b[0m`,
25
- yellow: (text) => `\x1b[7m\x1b[33m${text}\x1b[0m`,
26
- blue: (text) => `\x1b[7m\x1b[34m${text}\x1b[0m`,
27
- purple: (text) => `\x1b[7m\x1b[35m${text}\x1b[0m`,
28
- cyan: (text) => `\x1b[7m\x1b[36m${text}\x1b[0m`
29
- };
30
- const underline = {
31
- red: (text) => `\x1b[4m\x1b[31m${text}\x1b[0m`,
32
- green: (text) => `\x1b[4m\x1b[32m${text}\x1b[0m`,
33
- yellow: (text) => `\x1b[4m\x1b[33m${text}\x1b[0m`,
34
- blue: (text) => `\x1b[4m\x1b[34m${text}\x1b[0m`,
35
- purple: (text) => `\x1b[4m\x1b[35m${text}\x1b[0m`,
36
- cyan: (text) => `\x1b[4m\x1b[36m${text}\x1b[0m`
37
- };
38
- export const ansi = {
39
- color,
40
- variant,
41
- bold,
42
- inverse,
43
- underline
44
- };
@@ -1 +0,0 @@
1
- export declare const terminal: (type: "info" | "error" | "warn" | "success" | undefined, msg: string) => void;
@@ -1,12 +0,0 @@
1
- import { ansi } from './ansi.js';
2
- export const terminal = (type = 'info', msg) => {
3
- const name = ansi.color.cyan('lapikit');
4
- if (type === 'error')
5
- console.error(name, ansi.bold.red('[error]'), msg);
6
- else if (type === 'warn')
7
- console.warn(name, ansi.bold.yellow('[warn]'), msg);
8
- else if (type === 'success')
9
- console.warn(name, ansi.bold.green('[success]'), msg);
10
- else
11
- console.log(name, ansi.bold.blue('[info]'), msg);
12
- };
@@ -1 +0,0 @@
1
- export declare const processImportStyles: () => Promise<string>;
@@ -1,16 +0,0 @@
1
- import { fileURLToPath } from 'url';
2
- import { dirname } from 'path';
3
- import fs from 'fs';
4
- import path from 'path';
5
- const __filename = fileURLToPath(import.meta.url);
6
- const __dirname = dirname(__filename);
7
- export const processImportStyles = async () => {
8
- const _reset = fs.readFileSync(path.resolve(__dirname, './../../styles/reset.css'), 'utf-8');
9
- const _animation = fs.readFileSync(path.resolve(__dirname, './../../styles/animation.css'), 'utf-8');
10
- const _keyframes = fs.readFileSync(path.resolve(__dirname, './../../styles/keyframes.css'), 'utf-8');
11
- let styles = ``;
12
- styles += `${_reset}\n`;
13
- styles += `${_animation}\n`;
14
- styles += `${_keyframes}\n`;
15
- return styles;
16
- };
@@ -1,5 +0,0 @@
1
- export declare function componentFormatter({ breakpoints }: {
2
- breakpoints: {
3
- [key: string]: number | string;
4
- };
5
- }): Promise<void>;
@@ -1,60 +0,0 @@
1
- import { fileURLToPath } from 'url';
2
- import { dirname } from 'path';
3
- import fs from 'fs';
4
- import path from 'path';
5
- import { parserCSSBreakpoints } from '../../helpers/parser.js';
6
- const __filename = fileURLToPath(import.meta.url);
7
- const __dirname = dirname(__filename);
8
- export async function componentFormatter({ breakpoints }) {
9
- // load svelte component files (includes on components folders)
10
- function loadSvelteFiles(directory) {
11
- fs.readdirSync(directory).forEach((File) => {
12
- const absolutePath = path.join(directory, File);
13
- if (fs.statSync(absolutePath).isDirectory())
14
- return loadSvelteFiles(absolutePath);
15
- else if (absolutePath.endsWith('.css') && !absolutePath.includes('/_')) {
16
- const fileCSS = fs.readFileSync(absolutePath, 'utf8');
17
- const content = parserCSSBreakpoints(fileCSS);
18
- let css = `${content.cleaned}\n`;
19
- for (const property in breakpoints) {
20
- if (property !== 'base') {
21
- const name = `.${/^\d/.test(property) ? `\\3${property}` : property}\\:`;
22
- const value = typeof breakpoints[property] === 'number'
23
- ? `${breakpoints[property]}px`
24
- : breakpoints[property];
25
- if (content.base !== '' || content.minmax !== '' || content.min !== '') {
26
- css += `\n@media screen and (min-width: ${value}) {\n`;
27
- if (content.base !== '')
28
- css += content.base.replaceAll('[breakpoint]', name);
29
- if (content.minmax !== '')
30
- css += content.minmax.replaceAll('[breakpoint]', name);
31
- if (content.min !== '')
32
- css += content.min.replaceAll('[breakpoint]', name);
33
- css += `\n}\n`;
34
- }
35
- if (content.max !== '' || content.minmax !== '') {
36
- css += `\n@media screen and (max-width: ${value}) {\n`;
37
- if (content.max !== '')
38
- css += content.max.replaceAll('[breakpoint]', `max\\:${name}`);
39
- if (content.minmax !== '')
40
- css += content.all.replaceAll('[breakpoint]', `max\\:${name}`);
41
- css += `\n}\n`;
42
- }
43
- }
44
- else {
45
- css += `${content.base.replaceAll('[breakpoint]', '.')}\n`;
46
- }
47
- }
48
- const baseName = path.basename(absolutePath, '.css');
49
- const svelteFilePath = path.join(path.dirname(absolutePath), `${baseName}.svelte`);
50
- if (fs.existsSync(svelteFilePath)) {
51
- let svelteContent = fs.readFileSync(svelteFilePath, 'utf8');
52
- svelteContent = svelteContent.replace(/<style[^>]*>[\s\S]*?<\/style>/gi, '');
53
- svelteContent += `<style>\n${css}</style>`;
54
- fs.writeFileSync(svelteFilePath, svelteContent, 'utf8');
55
- }
56
- }
57
- });
58
- }
59
- loadSvelteFiles(path.resolve(__dirname, '../../../components'));
60
- }
@@ -1,5 +0,0 @@
1
- export declare function devicesFormatter({ devices }: {
2
- devices: {
3
- [key: string]: number | string;
4
- };
5
- }): Promise<string>;
@@ -1,66 +0,0 @@
1
- import { parserValues } from '../../helpers/parser.js';
2
- export async function devicesFormatter({ devices }) {
3
- let css = ``;
4
- const sortedDevices = Object.entries(devices).sort(([, a], [, b]) => {
5
- const valueA = typeof a === 'string' ? parseInt(a) : a;
6
- const valueB = typeof b === 'string' ? parseInt(b) : b;
7
- return valueB - valueA;
8
- });
9
- sortedDevices.forEach(([deviceName, breakpoint], index) => {
10
- const value = parserValues(breakpoint);
11
- if (index === 0) {
12
- // the largest device
13
- css += `@media (max-width: ${value}) {\n`;
14
- css += ` .kit-device--d-${deviceName} {\n`;
15
- css += ` display: none !important;\n`;
16
- css += ` }\n`;
17
- css += `}\n\n`;
18
- css += `@media (min-width: ${value}) {\n`;
19
- css += ` .kit-device--h-${deviceName} {\n`;
20
- css += ` display: none !important;\n`;
21
- css += ` }\n`;
22
- css += `}\n\n`;
23
- }
24
- else if (index === sortedDevices.length - 1) {
25
- const prevDevice = sortedDevices[index - 1];
26
- const prevValue = parserValues(prevDevice[1]);
27
- // the smallest device
28
- css += `@media (min-width: ${prevValue}) {\n`;
29
- css += ` .kit-device--d-${deviceName} {\n`;
30
- css += ` display: none !important;\n`;
31
- css += ` }\n`;
32
- css += `}\n\n`;
33
- css += `@media (max-width: ${prevValue}) {\n`;
34
- css += ` .kit-device--h-${deviceName} {\n`;
35
- css += ` display: none !important;\n`;
36
- css += ` }\n`;
37
- css += `}\n\n`;
38
- css += `@media (min-width: ${value}) {\n`;
39
- css += ` .kit-device--od-${deviceName} {\n`;
40
- css += ` display: none !important;\n`;
41
- css += ` }\n`;
42
- css += `}\n\n`;
43
- css += `@media (max-width: ${value}) {\n`;
44
- css += ` .kit-device--oh-${deviceName} {\n`;
45
- css += ` display: none !important;\n`;
46
- css += ` }\n`;
47
- css += `}\n\n`;
48
- }
49
- else {
50
- //intermediate devices
51
- const nextDevice = sortedDevices[index - 1];
52
- const nextValue = parserValues(nextDevice[1]);
53
- css += `@media (max-width: ${value}) {\n`;
54
- css += ` .kit-device--d-${deviceName} {\n`;
55
- css += ` display: none !important;\n`;
56
- css += ` }\n`;
57
- css += `}\n\n`;
58
- css += `@media (min-width: ${nextValue}) {\n`;
59
- css += ` .kit-device--h-${deviceName} {\n`;
60
- css += ` display: none !important;\n`;
61
- css += ` }\n`;
62
- css += `}\n\n`;
63
- }
64
- });
65
- return css.trim();
66
- }
@@ -1,7 +0,0 @@
1
- import type { DevConfiguration } from '../../types/index.js';
2
- export declare function liliRabbit(config: DevConfiguration): Promise<{
3
- themes: string;
4
- typography: string;
5
- styles: string;
6
- devices: string;
7
- }>;
@@ -1,35 +0,0 @@
1
- import { preset } from '../../config/presets.js';
2
- import { deepMerge } from '../../helpers/deep-merge.js';
3
- import { componentFormatter } from './component.js';
4
- import { devicesFormatter } from './device.js';
5
- import { stylesFormatter } from './style.js';
6
- import { themesFormatter } from './theme.js';
7
- import { typographyFormatter } from './typography.js';
8
- export async function liliRabbit(config) {
9
- // states
10
- const defaultTheme = config?.theme?.defaultTheme || preset.theme.defaultTheme;
11
- const defaultTypography = config?.typography?.defaultTypography || preset.typography.defaultTypography;
12
- // formatter
13
- const themes = await themesFormatter({
14
- themes: deepMerge(preset.theme.themes, config?.theme?.themes || {}),
15
- defaultTheme
16
- });
17
- const typography = await typographyFormatter({
18
- typography: deepMerge(preset.typography.fonts, config?.typography?.fonts || {}),
19
- defaultTypography
20
- });
21
- const styles = await stylesFormatter({ styles: deepMerge(preset.styles, config?.styles || {}) });
22
- const devices = await devicesFormatter({
23
- devices: deepMerge(preset.breakpoints.devices, config?.breakpoints?.devices || {})
24
- });
25
- // components
26
- await componentFormatter({
27
- breakpoints: deepMerge(preset.breakpoints.thresholds, config?.breakpoints?.thresholds || {})
28
- });
29
- return {
30
- themes: themes,
31
- typography: typography,
32
- styles: styles,
33
- devices: devices
34
- };
35
- }
@@ -1,4 +0,0 @@
1
- import type { FragStyles } from '../../types/configuration.js';
2
- export declare function stylesFormatter({ styles }: {
3
- styles: FragStyles;
4
- }): Promise<string>;
@@ -1,15 +0,0 @@
1
- import { parserValues } from '../../helpers/parser.js';
2
- export async function stylesFormatter({ styles }) {
3
- let css = `:root {\n`;
4
- for (const [name, values] of Object.entries(styles)) {
5
- if (values && typeof values === 'object') {
6
- for (const [styleName, styleValue] of Object.entries(values || {})) {
7
- css += ` --system-${name}-${styleName}: ${parserValues(styleValue)};\n`;
8
- }
9
- }
10
- else {
11
- css += ` --system-${name}: ${parserValues(values)};\n`;
12
- }
13
- }
14
- return (css += '}\n');
15
- }
@@ -1,5 +0,0 @@
1
- import type { FragThemes } from '../../types/index.js';
2
- export declare function themesFormatter({ themes, defaultTheme }: {
3
- themes: FragThemes;
4
- defaultTheme: string;
5
- }): Promise<string>;
@@ -1,44 +0,0 @@
1
- import { preset } from '../../config/presets.js';
2
- import { formatColor } from '../../helpers/colors.js';
3
- import { deepMerge } from '../../helpers/deep-merge.js';
4
- import { parserValues } from '../../helpers/parser.js';
5
- export async function themesFormatter({ themes, defaultTheme = 'light' }) {
6
- let css = '';
7
- for (const [name, values] of Object.entries(themes)) {
8
- const ref = values?.dark ? preset.theme.themes.dark : preset.theme.themes.light;
9
- let cssTheme = defaultTheme === name ? `:root,\n.kit-theme--${name} {\n` : `.kit-theme--${name} {\n`;
10
- function flattenColors(obj, prefix = '') {
11
- const result = {};
12
- for (const [key, value] of Object.entries(obj)) {
13
- const newPrefix = prefix ? `${prefix}-${key}` : key;
14
- if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
15
- Object.assign(result, flattenColors(value, newPrefix));
16
- }
17
- else {
18
- result[newPrefix] = value;
19
- }
20
- }
21
- return result;
22
- }
23
- // colors
24
- cssTheme += ` color-scheme: ${values?.dark ? 'dark' : 'light'};\n`;
25
- const mergedColors = deepMerge(ref.colors, values?.colors) || {};
26
- const flatColors = flattenColors(mergedColors);
27
- for (const [varName, varValue] of Object.entries(flatColors)) {
28
- cssTheme += ` --kit-${varName}: ${formatColor(varValue)};\n`;
29
- }
30
- // variables
31
- for (const [name, varValue] of Object.entries(deepMerge(ref.variables, values?.variables) || {})) {
32
- if (varValue && typeof varValue === 'object') {
33
- for (const [variableName, variableValue] of Object.entries(varValue || {})) {
34
- cssTheme += ` --kit-${name}-${variableName}: ${formatColor(parserValues(variableValue))};\n`;
35
- }
36
- }
37
- else {
38
- cssTheme += ` --kit-${name}: ${formatColor(parserValues(varValue))};\n`;
39
- }
40
- }
41
- css += cssTheme + '}\n';
42
- }
43
- return css;
44
- }
@@ -1,5 +0,0 @@
1
- import type { FragTypography } from '../../types/configuration.js';
2
- export declare function typographyFormatter({ typography, defaultTypography }: {
3
- typography: FragTypography;
4
- defaultTypography: string;
5
- }): Promise<string>;
@@ -1,12 +0,0 @@
1
- import { parserValues } from '../../helpers/parser.js';
2
- export async function typographyFormatter({ typography, defaultTypography = 'default' }) {
3
- let css = '';
4
- for (const [name, values] of Object.entries(typography)) {
5
- let cssTypo = defaultTypography === name ? `:root {\n` : `.${name} {\n`;
6
- for (const [fontName, fontValue] of Object.entries(values || {})) {
7
- cssTypo += ` --kit-font-${fontName}: ${parserValues(fontValue).replaceAll('"', '')};\n`;
8
- }
9
- css += cssTypo + '}\n';
10
- }
11
- return css;
12
- }
@@ -1 +0,0 @@
1
- export declare const minify: (css: string) => string;
@@ -1,10 +0,0 @@
1
- export const minify = (css) => {
2
- const minified = css
3
- .replace(/\s+/g, ' ')
4
- .replace(/\/\*.*?\*\//g, '')
5
- .replace(/;\s*}/g, '}')
6
- .replace(/:\s+/g, ':')
7
- .replace(/\s*([{};:])\s*/g, '$1')
8
- .trim();
9
- return minified;
10
- };
@@ -1,75 +0,0 @@
1
- export declare const standardColors: {
2
- red: {
3
- light: string;
4
- dark: string;
5
- };
6
- orange: {
7
- light: string;
8
- dark: string;
9
- };
10
- yellow: {
11
- light: string;
12
- dark: string;
13
- };
14
- green: {
15
- light: string;
16
- dark: string;
17
- };
18
- mint: {
19
- light: string;
20
- dark: string;
21
- };
22
- teal: {
23
- light: string;
24
- dark: string;
25
- };
26
- cyan: {
27
- light: string;
28
- dark: string;
29
- };
30
- blue: {
31
- light: string;
32
- dark: string;
33
- };
34
- indigo: {
35
- light: string;
36
- dark: string;
37
- };
38
- purple: {
39
- light: string;
40
- dark: string;
41
- };
42
- pink: {
43
- light: string;
44
- dark: string;
45
- };
46
- brown: {
47
- light: string;
48
- dark: string;
49
- };
50
- gray: {
51
- light: string;
52
- dark: string;
53
- };
54
- gray2: {
55
- light: string;
56
- dark: string;
57
- };
58
- gray3: {
59
- light: string;
60
- dark: string;
61
- };
62
- gray4: {
63
- light: string;
64
- dark: string;
65
- };
66
- gray5: {
67
- light: string;
68
- dark: string;
69
- };
70
- gray6: {
71
- light: string;
72
- dark: string;
73
- };
74
- };
75
- export default standardColors;
@@ -1,75 +0,0 @@
1
- export const standardColors = {
2
- red: {
3
- light: '#FF3B30',
4
- dark: '#FF453A'
5
- },
6
- orange: {
7
- light: '#FF9500',
8
- dark: '#FF9F0A'
9
- },
10
- yellow: {
11
- light: '#FFCC00',
12
- dark: '#FFD60A'
13
- },
14
- green: {
15
- light: '#34C759',
16
- dark: '#30D158'
17
- },
18
- mint: {
19
- light: '#00C7BE',
20
- dark: '#66D4CF'
21
- },
22
- teal: {
23
- light: '#30B0C7',
24
- dark: '#40CBE0'
25
- },
26
- cyan: {
27
- light: '#32ADE6',
28
- dark: '#64D2FF'
29
- },
30
- blue: {
31
- light: '#007AFF',
32
- dark: '#0A84FF'
33
- },
34
- indigo: {
35
- light: '#5856D6',
36
- dark: '#5E5CE6'
37
- },
38
- purple: {
39
- light: '#AF52DE',
40
- dark: '#BF5AF2'
41
- },
42
- pink: {
43
- light: '#FF2D55',
44
- dark: '#FF375F'
45
- },
46
- brown: {
47
- light: '#A2845E',
48
- dark: '#AC8E68'
49
- },
50
- gray: {
51
- light: '#8E8E93',
52
- dark: '#8E8E93'
53
- },
54
- gray2: {
55
- light: '#AEAEB2',
56
- dark: '#636366'
57
- },
58
- gray3: {
59
- light: '#C7C7CC',
60
- dark: '#48484A'
61
- },
62
- gray4: {
63
- light: '#D1D1D6',
64
- dark: '#3A3A3C'
65
- },
66
- gray5: {
67
- light: '#E5E5EA',
68
- dark: '#2C2C2E'
69
- },
70
- gray6: {
71
- light: '#F2F2F7',
72
- dark: '#1C1C1E'
73
- }
74
- };
75
- export default standardColors;
@@ -1,4 +0,0 @@
1
- export declare const x11Colors: {
2
- [key: string]: string;
3
- };
4
- export declare const x11ColorNames: Array<string>;