@ornikar/kitt-universal 31.1.0 → 31.1.2-canary.31eec21cbe0c2b92255fb1fa14d83757a05ea8b0.0

package/CHANGELOG.md

@@ -3,6 +3,26 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [31.1.2-canary.31eec21cbe0c2b92255fb1fa14d83757a05ea8b0.0](https://github.com/ornikar/kitt/compare/@ornikar/kitt-universal@31.1.1...@ornikar/kitt-universal@31.1.2-canary.31eec21cbe0c2b92255fb1fa14d83757a05ea8b0.0) (2025-11-26)
+
+
+### Features
+
+* **kitt-universal/Button:** add timer gauge option OSE-21414 ([#2771](https://github.com/ornikar/kitt/issues/2771)) ([c1f1e27](https://github.com/ornikar/kitt/commit/c1f1e27fe5dd78718338bab01178bca075c4ae07))
+* remove linaria usage OSE-18326 ([31eec21](https://github.com/ornikar/kitt/commit/31eec21cbe0c2b92255fb1fa14d83757a05ea8b0))
+* upgrade RTL [OSE-18110] ([#2769](https://github.com/ornikar/kitt/issues/2769)) ([56bcbe4](https://github.com/ornikar/kitt/commit/56bcbe4d1933bb4ae099f85b546790ba537d18f7))
+
+
+
+## [31.1.1](https://github.com/ornikar/kitt/compare/@ornikar/kitt-universal@31.1.0...@ornikar/kitt-universal@31.1.1) (2025-11-24)
+
+
+### Bug Fixes
+
+* **kitt-universal:** update code to use isExpanded props without bug OSE-21576 ([#2766](https://github.com/ornikar/kitt/issues/2766)) ([7e5dc23](https://github.com/ornikar/kitt/commit/7e5dc23af00e53c46f70bc810b4c16f03ca3429b))
+
+
+
 ## [31.1.0](https://github.com/ornikar/kitt/compare/@ornikar/kitt-universal@31.0.1...@ornikar/kitt-universal@31.1.0) (2025-11-21)
 
 

package/dist/definitions/Button/Button.d.ts

@@ -14,6 +14,11 @@ export interface ButtonProps extends Pick<PressableProps, 'onPress' | 'onFocus'
     iconPosition?: IconPosition;
     withBadge?: boolean;
     badgeCount?: number;
+    timerAttrs?: {
+        duration: number;
+        running: boolean;
+        onEnded: () => void;
+    };
     testID?: PressableProps['testID'];
     href?: PressableProps['href'];
     hrefAttrs?: PressableProps['hrefAttrs'];

package/dist/definitions/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE3E,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AACzF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sEAAsE,CAAC;AAQ5G,KAAK,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAErC,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,GAAG,QAAQ,CAAC;IAC3F,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,eAAe,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IAC/C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,IAAI,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IACxD,YAAY,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;CACrC;AAED,eAAO,MAAM,MAAM,uOAkGlB,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE3E,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AACzF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sEAAsE,CAAC;AAS5G,KAAK,YAAY,GAAG,OAAO,GAAG,MAAM,CAAC;AAErC,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,GAAG,QAAQ,CAAC;IAC3F,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,eAAe,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IAC/C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IACzB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC;IACzE,MAAM,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAClC,IAAI,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IACxD,YAAY,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kCAAkC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC;CACrC;AAED,eAAO,MAAM,MAAM,uOAoGlB,CAAC"}

package/dist/definitions/Button/ButtonGauge.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+interface ButtonGaugeProps {
+    duration: number;
+    running: boolean;
+    onEnded: () => void;
+}
+export declare function ButtonGauge({ duration, running, onEnded }: ButtonGaugeProps): ReactNode;
+export {};
+//# sourceMappingURL=ButtonGauge.d.ts.map

package/dist/definitions/Button/ButtonGauge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGauge.d.ts","sourceRoot":"","sources":["../../../src/Button/ButtonGauge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,UAAU,gBAAgB;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,gBAAgB,GAAG,SAAS,CAgFvF"}

package/dist/definitions/NavigationBottomSheet/NavigationBottomSheet.d.ts

@@ -27,6 +27,9 @@ export interface NavigationBottomSheetProps {
      * Native only: maximum dynamic content size for the bottom sheet.
      */
     maxDynamicContentSize?: number;
+    /**
+     * Callback called when the bottom sheet is closed.
+     */
     onClose?: () => void;
 }
 export declare function NavigationBottomSheet({ children, hasScrollView, snapPoints, maxDynamicContentSize, isVisible, isExpanded, onClose, }: NavigationBottomSheetProps): ReactNode;

package/dist/definitions/NavigationBottomSheet/NavigationBottomSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationBottomSheet.d.ts","sourceRoot":"","sources":["../../../src/NavigationBottomSheet/NavigationBottomSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAa,MAAM,OAAO,CAAC;AAGlD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAI7D,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,aAAa,EACb,UAAU,EACV,qBAAqB,EACrB,SAAS,EACT,UAAU,EACV,OAAO,GACR,EAAE,0BAA0B,GAAG,SAAS,CA8BxC;yBAtCe,qBAAqB;;;;;AAwCrC;;GAEG;AACH,MAAM,WAAW,gCAAiC,SAAQ,cAAc;CAAG;AAC3E,iBAAS,2BAA2B,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,gCAAgC,GAAG,SAAS,CAErG;AAED,MAAM,WAAW,8BAA+B,SAAQ,wBAAwB;CAAG;AAEnF,iBAAS,yBAAyB,CAAC,KAAK,EAAE,8BAA8B,GAAG,SAAS,CAUnF;AAED,MAAM,WAAW,gCAAiC,SAAQ,0BAA0B;CAAG;AAEvF,iBAAS,2BAA2B,CAAC,KAAK,EAAE,gCAAgC,GAAG,SAAS,CAEvF"}
+{"version":3,"file":"NavigationBottomSheet.d.ts","sourceRoot":"","sources":["../../../src/NavigationBottomSheet/NavigationBottomSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAa,MAAM,OAAO,CAAC;AAGlD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AAC5E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAI7D,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,aAAa,EACb,UAAU,EACV,qBAAqB,EACrB,SAAS,EACT,UAAkB,EAClB,OAAO,GACR,EAAE,0BAA0B,GAAG,SAAS,CAgCxC;yBAxCe,qBAAqB;;;;;AA0CrC;;GAEG;AACH,MAAM,WAAW,gCAAiC,SAAQ,cAAc;CAAG;AAC3E,iBAAS,2BAA2B,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,gCAAgC,GAAG,SAAS,CAErG;AAED,MAAM,WAAW,8BAA+B,SAAQ,wBAAwB;CAAG;AAEnF,iBAAS,yBAAyB,CAAC,KAAK,EAAE,8BAA8B,GAAG,SAAS,CAUnF;AAED,MAAM,WAAW,gCAAiC,SAAQ,0BAA0B;CAAG;AAEvF,iBAAS,2BAA2B,CAAC,KAAK,EAAE,gCAAgC,GAAG,SAAS,CAEvF"}

package/dist/definitions/typography/TypographyLinkWebWrapper.web.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TypographyLinkWebWrapper.web.d.ts","sourceRoot":"","sources":["../../../src/typography/TypographyLinkWebWrapper.web.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,4BAA4B,CAAC;AA2BhF,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,6BAA6B,GAAG,SAAS,CAI/G"}
+{"version":3,"file":"TypographyLinkWebWrapper.web.d.ts","sourceRoot":"","sources":["../../../src/typography/TypographyLinkWebWrapper.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,4BAA4B,CAAC;AAGhF,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,6BAA6B,GAAG,SAAS,CAM/G"}

package/dist/index-metro.es.android.js

@@ -1,6 +1,6 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import React, { useContext, createContext, forwardRef, useMemo, cloneElement, useRef, useEffect, useState, Children, useReducer, Fragment as Fragment$1, useCallback } from 'react';
+import React, { useContext, createContext, forwardRef, useMemo, cloneElement, useState, useRef, useCallback, useLayoutEffect, useEffect, Children, useReducer, Fragment as Fragment$1 } from 'react';
 import { View as View$1, ScrollView as ScrollView$1, Pressable as Pressable$1, Image as Image$1, FlatList as FlatList$1, SectionList as SectionList$1, Stack as Stack$1, VStack as VStack$1, HStack as HStack$1, Center as Center$1, useBreakpointValue as useBreakpointValue$1, useSx, Text, Input, NativeBaseProvider, extendTheme, useMediaQuery } from 'native-base';
 export { useClipboard, useContrastText, useMediaQuery, useSx, useToken } from 'native-base';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -3634,6 +3634,79 @@ function ButtonContent(_ref) {
   });
 }
 
+function ButtonGauge({
+  duration,
+  running,
+  onEnded
+}) {
+  const [translate, setTranslate] = useState(100);
+  const startTimeRef = useRef(0);
+  const pauseTimeRef = useRef(0);
+  const rafRef = useRef(undefined);
+  const distance = 100;
+  const draw = useCallback(timestamp => {
+    const timeElapsedSinceStart = timestamp - startTimeRef.current;
+    // Since the time between frame is not reliable and regular, we have to
+    // limit the progress to prevent overflows
+    const safeProgress = Math.min(distance * timeElapsedSinceStart / duration, distance);
+    setTranslate(safeProgress);
+    if (safeProgress < distance) {
+      if (!rafRef) return;
+      rafRef.current = requestAnimationFrame(draw);
+      return;
+    }
+    onEnded();
+    if (rafRef.current) {
+      cancelAnimationFrame(rafRef.current);
+    }
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  []);
+  useLayoutEffect(() => {
+    if (running) {
+      // Resuming from pause
+      if (pauseTimeRef.current > 0) {
+        startTimeRef.current += global.performance.now() - pauseTimeRef.current;
+        draw(global.performance.now());
+        return;
+      }
+
+      // First launch
+      startTimeRef.current = global.performance.now();
+      draw(startTimeRef.current);
+    }
+
+    // On pause
+    if (!running && rafRef.current) {
+      pauseTimeRef.current = global.performance.now();
+      cancelAnimationFrame(rafRef.current);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [running]);
+  useEffect(() => {
+    return () => {
+      if (rafRef.current) {
+        cancelAnimationFrame(rafRef.current);
+      }
+    };
+  }, []);
+  return /*#__PURE__*/jsx(View, {
+    position: "absolute",
+    left: 0,
+    right: 0,
+    top: 0,
+    bottom: 0,
+    overflow: "hidden",
+    alignItems: "flex-end",
+    borderRadius: "kitt.button.borderRadius",
+    children: /*#__PURE__*/jsx(View, {
+      width: `${translate}%`,
+      height: "100%",
+      backgroundColor: "kitt.palettes.deepPurple['white-alpha.20']"
+    })
+  });
+}
+
 function ButtonPadding({
   children,
   size,
@@ -3724,6 +3797,7 @@ const Button = /*#__PURE__*/forwardRef(({
   hrefAttrs,
   withBadge,
   badgeCount,
+  timerAttrs,
   accessibilityRole: _accessibilityRole = 'button',
   innerSpacing: _innerSpacing = 'center',
   isHoveredInternal,
@@ -3771,7 +3845,7 @@ const Button = /*#__PURE__*/forwardRef(({
       isHovered,
       isPressed,
       isFocused
-    }) => /*#__PURE__*/jsx(AnimatedContainer$2, {
+    }) => /*#__PURE__*/jsxs(AnimatedContainer$2, {
       animatedStyles: animatedStyles,
       type: _type,
       isHovered: isHovered || isHoveredInternal,
@@ -3781,7 +3855,7 @@ const Button = /*#__PURE__*/forwardRef(({
       size: _size,
       isIconOnly: isIconOnly,
       isStretch: stretch,
-      children: /*#__PURE__*/jsxs(ButtonPadding, {
+      children: [timerAttrs ? /*#__PURE__*/jsx(ButtonGauge, _objectSpread({}, timerAttrs)) : null, /*#__PURE__*/jsxs(ButtonPadding, {
         size: _size,
         isIconOnly: isIconOnly,
         children: [/*#__PURE__*/jsx(ButtonContent, {
@@ -3803,7 +3877,7 @@ const Button = /*#__PURE__*/forwardRef(({
           isHovered: isHovered,
           isPressed: isPressed
         })]
-      })
+      })]
     })
   });
 });
@@ -11701,7 +11775,7 @@ function NavigationBottomSheet({
   snapPoints,
   maxDynamicContentSize,
   isVisible,
-  isExpanded,
+  isExpanded = false,
   onClose
 }) {
   const bottomSheetRef = useBottomSheet();
@@ -11715,7 +11789,8 @@ function NavigationBottomSheet({
     }
   }, [bottomSheetRef, isVisible]);
   useEffect(() => {
-    if (isVisible && isExpanded) {
+    if (!isVisible) return;
+    if (isExpanded) {
       var _bottomSheetRef$curre3;
       (_bottomSheetRef$curre3 = bottomSheetRef.current) === null || _bottomSheetRef$curre3 === void 0 || _bottomSheetRef$curre3.expand();
     } else {