@turtleclub/earn-widget 0.1.1 → 0.2.0-beta.1

package/dist/styles.css

@@ -12,6 +12,8 @@
     --text-xs--line-height: calc(1 / 0.75);
     --text-sm: 0.875rem;
     --text-sm--line-height: calc(1.25 / 0.875);
+    --text-base: 1rem;
+    --text-base--line-height: calc(1.5 / 1);
     --text-lg: 1.125rem;
     --text-lg--line-height: calc(1.75 / 1.125);
     --text-2xl: 1.5rem;
@@ -188,6 +190,15 @@
   .turtle-widget-root .top-1\/2 {
     top: calc(1/2 * 100%);
   }
+  .turtle-widget-root .right-2 {
+    right: calc(var(--spacing) * 2);
+  }
+  .turtle-widget-root .right-4 {
+    right: calc(var(--spacing) * 4);
+  }
+  .turtle-widget-root .bottom-2 {
+    bottom: calc(var(--spacing) * 2);
+  }
   .turtle-widget-root .bottom-3 {
     bottom: calc(var(--spacing) * 3);
   }
@@ -227,6 +238,9 @@
   .turtle-widget-root .mr-2 {
     margin-right: calc(var(--spacing) * 2);
   }
+  .turtle-widget-root .mb-3 {
+    margin-bottom: calc(var(--spacing) * 3);
+  }
   .turtle-widget-root .flex {
     display: flex;
   }
@@ -318,6 +332,9 @@
     --tw-translate-y: calc(calc(1/2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .turtle-widget-root .transform {
+    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
+  }
   .turtle-widget-root .animate-pulse {
     animation: var(--animate-pulse);
   }
@@ -371,9 +388,19 @@
       margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .turtle-widget-root .-space-x-1 {
+    .turtle-widget-root :where(& > :not(:last-child)) {
+      --tw-space-x-reverse: 0;
+      margin-inline-start: calc(calc(var(--spacing) * -1) * var(--tw-space-x-reverse));
+      margin-inline-end: calc(calc(var(--spacing) * -1) * calc(1 - var(--tw-space-x-reverse)));
+    }
+  }
   .turtle-widget-root .overflow-hidden {
     overflow: hidden;
   }
+  .turtle-widget-root .overflow-x-auto {
+    overflow-x: auto;
+  }
   .turtle-widget-root .overflow-y-auto {
     overflow-y: auto;
   }
@@ -389,17 +416,28 @@
   .turtle-widget-root .rounded-md {
     border-radius: calc(var(--radius) - 2px);
   }
-  .turtle-widget-root .rounded-xl {
-    border-radius: calc(var(--radius) + 4px);
+  .turtle-widget-root .\!border {
+    border-style: var(--tw-border-style) !important;
+    border-width: 1px !important;
   }
   .turtle-widget-root .border {
     border-style: var(--tw-border-style);
     border-width: 1px;
   }
+  .turtle-widget-root .border-2 {
+    border-style: var(--tw-border-style);
+    border-width: 2px;
+  }
   .turtle-widget-root .border-b {
     border-bottom-style: var(--tw-border-style);
     border-bottom-width: 1px;
   }
+  .turtle-widget-root .\!border-border {
+    border-color: var(--border) !important;
+  }
+  .turtle-widget-root .border-background {
+    border-color: var(--background);
+  }
   .turtle-widget-root .border-border {
     border-color: var(--border);
   }
@@ -412,6 +450,9 @@
   .turtle-widget-root .border-muted {
     border-color: var(--muted);
   }
+  .turtle-widget-root .\!bg-background {
+    background-color: var(--background) !important;
+  }
   .turtle-widget-root .bg-background {
     background-color: var(--background);
   }
@@ -433,6 +474,9 @@
       background-color: color-mix(in oklab, var(--muted) 20%, transparent);
     }
   }
+  .turtle-widget-root .bg-primary {
+    background-color: var(--primary);
+  }
   .turtle-widget-root .bg-primary\/20 {
     background-color: var(--primary);
     @supports (color: color-mix(in lab, red, red)) {
@@ -445,27 +489,42 @@
   .turtle-widget-root .object-contain {
     object-fit: contain;
   }
+  .turtle-widget-root .object-cover {
+    object-fit: cover;
+  }
   .turtle-widget-root .p-1 {
     padding: calc(var(--spacing) * 1);
   }
   .turtle-widget-root .p-4 {
     padding: calc(var(--spacing) * 4);
   }
-  .turtle-widget-root .p-6 {
-    padding: calc(var(--spacing) * 6);
-  }
   .turtle-widget-root .px-4 {
     padding-inline: calc(var(--spacing) * 4);
   }
+  .turtle-widget-root .px-6 {
+    padding-inline: calc(var(--spacing) * 6);
+  }
   .turtle-widget-root .py-2 {
     padding-block: calc(var(--spacing) * 2);
   }
+  .turtle-widget-root .py-3 {
+    padding-block: calc(var(--spacing) * 3);
+  }
   .turtle-widget-root .py-4 {
     padding-block: calc(var(--spacing) * 4);
   }
+  .turtle-widget-root .py-8 {
+    padding-block: calc(var(--spacing) * 8);
+  }
   .turtle-widget-root .pr-3 {
     padding-right: calc(var(--spacing) * 3);
   }
+  .turtle-widget-root .pr-12 {
+    padding-right: calc(var(--spacing) * 12);
+  }
+  .turtle-widget-root .pl-4 {
+    padding-left: calc(var(--spacing) * 4);
+  }
   .turtle-widget-root .pl-14 {
     padding-left: calc(var(--spacing) * 14);
   }
@@ -484,6 +543,10 @@
     font-size: var(--text-6xl);
     line-height: var(--tw-leading, var(--text-6xl--line-height));
   }
+  .turtle-widget-root .text-base {
+    font-size: var(--text-base);
+    line-height: var(--tw-leading, var(--text-base--line-height));
+  }
   .turtle-widget-root .text-lg {
     font-size: var(--text-lg);
     line-height: var(--tw-leading, var(--text-lg--line-height));
@@ -508,6 +571,9 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
+  .turtle-widget-root .whitespace-nowrap {
+    white-space: nowrap;
+  }
   .turtle-widget-root .text-destructive {
     color: var(--destructive);
   }
@@ -520,6 +586,12 @@
   .turtle-widget-root .text-primary {
     color: var(--primary);
   }
+  .turtle-widget-root .text-primary-foreground {
+    color: var(--primary-foreground);
+  }
+  .turtle-widget-root .capitalize {
+    text-transform: capitalize;
+  }
   .turtle-widget-root .antialiased {
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
@@ -527,6 +599,10 @@
   .turtle-widget-root .opacity-30 {
     opacity: 30%;
   }
+  .turtle-widget-root .shadow-sm {
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .turtle-widget-root .ring-1 {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + 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);
@@ -537,6 +613,9 @@
       --tw-ring-color: color-mix(in oklab, var(--primary) 60%, transparent);
     }
   }
+  .turtle-widget-root .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,);
+  }
   .turtle-widget-root .transition-all {
     transition-property: all;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -547,6 +626,10 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .turtle-widget-root .duration-200 {
+    --tw-duration: 200ms;
+    transition-duration: 200ms;
+  }
   .turtle-widget-root .duration-700 {
     --tw-duration: 700ms;
     transition-duration: 700ms;
@@ -555,6 +638,11 @@
     --tw-ease: linear;
     transition-timing-function: linear;
   }
+  .turtle-widget-root .placeholder\:text-muted-foreground {
+    .turtle-widget-root &::placeholder {
+      color: var(--muted-foreground);
+    }
+  }
   .turtle-widget-root .hover\:border-primary {
     .turtle-widget-root &:hover {
       @media (hover: hover) {
@@ -572,6 +660,16 @@
       }
     }
   }
+  .turtle-widget-root .hover\:bg-muted\/90 {
+    .turtle-widget-root &:hover {
+      @media (hover: hover) {
+        background-color: var(--muted);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--muted) 90%, transparent);
+        }
+      }
+    }
+  }
   .turtle-widget-root .hover\:bg-secondary {
     .turtle-widget-root &:hover {
       @media (hover: hover) {
@@ -579,6 +677,13 @@
       }
     }
   }
+  .turtle-widget-root .hover\:text-foreground {
+    .turtle-widget-root &:hover {
+      @media (hover: hover) {
+        color: var(--foreground);
+      }
+    }
+  }
   .turtle-widget-root .hover\:text-primary {
     .turtle-widget-root &:hover {
       @media (hover: hover) {
@@ -586,6 +691,14 @@
       }
     }
   }
+  .turtle-widget-root .hover\:shadow-sm {
+    .turtle-widget-root &:hover {
+      @media (hover: hover) {
+        --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+      }
+    }
+  }
   .turtle-widget-root .focus\:border-primary {
     .turtle-widget-root &:focus {
       border-color: var(--primary);
@@ -597,6 +710,23 @@
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
+  .turtle-widget-root .focus\:ring-2 {
+    .turtle-widget-root &:focus {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + 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);
+    }
+  }
+  .turtle-widget-root .focus\:ring-primary {
+    .turtle-widget-root &:focus {
+      --tw-ring-color: var(--primary);
+    }
+  }
+  .turtle-widget-root .focus\:outline-none {
+    .turtle-widget-root &:focus {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+  }
   .turtle-widget-root .data-\[state\=checked\]\:bg-secondary {
     .turtle-widget-root &[data-state="checked"] {
       background-color: var(--secondary);
@@ -1063,6 +1193,13 @@
     color: var(--foreground);
   }
 }
+.turtle-widget-root .no-scrollbar {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+.turtle-widget-root .no-scrollbar::-webkit-scrollbar {
+  display: none;
+}
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;
@@ -1078,11 +1215,36 @@
   inherits: false;
   initial-value: 0;
 }
+@property --tw-rotate-x {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-rotate-y {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-rotate-z {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-skew-x {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-skew-y {
+  syntax: "*";
+  inherits: false;
+}
 @property --tw-space-y-reverse {
   syntax: "*";
   inherits: false;
   initial-value: 0;
 }
+@property --tw-space-x-reverse {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0;
+}
 @property --tw-border-style {
   syntax: "*";
   inherits: false;
@@ -1157,6 +1319,59 @@
   inherits: false;
   initial-value: 0 0 #0000;
 }
+@property --tw-blur {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-brightness {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-contrast {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-grayscale {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-hue-rotate {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-invert {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-opacity {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-saturate {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-sepia {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-drop-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-drop-shadow-size {
+  syntax: "*";
+  inherits: false;
+}
 @property --tw-duration {
   syntax: "*";
   inherits: false;
@@ -1181,7 +1396,13 @@
       --tw-translate-x: 0;
       --tw-translate-y: 0;
       --tw-translate-z: 0;
+      --tw-rotate-x: initial;
+      --tw-rotate-y: initial;
+      --tw-rotate-z: initial;
+      --tw-skew-x: initial;
+      --tw-skew-y: initial;
       --tw-space-y-reverse: 0;
+      --tw-space-x-reverse: 0;
       --tw-border-style: solid;
       --tw-font-weight: initial;
       --tw-shadow: 0 0 #0000;
@@ -1198,6 +1419,19 @@
       --tw-ring-offset-width: 0px;
       --tw-ring-offset-color: #fff;
       --tw-ring-offset-shadow: 0 0 #0000;
+      --tw-blur: initial;
+      --tw-brightness: initial;
+      --tw-contrast: initial;
+      --tw-grayscale: initial;
+      --tw-hue-rotate: initial;
+      --tw-invert: initial;
+      --tw-opacity: initial;
+      --tw-saturate: initial;
+      --tw-sepia: initial;
+      --tw-drop-shadow: initial;
+      --tw-drop-shadow-color: initial;
+      --tw-drop-shadow-alpha: 100%;
+      --tw-drop-shadow-size: initial;
       --tw-duration: initial;
       --tw-ease: initial;
       --tw-animation-delay: 0s;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@turtleclub/earn-widget",
-  "version": "0.1.1",
+  "version": "0.2.0-beta.1",
   "description": "Configurable and self-contained Turtle Earn widget for third-party integration",
   "license": "MIT",
   "repository": {
@@ -39,8 +39,8 @@
   },
   "dependencies": {
     "@tailwindcss/postcss": "^4.1.11",
-    "@turtleclub/hooks": "0.1.1",
-    "@turtleclub/ui": "0.1.1",
+    "@turtleclub/hooks": "0.2.0-beta.0",
+    "@turtleclub/ui": "0.2.0-beta.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "jotai": "^2.10.5",
@@ -78,5 +78,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "70dd6f0128bae6031c840efc31fde41bf3332a4c"
+  "gitHead": "7778980c05e971e49595f6bd65ee7c884b26fd0f"
 }