@youcan/celeste 0.6.40 → 0.6.42

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 (84) hide show
  1. package/dist/celeste.css +123 -9
  2. package/dist/cjs/chunks/index.js +211 -0
  3. package/dist/cjs/chunks/radio-group-item.vue_vue_type_style_index_0_lang.js +34 -0
  4. package/dist/cjs/chunks/radio-group.vue_vue_type_style_index_0_lang.js +39 -0
  5. package/dist/cjs/index.js +9 -0
  6. package/dist/cjs/modal-content.js +1 -1
  7. package/dist/cjs/radio-group-item.js +3 -0
  8. package/dist/cjs/radio-group.js +3 -0
  9. package/dist/cjs/tag.js +39 -0
  10. package/dist/components/index.d.ts +2 -0
  11. package/dist/components/radio-group/index.d.ts +4 -0
  12. package/dist/components/radio-group/radio-group-item.d.ts +7 -0
  13. package/dist/components/radio-group/radio-group.d.ts +26 -0
  14. package/dist/components/tag/index.d.ts +2 -0
  15. package/dist/components/tag/tag.d.ts +26 -0
  16. package/dist/es/button.js +1 -1
  17. package/dist/es/checkbox-label.js +1 -1
  18. package/dist/es/chunks/index.js +275 -64
  19. package/dist/es/chunks/index3.js +1 -1
  20. package/dist/es/chunks/radio-group-item.vue_vue_type_style_index_0_lang.js +35 -0
  21. package/dist/es/chunks/radio-group.vue_vue_type_style_index_0_lang.js +40 -0
  22. package/dist/es/combobox-group.js +1 -1
  23. package/dist/es/combobox-input.js +1 -1
  24. package/dist/es/combobox-item.js +1 -1
  25. package/dist/es/combobox-list.js +1 -1
  26. package/dist/es/combobox-root.js +1 -1
  27. package/dist/es/combobox-separator.js +1 -1
  28. package/dist/es/combobox-trigger.js +1 -1
  29. package/dist/es/command-group.js +1 -1
  30. package/dist/es/command-input.js +1 -1
  31. package/dist/es/command-item.js +1 -1
  32. package/dist/es/command-list.js +1 -1
  33. package/dist/es/command-root.js +1 -1
  34. package/dist/es/command-separator.js +1 -1
  35. package/dist/es/compact-button.js +1 -1
  36. package/dist/es/digit-input-group.js +1 -1
  37. package/dist/es/digit-input-slot.js +1 -1
  38. package/dist/es/digit-input.js +1 -1
  39. package/dist/es/dropdown-menu-content.js +1 -1
  40. package/dist/es/dropdown-menu-group.js +1 -1
  41. package/dist/es/dropdown-menu-item.js +1 -1
  42. package/dist/es/dropdown-menu-label.js +1 -1
  43. package/dist/es/dropdown-menu-separator.js +1 -1
  44. package/dist/es/dropdown-menu-sub-content.js +1 -1
  45. package/dist/es/dropdown-menu-sub-trigger.js +1 -1
  46. package/dist/es/dropdown-menu-trigger.js +1 -1
  47. package/dist/es/dropdown-menu.js +1 -1
  48. package/dist/es/dropdown.js +1 -1
  49. package/dist/es/fancy-button.js +1 -1
  50. package/dist/es/index.js +27 -18
  51. package/dist/es/label.js +1 -1
  52. package/dist/es/link-button.js +1 -1
  53. package/dist/es/modal-content.js +2 -2
  54. package/dist/es/modal-header.js +1 -1
  55. package/dist/es/popover-content.js +1 -1
  56. package/dist/es/popover-trigger.js +1 -1
  57. package/dist/es/progress-bar.js +1 -1
  58. package/dist/es/progress-circle.js +1 -1
  59. package/dist/es/radio-group-item.js +4 -0
  60. package/dist/es/radio-group.js +4 -0
  61. package/dist/es/segmented-control-item.js +1 -1
  62. package/dist/es/segmented-control.js +1 -1
  63. package/dist/es/select-content.js +1 -1
  64. package/dist/es/select-item.js +1 -1
  65. package/dist/es/select-trigger.js +1 -1
  66. package/dist/es/select-value.js +1 -1
  67. package/dist/es/social-button.js +1 -1
  68. package/dist/es/tab-menu-content.js +1 -1
  69. package/dist/es/tab-menu-item.js +1 -1
  70. package/dist/es/tab-menu-list.js +1 -1
  71. package/dist/es/tab-menu.js +1 -1
  72. package/dist/es/tag.js +40 -0
  73. package/dist/es/text-input.js +1 -1
  74. package/dist/es/tooltip.js +1 -1
  75. package/package.json +3 -4
  76. package/src/components/index.ts +2 -0
  77. package/src/components/modal/modal-content.vue +2 -2
  78. package/src/components/radio-group/index.ts +5 -0
  79. package/src/components/radio-group/radio-group-item.vue +83 -0
  80. package/src/components/radio-group/radio-group.vue +30 -0
  81. package/src/components/radio-group/stories/radio-group.stories.ts +48 -0
  82. package/src/components/tag/index.ts +2 -0
  83. package/src/components/tag/stories/tag.stories.ts +162 -0
  84. package/src/components/tag/tag.vue +125 -0
package/dist/celeste.css CHANGED
@@ -101,7 +101,57 @@
101
101
  .thumb[data-v-96c265fe] {
102
102
  background-color: var(--color-bg-soft-200);
103
103
  }
104
- .celecte-content-divider {
104
+ .celeste-radio-wrapper[data-orientation=vertical] {
105
+ display: flex;
106
+ flex-direction: column;
107
+ }.celeste-radio-item {
108
+ --celeste-radio-border: var(--color-stroke-soft-200);
109
+ all: unset;
110
+ box-sizing: border-box;
111
+ flex-shrink: 0;
112
+ width: 16px;
113
+ height: 16px;
114
+ padding: var(--spacing-0);
115
+ transition: box-shadow var(--animation-extra-fast) ease-out;
116
+ border-radius: var(--radius-full);
117
+ background-color: var(--color-bg-white-0);
118
+ box-shadow: inset 0 0 0 1.5px var(--celeste-radio-border), var(--shadow-regular-xs);
119
+ cursor: pointer;
120
+ }
121
+ .celeste-radio-item:hover:not([data-disabled]) {
122
+ --celeste-radio-border: var(--color-stroke-sub-300);
123
+ }
124
+ .celeste-radio-item:focus:not([data-disabled]) {
125
+ --celeste-radio-border: var(--color-primary-base);
126
+ outline: none;
127
+ }
128
+ .celeste-radio-item[data-disabled] {
129
+ background-color: var(--color-bg-soft-200);
130
+ pointer-events: none;
131
+ }
132
+ .celeste-radio-item[data-state=checked]:not([data-disabled]) {
133
+ --celeste-radio-border: transparent;
134
+ background-color: var(--color-primary-base);
135
+ }
136
+ .celeste-radio-item[data-state=checked]:not([data-disabled]):hover, .celeste-radio-item[data-state=checked]:not([data-disabled]):focus {
137
+ background-color: var(--color-primary-darker);
138
+ }
139
+ .celeste-radio-indicator {
140
+ display: flex;
141
+ position: relative;
142
+ align-items: center;
143
+ justify-content: center;
144
+ width: 100%;
145
+ height: 100%;
146
+ }
147
+ .celeste-radio-indicator::after {
148
+ content: "";
149
+ display: block;
150
+ width: 8px;
151
+ height: 8px;
152
+ border-radius: var(--radius-full);
153
+ background-color: var(--color-static-white);
154
+ }.celecte-content-divider {
105
155
  display: flex;
106
156
  align-items: center;
107
157
  justify-content: center;
@@ -634,6 +684,70 @@ to {
634
684
  }
635
685
  .celeste-textarea-wrapper .celeste-textarea[data-v-76864cee]:disabled::placeholder {
636
686
  color: var(--color-text-disabled-300);
687
+ }.celeste-tag[data-v-0011e3b8] {
688
+ display: inline-flex;
689
+ align-items: center;
690
+ justify-content: center;
691
+ padding: var(--spacing-4) var(--spacing-8);
692
+ transition: background-color, border-color;
693
+ transition-duration: var(--animation-fast);
694
+ transition-timing-function: ease-out;
695
+ border: 1px solid transparent;
696
+ border-radius: var(--radius-6);
697
+ color: var(--color-text-sub-600);
698
+ font: var(--label-xs);
699
+ gap: var(--spacing-4);
700
+ }
701
+ .celeste-tag[data-tag-variant=stroke][data-v-0011e3b8]:not([aria-disabled=true]) {
702
+ border-color: var(--color-stroke-soft-200);
703
+ background-color: var(--color-bg-white-0);
704
+ }
705
+ .celeste-tag[data-tag-variant=stroke][data-v-0011e3b8]:not([aria-disabled=true]):hover {
706
+ border-color: transparent;
707
+ background-color: var(--color-bg-weak-50);
708
+ }
709
+ .celeste-tag[data-tag-variant=gray][data-v-0011e3b8]:not([aria-disabled=true]) {
710
+ border-color: transparent;
711
+ background-color: var(--color-bg-weak-50);
712
+ }
713
+ .celeste-tag[data-tag-variant=gray][data-v-0011e3b8]:not([aria-disabled=true]):hover {
714
+ border-color: var(--color-stroke-soft-200);
715
+ background-color: var(--color-bg-white-0);
716
+ }
717
+ .celeste-tag .celeste-tag-dismiss-button[data-v-0011e3b8] {
718
+ --size: 16px;
719
+ display: flex;
720
+ align-items: center;
721
+ justify-content: center;
722
+ width: var(--size);
723
+ height: var(--size);
724
+ margin-inline-end: calc(var(--spacing-4) * -1);
725
+ padding: var(--spacing-0);
726
+ border: none;
727
+ border-radius: calc(var(--radius-4) / 2);
728
+ background-color: transparent;
729
+ cursor: pointer;
730
+ }
731
+ .celeste-tag .celeste-tag-dismiss-button i[data-v-0011e3b8] {
732
+ transition: background-color var(--animation-fast) ease-out;
733
+ background-color: var(--color-icon-soft-400);
734
+ }
735
+ .celeste-tag .celeste-tag-dismiss-button[data-v-0011e3b8]:disabled {
736
+ cursor: auto;
737
+ }
738
+ .celeste-tag .celeste-tag-dismiss-button:disabled i[data-v-0011e3b8] {
739
+ background-color: var(--color-icon-disabled-300);
740
+ }
741
+ .celeste-tag .celeste-tag-dismiss-button[data-v-0011e3b8]:focus:not([aria-disabled=true]) {
742
+ outline: none;
743
+ box-shadow: var(--shadow-buttons-important-focus);
744
+ }
745
+ .celeste-tag .celeste-tag-dismiss-button:not(:disabled):hover i[data-v-0011e3b8] {
746
+ background-color: var(--color-icon-sub-600);
747
+ }
748
+ .celeste-tag[aria-disabled=true][data-v-0011e3b8] {
749
+ background-color: var(--color-bg-weak-50);
750
+ color: var(--color-text-disabled-300);
637
751
  }
638
752
  .celeste-tab-menu-root[data-v-b5afb6cc] {
639
753
  display: flex;
@@ -3435,7 +3549,7 @@ to {
3435
3549
  }
3436
3550
  .celeste-modal-body[data-v-8872ed90] + .celeste-modal-footer {
3437
3551
  border-block-start: 1px solid var(--color-stroke-soft-200);
3438
- }.celeste-modal-overlay[data-v-bdcae06b] {
3552
+ }.celeste-modal-overlay[data-v-cec34aac] {
3439
3553
  position: fixed;
3440
3554
  z-index: 50;
3441
3555
  background: var(--color-overlay-overlay);
@@ -3443,23 +3557,23 @@ to {
3443
3557
  backdrop-filter: blur(5px);
3444
3558
  inset: 0;
3445
3559
  }
3446
- .celeste-modal-content[data-v-bdcae06b] {
3560
+ .celeste-modal-content[data-v-cec34aac] {
3447
3561
  position: fixed;
3448
3562
  z-index: 51;
3563
+ top: 50%;
3564
+ left: 50%;
3449
3565
  border: 1px solid var(--color-stroke-soft-200);
3450
3566
  border-radius: var(--radius-20);
3451
3567
  background: var(--color-bg-white-0);
3452
3568
  box-shadow: var(--shadow-regular-md);
3453
3569
  translate: -50% -50%;
3454
- inset-block-start: 50%;
3455
- inset-inline-start: 50%;
3456
3570
  }
3457
- .fade-enter-active[data-v-bdcae06b],
3458
- .fade-leave-active[data-v-bdcae06b] {
3571
+ .fade-enter-active[data-v-cec34aac],
3572
+ .fade-leave-active[data-v-cec34aac] {
3459
3573
  transition: all var(--animation-fast) cubic-bezier(0.18, 0.89, 0.43, 1.19);
3460
3574
  }
3461
- .fade-enter-from[data-v-bdcae06b],
3462
- .fade-leave-to[data-v-bdcae06b] {
3575
+ .fade-enter-from[data-v-cec34aac],
3576
+ .fade-leave-to[data-v-cec34aac] {
3463
3577
  visibility: hidden;
3464
3578
  opacity: 0;
3465
3579
  scale: 0.95;
@@ -6716,6 +6716,214 @@ const By = /* @__PURE__ */ Mo.defineComponent({
6716
6716
  }, 16, ["data-state", "data-value", "data-max"]);
6717
6717
  };
6718
6718
  }
6719
+ }), [nf, of] = Q("RadioGroupRoot"), Ty = /* @__PURE__ */ Mo.defineComponent({
6720
+ __name: "RadioGroupRoot",
6721
+ props: {
6722
+ modelValue: {},
6723
+ defaultValue: {},
6724
+ disabled: { type: Boolean, default: false },
6725
+ name: {},
6726
+ required: { type: Boolean, default: false },
6727
+ orientation: { default: void 0 },
6728
+ dir: {},
6729
+ loop: { type: Boolean, default: true },
6730
+ asChild: { type: Boolean },
6731
+ as: {}
6732
+ },
6733
+ emits: ["update:modelValue"],
6734
+ setup(a2, { emit: t }) {
6735
+ const e = a2, n = t, { forwardRef: l } = R(), s = ne(e, "modelValue", n, {
6736
+ defaultValue: e.defaultValue,
6737
+ passive: e.modelValue === void 0
6738
+ }), { disabled: r, loop: i, orientation: u, name: d, required: c, dir: f } = Mo.toRefs(e), v = be(f);
6739
+ return of({
6740
+ modelValue: s,
6741
+ changeModelValue: (p) => {
6742
+ s.value = p;
6743
+ },
6744
+ disabled: r,
6745
+ loop: i,
6746
+ orientation: u,
6747
+ name: d == null ? void 0 : d.value,
6748
+ required: c
6749
+ }), (p, g) => (Mo.openBlock(), Mo.createBlock(Mo.unref(Vt), {
6750
+ "as-child": "",
6751
+ orientation: Mo.unref(u),
6752
+ dir: Mo.unref(v),
6753
+ loop: Mo.unref(i)
6754
+ }, {
6755
+ default: Mo.withCtx(() => [
6756
+ Mo.createVNode(Mo.unref(O), {
6757
+ ref: Mo.unref(l),
6758
+ role: "radiogroup",
6759
+ "data-disabled": Mo.unref(r) ? "" : void 0,
6760
+ "as-child": p.asChild,
6761
+ as: p.as,
6762
+ required: Mo.unref(c),
6763
+ "aria-orientation": Mo.unref(u),
6764
+ "aria-required": Mo.unref(c),
6765
+ dir: Mo.unref(v),
6766
+ name: Mo.unref(d)
6767
+ }, {
6768
+ default: Mo.withCtx(() => [
6769
+ Mo.renderSlot(p.$slots, "default", { modelValue: Mo.unref(s) })
6770
+ ]),
6771
+ _: 3
6772
+ }, 8, ["data-disabled", "as-child", "as", "required", "aria-orientation", "aria-required", "dir", "name"])
6773
+ ]),
6774
+ _: 3
6775
+ }, 8, ["orientation", "dir", "loop"]));
6776
+ }
6777
+ }), lf = ["value", "checked", "name", "disabled", "required"], sf = /* @__PURE__ */ Mo.defineComponent({
6778
+ __name: "Radio",
6779
+ props: {
6780
+ id: {},
6781
+ value: {},
6782
+ disabled: { type: Boolean, default: false },
6783
+ required: { type: Boolean },
6784
+ checked: { type: Boolean, default: void 0 },
6785
+ name: {},
6786
+ asChild: { type: Boolean },
6787
+ as: { default: "button" }
6788
+ },
6789
+ emits: ["update:checked"],
6790
+ setup(a2, { emit: t }) {
6791
+ const e = a2, l = ne(e, "checked", t, {
6792
+ passive: e.checked === void 0
6793
+ }), { value: s } = Mo.toRefs(e), { forwardRef: r, currentElement: i } = R(), u = Qe(i), d = Mo.computed(() => {
6794
+ var f;
6795
+ return e.id && i.value ? ((f = document.querySelector(`[for="${e.id}"]`)) == null ? void 0 : f.innerText) ?? e.value : void 0;
6796
+ });
6797
+ function c(f) {
6798
+ l.value = true, u.value && f.stopPropagation();
6799
+ }
6800
+ return (f, v) => (Mo.openBlock(), Mo.createBlock(Mo.unref(O), Mo.mergeProps(f.$attrs, {
6801
+ id: f.id,
6802
+ ref: Mo.unref(r),
6803
+ role: "radio",
6804
+ type: f.as === "button" ? "button" : void 0,
6805
+ as: f.as,
6806
+ "aria-checked": Mo.unref(l),
6807
+ "aria-label": d.value,
6808
+ "as-child": f.asChild,
6809
+ disabled: f.disabled ? "" : void 0,
6810
+ "data-state": Mo.unref(l) ? "checked" : "unchecked",
6811
+ "data-disabled": f.disabled ? "" : void 0,
6812
+ value: Mo.unref(s),
6813
+ required: f.required,
6814
+ name: f.name,
6815
+ onClick: Mo.withModifiers(c, ["stop"])
6816
+ }), {
6817
+ default: Mo.withCtx(() => [
6818
+ Mo.renderSlot(f.$slots, "default", { checked: Mo.unref(l) }),
6819
+ Mo.unref(u) ? (Mo.openBlock(), Mo.createElementBlock("input", {
6820
+ key: 0,
6821
+ type: "radio",
6822
+ tabindex: "-1",
6823
+ "aria-hidden": "true",
6824
+ value: Mo.unref(s),
6825
+ checked: !!Mo.unref(l),
6826
+ name: f.name,
6827
+ disabled: f.disabled,
6828
+ required: f.required,
6829
+ style: {
6830
+ transform: "translateX(-100%)",
6831
+ position: "absolute",
6832
+ pointerEvents: "none",
6833
+ opacity: 0,
6834
+ margin: 0
6835
+ }
6836
+ }, null, 8, lf)) : Mo.createCommentVNode("", true)
6837
+ ]),
6838
+ _: 3
6839
+ }, 16, ["id", "type", "as", "aria-checked", "aria-label", "as-child", "disabled", "data-state", "data-disabled", "value", "required", "name"]));
6840
+ }
6841
+ }), [rf, uf] = Q("RadioGroupItem"), Ry = /* @__PURE__ */ Mo.defineComponent({
6842
+ inheritAttrs: false,
6843
+ __name: "RadioGroupItem",
6844
+ props: {
6845
+ id: {},
6846
+ value: {},
6847
+ disabled: { type: Boolean, default: false },
6848
+ required: { type: Boolean },
6849
+ name: {},
6850
+ asChild: { type: Boolean },
6851
+ as: { default: "button" }
6852
+ },
6853
+ setup(a2) {
6854
+ const t = a2, { forwardRef: e, currentElement: n } = R(), l = nf(), s = Mo.computed(() => l.disabled.value || t.disabled), r = Mo.computed(() => l.required.value || t.required), i = Mo.computed(() => {
6855
+ var f;
6856
+ return ((f = l.modelValue) == null ? void 0 : f.value) === t.value;
6857
+ });
6858
+ uf({ disabled: s, checked: i });
6859
+ const u = Mo.ref(false), d = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
6860
+ Le("keydown", (f) => {
6861
+ d.includes(f.key) && (u.value = true);
6862
+ }), Le("keyup", () => {
6863
+ u.value = false;
6864
+ });
6865
+ function c() {
6866
+ setTimeout(() => {
6867
+ var f;
6868
+ u.value && ((f = n.value) == null || f.click());
6869
+ }, 0);
6870
+ }
6871
+ return (f, v) => (Mo.openBlock(), Mo.createBlock(Mo.unref(Ft), {
6872
+ checked: i.value,
6873
+ disabled: s.value,
6874
+ "as-child": "",
6875
+ focusable: !s.value,
6876
+ active: i.value
6877
+ }, {
6878
+ default: Mo.withCtx(() => [
6879
+ Mo.createVNode(sf, Mo.mergeProps({ ...f.$attrs, ...t }, {
6880
+ ref: Mo.unref(e),
6881
+ checked: i.value,
6882
+ required: r.value,
6883
+ disabled: s.value,
6884
+ "onUpdate:checked": v[0] || (v[0] = (p) => Mo.unref(l).changeModelValue(f.value)),
6885
+ onKeydown: v[1] || (v[1] = Mo.withKeys(Mo.withModifiers(() => {
6886
+ }, ["prevent"]), ["enter"])),
6887
+ onFocus: c
6888
+ }), {
6889
+ default: Mo.withCtx(() => [
6890
+ Mo.renderSlot(f.$slots, "default")
6891
+ ]),
6892
+ _: 3
6893
+ }, 16, ["checked", "required", "disabled"])
6894
+ ]),
6895
+ _: 3
6896
+ }, 8, ["checked", "disabled", "focusable", "active"]));
6897
+ }
6898
+ }), Ay = /* @__PURE__ */ Mo.defineComponent({
6899
+ __name: "RadioGroupIndicator",
6900
+ props: {
6901
+ forceMount: { type: Boolean },
6902
+ asChild: { type: Boolean },
6903
+ as: { default: "span" }
6904
+ },
6905
+ setup(a2) {
6906
+ const { forwardRef: t } = R(), e = rf();
6907
+ return (n, l) => (Mo.openBlock(), Mo.createBlock(Mo.unref(Pe), {
6908
+ present: n.forceMount || Mo.unref(e).checked.value
6909
+ }, {
6910
+ default: Mo.withCtx(() => [
6911
+ Mo.createVNode(Mo.unref(O), Mo.mergeProps({
6912
+ ref: Mo.unref(t),
6913
+ "data-state": Mo.unref(e).checked.value ? "checked" : "unchecked",
6914
+ "data-disabled": Mo.unref(e).disabled.value ? "" : void 0,
6915
+ "as-child": n.asChild,
6916
+ as: n.as
6917
+ }, n.$attrs), {
6918
+ default: Mo.withCtx(() => [
6919
+ Mo.renderSlot(n.$slots, "default")
6920
+ ]),
6921
+ _: 3
6922
+ }, 16, ["data-state", "data-disabled", "as-child", "as"])
6923
+ ]),
6924
+ _: 3
6925
+ }, 8, ["present"]));
6926
+ }
6719
6927
  });
6720
6928
  const [He, Pf] = Q("ScrollAreaRoot"), Oy = /* @__PURE__ */ Mo.defineComponent({
6721
6929
  __name: "ScrollAreaRoot",
@@ -9504,6 +9712,7 @@ const av = /* @__PURE__ */ Mo.defineComponent({
9504
9712
  });
9505
9713
  exports.$y = $y;
9506
9714
  exports.At = At;
9715
+ exports.Ay = Ay;
9507
9716
  exports.By = By;
9508
9717
  exports.Cg = Cg;
9509
9718
  exports.Ch = Ch;
@@ -9532,6 +9741,8 @@ exports.Pu = Pu;
9532
9741
  exports.Qf = Qf;
9533
9742
  exports.Qv = Qv;
9534
9743
  exports.Qy = Qy;
9744
+ exports.Ry = Ry;
9745
+ exports.Ty = Ty;
9535
9746
  exports.Uv = Uv;
9536
9747
  exports.Uy = Uy;
9537
9748
  exports.Vy = Vy;
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ const Mo = require("vue");
3
+ const useDelegatedProps = require("../use-delegated-props.js");
4
+ const clsx = require("./clsx.js");
5
+ const index = require("./index.js");
6
+ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
7
+ __name: "radio-group-item",
8
+ props: {
9
+ id: {},
10
+ value: {},
11
+ disabled: { type: Boolean },
12
+ required: { type: Boolean },
13
+ name: {},
14
+ asChild: { type: Boolean },
15
+ as: {},
16
+ class: {}
17
+ },
18
+ setup(__props) {
19
+ const props = __props;
20
+ const delegatedProps = useDelegatedProps.useDelegatedProps(props, "class");
21
+ const forwarded = index.xe(delegatedProps);
22
+ return (_ctx, _cache) => {
23
+ return Mo.openBlock(), Mo.createBlock(Mo.unref(index.Ry), Mo.mergeProps(Mo.unref(forwarded), {
24
+ class: Mo.unref(clsx.clsx)("celeste-radio-item", props.class)
25
+ }), {
26
+ default: Mo.withCtx(() => [
27
+ Mo.createVNode(Mo.unref(index.Ay), { class: "celeste-radio-indicator" })
28
+ ]),
29
+ _: 1
30
+ }, 16, ["class"]);
31
+ };
32
+ }
33
+ });
34
+ exports._sfc_main = _sfc_main;
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+ const Mo = require("vue");
3
+ const useDelegatedProps = require("../use-delegated-props.js");
4
+ const clsx = require("./clsx.js");
5
+ const index = require("./index.js");
6
+ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
7
+ __name: "radio-group",
8
+ props: {
9
+ modelValue: {},
10
+ defaultValue: {},
11
+ disabled: { type: Boolean },
12
+ name: {},
13
+ required: { type: Boolean },
14
+ orientation: {},
15
+ dir: {},
16
+ loop: { type: Boolean },
17
+ asChild: { type: Boolean },
18
+ as: {},
19
+ class: {}
20
+ },
21
+ emits: ["update:modelValue"],
22
+ setup(__props, { emit: __emit }) {
23
+ const props = __props;
24
+ const emits = __emit;
25
+ const delegatedProps = useDelegatedProps.useDelegatedProps(props, "class");
26
+ const forwarded = index.xe(delegatedProps, emits);
27
+ return (_ctx, _cache) => {
28
+ return Mo.openBlock(), Mo.createBlock(Mo.unref(index.Ty), Mo.mergeProps({
29
+ class: Mo.unref(clsx.clsx)("celeste-radio-wrapper", props.class)
30
+ }, Mo.unref(forwarded)), {
31
+ default: Mo.withCtx(() => [
32
+ Mo.renderSlot(_ctx.$slots, "default")
33
+ ]),
34
+ _: 3
35
+ }, 16, ["class"]);
36
+ };
37
+ }
38
+ });
39
+ exports._sfc_main = _sfc_main;
package/dist/cjs/index.js CHANGED
@@ -51,6 +51,8 @@ const popoverTrigger = require("./popover-trigger.js");
51
51
  const popover_vue_vue_type_script_setup_true_lang = require("./chunks/popover.js");
52
52
  const progressBar = require("./progress-bar.js");
53
53
  const progressCircle = require("./progress-circle.js");
54
+ const radioGroupItem_vue_vue_type_style_index_0_lang = require("./chunks/radio-group-item.vue_vue_type_style_index_0_lang.js");
55
+ const radioGroup_vue_vue_type_style_index_0_lang = require("./chunks/radio-group.vue_vue_type_style_index_0_lang.js");
54
56
  const richEditor = require("./rich-editor.js");
55
57
  const scrollArea_vue_vue_type_script_setup_true_lang = require("./chunks/scroll-area.js");
56
58
  const segmentedControlItem = require("./segmented-control-item.js");
@@ -72,6 +74,7 @@ const tabMenuContent = require("./tab-menu-content.js");
72
74
  const tabMenuItem = require("./tab-menu-item.js");
73
75
  const tabMenuList = require("./tab-menu-list.js");
74
76
  const tabMenu = require("./tab-menu.js");
77
+ const tag = require("./tag.js");
75
78
  const textInputAffix = require("./text-input-affix.js");
76
79
  const textInputButton = require("./text-input-button.js");
77
80
  const textInput = require("./text-input.js");
@@ -131,6 +134,8 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
131
134
  PopoverTrigger: popoverTrigger,
132
135
  ProgressBar: progressBar,
133
136
  ProgressCircle: progressCircle,
137
+ RadioGroup: radioGroup_vue_vue_type_style_index_0_lang._sfc_main,
138
+ RadioGroupItem: radioGroupItem_vue_vue_type_style_index_0_lang._sfc_main,
134
139
  RichEditor: richEditor,
135
140
  ScrollArea: scrollArea_vue_vue_type_script_setup_true_lang._sfc_main,
136
141
  SegmentedControl: segmentedControl,
@@ -154,6 +159,7 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
154
159
  TabMenuContent: tabMenuContent,
155
160
  TabMenuItem: tabMenuItem,
156
161
  TabMenuList: tabMenuList,
162
+ Tag: tag,
157
163
  TextInput: textInput,
158
164
  TextInputAffix: textInputAffix,
159
165
  TextInputButton: textInputButton,
@@ -267,6 +273,8 @@ exports.PopoverTrigger = popoverTrigger;
267
273
  exports.Popover = popover_vue_vue_type_script_setup_true_lang._sfc_main;
268
274
  exports.ProgressBar = progressBar;
269
275
  exports.ProgressCircle = progressCircle;
276
+ exports.RadioGroupItem = radioGroupItem_vue_vue_type_style_index_0_lang._sfc_main;
277
+ exports.RadioGroup = radioGroup_vue_vue_type_style_index_0_lang._sfc_main;
270
278
  exports.RichEditor = richEditor;
271
279
  exports.ScrollArea = scrollArea_vue_vue_type_script_setup_true_lang._sfc_main;
272
280
  exports.SegmentedControlItem = segmentedControlItem;
@@ -288,6 +296,7 @@ exports.TabMenuContent = tabMenuContent;
288
296
  exports.TabMenuItem = tabMenuItem;
289
297
  exports.TabMenuList = tabMenuList;
290
298
  exports.TabMenu = tabMenu;
299
+ exports.Tag = tag;
291
300
  exports.TextInputAffix = textInputAffix;
292
301
  exports.TextInputButton = textInputButton;
293
302
  exports.TextInput = textInput;
@@ -44,5 +44,5 @@ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
44
44
  };
45
45
  }
46
46
  });
47
- const modalContent = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-bdcae06b"]]);
47
+ const modalContent = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-cec34aac"]]);
48
48
  module.exports = modalContent;
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ const radioGroupItem_vue_vue_type_style_index_0_lang = require("./chunks/radio-group-item.vue_vue_type_style_index_0_lang.js");
3
+ module.exports = radioGroupItem_vue_vue_type_style_index_0_lang._sfc_main;
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ const radioGroup_vue_vue_type_style_index_0_lang = require("./chunks/radio-group.vue_vue_type_style_index_0_lang.js");
3
+ module.exports = radioGroup_vue_vue_type_style_index_0_lang._sfc_main;
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+ const Mo = require("vue");
3
+ const clsx = require("./chunks/clsx.js");
4
+ const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
5
+ const _hoisted_1 = ["data-tag-variant", "aria-disabled"];
6
+ const _hoisted_2 = ["disabled"];
7
+ const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
8
+ __name: "tag",
9
+ props: {
10
+ variant: { default: "stroke" },
11
+ class: {},
12
+ dismissable: { type: Boolean, default: false },
13
+ disabled: { type: Boolean }
14
+ },
15
+ emits: ["dismiss"],
16
+ setup(__props) {
17
+ const props = __props;
18
+ return (_ctx, _cache) => {
19
+ return Mo.openBlock(), Mo.createElementBlock("div", {
20
+ class: Mo.normalizeClass(Mo.unref(clsx.clsx)("celeste-tag", props.class)),
21
+ "data-tag-variant": _ctx.variant,
22
+ "aria-disabled": _ctx.disabled
23
+ }, [
24
+ Mo.renderSlot(_ctx.$slots, "default", {}, void 0, true),
25
+ _ctx.dismissable ? (Mo.openBlock(), Mo.createElementBlock("button", {
26
+ key: 0,
27
+ disabled: _ctx.disabled,
28
+ class: "celeste-tag-dismiss-button",
29
+ "aria-label": "dismiss",
30
+ onClick: _cache[0] || (_cache[0] = Mo.withModifiers(($event) => _ctx.$emit("dismiss"), ["prevent", "stop"]))
31
+ }, _cache[1] || (_cache[1] = [
32
+ Mo.createElementVNode("i", { class: "i-celeste-close-line" }, null, -1)
33
+ ]), 8, _hoisted_2)) : Mo.createCommentVNode("", true)
34
+ ], 10, _hoisted_1);
35
+ };
36
+ }
37
+ });
38
+ const tag = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-0011e3b8"]]);
39
+ module.exports = tag;
@@ -12,6 +12,7 @@ export * from './label';
12
12
  export * from './modal';
13
13
  export * from './popover';
14
14
  export * from './progress';
15
+ export * from './radio-group';
15
16
  export * from './rich-editor';
16
17
  export * from './scroll-area';
17
18
  export * from './segmented-control';
@@ -20,6 +21,7 @@ export * from './slider';
20
21
  export * from './sonner';
21
22
  export * from './switch';
22
23
  export * from './tab-menu';
24
+ export * from './tag';
23
25
  export * from './text-input';
24
26
  export * from './textarea';
25
27
  export * from './tooltip';
@@ -0,0 +1,4 @@
1
+ export * from './radio-group-item';
2
+ export { default as RadioGroupItem } from './radio-group-item';
3
+ export * from './radio-group';
4
+ export { default as RadioGroup } from './radio-group';
@@ -0,0 +1,7 @@
1
+ import { HTMLAttributes } from 'vue';
2
+ import { RadioGroupItemProps } from 'radix-vue';
3
+ type __VLS_Props = RadioGroupItemProps & {
4
+ class?: HTMLAttributes['class'];
5
+ };
6
+ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
7
+ export default _default;
@@ -0,0 +1,26 @@
1
+ import { HTMLAttributes } from 'vue';
2
+ import { RadioGroupRootProps } from 'radix-vue';
3
+ type __VLS_Props = RadioGroupRootProps & {
4
+ class?: HTMLAttributes['class'];
5
+ };
6
+ declare function __VLS_template(): {
7
+ attrs: Partial<{}>;
8
+ slots: {
9
+ default?(_: {}): any;
10
+ };
11
+ refs: {};
12
+ rootEl: any;
13
+ };
14
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
15
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
16
+ "update:modelValue": (payload: string) => any;
17
+ }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
18
+ "onUpdate:modelValue"?: ((payload: string) => any) | undefined;
19
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
20
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
21
+ export default _default;
22
+ type __VLS_WithTemplateSlots<T, S> = T & {
23
+ new (): {
24
+ $slots: S;
25
+ };
26
+ };
@@ -0,0 +1,2 @@
1
+ export * from './tag';
2
+ export { default as Tag } from './tag';
@@ -0,0 +1,26 @@
1
+ import { HTMLAttributes } from 'vue';
2
+ export interface TagProps {
3
+ variant?: 'stroke' | 'gray';
4
+ class?: HTMLAttributes['class'];
5
+ dismissable?: boolean;
6
+ disabled?: boolean;
7
+ }
8
+ export interface TagEmits {
9
+ dismiss: [];
10
+ }
11
+ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<TagProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
12
+ dismiss: () => any;
13
+ }, string, import('vue').PublicProps, Readonly<TagProps> & Readonly<{
14
+ onDismiss?: (() => any) | undefined;
15
+ }>, {
16
+ variant: "stroke" | "gray";
17
+ dismissable: boolean;
18
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>, {
19
+ default?(_: {}): any;
20
+ }>;
21
+ export default _default;
22
+ type __VLS_WithTemplateSlots<T, S> = T & {
23
+ new (): {
24
+ $slots: S;
25
+ };
26
+ };
package/dist/es/button.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { defineComponent, openBlock, createBlock, unref, normalizeClass, withCtx, renderSlot } from "vue";
2
2
  import { c as clsx } from "./chunks/clsx.js";
3
- import { f as O } from "./chunks/index.js";
3
+ import { g as O } from "./chunks/index.js";
4
4
  import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
5
5
  const _sfc_main = /* @__PURE__ */ defineComponent({
6
6
  __name: "button",