lapikit 0.1.5 → 0.1.7
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/dist/actions/index.d.ts +1 -0
- package/dist/actions/index.js +1 -0
- package/dist/assets/icons/arrow-down.svelte +10 -0
- package/dist/assets/icons/arrow-down.svelte.d.ts +26 -0
- package/dist/assets/icons/arrow-up.svelte +10 -0
- package/dist/assets/icons/arrow-up.svelte.d.ts +26 -0
- package/dist/assets/icons/close-fill.svelte +10 -0
- package/dist/assets/icons/close-fill.svelte.d.ts +26 -0
- package/dist/components/accordion/accordion.css +113 -0
- package/dist/components/accordion/accordion.svelte +37 -0
- package/dist/components/accordion/accordion.svelte.d.ts +4 -0
- package/dist/components/accordion/accordion.svelte.js +24 -0
- package/dist/components/accordion/modules/accordion-item.svelte +94 -0
- package/dist/components/accordion/modules/accordion-item.svelte.d.ts +4 -0
- package/dist/components/accordion/types.d.ts +33 -0
- package/dist/components/accordion/types.js +1 -0
- package/dist/components/alert/alert.css +127 -0
- package/dist/components/alert/alert.svelte +89 -0
- package/dist/components/alert/alert.svelte.d.ts +4 -0
- package/dist/components/alert/types.d.ts +28 -0
- package/dist/components/alert/types.js +1 -0
- package/dist/components/aspect-ratio/aspect-ratio.css +19 -0
- package/dist/components/aspect-ratio/aspect-ratio.svelte +25 -0
- package/dist/components/aspect-ratio/aspect-ratio.svelte.d.ts +4 -0
- package/dist/components/aspect-ratio/types.d.ts +5 -0
- package/dist/components/aspect-ratio/types.js +1 -0
- package/dist/components/avatar/avatar.css +109 -0
- package/dist/components/avatar/avatar.svelte +46 -0
- package/dist/components/avatar/avatar.svelte.d.ts +4 -0
- package/dist/components/avatar/types.d.ts +22 -0
- package/dist/components/avatar/types.js +1 -0
- package/dist/components/card/card.css +109 -0
- package/dist/components/card/card.svelte +50 -0
- package/dist/components/card/card.svelte.d.ts +4 -0
- package/dist/components/card/types.d.ts +18 -0
- package/dist/components/card/types.js +1 -0
- package/dist/components/chip/chip.css +199 -0
- package/dist/components/chip/chip.svelte +118 -0
- package/dist/components/chip/chip.svelte.d.ts +4 -0
- package/dist/components/chip/types.d.ts +30 -0
- package/dist/components/chip/types.js +1 -0
- package/dist/components/index.d.ts +10 -0
- package/dist/components/index.js +10 -0
- package/dist/components/list/list.css +195 -0
- package/dist/components/list/list.svelte +46 -0
- package/dist/components/list/list.svelte.d.ts +4 -0
- package/dist/components/list/modules/list-item.svelte +68 -0
- package/dist/components/list/modules/list-item.svelte.d.ts +4 -0
- package/dist/components/list/types.d.ts +36 -0
- package/dist/components/list/types.js +1 -0
- package/dist/components/toolbar/toolbar.css +142 -0
- package/dist/components/toolbar/toolbar.svelte +47 -0
- package/dist/components/toolbar/toolbar.svelte.d.ts +4 -0
- package/dist/components/toolbar/types.d.ts +27 -0
- package/dist/components/toolbar/types.js +1 -0
- package/package.json +4 -1
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { getAssets } from '../../internal/index.js';
|
|
3
|
+
import type { ToolbarProps } from './types.js';
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
children,
|
|
7
|
+
ref = $bindable(),
|
|
8
|
+
is = 'div',
|
|
9
|
+
classContent,
|
|
10
|
+
light,
|
|
11
|
+
dark,
|
|
12
|
+
variant,
|
|
13
|
+
rounded,
|
|
14
|
+
background,
|
|
15
|
+
color,
|
|
16
|
+
density = 'default',
|
|
17
|
+
orientation = 'horizontal',
|
|
18
|
+
location,
|
|
19
|
+
...rest
|
|
20
|
+
}: ToolbarProps = $props();
|
|
21
|
+
|
|
22
|
+
const assets = getAssets();
|
|
23
|
+
</script>
|
|
24
|
+
|
|
25
|
+
<svelte:element
|
|
26
|
+
this={is}
|
|
27
|
+
bind:this={ref}
|
|
28
|
+
{...rest}
|
|
29
|
+
role="toolbar"
|
|
30
|
+
class={[
|
|
31
|
+
'kit-toolbar',
|
|
32
|
+
light && 'light',
|
|
33
|
+
dark && 'dark',
|
|
34
|
+
variant && assets.className('toolbar', 'variant', variant),
|
|
35
|
+
density && assets.className('toolbar', 'density', density),
|
|
36
|
+
orientation && assets.className('toolbar', 'orientation', orientation),
|
|
37
|
+
location && assets.className('toolbar', 'location', location),
|
|
38
|
+
rest.class
|
|
39
|
+
]}
|
|
40
|
+
style:--base={assets.color(background)}
|
|
41
|
+
style:--on={assets.color(color)}
|
|
42
|
+
style:--shape={assets.shape(rounded)}
|
|
43
|
+
>
|
|
44
|
+
<div class={['myt-toolbar--wrapper', classContent]}>
|
|
45
|
+
{@render children?.()}
|
|
46
|
+
</div>
|
|
47
|
+
</svelte:element>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { Component } from '../../internal/types.js';
|
|
2
|
+
type Variant = 'outline' | 'text' | 'dash';
|
|
3
|
+
type Density = 'compact' | 'comfortable' | 'default';
|
|
4
|
+
type Orientation = 'horizontal' | 'vertical';
|
|
5
|
+
type Location = 'top' | 'bottom';
|
|
6
|
+
export interface ToolbarProps extends Component {
|
|
7
|
+
is?: 'div' | 'header' | 'nav';
|
|
8
|
+
variant?: Variant | {
|
|
9
|
+
[key: string]: Variant;
|
|
10
|
+
};
|
|
11
|
+
rounded?: string;
|
|
12
|
+
density?: Density | {
|
|
13
|
+
[key: string]: Density;
|
|
14
|
+
};
|
|
15
|
+
dark?: boolean;
|
|
16
|
+
light?: boolean;
|
|
17
|
+
color?: string;
|
|
18
|
+
orientation?: Orientation | {
|
|
19
|
+
[key: string]: Orientation;
|
|
20
|
+
};
|
|
21
|
+
background?: string;
|
|
22
|
+
location?: Location | {
|
|
23
|
+
[key: string]: Location;
|
|
24
|
+
};
|
|
25
|
+
classContent?: string | string[] | undefined;
|
|
26
|
+
}
|
|
27
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lapikit",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -55,6 +55,9 @@
|
|
|
55
55
|
"./stores": {
|
|
56
56
|
"default": "./dist/stores/index.js"
|
|
57
57
|
},
|
|
58
|
+
"./actions": {
|
|
59
|
+
"default": "./dist/actions/index.js"
|
|
60
|
+
},
|
|
58
61
|
"./css": "./dist/styles.css"
|
|
59
62
|
},
|
|
60
63
|
"peerDependencies": {
|