@jbpark/live-editor 2.0.4 → 2.1.0

package/dist/style.css

@@ -520,12 +520,16 @@
       --font-mono: var(--font-geist-mono);
       --color-red-400: oklch(70.4% .191 22.216);
       --color-yellow-400: oklch(85.2% .199 91.936);
-      --color-yellow-500: oklch(79.5% .184 86.047);
-      --color-yellow-600: oklch(68.1% .162 75.834);
       --color-green-400: oklch(79.2% .209 151.711);
-      --color-green-500: oklch(72.3% .219 149.579);
-      --color-green-600: oklch(62.7% .194 149.214);
       --color-blue-400: oklch(70.7% .165 254.624);
+      --color-blue-600: oklch(54.6% .245 262.881);
+      --color-gray-100: oklch(96.7% .003 264.542);
+      --color-gray-200: oklch(92.8% .006 264.531);
+      --color-gray-300: oklch(87.2% .01 258.338);
+      --color-gray-400: oklch(70.7% .022 261.325);
+      --color-gray-600: oklch(44.6% .03 256.802);
+      --color-gray-800: oklch(27.8% .033 256.848);
+      --color-gray-900: oklch(21% .034 264.665);
       --color-black: #000;
       --color-white: #fff;
       --spacing: .25rem;
@@ -689,6 +693,103 @@
       --btn-bg: #f59e0b;
     }
 
+    [data-slot="badge"][data-color] {
+      --tag-fg: var(--tag-bg);
+      --tag-tint: var(--tag-bg);
+
+      @supports (color: color-mix(in lab, red, red)) {
+        --tag-tint: color-mix(in oklab, var(--tag-bg), transparent 90%);
+      }
+    }
+
+    [data-slot="badge"][data-color="default"] {
+      --tag-bg: var(--border);
+      --tag-tint: var(--muted);
+      --tag-fg: var(--muted-foreground);
+    }
+
+    [data-slot="badge"][data-color="default"][data-variant="outlined"] {
+      --tag-fg: var(--foreground);
+    }
+
+    [data-slot="badge"][data-color="primary"] {
+      --tag-bg: var(--primary);
+    }
+
+    [data-slot="badge"][data-color="danger"] {
+      --tag-bg: var(--destructive);
+    }
+
+    [data-slot="badge"][data-color="success"] {
+      --tag-bg: oklch(72.3% .219 149.579);
+      --tag-fg: oklch(62.7% .194 149.214);
+    }
+
+    [data-slot="badge"][data-color="warning"] {
+      --tag-bg: oklch(79.5% .184 86.047);
+      --tag-fg: oklch(68.1% .162 75.834);
+    }
+
+    :is(.dark, [data-theme="dark"]) [data-slot="badge"][data-color="success"] {
+      --tag-fg: oklch(79.2% .209 151.711);
+    }
+
+    :is(.dark, [data-theme="dark"]) [data-slot="badge"][data-color="warning"] {
+      --tag-fg: oklch(85.2% .199 91.936);
+    }
+
+    [data-slot="badge"][data-color="blue"] {
+      --tag-bg: #3b82f6;
+    }
+
+    [data-slot="badge"][data-color="purple"] {
+      --tag-bg: #a855f7;
+    }
+
+    [data-slot="badge"][data-color="cyan"] {
+      --tag-bg: #06b6d4;
+    }
+
+    [data-slot="badge"][data-color="green"] {
+      --tag-bg: #22c55e;
+    }
+
+    [data-slot="badge"][data-color="magenta"] {
+      --tag-bg: #d946ef;
+    }
+
+    [data-slot="badge"][data-color="pink"] {
+      --tag-bg: #ec4899;
+    }
+
+    [data-slot="badge"][data-color="red"] {
+      --tag-bg: #ef4444;
+    }
+
+    [data-slot="badge"][data-color="orange"] {
+      --tag-bg: #f97316;
+    }
+
+    [data-slot="badge"][data-color="yellow"] {
+      --tag-bg: #eab308;
+    }
+
+    [data-slot="badge"][data-color="volcano"] {
+      --tag-bg: #ea580c;
+    }
+
+    [data-slot="badge"][data-color="geekblue"] {
+      --tag-bg: #6366f1;
+    }
+
+    [data-slot="badge"][data-color="lime"] {
+      --tag-bg: #84cc16;
+    }
+
+    [data-slot="badge"][data-color="gold"] {
+      --tag-bg: #f59e0b;
+    }
+
     [data-slot="col"] {
       flex-basis: calc(var(--col-span-xs) / 24 * 100%);
       max-width: calc(var(--col-span-xs) / 24 * 100%);
@@ -1220,6 +1321,10 @@
       min-height: calc(var(--spacing) * 16);
     }
 
+    .min-h-20 {
+      min-height: calc(var(--spacing) * 20);
+    }
+
     .min-h-screen {
       min-height: 100vh;
     }
@@ -1252,10 +1357,18 @@
       width: calc(var(--spacing) * 15);
     }
 
+    .w-20 {
+      width: calc(var(--spacing) * 20);
+    }
+
     .w-25 {
       width: calc(var(--spacing) * 25);
     }
 
+    .w-28 {
+      width: calc(var(--spacing) * 28);
+    }
+
     .w-48 {
       width: calc(var(--spacing) * 48);
     }
@@ -1516,6 +1629,10 @@
       cursor: pointer;
     }
 
+    .touch-none {
+      touch-action: none;
+    }
+
     .resize {
       resize: both;
     }
@@ -1837,6 +1954,10 @@
       border-color: var(--btn-border);
     }
 
+    .border-\(--tag-bg\) {
+      border-color: var(--tag-bg);
+    }
+
     .border-\[color-mix\(in_oklch\,var\(--btn-border\)\,transparent_50\%\)\] {
       border-color: var(--btn-border);
 
@@ -1861,12 +1982,8 @@
       border-color: currentColor;
     }
 
-    .border-destructive {
-      border-color: var(--destructive);
-    }
-
-    .border-green-500 {
-      border-color: var(--color-green-500);
+    .border-gray-200 {
+      border-color: var(--color-gray-200);
     }
 
     .border-input {
@@ -1881,14 +1998,14 @@
       border-color: #0000;
     }
 
-    .border-yellow-500 {
-      border-color: var(--color-yellow-500);
-    }
-
     .bg-\(--btn-bg\) {
       background-color: var(--btn-bg);
     }
 
+    .bg-\(--tag-tint\) {
+      background-color: var(--tag-tint);
+    }
+
     .bg-accent {
       background-color: var(--accent);
     }
@@ -1933,26 +2050,14 @@
       background-color: var(--destructive);
     }
 
-    .bg-destructive\/10 {
-      background-color: var(--destructive);
-
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
-      }
-    }
-
-    .bg-green-500\/10 {
-      background-color: #00c7581a;
-
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--color-green-500) 10%, transparent);
-      }
-    }
-
     .bg-inherit {
       background-color: inherit;
     }
 
+    .bg-input {
+      background-color: var(--input);
+    }
+
     .bg-muted {
       background-color: var(--muted);
     }
@@ -1965,14 +2070,6 @@
       background-color: var(--primary);
     }
 
-    .bg-primary\/10 {
-      background-color: var(--primary);
-
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--primary) 10%, transparent);
-      }
-    }
-
     .bg-primary\/20 {
       background-color: var(--primary);
 
@@ -1989,12 +2086,8 @@
       background-color: #0000;
     }
 
-    .bg-yellow-500\/10 {
-      background-color: #edb2001a;
-
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--color-yellow-500) 10%, transparent);
-      }
+    .bg-white {
+      background-color: var(--color-white);
     }
 
     .fill-primary {
@@ -2269,6 +2362,10 @@
       color: var(--btn-fg);
     }
 
+    .text-\(--tag-fg\) {
+      color: var(--tag-fg);
+    }
+
     .text-accent-foreground {
       color: var(--accent-foreground);
     }
@@ -2293,12 +2390,12 @@
       color: var(--foreground);
     }
 
-    .text-green-400 {
-      color: var(--color-green-400);
+    .text-gray-800 {
+      color: var(--color-gray-800);
     }
 
-    .text-green-600 {
-      color: var(--color-green-600);
+    .text-green-400 {
+      color: var(--color-green-400);
     }
 
     .text-muted-foreground {
@@ -2333,14 +2430,14 @@
       color: var(--color-yellow-400);
     }
 
-    .text-yellow-600 {
-      color: var(--color-yellow-600);
-    }
-
     .lowercase {
       text-transform: lowercase;
     }
 
+    .italic {
+      font-style: italic;
+    }
+
     .underline {
       text-decoration-line: underline;
     }
@@ -2408,6 +2505,14 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
+    .ring-ring\/50 {
+      --tw-ring-color: var(--ring);
+
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
+      }
+    }
+
     .ring-offset-background {
       --tw-ring-offset-color: var(--background);
     }
@@ -2427,6 +2532,11 @@
       outline-width: 1px;
     }
 
+    .blur {
+      --tw-blur: blur(8px);
+      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
+    }
+
     .filter {
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
@@ -3035,6 +3145,11 @@
       .hover\:opacity-100:hover {
         opacity: 1;
       }
+
+      .hover\:ring-4:hover {
+        --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+      }
     }
 
     .focus\:bg-accent:focus {
@@ -3078,6 +3193,11 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
+    .focus-visible\:ring-4:focus-visible {
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+
     .focus-visible\:ring-\[3px\]:focus-visible {
       --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3275,6 +3395,10 @@
       pointer-events: none;
     }
 
+    .data-\[disabled\]\:cursor-not-allowed[data-disabled] {
+      cursor: not-allowed;
+    }
+
     .data-\[disabled\]\:opacity-50[data-disabled] {
       opacity: .5;
     }
@@ -3287,6 +3411,14 @@
       color: var(--destructive);
     }
 
+    .data-\[orientation\=horizontal\]\:h-1\.5[data-orientation="horizontal"] {
+      height: calc(var(--spacing) * 1.5);
+    }
+
+    .data-\[orientation\=horizontal\]\:h-full[data-orientation="horizontal"] {
+      height: 100%;
+    }
+
     .data-\[orientation\=horizontal\]\:h-px[data-orientation="horizontal"] {
       height: 1px;
     }
@@ -3299,10 +3431,30 @@
       height: 100%;
     }
 
+    .data-\[orientation\=vertical\]\:min-h-44[data-orientation="vertical"] {
+      min-height: calc(var(--spacing) * 44);
+    }
+
+    .data-\[orientation\=vertical\]\:w-1\.5[data-orientation="vertical"] {
+      width: calc(var(--spacing) * 1.5);
+    }
+
+    .data-\[orientation\=vertical\]\:w-auto[data-orientation="vertical"] {
+      width: auto;
+    }
+
+    .data-\[orientation\=vertical\]\:w-full[data-orientation="vertical"] {
+      width: 100%;
+    }
+
     .data-\[orientation\=vertical\]\:w-px[data-orientation="vertical"] {
       width: 1px;
     }
 
+    .data-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
+      flex-direction: column;
+    }
+
     .data-\[placeholder\]\:text-muted-foreground[data-placeholder] {
       color: var(--muted-foreground);
     }
@@ -3719,14 +3871,6 @@
       }
     }
 
-    .dark\:text-green-400:is(.dark *, [data-theme="dark"] *) {
-      color: var(--color-green-400);
-    }
-
-    .dark\:text-yellow-400:is(.dark *, [data-theme="dark"] *) {
-      color: var(--color-yellow-400);
-    }
-
     @media (hover: hover) {
       .dark\:hover\:bg-accent\/50:is(.dark *, [data-theme="dark"] *):hover {
         background-color: var(--accent);
@@ -3793,6 +3937,250 @@
       }
     }
 
+    .\[\&_\.tiptap\]\:outline-none .tiptap {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+
+    .\[\&_\.tiptap_a\]\:text-blue-600 .tiptap a {
+      color: var(--color-blue-600);
+    }
+
+    .\[\&_\.tiptap_a\]\:underline .tiptap a {
+      text-decoration-line: underline;
+    }
+
+    .\[\&_\.tiptap_a\]\:underline-offset-2 .tiptap a {
+      text-underline-offset: 2px;
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:my-2 .tiptap blockquote {
+      margin-block: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:border-l-2 .tiptap blockquote {
+      border-left-style: var(--tw-border-style);
+      border-left-width: 2px;
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:border-gray-300 .tiptap blockquote {
+      border-color: var(--color-gray-300);
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:pl-3 .tiptap blockquote {
+      padding-left: calc(var(--spacing) * 3);
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:text-gray-600 .tiptap blockquote {
+      color: var(--color-gray-600);
+    }
+
+    .\[\&_\.tiptap_blockquote\]\:italic .tiptap blockquote {
+      font-style: italic;
+    }
+
+    .\[\&_\.tiptap_code\]\:rounded .tiptap code {
+      border-radius: .25rem;
+    }
+
+    .\[\&_\.tiptap_code\]\:bg-gray-100 .tiptap code {
+      background-color: var(--color-gray-100);
+    }
+
+    .\[\&_\.tiptap_code\]\:px-1 .tiptap code {
+      padding-inline: var(--spacing);
+    }
+
+    .\[\&_\.tiptap_code\]\:py-0\.5 .tiptap code {
+      padding-block: calc(var(--spacing) * .5);
+    }
+
+    .\[\&_\.tiptap_code\]\:font-mono .tiptap code {
+      font-family: var(--font-geist-mono);
+    }
+
+    .\[\&_\.tiptap_code\]\:text-\[0\.85em\] .tiptap code {
+      font-size: .85em;
+    }
+
+    .\[\&_\.tiptap_h1\]\:mt-6 .tiptap h1 {
+      margin-top: calc(var(--spacing) * 6);
+    }
+
+    .\[\&_\.tiptap_h1\]\:mb-2 .tiptap h1 {
+      margin-bottom: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_h1\]\:text-2xl .tiptap h1 {
+      font-size: var(--text-2xl);
+      line-height: var(--tw-leading, var(--text-2xl--line-height));
+    }
+
+    .\[\&_\.tiptap_h1\]\:font-bold .tiptap h1 {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+
+    .\[\&_\.tiptap_h2\]\:mt-5 .tiptap h2 {
+      margin-top: calc(var(--spacing) * 5);
+    }
+
+    .\[\&_\.tiptap_h2\]\:mb-2 .tiptap h2 {
+      margin-bottom: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_h2\]\:text-xl .tiptap h2 {
+      font-size: var(--text-xl);
+      line-height: var(--tw-leading, var(--text-xl--line-height));
+    }
+
+    .\[\&_\.tiptap_h2\]\:font-bold .tiptap h2 {
+      --tw-font-weight: var(--font-weight-bold);
+      font-weight: var(--font-weight-bold);
+    }
+
+    .\[\&_\.tiptap_h3\]\:mt-4 .tiptap h3 {
+      margin-top: calc(var(--spacing) * 4);
+    }
+
+    .\[\&_\.tiptap_h3\]\:mb-2 .tiptap h3 {
+      margin-bottom: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_h3\]\:text-lg .tiptap h3 {
+      font-size: var(--text-lg);
+      line-height: var(--tw-leading, var(--text-lg--line-height));
+    }
+
+    .\[\&_\.tiptap_h3\]\:font-semibold .tiptap h3 {
+      --tw-font-weight: var(--font-weight-semibold);
+      font-weight: var(--font-weight-semibold);
+    }
+
+    .\[\&_\.tiptap_h4\]\:mt-3 .tiptap h4 {
+      margin-top: calc(var(--spacing) * 3);
+    }
+
+    .\[\&_\.tiptap_h4\]\:mb-1 .tiptap h4 {
+      margin-bottom: var(--spacing);
+    }
+
+    .\[\&_\.tiptap_h4\]\:text-base .tiptap h4 {
+      font-size: var(--text-base);
+      line-height: var(--tw-leading, var(--text-base--line-height));
+    }
+
+    .\[\&_\.tiptap_h4\]\:font-semibold .tiptap h4 {
+      --tw-font-weight: var(--font-weight-semibold);
+      font-weight: var(--font-weight-semibold);
+    }
+
+    .\[\&_\.tiptap_hr\]\:my-4 .tiptap hr {
+      margin-block: calc(var(--spacing) * 4);
+    }
+
+    .\[\&_\.tiptap_hr\]\:border-gray-200 .tiptap hr {
+      border-color: var(--color-gray-200);
+    }
+
+    .\[\&_\.tiptap_li\]\:my-1 .tiptap li {
+      margin-block: var(--spacing);
+    }
+
+    .\[\&_\.tiptap_ol\]\:my-2 .tiptap ol {
+      margin-block: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_ol\]\:list-decimal .tiptap ol {
+      list-style-type: decimal;
+    }
+
+    .\[\&_\.tiptap_ol\]\:pl-5 .tiptap ol {
+      padding-left: calc(var(--spacing) * 5);
+    }
+
+    .\[\&_\.tiptap_p\.is-editor-empty\:first-child\:\:before\]\:pointer-events-none .tiptap p.is-editor-empty:first-child:before {
+      pointer-events: none;
+    }
+
+    .\[\&_\.tiptap_p\.is-editor-empty\:first-child\:\:before\]\:float-left .tiptap p.is-editor-empty:first-child:before {
+      float: left;
+    }
+
+    .\[\&_\.tiptap_p\.is-editor-empty\:first-child\:\:before\]\:h-0 .tiptap p.is-editor-empty:first-child:before {
+      height: 0;
+    }
+
+    .\[\&_\.tiptap_p\.is-editor-empty\:first-child\:\:before\]\:text-gray-400 .tiptap p.is-editor-empty:first-child:before {
+      color: var(--color-gray-400);
+    }
+
+    .\[\&_\.tiptap_p\.is-editor-empty\:first-child\:\:before\]\:content-\[attr\(data-placeholder\)\] .tiptap p.is-editor-empty:first-child:before {
+      --tw-content: attr(data-placeholder);
+      content: var(--tw-content);
+    }
+
+    .\[\&_\.tiptap_pre\]\:my-2 .tiptap pre {
+      margin-block: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_pre\]\:overflow-x-auto .tiptap pre {
+      overflow-x: auto;
+    }
+
+    .\[\&_\.tiptap_pre\]\:rounded .tiptap pre {
+      border-radius: .25rem;
+    }
+
+    .\[\&_\.tiptap_pre\]\:bg-gray-900 .tiptap pre {
+      background-color: var(--color-gray-900);
+    }
+
+    .\[\&_\.tiptap_pre\]\:p-3 .tiptap pre {
+      padding: calc(var(--spacing) * 3);
+    }
+
+    .\[\&_\.tiptap_pre\]\:font-mono .tiptap pre {
+      font-family: var(--font-geist-mono);
+    }
+
+    .\[\&_\.tiptap_pre\]\:text-sm .tiptap pre {
+      font-size: var(--text-sm);
+      line-height: var(--tw-leading, var(--text-sm--line-height));
+    }
+
+    .\[\&_\.tiptap_pre\]\:text-gray-100 .tiptap pre {
+      color: var(--color-gray-100);
+    }
+
+    .\[\&_\.tiptap_pre_code\]\:bg-transparent .tiptap pre code {
+      background-color: #0000;
+    }
+
+    .\[\&_\.tiptap_pre_code\]\:p-0 .tiptap pre code {
+      padding: 0;
+    }
+
+    .\[\&_\.tiptap_pre_code\]\:text-inherit .tiptap pre code {
+      color: inherit;
+    }
+
+    .\[\&_\.tiptap_ul\]\:my-2 .tiptap ul {
+      margin-block: calc(var(--spacing) * 2);
+    }
+
+    .\[\&_\.tiptap_ul\]\:list-disc .tiptap ul {
+      list-style-type: disc;
+    }
+
+    .\[\&_\.tiptap_ul\]\:pl-5 .tiptap ul {
+      padding-left: calc(var(--spacing) * 5);
+    }
+
+    .\[\&_\.tiptap\>\*\:first-child\]\:mt-0 .tiptap > :first-child {
+      margin-top: 0;
+    }
+
     .\[\&_svg\]\:pointer-events-none svg {
       pointer-events: none;
     }

package/dist/{use-dynamic-tailwind-CRMGuKnH.js → use-dynamic-tailwind-cdaivJXJ.js}

@@ -1,4 +1,4 @@
-import { i as compile, l as getCachedScriptBlob, t as baseModules } from "./utils-B6zpA7mT.js";
+import { i as compile, l as getCachedScriptBlob, t as baseModules } from "./utils-DbfbS1yV.js";
 import { t as generateTailwindCSSFromDOM } from "./tailwind-CbjdLyVX.js";
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -456,4 +456,4 @@ const useDynamicTailwind = (code, enabled) => {
 //#endregion
 export { useCompiledModule as n, Frame as r, useDynamicTailwind as t };
 
-//# sourceMappingURL=use-dynamic-tailwind-CRMGuKnH.js.map
+//# sourceMappingURL=use-dynamic-tailwind-cdaivJXJ.js.map