@haklex/rich-editor-ui 0.0.20 → 0.0.23

package/dist/components/segmented-control/styles.css.d.ts

@@ -2,11 +2,11 @@ export declare const container: import('@vanilla-extract/recipes').RuntimeFn<{
     size: {
         sm: {
             height: "2rem";
-            fontSize: "0.75rem";
+            fontSize: `var(--${string})`;
         };
         md: {
             height: "2.5rem";
-            fontSize: "0.875rem";
+            fontSize: `var(--${string})`;
         };
     };
     fullWidth: {

package/dist/rich-editor-ui.css

@@ -1,636 +1 @@
-.iryuae0 {
-  position: relative;
-}
-.iryuae1 {
-  display: flex;
-}
-.iryuae2 {
-  position: relative;
-  padding: 0.625rem 1rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-  transition: color 200ms;
-  cursor: pointer;
-  border: none;
-  background: none;
-  color: var(--rc-text-secondary);
-  outline: none;
-}
-.iryuae2:hover {
-  color: color-mix(in srgb, currentColor 80%, transparent);
-}
-.iryuae2:focus-visible {
-  outline: 2px solid var(--rc-accent);
-  outline-offset: 2px;
-}
-.iryuae3 {
-  color: var(--rc-text);
-}
-.iryuae4 {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  height: 1px;
-  background-color: var(--rc-border);
-}
-.iryuae5 {
-  position: absolute;
-  bottom: 0;
-  height: 2px;
-  background-color: var(--rc-text);
-  transition: left 300ms ease-in-out, width 300ms ease-in-out;
-}@keyframes _10muorc0 {
-  0% {
-    transform: scale(1);
-  }
-  40% {
-    transform: scale(0.85);
-  }
-  100% {
-    transform: scale(1);
-  }
-}
-@keyframes _10muorc1 {
-  0% {
-    box-shadow: 0 0 0 0 color-mix(in srgb, var(--rc-accent) 40%, transparent);
-  }
-  100% {
-    box-shadow: 0 0 0 6px transparent;
-  }
-}
-._10muorc2 {
-  display: inline-flex;
-  align-items: flex-start;
-  gap: 0.75rem;
-  border-radius: 0.5rem;
-  padding: 0.25rem;
-  text-align: left;
-  border: none;
-  background: none;
-  cursor: pointer;
-  font-family: inherit;
-  font-size: inherit;
-  color: inherit;
-}
-._10muorc2:focus-visible {
-  outline: 2px solid var(--rc-accent);
-  outline-offset: 2px;
-}
-._10muorc3 {
-  cursor: not-allowed;
-  opacity: 0.5;
-}
-._10muorc4 {
-  position: relative;
-  display: flex;
-  width: 1.125rem;
-  height: 1.125rem;
-  flex-shrink: 0;
-  align-items: center;
-  justify-content: center;
-  border-radius: 0.3rem;
-  border-width: 2px;
-  border-style: solid;
-  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
-  box-sizing: border-box;
-}
-._10muorc5 {
-  border-color: color-mix(in srgb, var(--rc-text-secondary) 50%, transparent);
-  background-color: transparent;
-}
-._10muorc6 {
-  border-color: var(--rc-accent);
-  background-color: var(--rc-accent);
-}
-._10muorc7 {
-  animation: _10muorc0 0.4s ease-out;
-}
-._10muorc8 {
-  width: 0.75rem;
-  height: 0.75rem;
-  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
-}
-._10muorc9 {
-  opacity: 1;
-  transform: scale(1);
-}
-._10muorca {
-  opacity: 0;
-  transform: scale(0.5);
-}
-._10muorcb {
-  position: absolute;
-  inset: 0;
-  border-radius: 0.3rem;
-  pointer-events: none;
-}
-._10muorcc {
-  animation: _10muorc1 0.4s ease-out;
-}
-._10muorcd {
-  display: flex;
-  flex-direction: column;
-  gap: 0.125rem;
-}
-._10muorce {
-  font-size: 0.875rem;
-  font-weight: 500;
-  line-height: 1.25;
-  color: var(--rc-text);
-  transition: color 0.2s;
-}
-._10muorcf {
-  color: var(--rc-text-secondary);
-}
-._10muorcg {
-  font-size: 0.75rem;
-  line-height: 1.25;
-  color: var(--rc-text-secondary);
-}@keyframes f2q44l0 {
-  from {
-    opacity: 0;
-    transform: translateY(2px) scale(0.96);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-  }
-}
-@keyframes f2q44l1 {
-  from {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(2px) scale(0.96);
-  }
-}
-.f2q44l2 {
-  z-index: 50;
-  width: 288px;
-  border-radius: 0.5rem;
-  border: 1px solid var(--rc-border);
-  padding: 1rem;
-  background-color: var(--rc-bg);
-  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
-  outline: none;
-  transition: opacity 150ms ease-out, transform 150ms ease-out;
-}
-.f2q44l2[data-open] {
-  animation: f2q44l0 150ms ease-out;
-}
-.f2q44l2[data-ending-style] {
-  opacity: 0;
-  transform: translateY(2px) scale(0.96);
-}
-.f2q44l2[data-closed] {
-  animation: f2q44l1 150ms ease-in;
-}
-.f2q44l3 {
-  width: 10px;
-  height: 10px;
-  transform-origin: center;
-}
-.f2q44l3 > polygon {
-  fill: var(--rc-bg);
-}
-.f2q44l3 > polyline {
-  stroke: var(--rc-border);
-  fill: none;
-}
-.f2q44l4 {
-  font-size: 0.875rem;
-  font-weight: 600;
-  line-height: 1;
-  color: var(--rc-text);
-}
-.f2q44l5 {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  color: var(--rc-text-secondary);
-  margin-top: 0.25rem;
-}@keyframes _17r50hf0 {
-  from {
-    opacity: 0;
-    transform: scale(0.95);
-  }
-  to {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-._17r50hf1 {
-  display: flex;
-  align-items: center;
-  gap: 2px;
-  height: 32px;
-  padding: 0 6px;
-  border: none;
-  background: none;
-  border-radius: 8px;
-  cursor: pointer;
-  color: var(--rc-text-secondary);
-  transition: color 0.1s, background-color 0.1s;
-}
-._17r50hf1:hover {
-  color: var(--rc-text);
-  background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
-}
-._17r50hf2 {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-._17r50hf3 {
-  font-size: 12px;
-  font-weight: 600;
-  line-height: 1;
-}
-._17r50hf4 {
-  margin-top: 2px;
-  height: 2px;
-  width: 14px;
-  border-radius: 1px;
-}
-._17r50hf5 {
-  width: 12px;
-  height: 12px;
-  transition: transform 0.15s;
-}
-._17r50hf6 {
-  padding: 8px;
-  width: auto;
-}
-._17r50hf6[data-open] {
-  animation: _17r50hf0 120ms ease-out;
-}
-._17r50hf7 {
-  display: grid;
-  grid-template-columns: repeat(5, 1fr);
-  gap: 4px;
-}
-._17r50hf8 {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  border: none;
-  background: none;
-  border-radius: 8px;
-  cursor: pointer;
-  padding: 0;
-  transition: background-color 0.1s;
-}
-._17r50hf8:hover {
-  background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
-}
-._17r50hf9 {
-  width: 16px;
-  height: 16px;
-  border-radius: 50%;
-  border: 1px solid color-mix(in srgb, var(--rc-text) 10%, transparent);
-}
-._17r50hfa {
-  position: absolute;
-  width: 10px;
-  height: 10px;
-  color: var(--rc-bg);
-}@keyframes vwlngv0 {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-@keyframes vwlngv1 {
-  from {
-    opacity: 1;
-  }
-  to {
-    opacity: 0;
-  }
-}
-@keyframes vwlngv2 {
-  from {
-    opacity: 0;
-    transform: translate(-50%, -48%) scale(0.95);
-  }
-  to {
-    opacity: 1;
-    transform: translate(-50%, -50%) scale(1);
-  }
-}
-@keyframes vwlngv3 {
-  from {
-    opacity: 1;
-    transform: translate(-50%, -50%) scale(1);
-  }
-  to {
-    opacity: 0;
-    transform: translate(-50%, -48%) scale(0.95);
-  }
-}
-.vwlngv4 {
-  position: fixed;
-  inset: 0;
-  z-index: 50;
-  background-color: rgba(0, 0, 0, 0.8);
-}
-.vwlngv4[data-open] {
-  animation: vwlngv0 150ms ease-out;
-}
-.vwlngv4[data-closed] {
-  animation: vwlngv1 100ms ease-in;
-}
-.vwlngv5 {
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  z-index: 50;
-  display: grid;
-  width: 100%;
-  max-width: calc(100% - 2rem);
-  gap: 1rem;
-  border-radius: 0.75rem;
-  border: 1px solid var(--rc-border);
-  padding: 1.5rem;
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-  font-size: 0.875rem;
-  line-height: 1.43;
-  color: var(--rc-text);
-  background-color: var(--rc-bg);
-  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
-  outline: none;
-}
-.vwlngv5[data-open] {
-  animation: vwlngv2 150ms ease-out;
-}
-.vwlngv5[data-closed] {
-  animation: vwlngv3 100ms ease-in;
-}
-.vwlngv6 {
-  position: absolute;
-  top: 1rem;
-  right: 1rem;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 24px;
-  height: 24px;
-  border-radius: 0.25rem;
-  border: none;
-  background: none;
-  cursor: pointer;
-  opacity: 0.7;
-  color: var(--rc-text-secondary);
-  transition: opacity 0.2s ease, color 0.2s ease;
-}
-.vwlngv6:hover {
-  opacity: 1;
-  color: var(--rc-text);
-}
-.vwlngv6:focus-visible {
-  outline: none;
-  box-shadow: 0 0 0 2px var(--rc-bg), 0 0 0 4px var(--rc-text-secondary);
-}
-.vwlngv6:disabled {
-  pointer-events: none;
-  opacity: 0.5;
-}
-.vwlngv6 svg {
-  width: 16px;
-  height: 16px;
-  pointer-events: none;
-  flex-shrink: 0;
-}
-.vwlngv7 {
-  display: flex;
-  flex-direction: column;
-  gap: 0.375rem;
-  text-align: center;
-}
-.vwlngv8 {
-  display: flex;
-  flex-direction: column-reverse;
-  gap: 0.5rem;
-  padding-top: 0.25rem;
-}
-.vwlngv9 {
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-  font-size: 1.125rem;
-  font-weight: 600;
-  line-height: 1.33;
-  letter-spacing: -0.015em;
-  color: var(--rc-text);
-}
-.vwlngva {
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-  font-size: 0.875rem;
-  line-height: 1.43;
-  color: var(--rc-text-secondary);
-}
-@media (min-width: 640px) {
-  .vwlngv5 {
-    max-width: 28rem;
-  }
-  .vwlngv7 {
-    text-align: left;
-  }
-  .vwlngv8 {
-    flex-direction: row;
-    justify-content: flex-end;
-  }
-}.oih0op0 {
-  min-width: 8rem;
-  border-radius: 0.5rem;
-  padding: 0.25rem;
-  background-color: var(--rc-bg);
-  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
-  outline: none;
-  border: 1px solid var(--rc-border);
-  z-index: 50;
-  max-height: var(--available-height);
-  overflow-y: auto;
-  transform-origin: var(--transform-origin);
-  transition: opacity 100ms, transform 100ms;
-}
-.oih0op0[data-open] {
-  opacity: 1;
-  transform: scale(1);
-}
-.oih0op0[data-closed] {
-  opacity: 0;
-  transform: scale(0.95);
-}
-.oih0op1 {
-  display: flex;
-  align-items: center;
-  gap: 0.375rem;
-  border-radius: 0.375rem;
-  padding: 0.25rem 0.375rem;
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  outline: none;
-  user-select: none;
-  cursor: default;
-  color: var(--rc-text);
-}
-.oih0op1[data-highlighted] {
-  background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
-}
-.oih0op1[data-disabled] {
-  opacity: 0.5;
-  pointer-events: none;
-}
-.oih0op1 svg {
-  pointer-events: none;
-  flex-shrink: 0;
-  width: 16px;
-  height: 16px;
-}
-.oih0op2 {
-  height: 1px;
-  background-color: var(--rc-border);
-  margin: 0.25rem -0.25rem;
-}
-.oih0op3 {
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--rc-text-secondary);
-  padding: 0.25rem 0.375rem;
-}
-.oih0op4 {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-}
-.oih0op5 {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-}._6d8tz20 {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  border-radius: 0.5rem;
-  background-color: var(--rc-bg-secondary);
-  padding: 0.25rem;
-}
-._6d8tz21 {
-  height: 2rem;
-  font-size: 0.75rem;
-}
-._6d8tz22 {
-  height: 2.5rem;
-  font-size: 0.875rem;
-}
-._6d8tz23 {
-  width: 100%;
-}
-._6d8tz25 {
-  position: absolute;
-  top: 0.25rem;
-  bottom: 0.25rem;
-  border-radius: 0.375rem;
-  background-color: var(--rc-bg);
-  box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
-  transition: all 300ms cubic-bezier(0.25, 1, 0.5, 1);
-  pointer-events: none;
-}
-._6d8tz27 {
-  opacity: 0;
-}
-._6d8tz28 {
-  position: relative;
-  z-index: 10;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  white-space: nowrap;
-  border-radius: 0.375rem;
-  font-weight: 500;
-  outline: none;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  transition: color 200ms;
-  color: var(--rc-text-secondary);
-}
-._6d8tz28:focus-visible {
-  outline: 2px solid var(--rc-accent);
-  outline-offset: 1px;
-}
-._6d8tz29 {
-  padding: 0 0.75rem;
-}
-._6d8tz2a {
-  padding: 0 1rem;
-}
-._6d8tz2b {
-  color: var(--rc-text);
-}
-._6d8tz2d {
-  pointer-events: none;
-  opacity: 0.4;
-}
-._6d8tz2f {
-  flex: 1;
-}@keyframes _1cspf2m0 {
-  from {
-    opacity: 0;
-    transform: translateY(2px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-@keyframes _1cspf2m1 {
-  from {
-    opacity: 1;
-    transform: translateY(0);
-  }
-  to {
-    opacity: 0;
-    transform: translateY(2px);
-  }
-}
-._1cspf2m2 {
-  z-index: 50;
-  max-width: 320px;
-  padding: 6px 10px;
-  font-size: var(--rc-font-size-small);
-  line-height: 1.4;
-  color: var(--rc-text);
-  background-color: var(--rc-bg);
-  border: 1px solid var(--rc-border);
-  border-radius: var(--rc-radius-md);
-  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
-  outline: none;
-  white-space: normal;
-  word-break: break-word;
-  pointer-events: none;
-  transition: opacity 120ms ease-out, transform 120ms ease-out;
-}
-._1cspf2m2[data-open] {
-  animation: _1cspf2m0 120ms ease-out;
-}
-._1cspf2m2[data-ending-style] {
-  opacity: 0;
-  transform: translateY(2px);
-}
-._1cspf2m2[data-closed] {
-  animation: _1cspf2m1 120ms ease-in;
-}
+.iryuae0{position:relative}.iryuae1{display:flex}.iryuae2{position:relative;padding:.625rem 1rem;font-size:var(--rc-font-size-md);font-weight:500;transition:color .2s;cursor:pointer;border:none;background:none;color:var(--rc-text-secondary);outline:none}.iryuae2:hover{color:color-mix(in srgb,currentColor 80%,transparent)}.iryuae2:focus-visible{outline:2px solid var(--rc-accent);outline-offset:2px}.iryuae3{color:var(--rc-text)}.iryuae4{position:absolute;bottom:0;left:0;right:0;height:1px;background-color:var(--rc-border)}.iryuae5{position:absolute;bottom:0;height:2px;background-color:var(--rc-text);transition:left .3s ease-in-out,width .3s ease-in-out}@keyframes _10muorc0{0%{transform:scale(1)}40%{transform:scale(.85)}to{transform:scale(1)}}@keyframes _10muorc1{0%{box-shadow:0 0 color-mix(in srgb,var(--rc-accent) 40%,transparent)}to{box-shadow:0 0 0 6px transparent}}._10muorc2{display:inline-flex;align-items:flex-start;gap:.75rem;border-radius:.5rem;padding:.25rem;text-align:left;border:none;background:none;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit}._10muorc2:focus-visible{outline:2px solid var(--rc-accent);outline-offset:2px}._10muorc3{cursor:not-allowed;opacity:.5}._10muorc4{position:relative;display:flex;width:1.125rem;height:1.125rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:.3rem;border-width:2px;border-style:solid;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-sizing:border-box}._10muorc5{border-color:color-mix(in srgb,var(--rc-text-secondary) 50%,transparent);background-color:transparent}._10muorc6{border-color:var(--rc-accent);background-color:var(--rc-accent)}._10muorc7{animation:_10muorc0 .4s ease-out}._10muorc8{width:.75rem;height:.75rem;transition:all .3s cubic-bezier(.34,1.56,.64,1)}._10muorc9{opacity:1;transform:scale(1)}._10muorca{opacity:0;transform:scale(.5)}._10muorcb{position:absolute;inset:0;border-radius:.3rem;pointer-events:none}._10muorcc{animation:_10muorc1 .4s ease-out}._10muorcd{display:flex;flex-direction:column;gap:.125rem}._10muorce{font-size:var(--rc-font-size-md);font-weight:500;line-height:1.25;color:var(--rc-text);transition:color .2s}._10muorcf{color:var(--rc-text-secondary)}._10muorcg{font-size:var(--rc-font-size-xs);line-height:1.25;color:var(--rc-text-secondary)}@keyframes f2q44l0{0%{opacity:0;transform:translateY(2px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes f2q44l1{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(2px) scale(.96)}}.f2q44l2{z-index:50;width:288px;border-radius:.5rem;border:1px solid var(--rc-border);padding:1rem;background-color:var(--rc-bg);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:none;transition:opacity .15s ease-out,transform .15s ease-out}.f2q44l2[data-open]{animation:f2q44l0 .15s ease-out}.f2q44l2[data-ending-style]{opacity:0;transform:translateY(2px) scale(.96)}.f2q44l2[data-closed]{animation:f2q44l1 .15s ease-in}.f2q44l3{width:10px;height:10px;transform-origin:center}.f2q44l3>polygon{fill:var(--rc-bg)}.f2q44l3>polyline{stroke:var(--rc-border);fill:none}.f2q44l4{font-size:var(--rc-font-size-md);font-weight:600;line-height:1;color:var(--rc-text)}.f2q44l5{font-size:var(--rc-font-size-md);line-height:1.25rem;color:var(--rc-text-secondary);margin-top:.25rem}@keyframes _17r50hf0{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}._17r50hf1{display:flex;align-items:center;gap:2px;height:32px;padding:0 6px;border:none;background:none;border-radius:8px;cursor:pointer;color:var(--rc-text-secondary);transition:color .1s,background-color .1s}._17r50hf1:hover{color:var(--rc-text);background-color:color-mix(in srgb,var(--rc-text) 4%,transparent)}._17r50hf2{display:flex;flex-direction:column;align-items:center}._17r50hf3{font-size:var(--rc-font-size-xs);font-weight:600;line-height:1}._17r50hf4{margin-top:2px;height:2px;width:14px;border-radius:1px}._17r50hf5{width:12px;height:12px;transition:transform .15s}._17r50hf6{padding:8px;width:auto}._17r50hf6[data-open]{animation:_17r50hf0 .12s ease-out}._17r50hf7{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}._17r50hf8{position:relative;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:none;border-radius:8px;cursor:pointer;padding:0;transition:background-color .1s}._17r50hf8:hover{background-color:color-mix(in srgb,var(--rc-text) 4%,transparent)}._17r50hf9{width:16px;height:16px;border-radius:50%;border:1px solid color-mix(in srgb,var(--rc-text) 10%,transparent)}._17r50hfa{position:absolute;width:10px;height:10px;color:var(--rc-bg)}@keyframes vwlngv0{0%{opacity:0}to{opacity:1}}@keyframes vwlngv1{0%{opacity:1}to{opacity:0}}@keyframes vwlngv2{0%{opacity:0;transform:translate(-50%,-48%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes vwlngv3{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-48%) scale(.95)}}.vwlngv4{position:fixed;inset:0;z-index:50;background-color:#000c}.vwlngv4[data-open]{animation:vwlngv0 .15s ease-out}.vwlngv4[data-closed]{animation:vwlngv1 .1s ease-in}.vwlngv5{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:50;display:grid;width:100%;max-width:calc(100% - 2rem);gap:1rem;border-radius:.75rem;border:1px solid var(--rc-border);padding:1.5rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:var(--rc-font-size-md);line-height:1.43;color:var(--rc-text);background-color:var(--rc-bg);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;outline:none}.vwlngv5[data-open]{animation:vwlngv2 .15s ease-out}.vwlngv5[data-closed]{animation:vwlngv3 .1s ease-in}.vwlngv6{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:.25rem;border:none;background:none;cursor:pointer;opacity:.7;color:var(--rc-text-secondary);transition:opacity .2s ease,color .2s ease}.vwlngv6:hover{opacity:1;color:var(--rc-text)}.vwlngv6:focus-visible{outline:none;box-shadow:0 0 0 2px var(--rc-bg),0 0 0 4px var(--rc-text-secondary)}.vwlngv6:disabled{pointer-events:none;opacity:.5}.vwlngv6 svg{width:16px;height:16px;pointer-events:none;flex-shrink:0}.vwlngv7{display:flex;flex-direction:column;gap:.375rem;text-align:center}.vwlngv8{display:flex;flex-direction:column-reverse;gap:.5rem;padding-top:.25rem}.vwlngv9{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:1.125em;font-weight:600;line-height:1.33;letter-spacing:-.015em;color:var(--rc-text)}.vwlngva{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:var(--rc-font-size-md);line-height:1.43;color:var(--rc-text-secondary)}@media(min-width:640px){.vwlngv5{max-width:28rem}.vwlngv7{text-align:left}.vwlngv8{flex-direction:row;justify-content:flex-end}}.oih0op0{min-width:8rem;border-radius:.5rem;padding:.25rem;background-color:var(--rc-bg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;outline:none;border:1px solid var(--rc-border);z-index:50;max-height:var(--available-height);overflow-y:auto;transform-origin:var(--transform-origin);transition:opacity .1s,transform .1s}.oih0op0[data-open]{opacity:1;transform:scale(1)}.oih0op0[data-closed]{opacity:0;transform:scale(.95)}.oih0op1{display:flex;align-items:center;gap:.375rem;border-radius:.375rem;padding:.25rem .375rem;font-size:var(--rc-font-size-md);line-height:1.25rem;outline:none;user-select:none;cursor:default;color:var(--rc-text)}.oih0op1[data-highlighted]{background-color:color-mix(in srgb,var(--rc-text) 4%,transparent)}.oih0op1[data-disabled]{opacity:.5;pointer-events:none}.oih0op1 svg{pointer-events:none;flex-shrink:0;width:16px;height:16px}.oih0op2{height:1px;background-color:var(--rc-border);margin:.25rem -.25rem}.oih0op3{font-size:var(--rc-font-size-xs);font-weight:500;color:var(--rc-text-secondary);padding:.25rem .375rem}.oih0op4,.oih0op5{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0}._6d8tz20{position:relative;display:inline-flex;align-items:center;border-radius:.5rem;background-color:var(--rc-bg-secondary);padding:.25rem}._6d8tz21{height:2rem;font-size:var(--rc-font-size-xs)}._6d8tz22{height:2.5rem;font-size:var(--rc-font-size-md)}._6d8tz23{width:100%}._6d8tz25{position:absolute;top:.25rem;bottom:.25rem;border-radius:.375rem;background-color:var(--rc-bg);box-shadow:0 1px 2px #0000000d;transition:all .3s cubic-bezier(.25,1,.5,1);pointer-events:none}._6d8tz27{opacity:0}._6d8tz28{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:.375rem;font-weight:500;outline:none;border:none;background:transparent;cursor:pointer;transition:color .2s;color:var(--rc-text-secondary)}._6d8tz28:focus-visible{outline:2px solid var(--rc-accent);outline-offset:1px}._6d8tz29{padding:0 .75rem}._6d8tz2a{padding:0 1rem}._6d8tz2b{color:var(--rc-text)}._6d8tz2d{pointer-events:none;opacity:.4}._6d8tz2f{flex:1}@keyframes _1cspf2m0{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@keyframes _1cspf2m1{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(2px)}}._1cspf2m2{z-index:50;max-width:320px;padding:6px 10px;font-size:var(--rc-font-size-md);line-height:1.4;color:var(--rc-text);background-color:var(--rc-bg);border:1px solid var(--rc-border);border-radius:var(--rc-radius-md);box-shadow:0 1px 3px #0000000f;outline:none;white-space:normal;word-break:break-word;pointer-events:none;transition:opacity .12s ease-out,transform .12s ease-out}._1cspf2m2[data-open]{animation:_1cspf2m0 .12s ease-out}._1cspf2m2[data-ending-style]{opacity:0;transform:translateY(2px)}._1cspf2m2[data-closed]{animation:_1cspf2m1 .12s ease-in}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haklex/rich-editor-ui",
-  "version": "0.0.20",
+  "version": "0.0.23",
   "description": "UI components for haklex rich editor",
   "license": "MIT",
   "type": "module",
@@ -18,7 +18,7 @@
   "dependencies": {
     "@base-ui/react": "^1.2.0",
     "lucide-react": "^0.574.0",
-    "@haklex/rich-style-token": "0.0.20"
+    "@haklex/rich-style-token": "0.0.23"
   },
   "devDependencies": {
     "@types/react": "^19.2.14",