Skip to content

Commit b002c09

Browse files
authored
Merge pull request #40 from kampsy/dev
Dev to main
2 parents 2efd144 + 8544dcd commit b002c09

File tree

34 files changed

+1511
-850
lines changed

34 files changed

+1511
-850
lines changed

package.json

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -51,31 +51,31 @@
5151
"svelte": "^5.0.0-next.1"
5252
},
5353
"devDependencies": {
54-
"@playwright/test": "^1.51.1",
54+
"@playwright/test": "^1.55.0",
5555
"@semantic-release/exec": "^6.0.3",
5656
"@sveltejs/adapter-auto": "^3.3.1",
57-
"@sveltejs/kit": "^2.20.2",
58-
"@sveltejs/package": "^2.3.10",
57+
"@sveltejs/kit": "^2.35.0",
58+
"@sveltejs/package": "^2.5.0",
5959
"@sveltejs/vite-plugin-svelte": "4.0.0-next.6",
6060
"@types/eslint": "^8.56.12",
6161
"autoprefixer": "^10.4.21",
62-
"eslint": "^9.23.0",
63-
"eslint-config-prettier": "^9.1.0",
62+
"eslint": "^9.33.0",
63+
"eslint-config-prettier": "^9.1.2",
6464
"eslint-plugin-svelte": "^2.46.1",
6565
"globals": "^15.15.0",
6666
"highlight.js": "^11.11.1",
67-
"postcss": "^8.5.3",
68-
"prettier": "^3.5.3",
69-
"prettier-plugin-svelte": "^3.3.3",
67+
"postcss": "^8.5.6",
68+
"prettier": "^3.6.2",
69+
"prettier-plugin-svelte": "^3.4.0",
7070
"publint": "^0.1.16",
71-
"semantic-release": "^24.2.3",
72-
"svelte": "^5.25.6",
73-
"svelte-check": "^4.1.5",
71+
"semantic-release": "^24.2.7",
72+
"svelte": "^5.38.2",
73+
"svelte-check": "^4.3.1",
7474
"tailwindcss": "^3.4.17",
7575
"tslib": "^2.8.1",
76-
"typescript": "^5.8.2",
76+
"typescript": "^5.9.2",
7777
"typescript-eslint": "8.0.0-alpha.39",
78-
"vite": "^5.4.16",
78+
"vite": "^5.4.19",
7979
"vitest": "^1.6.1"
8080
},
8181
"svelte": "./dist/index.js",

pnpm-lock.yaml

Lines changed: 657 additions & 654 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/docs/data/collapse.ts

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,38 @@ import { Collapse } from 'kampsy-ui';
6262
</Collapse.Item>
6363
</Collapse.Root>`;
6464

65+
export const collapseMultiple = `
66+
import { Collapse } from 'kampsy-ui';
67+
68+
<Collapse.Root multiple>
69+
<Collapse.Item value="tab1">
70+
<Collapse.Trigger
71+
role="heading"
72+
aria-level={3}
73+
type="button"
74+
aria-controls="tab1-section"
75+
aria-expanded="false">Question A</Collapse.Trigger>
76+
<Collapse.Content id="tab1-section" aria-hidden="true" aria-labelledby="tab1">
77+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
78+
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
79+
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
80+
</Collapse.Content>
81+
</Collapse.Item>
82+
<Collapse.Item defaultExpanded value="tab2">
83+
<Collapse.Trigger
84+
role="heading"
85+
aria-level={3}
86+
type="button"
87+
aria-controls="tab2-section"
88+
aria-expanded="false">Question B</Collapse.Trigger>
89+
<Collapse.Content id="tab2-section" aria-hidden="false" aria-labelledby="tab2">
90+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
91+
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
92+
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
93+
</Collapse.Content>
94+
</Collapse.Item>
95+
</Collapse.Root>`;
96+
6597
export const collapseSize = `
6698
import { Collapse } from 'kampsy-ui';
6799

src/docs/data/emptyState.ts

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
export const emptyStateDefault = `
2+
import { EmptyState, ChartBarPeak } from 'kampsy-ui';
3+
4+
<EmptyState.Root
5+
description="A message conveying the state of the product."
6+
icon={ChartBarPeak}
7+
title="Title"
8+
/>`;
9+
10+
export const blankStateDocs = emptyStateDefault;
11+
12+
export const informationalDocs = `
13+
import { EmptyState, ChartBarPeak, Button} from 'kampsy-ui';
14+
15+
<EmptyState.Root
16+
description="This should detail the actions you can take on this screen, as well as why it’s valuable."
17+
icon={ChartBarPeak}
18+
title="Title"
19+
>
20+
<Button variant="secondary">Primary Action</Button>
21+
</EmptyState.Root>
22+
`;

src/docs/data/select.ts

Lines changed: 45 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,4 +56,48 @@ let value = $state('');
5656
<Select.Item value="pineapple">pineapple</Select.Item>
5757
</Select.Content>
5858
</Select.Root>
59-
</div>`;
59+
</div>`;
60+
61+
export const selectError = `
62+
import { Select } from 'kampsy-ui';
63+
64+
let value = $state('');
65+
let error = $state('Please select a value.');
66+
67+
<div class="w-full flex flex-wrap gap-4 justify-between">
68+
<Select.Root bind:error size="small" bind:value class="w-full lg:w-auto">
69+
<Select.Trigger class="w-full lg:w-[200px]">
70+
<Select.Value placeholder="select a friuit" />
71+
</Select.Trigger>
72+
<Select.Content>
73+
<Select.Item value="apple">apple</Select.Item>
74+
<Select.Item value="banana">banana</Select.Item>
75+
<Select.Item value="orange">orange</Select.Item>
76+
<Select.Item value="pineapple">pineapple</Select.Item>
77+
</Select.Content>
78+
</Select.Root>
79+
80+
<Select.Root bind:error bind:value class="w-full lg:w-auto" >
81+
<Select.Trigger class="w-full lg:w-[200px]">
82+
<Select.Value placeholder="select a friuit" />
83+
</Select.Trigger>
84+
<Select.Content>
85+
<Select.Item value="apple">apple</Select.Item>
86+
<Select.Item value="banana">banana</Select.Item>
87+
<Select.Item value="orange">orange</Select.Item>
88+
<Select.Item value="pineapple">pineapple</Select.Item>
89+
</Select.Content>
90+
</Select.Root>
91+
92+
<Select.Root bind:error size="large" bind:value class="w-full lg:w-auto" >
93+
<Select.Trigger class="w-full lg:w-[200px]">
94+
<Select.Value placeholder="select a friuit" />
95+
</Select.Trigger>
96+
<Select.Content>
97+
<Select.Item value="apple">apple</Select.Item>
98+
<Select.Item value="banana">banana</Select.Item>
99+
<Select.Item value="orange">orange</Select.Item>
100+
<Select.Item value="pineapple">pineapple</Select.Item>
101+
</Select.Content>
102+
</Select.Root>
103+
</div>`;

src/docs/data/spinner.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,8 @@ import { Spinner } from 'kampsy-ui';
66
export const spinnerCustom = `
77
import { Spinner } from 'kampsy-ui';
88
9-
<Spinner size={30} />`;
9+
<div class="flex items-center gap-8">
10+
<Spinner size={12} />
11+
<Spinner size={32} />
12+
<Spinner size={40} />
13+
</div>`;

src/docs/ui/aside.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
66
interface Props {
77
asideDataList?: Array<AsideT>;
8-
};
8+
}
99
1010
let { asideDataList = undefined }: Props = $props();
1111

src/docs/utils/data.ts

Lines changed: 19 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -66,12 +66,24 @@ export const asideData: Array<AsideT> = [
6666
},
6767
{
6868
name: 'collapse',
69-
url: '/collapse'
69+
url: '/collapse',
70+
badge: {
71+
name: 'updated',
72+
variant: 'purple'
73+
}
7074
},
7175
{
7276
name: 'description',
7377
url: '/description'
7478
},
79+
{
80+
name: 'empty state',
81+
url: '/empty-state',
82+
badge: {
83+
name: 'new',
84+
variant: 'blue'
85+
}
86+
},
7587
{
7688
name: 'error',
7789
url: '/error'
@@ -98,11 +110,7 @@ export const asideData: Array<AsideT> = [
98110
},
99111
{
100112
name: 'pill',
101-
url: '/badge#pill',
102-
badge: {
103-
name: 'new',
104-
variant: 'green'
105-
}
113+
url: '/badge#pill'
106114
},
107115
{
108116
name: 'progress',
@@ -114,7 +122,11 @@ export const asideData: Array<AsideT> = [
114122
},
115123
{
116124
name: 'select',
117-
url: '/select'
125+
url: '/select',
126+
badge: {
127+
name: 'updated',
128+
variant: 'purple'
129+
}
118130
},
119131
{
120132
name: 'show more',

src/lib/collapse/content.svelte

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,10 @@
1010
1111
let { size, value } = getContext<{ size: 'small' | 'large'; value: string }>('collapseItem');
1212
13-
let collapseItem = getContext<{ get: () => string; set: (value: string) => void }>('collapse');
13+
let collapseItem = getContext<{
14+
getItem: () => string;
15+
setItem: (value: string) => void
16+
}>('collapse');
1417
1518
let isActive = $state(false);
1619
@@ -23,7 +26,7 @@
2326
});
2427
2528
$effect.pre(() => {
26-
if (collapseItem.get() == value) {
29+
if (collapseItem.getItem().includes(value)) {
2730
isActive = true;
2831
} else {
2932
isActive = false;

src/lib/collapse/root.svelte

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,15 @@
33
import { createCollapseState } from './root.svelte.js';
44
55
interface Props {
6+
multiple?: boolean | undefined;
67
children: Snippet | undefined;
7-
};
8-
let { children }: Props = $props();
8+
}
9+
let {
10+
multiple = false,
11+
children
12+
}: Props = $props();
913
10-
const collapseState = createCollapseState({ item: '' });
14+
const collapseState = createCollapseState({ multiple: multiple, item: []});
1115
1216
setContext('collapse', collapseState);
1317
</script>

0 commit comments

Comments
 (0)