@youcan/celeste 0.14.0 → 0.14.1

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/celeste.css CHANGED
@@ -5952,9 +5952,12 @@ to {
5952
5952
  width: 20px;
5953
5953
  padding: 0;
5954
5954
  transition: transform var(--animation-fast) ease-in-out;
5955
+ border: 0;
5955
5956
  border-radius: var(--radius-8);
5956
5957
  outline: none;
5958
+ background: none;
5957
5959
  color: var(--sidebar-foreground);
5960
+ text-decoration: none;
5958
5961
  inset-inline-end: var(--spacing-4);
5959
5962
  inset-block-start: var(--spacing-8);
5960
5963
  aspect-ratio: 1;
@@ -6058,10 +6061,14 @@ to {
6058
6061
  height var(--animation-fast) linear,
6059
6062
  padding var(--animation-fast) linear,
6060
6063
  background-color var(--animation-fast);
6064
+ border: 0;
6061
6065
  border-radius: var(--radius-8);
6062
6066
  outline: none;
6067
+ background: none;
6068
+ color: var(--sidebar-foreground);
6063
6069
  font: var(--label-sm);
6064
6070
  text-align: start;
6071
+ text-decoration: none;
6065
6072
  gap: var(--spacing-8);
6066
6073
  }
6067
6074
  .celeste-sidebar-menu-button:hover {
@@ -6144,9 +6151,12 @@ to {
6144
6151
  overflow: hidden;
6145
6152
  transform: translateX(-1px);
6146
6153
  transition: background-color var(--animation-fast);
6154
+ border: 0;
6147
6155
  border-radius: var(--radius-8);
6148
6156
  outline: none;
6157
+ background: none;
6149
6158
  color: var(--sidebar-foreground);
6159
+ text-decoration: none;
6150
6160
  gap: var(--spacing-8);
6151
6161
  }
6152
6162
  .celeste-sidebar-menu-sub-button:hover {
@@ -6201,12 +6211,14 @@ to {
6201
6211
  display: flex;
6202
6212
  flex-direction: column;
6203
6213
  min-width: 0;
6214
+ margin-block: 0;
6204
6215
  margin-inline: var(--spacing-16);
6205
6216
  padding-block: var(--spacing-4);
6206
6217
  padding-inline: var(--spacing-10);
6207
6218
  transform: translateX(1px);
6208
6219
  gap: var(--spacing-4);
6209
6220
  border-inline-start: 1px solid var(--sidebar-border);
6221
+ list-style: none;
6210
6222
  }
6211
6223
  [data-collapsible='icon'] .celeste-sidebar-menu-sub {
6212
6224
  display: none;
@@ -6217,7 +6229,10 @@ to {
6217
6229
  flex-direction: column;
6218
6230
  width: 100%;
6219
6231
  min-width: 0;
6232
+ margin: 0;
6233
+ padding: 0;
6220
6234
  gap: var(--spacing-4);
6235
+ list-style: none;
6221
6236
  }
6222
6237
 
6223
6238
  :root {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@youcan/celeste",
3
3
  "type": "module",
4
- "version": "0.14.0",
4
+ "version": "0.14.1",
5
5
  "author": "YouCan <tech@youcan.shop>",
6
6
  "repository": {
7
7
  "type": "git",
@@ -52,8 +52,8 @@
52
52
  "reka-ui": "^2.10.1",
53
53
  "tinycolor2": "^1.6.0",
54
54
  "vue-sonner": "^2.0.9",
55
- "@youcan/celeste-icons": "0.14.0",
56
- "@youcan/celeste-tokens": "0.14.0"
55
+ "@youcan/celeste-icons": "0.14.1",
56
+ "@youcan/celeste-tokens": "0.14.1"
57
57
  },
58
58
  "devDependencies": {
59
59
  "@chromatic-com/storybook": "^5.3.0",
@@ -42,7 +42,7 @@ export const Default: Story = {
42
42
  />
43
43
  <ModalBody>
44
44
  <div style="display: grid; gap: 4px;">
45
- <Label label-text="Email address" sublabel="(Optional)" required />
45
+ <Label sublabel="(Optional)" required>Email address</Label>
46
46
  <TextInput type="email" placeholder="hello@live.fr" size="md" />
47
47
  </div>
48
48
  </ModalBody>
@@ -79,7 +79,7 @@ export const WithoutDescription: Story = {
79
79
  />
80
80
  <ModalBody>
81
81
  <div style="display: grid; gap: 4px;">
82
- <Label label-text="Email address" sublabel="(Optional)" required />
82
+ <Label sublabel="(Optional)" required>Email address</Label>
83
83
  <TextInput type="email" placeholder="hello@live.fr" size="md" />
84
84
  </div>
85
85
  </ModalBody>
@@ -113,7 +113,7 @@ export const WithoutIcon: Story = {
113
113
  <ModalHeader title="Email Verification"/>
114
114
  <ModalBody>
115
115
  <div style="display: grid; gap: 4px;">
116
- <Label label-text="Email address" sublabel="(Optional)" required />
116
+ <Label sublabel="(Optional)" required>Email address</Label>
117
117
  <TextInput type="email" placeholder="hello@live.fr" size="md" />
118
118
  </div>
119
119
  </ModalBody>
@@ -38,9 +38,12 @@ const props = withDefaults(defineProps<SidebarMenuActionProps>(), {
38
38
  width: 20px;
39
39
  padding: 0;
40
40
  transition: transform var(--animation-fast) ease-in-out;
41
+ border: 0;
41
42
  border-radius: var(--radius-8);
42
43
  outline: none;
44
+ background: none;
43
45
  color: var(--sidebar-foreground);
46
+ text-decoration: none;
44
47
  inset-inline-end: var(--spacing-4);
45
48
  inset-block-start: var(--spacing-8);
46
49
  aspect-ratio: 1;
@@ -51,10 +51,14 @@ const delegatedProps = reactiveOmit(props, 'class', 'variant', 'isActive');
51
51
  height var(--animation-fast) linear,
52
52
  padding var(--animation-fast) linear,
53
53
  background-color var(--animation-fast);
54
+ border: 0;
54
55
  border-radius: var(--radius-8);
55
56
  outline: none;
57
+ background: none;
58
+ color: var(--sidebar-foreground);
56
59
  font: var(--label-sm);
57
60
  text-align: start;
61
+ text-decoration: none;
58
62
  gap: var(--spacing-8);
59
63
  }
60
64
 
@@ -46,9 +46,12 @@ const props = withDefaults(defineProps<SidebarMenuSubButtonProps>(), {
46
46
  overflow: hidden;
47
47
  transform: translateX(-1px);
48
48
  transition: background-color var(--animation-fast);
49
+ border: 0;
49
50
  border-radius: var(--radius-8);
50
51
  outline: none;
52
+ background: none;
51
53
  color: var(--sidebar-foreground);
54
+ text-decoration: none;
52
55
  gap: var(--spacing-8);
53
56
  }
54
57
 
@@ -21,12 +21,14 @@ const props = defineProps<{
21
21
  display: flex;
22
22
  flex-direction: column;
23
23
  min-width: 0;
24
+ margin-block: 0;
24
25
  margin-inline: var(--spacing-16);
25
26
  padding-block: var(--spacing-4);
26
27
  padding-inline: var(--spacing-10);
27
28
  transform: translateX(1px);
28
29
  gap: var(--spacing-4);
29
30
  border-inline-start: 1px solid var(--sidebar-border);
31
+ list-style: none;
30
32
  }
31
33
 
32
34
  [data-collapsible='icon'] .celeste-sidebar-menu-sub {
@@ -22,6 +22,9 @@ const props = defineProps<{
22
22
  flex-direction: column;
23
23
  width: 100%;
24
24
  min-width: 0;
25
+ margin: 0;
26
+ padding: 0;
25
27
  gap: var(--spacing-4);
28
+ list-style: none;
26
29
  }
27
30
  </style>
@@ -180,7 +180,7 @@ export const Simple: Story = {
180
180
  },
181
181
  template: `
182
182
  <SidebarProvider>
183
- <Sidebar collapsible="icon" side="end" v-bind="args">
183
+ <Sidebar collapsible="icon" v-bind="args">
184
184
  <SidebarHeader>
185
185
  <DropdownMenu>
186
186
  <DropdownMenuTrigger as-child>
@@ -351,7 +351,7 @@ export const Simple: Story = {
351
351
 
352
352
  <div style="padding: 24px;">
353
353
  <SidebarTrigger />
354
- <div>
354
+ </div>
355
355
  </SidebarProvider>
356
356
  `,
357
357
  }),