@kushagradhawan/kookie-ui 0.1.105 → 0.1.108

package/components.css

@@ -12948,12 +12948,19 @@
     border-radius: 0 !important;
     will-change: transform;
 }
+@supports (height: 100dvh) {
+    :where(.rt-SheetContent) {
+        height: 100dvh;
+        max-height: 100dvh;
+    }
+}
 :where(.rt-SheetContent[data-side='start']) {
     inset-block: 0 !important;
     inset-inline-start: 0 !important;
     margin: 0 !important;
     border-start-start-radius: 0;
     border-end-start-radius: 0;
+    padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='end']) {
     inset-block: 0 !important;
@@ -12961,6 +12968,7 @@
     margin: 0 !important;
     border-start-end-radius: 0;
     border-end-end-radius: 0;
+    padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='top']) {
     inset-block-start: 0 !important;
@@ -13061,6 +13069,7 @@
     flex-direction: column;
     width: 100%;
     height: 100%;
+    -webkit-overflow-scrolling: touch;
 }
 .rt-ScrollAreaViewport:where(:focus-visible) + :where(.rt-ScrollAreaViewportFocusRing) {
     position: absolute;
@@ -17189,6 +17198,8 @@
     flex-direction: column;
     width: 100%;
     overflow: hidden;
+    overscroll-behavior: none;
+    position: relative;
 }
 .rt-ShellRoot:not([style*='height']) {
     height: 100vh;
@@ -17215,6 +17226,7 @@
     min-height: 0;
     overflow: hidden;
     position: relative;
+    overscroll-behavior: contain;
 }
 .rt-ShellLeft {
     display: flex;
@@ -17369,6 +17381,9 @@
     min-width: 0;
     height: 100%;
     overflow: auto;
+    -webkit-overflow-scrolling: touch;
+    padding-bottom: env(safe-area-inset-bottom, 0px);
+    overscroll-behavior: contain;
 }
 .rt-ShellInspector {
     display: flex;
@@ -19969,7 +19984,7 @@
     min-width: 0;
     resize: none;
     border: 0;
-    outline: 0;
+    outline: none;
     background: transparent;
     padding: 0;
     margin: 0;
@@ -19979,6 +19994,10 @@
     text-align: start;
     transition: height 150ms ease-out;
 }
+.rt-ChatbarInput:focus,
+.rt-ChatbarInput:focus-visible {
+    outline: none;
+}
 .rt-ChatbarBox :where(.rt-ChatbarGrid) {
     display: flex;
     flex-direction: column;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kushagradhawan/kookie-ui",
-  "version": "0.1.105",
+  "version": "0.1.108",
   "description": "A modern React component library with beautiful design tokens, flexible theming, and comprehensive documentation",
   "keywords": [
     "react",

package/schemas/base-button.json

@@ -279,6 +279,6 @@
   "title": "Base-button Component Props",
   "description": "Props schema for the base-button component in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.470Z",
+  "generatedAt": "2026-01-06T09:52:15.405Z",
   "source": "Zod schema"
 }

package/schemas/button.json

@@ -530,6 +530,6 @@
   "title": "Button Component Props",
   "description": "Props schema for the button component in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.477Z",
+  "generatedAt": "2026-01-06T09:52:15.411Z",
   "source": "Zod schema"
 }

package/schemas/icon-button.json

@@ -313,6 +313,6 @@
   "title": "Icon-button Component Props",
   "description": "Props schema for the icon-button component in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.477Z",
+  "generatedAt": "2026-01-06T09:52:15.412Z",
   "source": "Zod schema"
 }

package/schemas/index.json

@@ -3,7 +3,7 @@
   "title": "Kookie UI Button Components",
   "description": "Complete JSON Schema collection for all button components in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.480Z",
+  "generatedAt": "2026-01-06T09:52:15.415Z",
   "source": "Zod schemas",
   "components": {
     "base-button": {
@@ -287,7 +287,7 @@
       "title": "Base-button Component Props",
       "description": "Props schema for the base-button component in Kookie UI",
       "version": "1.0.0",
-      "generatedAt": "2026-01-05T19:36:34.470Z",
+      "generatedAt": "2026-01-06T09:52:15.405Z",
       "source": "Zod schema"
     },
     "button": {
@@ -822,7 +822,7 @@
       "title": "Button Component Props",
       "description": "Props schema for the button component in Kookie UI",
       "version": "1.0.0",
-      "generatedAt": "2026-01-05T19:36:34.477Z",
+      "generatedAt": "2026-01-06T09:52:15.411Z",
       "source": "Zod schema"
     },
     "icon-button": {
@@ -1140,7 +1140,7 @@
       "title": "Icon-button Component Props",
       "description": "Props schema for the icon-button component in Kookie UI",
       "version": "1.0.0",
-      "generatedAt": "2026-01-05T19:36:34.477Z",
+      "generatedAt": "2026-01-06T09:52:15.412Z",
       "source": "Zod schema"
     },
     "toggle-button": {
@@ -1683,7 +1683,7 @@
       "title": "Toggle-button Component Props",
       "description": "Props schema for the toggle-button component in Kookie UI",
       "version": "1.0.0",
-      "generatedAt": "2026-01-05T19:36:34.479Z",
+      "generatedAt": "2026-01-06T09:52:15.414Z",
       "source": "Zod schema"
     },
     "toggle-icon-button": {
@@ -2009,7 +2009,7 @@
       "title": "Toggle-icon-button Component Props",
       "description": "Props schema for the toggle-icon-button component in Kookie UI",
       "version": "1.0.0",
-      "generatedAt": "2026-01-05T19:36:34.480Z",
+      "generatedAt": "2026-01-06T09:52:15.415Z",
       "source": "Zod schema"
     }
   }

package/schemas/toggle-button.json

@@ -538,6 +538,6 @@
   "title": "Toggle-button Component Props",
   "description": "Props schema for the toggle-button component in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.479Z",
+  "generatedAt": "2026-01-06T09:52:15.414Z",
   "source": "Zod schema"
 }

package/schemas/toggle-icon-button.json

@@ -321,6 +321,6 @@
   "title": "Toggle-icon-button Component Props",
   "description": "Props schema for the toggle-icon-button component in Kookie UI",
   "version": "1.0.0",
-  "generatedAt": "2026-01-05T19:36:34.480Z",
+  "generatedAt": "2026-01-06T09:52:15.415Z",
   "source": "Zod schema"
 }

package/src/components/chatbar.css

@@ -18,7 +18,7 @@
   min-width: 0;
   resize: none;
   border: 0;
-  outline: 0;
+  outline: none;
   background: transparent;
   padding: 0;
   margin: 0;
@@ -28,6 +28,10 @@
   text-align: start;
   transition: height 150ms ease-out;
 }
+.rt-ChatbarInput:focus,
+.rt-ChatbarInput:focus-visible {
+  outline: none;
+}
 
 /* Main container - flex layout */
 .rt-ChatbarBox :where(.rt-ChatbarGrid) {

package/src/components/scroll-area.css

@@ -22,6 +22,8 @@
   flex-direction: column;
   width: 100%;
   height: 100%;
+  /* iOS momentum scrolling */
+  -webkit-overflow-scrolling: touch;
 
   &:where(:focus-visible) + :where(.rt-ScrollAreaViewportFocusRing) {
     position: absolute;

package/src/components/sheet.css

@@ -10,6 +10,14 @@
   will-change: transform;
 }
 
+/* iOS dynamic viewport height - accounts for browser chrome */
+@supports (height: 100dvh) {
+  :where(.rt-SheetContent) {
+    height: 100dvh;
+    max-height: 100dvh;
+  }
+}
+
 /* Logical side anchoring (RTL-aware via logical inset) */
 :where(.rt-SheetContent[data-side='start']) {
   inset-block: 0 !important;
@@ -17,6 +25,8 @@
   margin: 0 !important;
   border-start-start-radius: 0;
   border-end-start-radius: 0;
+  /* iOS safe area for home indicator */
+  padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='end']) {
   inset-block: 0 !important;
@@ -24,6 +34,8 @@
   margin: 0 !important;
   border-start-end-radius: 0;
   border-end-end-radius: 0;
+  /* iOS safe area for home indicator */
+  padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='top']) {
   inset-block-start: 0 !important;

package/src/components/shell.css

@@ -13,6 +13,10 @@
   flex-direction: column;
   width: 100%;
   overflow: hidden;
+  /* Prevent scroll chaining to parent/body on iOS */
+  overscroll-behavior: none;
+  /* Ensure Shell is the scroll boundary */
+  position: relative;
 }
 
 /* Default height when no height prop is provided */
@@ -46,6 +50,8 @@
   min-height: 0;
   overflow: hidden;
   position: relative; /* enable absolute positioning for peek overlays */
+  /* Prevent scroll chaining on iOS */
+  overscroll-behavior: contain;
 }
 
 /* Left container - holds Rail, Panel, or Sidebar */
@@ -272,6 +278,12 @@
   min-width: 0;
   height: 100%;
   overflow: auto;
+  /* iOS momentum scrolling */
+  -webkit-overflow-scrolling: touch;
+  /* iOS safe area support */
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+  /* Prevent overscroll bounce from triggering parent scroll */
+  overscroll-behavior: contain;
 }
 
 /* Inspector - right-side panel */

package/styles.css

@@ -17959,12 +17959,19 @@
   border-radius: 0 !important;
   will-change: transform;
 }
+@supports (height: 100dvh) {
+  :where(.rt-SheetContent){
+    height: 100dvh;
+    max-height: 100dvh;
+  }
+}
 :where(.rt-SheetContent[data-side='start']){
   inset-block: 0 !important;
   inset-inline-start: 0 !important;
   margin: 0 !important;
   border-start-start-radius: 0;
   border-end-start-radius: 0;
+  padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='end']){
   inset-block: 0 !important;
@@ -17972,6 +17979,7 @@
   margin: 0 !important;
   border-start-end-radius: 0;
   border-end-end-radius: 0;
+  padding-bottom: env(safe-area-inset-bottom, 0px);
 }
 :where(.rt-SheetContent[data-side='top']){
   inset-block-start: 0 !important;
@@ -18072,6 +18080,7 @@
   flex-direction: column;
   width: 100%;
   height: 100%;
+  -webkit-overflow-scrolling: touch;
 }
 .rt-ScrollAreaViewport:where(:focus-visible) + :where(.rt-ScrollAreaViewportFocusRing){
   position: absolute;
@@ -22200,6 +22209,8 @@
   flex-direction: column;
   width: 100%;
   overflow: hidden;
+  overscroll-behavior: none;
+  position: relative;
 }
 .rt-ShellRoot:not([style*='height']){
   height: 100vh;
@@ -22226,6 +22237,7 @@
   min-height: 0;
   overflow: hidden;
   position: relative;
+  overscroll-behavior: contain;
 }
 .rt-ShellLeft{
   display: flex;
@@ -22380,6 +22392,9 @@
   min-width: 0;
   height: 100%;
   overflow: auto;
+  -webkit-overflow-scrolling: touch;
+  padding-bottom: env(safe-area-inset-bottom, 0px);
+  overscroll-behavior: contain;
 }
 .rt-ShellInspector{
   display: flex;
@@ -24980,7 +24995,7 @@
   min-width: 0;
   resize: none;
   border: 0;
-  outline: 0;
+  outline: none;
   background: transparent;
   padding: 0;
   margin: 0;
@@ -24990,6 +25005,10 @@
   text-align: start;
   transition: height 150ms ease-out;
 }
+.rt-ChatbarInput:focus,
+.rt-ChatbarInput:focus-visible{
+  outline: none;
+}
 .rt-ChatbarBox :where(.rt-ChatbarGrid){
   display: flex;
   flex-direction: column;