lapikit 0.0.0-insiders.df15d32 → 0.0.0-insiders.e06d168

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 (170) hide show
  1. package/bin/configuration.js +0 -1
  2. package/bin/index.js +1 -9
  3. package/bin/presets.js +1 -1
  4. package/bin/prompts.js +46 -79
  5. package/dist/actions/accordion.svelte.d.ts +9 -0
  6. package/dist/actions/index.d.ts +2 -1
  7. package/dist/actions/index.js +2 -1
  8. package/dist/actions/use-theme.d.ts +1 -0
  9. package/dist/actions/use-theme.js +18 -0
  10. package/dist/components/accordion/accordion.css +0 -77
  11. package/dist/components/accordion/accordion.svelte +5 -3
  12. package/dist/components/accordion/modules/accordion-item.css +68 -0
  13. package/dist/components/accordion/modules/accordion-item.svelte +4 -4
  14. package/dist/components/accordion/types.d.ts +1 -1
  15. package/dist/components/alert/alert.css +11 -18
  16. package/dist/components/alert/alert.svelte +4 -4
  17. package/dist/components/alert/types.d.ts +1 -1
  18. package/dist/components/app/app.css +1 -2
  19. package/dist/components/app/app.svelte +24 -28
  20. package/dist/components/app/app.svelte.d.ts +2 -0
  21. package/dist/components/appbar/appbar.css +8 -18
  22. package/dist/components/appbar/appbar.svelte +4 -4
  23. package/dist/components/appbar/types.d.ts +1 -1
  24. package/dist/components/aspect-ratio/aspect-ratio.svelte +0 -22
  25. package/dist/components/aspect-ratio/types.d.ts +1 -1
  26. package/dist/components/avatar/avatar.css +7 -14
  27. package/dist/components/avatar/avatar.svelte +4 -4
  28. package/dist/components/avatar/types.d.ts +1 -1
  29. package/dist/components/button/button.css +29 -36
  30. package/dist/components/button/button.svelte +5 -5
  31. package/dist/components/button/types.d.ts +1 -1
  32. package/dist/components/card/card.css +10 -20
  33. package/dist/components/card/card.svelte +5 -5
  34. package/dist/components/card/types.d.ts +1 -1
  35. package/dist/components/chip/chip.css +26 -33
  36. package/dist/components/chip/chip.svelte +5 -5
  37. package/dist/components/chip/types.d.ts +1 -1
  38. package/dist/components/dialog/dialog.css +13 -20
  39. package/dist/components/dialog/dialog.svelte +5 -5
  40. package/dist/components/dialog/types.d.ts +1 -1
  41. package/dist/components/dropdown/dropdown.css +3 -12
  42. package/dist/components/dropdown/dropdown.svelte +6 -7
  43. package/dist/components/dropdown/types.d.ts +1 -1
  44. package/dist/components/icon/icon.css +11 -12
  45. package/dist/components/icon/icon.svelte +2 -2
  46. package/dist/components/icon/types.d.ts +1 -1
  47. package/dist/components/list/list.css +19 -91
  48. package/dist/components/list/list.svelte +4 -4
  49. package/dist/components/list/modules/list-item.css +67 -0
  50. package/dist/components/list/modules/list-item.svelte +5 -5
  51. package/dist/components/list/types.d.ts +1 -1
  52. package/dist/components/modal/modal.css +15 -23
  53. package/dist/components/modal/modal.svelte +4 -5
  54. package/dist/components/modal/types.d.ts +1 -1
  55. package/dist/components/popover/popover.css +3 -12
  56. package/dist/components/popover/popover.svelte +6 -6
  57. package/dist/components/popover/types.d.ts +1 -1
  58. package/dist/components/separator/separator.css +4 -8
  59. package/dist/components/separator/separator.svelte +5 -5
  60. package/dist/components/separator/types.d.ts +1 -1
  61. package/dist/components/spacer/types.d.ts +1 -1
  62. package/dist/components/textfield/textfield.css +16 -23
  63. package/dist/components/textfield/textfield.svelte +4 -4
  64. package/dist/components/textfield/types.d.ts +1 -1
  65. package/dist/components/toolbar/toolbar.css +14 -26
  66. package/dist/components/toolbar/toolbar.svelte +4 -4
  67. package/dist/components/toolbar/types.d.ts +1 -1
  68. package/dist/components/tooltip/tooltip.css +5 -13
  69. package/dist/components/tooltip/tooltip.svelte +5 -5
  70. package/dist/components/tooltip/types.d.ts +1 -1
  71. package/dist/index.d.ts +2 -26
  72. package/dist/index.js +2 -6
  73. package/dist/internal/config/presets.d.ts +149 -0
  74. package/dist/internal/config/presets.js +169 -0
  75. package/dist/internal/config/variables.d.ts +3 -0
  76. package/dist/internal/config/variables.js +3 -0
  77. package/dist/internal/{assets.svelte.js → core/actions/assets.svelte.js} +4 -4
  78. package/dist/internal/core/actions/dropdown.svelte.d.ts +7 -0
  79. package/dist/internal/core/actions/popover.svelte.d.ts +7 -0
  80. package/dist/internal/core/actions/tooltip.svelte.d.ts +7 -0
  81. package/dist/internal/{ripple.js → core/animations/ripple.js} +3 -3
  82. package/dist/internal/core/css.d.ts +1 -0
  83. package/dist/internal/core/css.js +16 -0
  84. package/dist/internal/core/formatter/component.d.ts +5 -0
  85. package/dist/internal/core/formatter/component.js +60 -0
  86. package/dist/internal/core/formatter/device.d.ts +5 -0
  87. package/dist/internal/core/formatter/device.js +66 -0
  88. package/dist/internal/core/formatter/index.d.ts +7 -0
  89. package/dist/internal/core/formatter/index.js +35 -0
  90. package/dist/internal/core/formatter/style.d.ts +4 -0
  91. package/dist/internal/core/formatter/style.js +15 -0
  92. package/dist/internal/core/formatter/theme.d.ts +5 -0
  93. package/dist/internal/core/formatter/theme.js +44 -0
  94. package/dist/internal/core/formatter/typography.d.ts +5 -0
  95. package/dist/internal/core/formatter/typography.js +12 -0
  96. package/dist/internal/core/standard-colors.d.ts +75 -0
  97. package/dist/internal/core/standard-colors.js +75 -0
  98. package/dist/internal/helpers/colors.d.ts +1 -0
  99. package/dist/internal/{colors.js → helpers/colors.js} +2 -2
  100. package/dist/internal/helpers/parser.d.ts +10 -0
  101. package/dist/internal/helpers/parser.js +93 -0
  102. package/dist/{plugin/vitejs.d.ts → internal/plugins/vite.d.ts} +1 -3
  103. package/dist/internal/plugins/vite.js +33 -0
  104. package/dist/internal/types/components.d.ts +14 -0
  105. package/dist/internal/types/configuration.d.ts +63 -0
  106. package/dist/internal/types/configuration.js +1 -0
  107. package/dist/internal/types/index.d.ts +2 -0
  108. package/dist/internal/types/index.js +2 -0
  109. package/dist/stores/components.js +1 -1
  110. package/dist/stores/themes.d.ts +0 -6
  111. package/dist/stores/themes.js +1 -31
  112. package/dist/styles/animation.css +33 -0
  113. package/dist/styles/keyframes.css +30 -0
  114. package/dist/{style/normalize.css → styles/reset.css} +15 -7
  115. package/package.json +7 -4
  116. package/dist/internal/colors.d.ts +0 -1
  117. package/dist/internal/index.d.ts +0 -4
  118. package/dist/internal/index.js +0 -4
  119. package/dist/internal/types.d.ts +0 -57
  120. package/dist/internal/unit.d.ts +0 -1
  121. package/dist/internal/unit.js +0 -11
  122. package/dist/plugin/css.d.ts +0 -1
  123. package/dist/plugin/css.js +0 -56
  124. package/dist/plugin/modules/config.d.ts +0 -2
  125. package/dist/plugin/modules/config.js +0 -54
  126. package/dist/plugin/modules/importer.d.ts +0 -1
  127. package/dist/plugin/modules/importer.js +0 -15
  128. package/dist/plugin/preset-v2.d.ts +0 -96
  129. package/dist/plugin/preset-v2.js +0 -114
  130. package/dist/plugin/vitejs.js +0 -55
  131. package/dist/preset.d.ts +0 -2
  132. package/dist/preset.js +0 -92
  133. package/dist/style/animation.css +0 -62
  134. package/dist/style/css.d.ts +0 -2
  135. package/dist/style/css.js +0 -34
  136. package/dist/style/parser/color.d.ts +0 -5
  137. package/dist/style/parser/color.js +0 -88
  138. package/dist/style/parser/component.d.ts +0 -2
  139. package/dist/style/parser/component.js +0 -115
  140. package/dist/style/parser/device.d.ts +0 -2
  141. package/dist/style/parser/device.js +0 -40
  142. package/dist/style/parser/index.d.ts +0 -4
  143. package/dist/style/parser/index.js +0 -4
  144. package/dist/style/parser/variable.d.ts +0 -2
  145. package/dist/style/parser/variable.js +0 -25
  146. package/dist/style/variable.css +0 -12
  147. /package/dist/{components/accordion → actions}/accordion.svelte.js +0 -0
  148. /package/dist/internal/{assets.svelte.d.ts → core/actions/assets.svelte.d.ts} +0 -0
  149. /package/dist/{components/dropdown → internal/core/actions}/dropdown.svelte.js +0 -0
  150. /package/dist/{components/popover → internal/core/actions}/popover.svelte.js +0 -0
  151. /package/dist/{components/tooltip → internal/core/actions}/tooltip.svelte.js +0 -0
  152. /package/dist/internal/{ripple.d.ts → core/animations/ripple.d.ts} +0 -0
  153. /package/dist/internal/{ansi.d.ts → core/bin/ansi.d.ts} +0 -0
  154. /package/dist/internal/{ansi.js → core/bin/ansi.js} +0 -0
  155. /package/dist/internal/{terminal.d.ts → core/bin/terminal.d.ts} +0 -0
  156. /package/dist/internal/{terminal.js → core/bin/terminal.js} +0 -0
  157. /package/dist/internal/{minify.d.ts → core/minify.d.ts} +0 -0
  158. /package/dist/internal/{minify.js → core/minify.js} +0 -0
  159. /package/dist/{utils/x11.d.ts → internal/core/x11-colors.d.ts} +0 -0
  160. /package/dist/{utils/x11.js → internal/core/x11-colors.js} +0 -0
  161. /package/dist/{utils → internal/helpers}/convert.d.ts +0 -0
  162. /package/dist/{utils → internal/helpers}/convert.js +0 -0
  163. /package/dist/internal/{deepMerge.d.ts → helpers/deep-merge.d.ts} +0 -0
  164. /package/dist/internal/{deepMerge.js → helpers/deep-merge.js} +0 -0
  165. /package/dist/internal/{clickOutside.d.ts → helpers/outside.d.ts} +0 -0
  166. /package/dist/internal/{clickOutside.js → helpers/outside.js} +0 -0
  167. /package/dist/internal/{scroll.d.ts → helpers/scroll.d.ts} +0 -0
  168. /package/dist/internal/{scroll.js → helpers/scroll.js} +0 -0
  169. /package/dist/internal/{types.js → types/components.js} +0 -0
  170. /package/dist/{colors.css → themes.css} +0 -0
@@ -1,56 +0,0 @@
1
- import { deepMerge } from '../internal/deepMerge.js';
2
- import { preset } from './preset-v2.js';
3
- import { fileURLToPath } from 'url';
4
- import { dirname } from 'path';
5
- import fsPromises from 'fs/promises';
6
- import path from 'path';
7
- const __filename = fileURLToPath(import.meta.url);
8
- const __dirname = dirname(__filename);
9
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
10
- export function css(configuration) {
11
- // states
12
- const defaultTheme = configuration?.theme?.defaultTheme || preset.theme.defaultTheme;
13
- const themesMerged = deepMerge(configuration?.theme?.themes || {}, preset.theme.themes);
14
- let response = '';
15
- for (const [name, values] of Object.entries(themesMerged)) {
16
- let css = defaultTheme === name ? `:root,\n.${name} {\n` : `.${name} {\n`;
17
- // ref
18
- const ref = values?.dark ? preset.theme.themes.dark : preset.theme.themes.light;
19
- // colors
20
- css += ` color-scheme: ${values?.dark ? 'dark' : 'light'};\n`;
21
- for (const [varName, varValue] of Object.entries(deepMerge(values?.colors, ref.colors) || {})) {
22
- css += ` --system-${varName}: ${varValue};\n`;
23
- }
24
- console.log('VALUE', values, deepMerge(values?.variables, ref.variables));
25
- // variables
26
- for (const [name, varValue] of Object.entries(deepMerge(values?.variables, ref.variables) || {})) {
27
- css += ` --kit-${name}: ${varValue};\n`;
28
- }
29
- css += '}\n';
30
- console.log(`Themes colors (${name}):`, css);
31
- response += css;
32
- }
33
- console.log('All themes CSS:', response);
34
- // typography
35
- // states
36
- const defaultTypography = configuration?.typography?.defaultTypography || preset.typography.defaultTypography;
37
- const fontsMerged = deepMerge(configuration?.typography?.fonts || {}, preset.typography.fonts);
38
- for (const [name, values] of Object.entries(fontsMerged)) {
39
- let css = '';
40
- css += defaultTypography === name ? `:root,\n.${name} {\n` : `.${name} {\n`;
41
- // fonts
42
- for (const [fontName, fontValue] of Object.entries(values?.font || {})) {
43
- css += ` --kit-font-${fontName}: ${parser(fontValue)};\n`;
44
- }
45
- css += '}\n';
46
- response += css;
47
- }
48
- fsPromises.writeFile(path.resolve(__dirname, '../colors.css'), response);
49
- }
50
- const parser = (value) => {
51
- if (typeof value === 'number')
52
- return `${value}px`;
53
- if (Array.isArray(value))
54
- return value.join(', ');
55
- return value;
56
- };
@@ -1,2 +0,0 @@
1
- import type { LapikitConfig } from '../../internal/types.js';
2
- export declare const parseConfig: (props?: LapikitConfig) => import("../../internal/types.js").Lapikit;
@@ -1,54 +0,0 @@
1
- import { config } from '../../preset.js';
2
- export const parseConfig = (props) => {
3
- if (!props)
4
- return config;
5
- const newConfig = { ...config };
6
- if (props?.options) {
7
- if (props.options.normalize !== undefined)
8
- newConfig.options.normalize = props.options.normalize;
9
- if (props.options.minify !== undefined)
10
- newConfig.options.minify = props.options.minify;
11
- }
12
- if (props?.theme) {
13
- if (props.theme.colorScheme !== undefined)
14
- newConfig.theme.colorScheme = props.theme.colorScheme;
15
- if (props.theme.colors) {
16
- newConfig.theme.colors = {
17
- ...newConfig.theme.colors,
18
- ...props.theme.colors
19
- };
20
- }
21
- }
22
- if (props?.breakpoints) {
23
- if (props.breakpoints.mobileBreakpoint !== undefined)
24
- newConfig.breakpoints.mobileBreakpoint = props.breakpoints.mobileBreakpoint;
25
- if (props.breakpoints.tabletBreakpoint !== undefined)
26
- newConfig.breakpoints.tabletBreakpoint = props.breakpoints.tabletBreakpoint;
27
- if (props.breakpoints.laptopBreakpoint !== undefined)
28
- newConfig.breakpoints.laptopBreakpoint = props.breakpoints.laptopBreakpoint;
29
- if (props.breakpoints.thresholds)
30
- newConfig.breakpoints.thresholds = {
31
- ...newConfig.breakpoints.thresholds,
32
- ...props.breakpoints.thresholds
33
- };
34
- }
35
- if (props?.styles) {
36
- if (props.styles.spacing !== undefined)
37
- newConfig.styles.spacing = props.styles.spacing;
38
- if (props.styles.corner !== undefined) {
39
- if (props.styles.corner.active !== undefined)
40
- newConfig.styles.corner.active = props.styles.corner.active;
41
- if (props.styles.corner.radius)
42
- newConfig.styles.corner.radius = {
43
- ...newConfig.styles.corner.radius,
44
- ...props.styles.corner.radius
45
- };
46
- }
47
- if (props.styles.font)
48
- newConfig.styles.font = {
49
- ...newConfig.styles.font,
50
- ...props.styles.font
51
- };
52
- }
53
- return newConfig;
54
- };
@@ -1 +0,0 @@
1
- export declare const importer: () => Promise<any>;
@@ -1,15 +0,0 @@
1
- import path from 'path';
2
- import fs from 'fs';
3
- import { terminal, ansi } from '../../internal/index.js';
4
- const app = process.cwd();
5
- const pathConfig = path.resolve(app, 'lapikit.config.js');
6
- export const importer = async () => {
7
- if (!fs.existsSync(pathConfig)) {
8
- terminal('error', `config file not found\n ${ansi.color.yellow('Could not find lapikit.config.js. See https://localhost/docs/kit/vite to learn more about the configuration file.')}\n\n${ansi.color.blue('for initializing a new lapikit config, run:')}\n ${ansi.variant.bold('npx lapikit init')} ${ansi.bold.yellow('(preview)')}\n\n`);
9
- process.exit(1);
10
- }
11
- const timestamp = Date.now();
12
- const fileUrl = `file://${pathConfig}?t=${timestamp}`;
13
- const content = await import(fileUrl);
14
- return content.default;
15
- };
@@ -1,96 +0,0 @@
1
- export declare const preset: {
2
- breakpoints: {
3
- devices: {
4
- desktop: number;
5
- tablet: number;
6
- mobile: number;
7
- };
8
- thresholds: {
9
- base: number;
10
- xs: number;
11
- sm: number;
12
- md: number;
13
- lg: number;
14
- xl: number;
15
- '2xl': number;
16
- '3xl': number;
17
- };
18
- };
19
- theme: {
20
- defaultTheme: string;
21
- themes: {
22
- light: {
23
- dark: boolean;
24
- colors: {
25
- blue: string;
26
- green: string;
27
- red: string;
28
- yellow: string;
29
- orange: string;
30
- purple: string;
31
- pink: string;
32
- indigo: string;
33
- cyan: string;
34
- gray: string;
35
- 'gray-2': string;
36
- 'gray-3': string;
37
- 'gray-4': string;
38
- 'gray-5': string;
39
- 'gray-6': string;
40
- background: string;
41
- 'secondary-background': string;
42
- 'tertiary-background': string;
43
- label: string;
44
- 'secondary-label': string;
45
- };
46
- variables: {
47
- info: string;
48
- success: string;
49
- error: string;
50
- warning: string;
51
- };
52
- };
53
- dark: {
54
- dark: boolean;
55
- colors: {
56
- blue: string;
57
- green: string;
58
- red: string;
59
- yellow: string;
60
- orange: string;
61
- purple: string;
62
- pink: string;
63
- indigo: string;
64
- cyan: string;
65
- gray: string;
66
- 'gray-2': string;
67
- 'gray-3': string;
68
- 'gray-4': string;
69
- 'gray-5': string;
70
- 'gray-6': string;
71
- background: string;
72
- 'secondary-background': string;
73
- 'tertiary-background': string;
74
- label: string;
75
- 'secondary-label': string;
76
- };
77
- variables: {
78
- info: string;
79
- success: string;
80
- error: string;
81
- warning: string;
82
- };
83
- };
84
- };
85
- };
86
- typography: {
87
- defaultTypography: string;
88
- fonts: {
89
- default: {
90
- sans: string[];
91
- mono: string[];
92
- serif: string[];
93
- };
94
- };
95
- };
96
- };
@@ -1,114 +0,0 @@
1
- const variables = {
2
- info: 'var(--system-blue)',
3
- success: 'var(--system-green)',
4
- error: 'var(--system-red)',
5
- warning: 'var(--system-yellow)'
6
- };
7
- export const preset = {
8
- breakpoints: {
9
- devices: {
10
- desktop: 1024, //64rem (lg)
11
- tablet: 768, //48rem (md)
12
- mobile: 375 //28rem (sm)
13
- },
14
- thresholds: {
15
- base: 0, // 0px
16
- xs: 448, //28rem
17
- sm: 640, //40rem
18
- md: 768, //48rem
19
- lg: 1024, //64rem
20
- xl: 1280, //80rem
21
- '2xl': 1536, //96rem
22
- '3xl': 1792 //112rem
23
- }
24
- },
25
- theme: {
26
- defaultTheme: 'light',
27
- themes: {
28
- light: {
29
- dark: false,
30
- colors: {
31
- blue: '#007AFF',
32
- green: '#34C759',
33
- red: '#FF3B30',
34
- yellow: '#FFCC00',
35
- orange: '#FF9500',
36
- purple: '#AF52DE',
37
- pink: '#FF2D55',
38
- indigo: '#5856D6',
39
- cyan: '#5AC8FA',
40
- gray: '#8E8E93',
41
- 'gray-2': '#AEAEB2',
42
- 'gray-3': '#C7C7CC',
43
- 'gray-4': '#D1D1D6',
44
- 'gray-5': '#E5E5EA',
45
- 'gray-6': '#F2F2F7',
46
- background: '#FFFFFF',
47
- 'secondary-background': '#F2F2F7',
48
- 'tertiary-background': '#EFEFF4',
49
- label: '#000000',
50
- 'secondary-label': 'rgba(60,60,67,0.6)'
51
- },
52
- variables: variables
53
- },
54
- dark: {
55
- dark: true,
56
- colors: {
57
- blue: '#0A84FF',
58
- green: '#30D158',
59
- red: '#FF453A',
60
- yellow: '#FFD60A',
61
- orange: '#FF9F0A',
62
- purple: '#BF5AF2',
63
- pink: '#FF375F',
64
- indigo: '#5E5CE6',
65
- cyan: '#64D2FF',
66
- gray: '#8E8E93',
67
- 'gray-2': '#636366',
68
- 'gray-3': '#48484A',
69
- 'gray-4': '#3A3A3C',
70
- 'gray-5': '#2C2C2E',
71
- 'gray-6': '#1C1C1E',
72
- background: '#000000',
73
- 'secondary-background': '#1C1C1E',
74
- 'tertiary-background': '#2C2C2E',
75
- label: '#FFFFFF',
76
- 'secondary-label': 'rgba(235,235,245,0.6)'
77
- },
78
- variables: variables
79
- }
80
- }
81
- },
82
- typography: {
83
- defaultTypography: 'default',
84
- fonts: {
85
- default: {
86
- sans: [
87
- 'system-ui',
88
- '-apple-system',
89
- 'BlinkMacSystemFont',
90
- 'Segoe UI',
91
- 'Roboto',
92
- 'Helvetica Neue',
93
- 'Arial',
94
- 'sans-serif',
95
- 'Apple Color Emoji',
96
- 'Segoe UI Emoji',
97
- 'Segoe UI Symbol'
98
- ],
99
- mono: [
100
- 'SFMono-Regular',
101
- 'ui-monospace',
102
- 'SF Mono',
103
- 'Menlo',
104
- 'Monaco',
105
- 'Consolas',
106
- 'Liberation Mono',
107
- 'Courier New',
108
- 'monospace'
109
- ],
110
- serif: ['Merriweather', 'Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif']
111
- }
112
- }
113
- }
114
- };
@@ -1,55 +0,0 @@
1
- import { importer } from './modules/importer.js';
2
- import { processCSS } from '../style/css.js';
3
- import { parseConfig } from './modules/config.js';
4
- import { terminal } from '../internal/terminal.js';
5
- import path from 'path';
6
- import fs from 'fs';
7
- import { css } from './css.js';
8
- const app = process.cwd();
9
- async function getLapikitConfig(filePath) {
10
- const pathConfig = path.resolve(app, filePath);
11
- if (!fs.existsSync(pathConfig))
12
- process.exit(1);
13
- const code = fs.readFileSync(pathConfig, 'utf-8');
14
- const match = code.match(/createLapikit\s*\(\s*({[\s\S]*?})\s*\)/);
15
- let options = {};
16
- if (match && match[1]) {
17
- try {
18
- options = new Function('return ' + match[1])();
19
- }
20
- catch (e) {
21
- console.error('Error parsing lapikit config:', e);
22
- }
23
- }
24
- else {
25
- console.error('Lapikit not found');
26
- }
27
- return options;
28
- }
29
- export async function lapikit({ config } = {}) {
30
- if (config) {
31
- const value = getLapikitConfig(config);
32
- console.log(value);
33
- css(value);
34
- }
35
- return {
36
- name: 'lapikit/vite.js',
37
- async configResolved() {
38
- const importedConfig = await importer();
39
- const result = await parseConfig(importedConfig);
40
- await processCSS(result);
41
- terminal('info', 'lapikit is up!');
42
- },
43
- async configureServer(server) {
44
- server.watcher.add('./lapikit.config.js');
45
- server.watcher.on('change', async (filePath) => {
46
- if (String(filePath).includes('lapikit.config.js')) {
47
- const config = await importer();
48
- const result = await parseConfig(config);
49
- await processCSS(result);
50
- terminal('info', 'lapikit config reloaded');
51
- }
52
- });
53
- }
54
- };
55
- }
package/dist/preset.d.ts DELETED
@@ -1,2 +0,0 @@
1
- import type { Lapikit } from './internal/types.js';
2
- export declare const config: Lapikit;
package/dist/preset.js DELETED
@@ -1,92 +0,0 @@
1
- export const config = {
2
- options: {
3
- normalize: true, // true | false
4
- minify: false // true | false
5
- },
6
- theme: {
7
- colorScheme: 'system', // 'light' | 'dark' | 'system'
8
- colors: {
9
- primary: { light: 'oklch(45% 0.24 277.023)', dark: 'oklch(45% 0.24 277.023)' },
10
- 'on-primary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
11
- secondary: { light: 'oklch(65% 0.241 354.308)', dark: 'oklch(65% 0.241 354.308)' },
12
- 'on-secondary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
13
- tertiary: { light: 'oklch(77% 0.152 181.912)', dark: 'oklch(77% 0.152 181.912)' },
14
- 'on-tertiary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
15
- neutral: { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
16
- 'on-neutral': { light: 'oklch(100% 0 0)', dark: 'oklch(100% 0 0)' },
17
- info: { light: 'oklch(74% 0.16 232.661)', dark: 'oklch(74% 0.16 232.661)' },
18
- 'on-info': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
19
- success: { light: 'oklch(76% 0.177 163.223)', dark: 'oklch(76% 0.177 163.223)' },
20
- 'on-success': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
21
- warning: { light: 'oklch(82% 0.189 84.429)', dark: 'oklch(82% 0.189 84.429)' },
22
- 'on-warning': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
23
- error: { light: 'oklch(71% 0.194 13.428)', dark: 'oklch(71% 0.194 13.428)' },
24
- 'on-error': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
25
- base: { light: 'oklch(100% 0 0)', dark: 'oklch(25.33% 0.016 252.42)' },
26
- 'on-base': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
27
- surface: { light: 'oklch(98% 0 0)', dark: 'oklch(23.26% 0.014 253.1)' },
28
- 'on-surface': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
29
- container: { light: 'oklch(95% 0 0)', dark: 'oklch(21.15% 0.012 254.09)' },
30
- 'on-container': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
31
- shadow: 'black',
32
- scrim: 'oklch(0.00% 0.000 0)'
33
- }
34
- },
35
- breakpoints: {
36
- mobileBreakpoint: 'sm',
37
- tabletBreakpoint: 'md',
38
- laptopBreakpoint: 'lg',
39
- thresholds: {
40
- _default: 0, // 0px
41
- xs: '28rem', //448px
42
- sm: '40rem', //640px
43
- md: '48rem', //768px
44
- lg: '64rem', //1024px
45
- xl: '80rem', //1280px
46
- '2xl': '96rem', //1536px
47
- '3xl': '112rem' //1792px
48
- }
49
- },
50
- styles: {
51
- spacing: '0.125rem', // 2px
52
- corner: {
53
- active: true, // true | false
54
- radius: {
55
- sm: '0.125rem', // 2px
56
- md: '0.25rem', // 4px
57
- lg: '0.5rem', // 8px
58
- xl: '0.75rem', // 12px
59
- '2xl': '1rem', // 16px
60
- '3xl': '1.5rem', // 24px
61
- full: '9999px' // 9999px
62
- }
63
- },
64
- font: {
65
- sans: [
66
- 'system-ui',
67
- '-apple-system',
68
- 'BlinkMacSystemFont',
69
- 'Segoe UI',
70
- 'Roboto',
71
- 'Helvetica Neue',
72
- 'Arial',
73
- 'sans-serif',
74
- 'Apple Color Emoji',
75
- 'Segoe UI Emoji',
76
- 'Segoe UI Symbol'
77
- ],
78
- mono: [
79
- 'SFMono-Regular',
80
- 'ui-monospace',
81
- 'SF Mono',
82
- 'Menlo',
83
- 'Monaco',
84
- 'Consolas',
85
- 'Liberation Mono',
86
- 'Courier New',
87
- 'monospace'
88
- ],
89
- serif: ['Merriweather', 'Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif']
90
- }
91
- }
92
- };
@@ -1,62 +0,0 @@
1
- @keyframes button-click {
2
- 0% {
3
- transform: scale(0.98);
4
- }
5
- 40% {
6
- transform: scale(1.02);
7
- }
8
- 100% {
9
- transform: scale(1);
10
- }
11
- }
12
-
13
- @keyframes icon-rotate {
14
- 0% {
15
- transform: rotate(10deg);
16
- }
17
- 100% {
18
- transform: rotate(380deg);
19
- }
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
- }
@@ -1,2 +0,0 @@
1
- import type { Lapikit } from '../internal/types.js';
2
- export declare const processCSS: (config: Lapikit) => Promise<void>;
package/dist/style/css.js DELETED
@@ -1,34 +0,0 @@
1
- import { fileURLToPath } from 'url';
2
- import { dirname } from 'path';
3
- import fs from 'fs';
4
- import fsPromises from 'fs/promises';
5
- import path from 'path';
6
- import { minify } from '../internal/minify.js';
7
- import { colors, component, devices, variables } from './parser/index.js';
8
- import { terminal } from '../internal/terminal.js';
9
- const __filename = fileURLToPath(import.meta.url);
10
- const __dirname = dirname(__filename);
11
- export const processCSS = async (config) => {
12
- const _normalize = fs.readFileSync(path.resolve(__dirname, './normalize.css'), 'utf-8');
13
- const _animation = fs.readFileSync(path.resolve(__dirname, './animation.css'), 'utf-8');
14
- const _variables = fs.readFileSync(path.resolve(__dirname, './variable.css'), 'utf-8');
15
- let styles = ``;
16
- if (config.options.normalize)
17
- styles += `${_normalize}\n`;
18
- const colorScheme = colors(config);
19
- const deviceDisplay = devices(config);
20
- const variablesStyles = variables(config);
21
- styles += `${colorScheme.root}\n`;
22
- styles += `${variablesStyles}\n`;
23
- styles += `${variablesStyles}\n`;
24
- styles += `${_variables}\n`;
25
- styles += `${colorScheme.className}\n`;
26
- styles += `${deviceDisplay}\n`;
27
- styles += component(config);
28
- styles += `${_animation}\n`;
29
- if (config.options.minify) {
30
- styles = minify(styles);
31
- terminal('success', 'css minified');
32
- }
33
- fsPromises.writeFile(path.resolve(__dirname, '../styles.css'), styles);
34
- };
@@ -1,5 +0,0 @@
1
- import type { Lapikit } from '../../internal/types.js';
2
- export declare const colors: (config: Lapikit) => {
3
- root: string;
4
- className: string;
5
- };