@youcan/celeste 0.17.0 → 0.17.2

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 (27) hide show
  1. package/ai/README.md +1 -1
  2. package/ai/component-registry.json +2 -2
  3. package/ai/icons.json +2 -2
  4. package/ai/tokens.json +8 -5
  5. package/dist/celeste.css +198 -197
  6. package/dist/cjs/chunks/badge.cjs +1 -1
  7. package/dist/cjs/chunks/button.cjs +1 -1
  8. package/dist/cjs/chunks/compact-button.cjs +1 -1
  9. package/dist/cjs/chunks/fancy-button.cjs +1 -1
  10. package/dist/cjs/chunks/link-button.cjs +1 -1
  11. package/dist/cjs/chunks/modal-content.cjs +1 -1
  12. package/dist/cjs/chunks/social-button.cjs +1 -1
  13. package/dist/es/chunks/badge.js +1 -1
  14. package/dist/es/chunks/button.js +1 -1
  15. package/dist/es/chunks/compact-button.js +1 -1
  16. package/dist/es/chunks/fancy-button.js +1 -1
  17. package/dist/es/chunks/link-button.js +1 -1
  18. package/dist/es/chunks/modal-content.js +1 -1
  19. package/dist/es/chunks/social-button.js +1 -1
  20. package/package.json +3 -3
  21. package/src/components/badge/badge.vue +1 -1
  22. package/src/components/button/button.vue +5 -5
  23. package/src/components/button/compact-button.vue +1 -1
  24. package/src/components/button/fancy-button.vue +6 -6
  25. package/src/components/button/link-button.vue +5 -5
  26. package/src/components/button/social-button.vue +2 -2
  27. package/src/components/modal/modal-content.vue +1 -0
package/dist/cjs/chunks/badge.cjs CHANGED
@@ -54,7 +54,7 @@ var badge_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.de
54
54
  });
55
55
  //#endregion
56
56
  //#region src/components/badge/badge.vue
57
- var badge_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(badge_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-26dfea2b"]]);
57
+ var badge_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(badge_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e88c7e25"]]);
58
58
  //#endregion
59
59
  Object.defineProperty(exports, "badge_default", {
60
60
  enumerable: true,
package/dist/cjs/chunks/button.cjs CHANGED
@@ -39,7 +39,7 @@ var button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.d
39
39
  });
40
40
  //#endregion
41
41
  //#region src/components/button/button.vue
42
- var button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-d9a3a958"]]);
42
+ var button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-86a7957d"]]);
43
43
  //#endregion
44
44
  Object.defineProperty(exports, "button_default", {
45
45
  enumerable: true,
package/dist/cjs/chunks/compact-button.cjs CHANGED
@@ -40,7 +40,7 @@ var compact_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (
40
40
  });
41
41
  //#endregion
42
42
  //#region src/components/button/compact-button.vue
43
- var compact_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(compact_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-74e9648d"]]);
43
+ var compact_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(compact_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-bcc27daf"]]);
44
44
  //#endregion
45
45
  Object.defineProperty(exports, "compact_button_default", {
46
46
  enumerable: true,
package/dist/cjs/chunks/fancy-button.cjs CHANGED
@@ -38,7 +38,7 @@ var fancy_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0,
38
38
  });
39
39
  //#endregion
40
40
  //#region src/components/button/fancy-button.vue
41
- var fancy_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(fancy_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-262bd031"]]);
41
+ var fancy_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(fancy_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e9dcba71"]]);
42
42
  //#endregion
43
43
  Object.defineProperty(exports, "fancy_button_default", {
44
44
  enumerable: true,
package/dist/cjs/chunks/link-button.cjs CHANGED
@@ -44,7 +44,7 @@ var link_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0,
44
44
  });
45
45
  //#endregion
46
46
  //#region src/components/button/link-button.vue
47
- var link_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(link_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-6436f331"]]);
47
+ var link_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(link_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-42f6843d"]]);
48
48
  //#endregion
49
49
  Object.defineProperty(exports, "link_button_default", {
50
50
  enumerable: true,
package/dist/cjs/chunks/modal-content.cjs CHANGED
@@ -61,7 +61,7 @@ var modal_content_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0
61
61
  });
62
62
  //#endregion
63
63
  //#region src/components/modal/modal-content.vue
64
- var modal_content_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(modal_content_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-f6a37b86"]]);
64
+ var modal_content_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(modal_content_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-582c8a70"]]);
65
65
  //#endregion
66
66
  Object.defineProperty(exports, "modal_content_default", {
67
67
  enumerable: true,
package/dist/cjs/chunks/social-button.cjs CHANGED
@@ -32,7 +32,7 @@ var social_button_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0
32
32
  });
33
33
  //#endregion
34
34
  //#region src/components/button/social-button.vue
35
- var social_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(social_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-8db97e9a"]]);
35
+ var social_button_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(social_button_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dd727c87"]]);
36
36
  //#endregion
37
37
  Object.defineProperty(exports, "social_button_default", {
38
38
  enumerable: true,
package/dist/es/chunks/badge.js CHANGED
@@ -53,6 +53,6 @@ var badge_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__
53
53
  ], 10, _hoisted_1);
54
54
  };
55
55
  }
56
- }), [["__scopeId", "data-v-26dfea2b"]]);
56
+ }), [["__scopeId", "data-v-e88c7e25"]]);
57
57
  //#endregion
58
58
  export { badge_default as t };
package/dist/es/chunks/button.js CHANGED
@@ -37,6 +37,6 @@ var button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
37
37
  ]);
38
38
  };
39
39
  }
40
- }), [["__scopeId", "data-v-d9a3a958"]]);
40
+ }), [["__scopeId", "data-v-86a7957d"]]);
41
41
  //#endregion
42
42
  export { button_default as t };
package/dist/es/chunks/compact-button.js CHANGED
@@ -38,6 +38,6 @@ var compact_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/*
38
38
  ]);
39
39
  };
40
40
  }
41
- }), [["__scopeId", "data-v-74e9648d"]]);
41
+ }), [["__scopeId", "data-v-bcc27daf"]]);
42
42
  //#endregion
43
43
  export { compact_button_default as t };
package/dist/es/chunks/fancy-button.js CHANGED
@@ -36,6 +36,6 @@ var fancy_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
36
36
  ]);
37
37
  };
38
38
  }
39
- }), [["__scopeId", "data-v-262bd031"]]);
39
+ }), [["__scopeId", "data-v-e9dcba71"]]);
40
40
  //#endregion
41
41
  export { fancy_button_default as t };
package/dist/es/chunks/link-button.js CHANGED
@@ -42,6 +42,6 @@ var link_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
42
42
  ]);
43
43
  };
44
44
  }
45
- }), [["__scopeId", "data-v-6436f331"]]);
45
+ }), [["__scopeId", "data-v-42f6843d"]]);
46
46
  //#endregion
47
47
  export { link_button_default as t };
package/dist/es/chunks/modal-content.js CHANGED
@@ -59,6 +59,6 @@ var modal_content_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @
59
59
  });
60
60
  };
61
61
  }
62
- }), [["__scopeId", "data-v-f6a37b86"]]);
62
+ }), [["__scopeId", "data-v-582c8a70"]]);
63
63
  //#endregion
64
64
  export { modal_content_default as t };
package/dist/es/chunks/social-button.js CHANGED
@@ -31,6 +31,6 @@ var social_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @
31
31
  }, 8, ["aria-label", "class"]);
32
32
  };
33
33
  }
34
- }), [["__scopeId", "data-v-8db97e9a"]]);
34
+ }), [["__scopeId", "data-v-dd727c87"]]);
35
35
  //#endregion
36
36
  export { social_button_default as t };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@youcan/celeste",
3
3
  "type": "module",
4
- "version": "0.17.0",
4
+ "version": "0.17.2",
5
5
  "author": "YouCan <tech@youcan.shop>",
6
6
  "repository": {
7
7
  "type": "git",
@@ -52,8 +52,8 @@
52
52
  "reka-ui": "~2.10.5",
53
53
  "tinycolor2": "^1.6.0",
54
54
  "vue-sonner": "^2.0.9",
55
- "@youcan/celeste-tokens": "0.17.0",
56
- "@youcan/celeste-icons": "0.17.0"
55
+ "@youcan/celeste-icons": "0.17.2",
56
+ "@youcan/celeste-tokens": "0.17.2"
57
57
  },
58
58
  "devDependencies": {
59
59
  "@chromatic-com/storybook": "^5.3.0",
package/src/components/badge/badge.vue CHANGED
@@ -110,7 +110,7 @@ $states: faded, information, warning, error, success, away, feature, verified, h
110
110
  @each $state in $states {
111
111
  &-fill.celeste-badge-#{$state}:not(&-disabled) {
112
112
  background-color: var(--color-state-#{$state}-base);
113
- color: var(--color-text-white-0);
113
+ color: var(--color-static-white);
114
114
  }
115
115
 
116
116
  &-light.celeste-badge-#{$state}:not(&-disabled) {
package/src/components/button/button.vue CHANGED
@@ -68,7 +68,7 @@ $size-map: (
68
68
  $intent-map: (
69
69
  'primary': (
70
70
  'fill': (
71
- fg: var(--color-text-white-0),
71
+ fg: var(--color-static-white),
72
72
  bg: var(--color-primary-base),
73
73
  border: var(--color-primary-base),
74
74
  shadow: none,
@@ -120,7 +120,7 @@ $intent-map: (
120
120
  ),
121
121
  'error': (
122
122
  'fill': (
123
- fg: var(--color-text-white-0),
123
+ fg: var(--color-static-white),
124
124
  bg: var(--color-state-error-base),
125
125
  border: var(--color-state-error-base),
126
126
  shadow: none,
@@ -148,7 +148,7 @@ $intent-map: (
148
148
  $hover-map: (
149
149
  'primary': (
150
150
  'fill': (
151
- fg: var(--color-text-white-0),
151
+ fg: var(--color-static-white),
152
152
  bg: var(--color-primary-darker),
153
153
  border: var(--color-primary-darker),
154
154
  ),
@@ -192,7 +192,7 @@ $hover-map: (
192
192
  ),
193
193
  'error': (
194
194
  'fill': (
195
- fg: var(--color-text-white-0),
195
+ fg: var(--color-static-white),
196
196
  bg: var(--color-red-700),
197
197
  border: var(--color-red-700),
198
198
  ),
@@ -270,7 +270,7 @@ $hover-map: (
270
270
  color: map.get($hover-values, fg);
271
271
  }
272
272
 
273
- &:focus:not(:disabled) {
273
+ &:focus-visible:not(:disabled) {
274
274
  outline: none;
275
275
  box-shadow: if(
276
276
  $intent == 'neutral',
package/src/components/button/compact-button.vue CHANGED
@@ -73,7 +73,7 @@ const props = withDefaults(defineProps<CompactButtonProps>(), {
73
73
  color: var(--color-icon-strong-950);
74
74
  }
75
75
 
76
- &:focus {
76
+ &:focus-visible {
77
77
  border-color: transparent;
78
78
  outline: none;
79
79
  background-color: var(--color-bg-weak-50);
package/src/components/button/fancy-button.vue CHANGED
@@ -107,7 +107,7 @@ $intent-map: (
107
107
  height: 20px;
108
108
  }
109
109
 
110
- &:focus {
110
+ &:focus-visible {
111
111
  outline: none;
112
112
  }
113
113
 
@@ -129,7 +129,7 @@ $intent-map: (
129
129
  linear-gradient(180deg, var(--celeste-fbutton-bg-start) 0%, var(--celeste-fbutton-bg-end) 100%),
130
130
  #{map.get($v, bg)};
131
131
  box-shadow: var(--shadow-fancy-buttons-#{$k});
132
- color: var(--color-text-white-0);
132
+ color: if($k == 'neutral', var(--color-text-white-0), var(--color-static-white));
133
133
 
134
134
  &::before {
135
135
  content: '';
@@ -148,7 +148,7 @@ $intent-map: (
148
148
  --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
149
149
  }
150
150
 
151
- &:focus {
151
+ &:focus-visible {
152
152
  --celeste-fbutton-bg-start: rgb(255 255 255 / 24%);
153
153
  --celeste-fbutton-bg-end: rgb(255 255 255 / 0%);
154
154
 
@@ -167,13 +167,13 @@ $intent-map: (
167
167
  &:hover {
168
168
  background: var(--color-bg-weak-50);
169
169
  box-shadow: none;
170
- color: var(--text-strong-950);
170
+ color: var(--color-text-strong-950);
171
171
  }
172
172
 
173
- &:focus {
173
+ &:focus-visible {
174
174
  background: var(--color-bg-weak-50);
175
175
  box-shadow: var(--shadow-buttons-important-focus);
176
- color: var(--text-strong-950);
176
+ color: var(--color-text-strong-950);
177
177
  }
178
178
  }
179
179
  }
package/src/components/button/link-button.vue CHANGED
@@ -57,7 +57,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
57
57
  }
58
58
 
59
59
  &:hover,
60
- &:focus {
60
+ &:focus-visible {
61
61
  outline: none;
62
62
  text-decoration: underline;
63
63
  }
@@ -92,7 +92,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
92
92
  color: var(--color-primary-base);
93
93
 
94
94
  &:hover,
95
- &:focus {
95
+ &:focus-visible {
96
96
  color: var(--color-primary-darker);
97
97
  }
98
98
  }
@@ -101,7 +101,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
101
101
  color: var(--color-text-strong-950);
102
102
 
103
103
  &:hover,
104
- &:focus {
104
+ &:focus-visible {
105
105
  color: var(--color-text-strong-950);
106
106
  }
107
107
  }
@@ -110,7 +110,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
110
110
  color: var(--color-text-sub-600);
111
111
 
112
112
  &:hover,
113
- &:focus {
113
+ &:focus-visible {
114
114
  color: var(--color-text-sub-600);
115
115
  }
116
116
  }
@@ -119,7 +119,7 @@ const props = withDefaults(defineProps<LinkButtonProps>(), {
119
119
  color: var(--color-state-error-base);
120
120
 
121
121
  &:hover,
122
- &:focus {
122
+ &:focus-visible {
123
123
  color: var(--color-red-700);
124
124
  }
125
125
  }
package/src/components/button/social-button.vue CHANGED
@@ -87,7 +87,7 @@ $brand-map: (
87
87
  padding-inline-end: var(--spacing-6);
88
88
  }
89
89
 
90
- &:focus {
90
+ &:focus-visible {
91
91
  outline: none;
92
92
  box-shadow: var(--shadow-buttons-important-focus);
93
93
  }
@@ -100,7 +100,7 @@ $brand-map: (
100
100
  border-color: var(--color-stroke-soft-200);
101
101
  background-color: var(--color-bg-white-0);
102
102
  box-shadow: var(--shadow-regular-xs);
103
- color: var(--text-strong-950);
103
+ color: var(--color-text-strong-950);
104
104
 
105
105
  &:hover {
106
106
  border-color: transparent;
package/src/components/modal/modal-content.vue CHANGED
@@ -66,6 +66,7 @@ const root = injectDialogRootContext();
66
66
 
67
67
  .celeste-modal-content {
68
68
  position: relative;
69
+ width: 440px;
69
70
  max-width: 100%;
70
71
  margin: auto;
71
72
  border: 1px solid var(--color-stroke-soft-200);