@lmb-it/kitsconcerto-native 0.1.236

package/apps/mobile/src/ui/skeleton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../../../apps/mobile/src/ui/skeleton/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport type { VariantProps } from '@gluestack-ui/utils/nativewind-utils';\nimport { Animated, Easing, Platform, View } from 'react-native';\nimport { skeletonStyle, skeletonTextStyle } from './styles';\n\nexport type ISkeletonProps = React.ComponentProps<typeof View> &\n  VariantProps<typeof skeletonStyle> & {\n    isLoaded?: boolean;\n    startColor?: string;\n    speed?: number | string;\n  };\n\nexport type ISkeletonTextProps = React.ComponentProps<typeof View> &\n  VariantProps<typeof skeletonTextStyle> & {\n    _lines?: number;\n    isLoaded?: boolean;\n    startColor?: string;\n  };\n\nconst Skeleton = forwardRef<\n  React.ComponentRef<typeof Animated.View>,\n  ISkeletonProps\n>(function Skeleton(\n  {\n    className,\n    variant,\n    children,\n    startColor = 'bg-background-200',\n    isLoaded = false,\n    speed = 2,\n    ...props\n  },\n  ref\n) {\n  const pulseAnim = new Animated.Value(1);\n  const customTimingFunction = Easing.bezier(0.4, 0, 0.6, 1);\n  const fadeDuration = 0.6;\n  const animationDuration = (fadeDuration * 10000) / Number(speed); // Convert seconds to milliseconds\n\n  const pulse = Animated.sequence([\n    Animated.timing(pulseAnim, {\n      toValue: 1, // Start with opacity 1\n      duration: animationDuration / 2, // Third of the animation duration\n      easing: customTimingFunction,\n      useNativeDriver: Platform.OS !== 'web',\n    }),\n    Animated.timing(pulseAnim, {\n      toValue: 0.75,\n      duration: animationDuration / 2, // Third of the animation duration\n      easing: customTimingFunction,\n      useNativeDriver: Platform.OS !== 'web',\n    }),\n    Animated.timing(pulseAnim, {\n      toValue: 1,\n      duration: animationDuration / 2, // Third of the animation duration\n      easing: customTimingFunction,\n      useNativeDriver: Platform.OS !== 'web',\n    }),\n  ]);\n\n  if (!isLoaded) {\n    Animated.loop(pulse).start();\n    return (\n      <Animated.View\n        style={{ opacity: pulseAnim }}\n        className={`${startColor} ${skeletonStyle({\n          variant,\n          class: className,\n        })}`}\n        {...props}\n        ref={ref}\n      />\n    );\n  } else {\n    Animated.loop(pulse).stop();\n\n    return children;\n  }\n});\n\nconst SkeletonText = forwardRef<\n  React.ComponentRef<typeof View>,\n  ISkeletonTextProps\n>(function SkeletonText(\n  {\n    className,\n    _lines,\n    isLoaded = false,\n    startColor = 'bg-background-200',\n    gap = 2,\n    children,\n    ...props\n  },\n  ref\n) {\n  if (!isLoaded) {\n    if (_lines) {\n      return (\n        <View\n          className={`${skeletonTextStyle({\n            gap,\n          })}`}\n          ref={ref}\n        >\n          {Array.from({ length: _lines }).map((_, index) => (\n            <Skeleton\n              key={index}\n              className={`${startColor} ${skeletonTextStyle({\n                class: className,\n              })}`}\n              {...props}\n            />\n          ))}\n        </View>\n      );\n    } else {\n      return (\n        <Skeleton\n          className={`${startColor} ${skeletonTextStyle({\n            class: className,\n          })}`}\n          {...props}\n          ref={ref}\n        />\n      );\n    }\n  } else {\n    return children;\n  }\n});\n\nSkeleton.displayName = 'Skeleton';\nSkeletonText.displayName = 'SkeletonText';\n\nexport { Skeleton, SkeletonText };\n"],"names":["Skeleton","SkeletonText"],"mappings":";;;;;AAmBA,MAAM,QAAA,GAAW,UAAA,CAGf,SAASA,SAAAA,CACT;AAAA,EACE,SAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA,GAAa,mBAAA;AAAA,EACb,QAAA,GAAW,KAAA;AAAA,EACX,KAAA,GAAQ,CAAA;AAAA,EACR,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,SAAA,GAAY,IAAI,QAAA,CAAS,KAAA,CAAM,CAAC,CAAA;AACtC,EAAA,MAAM,uBAAuB,MAAA,CAAO,MAAA,CAAO,GAAA,EAAK,CAAA,EAAG,KAAK,CAAC,CAAA;AACzD,EAAA,MAAM,YAAA,GAAe,GAAA;AACrB,EAAA,MAAM,iBAAA,GAAqB,YAAA,GAAe,GAAA,GAAS,MAAA,CAAO,KAAK,CAAA;AAE/D,EAAA,MAAM,KAAA,GAAQ,SAAS,QAAA,CAAS;AAAA,IAC9B,QAAA,CAAS,OAAO,SAAA,EAAW;AAAA,MACzB,OAAA,EAAS,CAAA;AAAA;AAAA,MACT,UAAU,iBAAA,GAAoB,CAAA;AAAA;AAAA,MAC9B,MAAA,EAAQ,oBAAA;AAAA,MACR,eAAA,EAAiB,SAAS,EAAA,KAAO;AAAA,KAClC,CAAA;AAAA,IACD,QAAA,CAAS,OAAO,SAAA,EAAW;AAAA,MACzB,OAAA,EAAS,IAAA;AAAA,MACT,UAAU,iBAAA,GAAoB,CAAA;AAAA;AAAA,MAC9B,MAAA,EAAQ,oBAAA;AAAA,MACR,eAAA,EAAiB,SAAS,EAAA,KAAO;AAAA,KAClC,CAAA;AAAA,IACD,QAAA,CAAS,OAAO,SAAA,EAAW;AAAA,MACzB,OAAA,EAAS,CAAA;AAAA,MACT,UAAU,iBAAA,GAAoB,CAAA;AAAA;AAAA,MAC9B,MAAA,EAAQ,oBAAA;AAAA,MACR,eAAA,EAAiB,SAAS,EAAA,KAAO;AAAA,KAClC;AAAA,GACF,CAAA;AAED,EAAA,IAAI,CAAC,QAAA,EAAU;AACb,IAAA,QAAA,CAAS,IAAA,CAAK,KAAK,CAAA,CAAE,KAAA,EAAM;AAC3B,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA,CAAS,IAAA;AAAA,MAAT;AAAA,QACC,KAAA,EAAO,EAAE,OAAA,EAAS,SAAA,EAAU;AAAA,QAC5B,SAAA,EAAW,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,aAAA,CAAc;AAAA,UACxC,OAAA;AAAA,UACA,KAAA,EAAO;AAAA,SACR,CAAC,CAAA,CAAA;AAAA,QACD,GAAG,KAAA;AAAA,QACJ;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA,MAAO;AACL,IAAA,QAAA,CAAS,IAAA,CAAK,KAAK,CAAA,CAAE,IAAA,EAAK;AAE1B,IAAA,OAAO,QAAA;AAAA,EACT;AACF,CAAC;AAED,MAAM,YAAA,GAAe,UAAA,CAGnB,SAASC,aAAAA,CACT;AAAA,EACE,SAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,UAAA,GAAa,mBAAA;AAAA,EACb,GAAA,GAAM,CAAA;AAAA,EACN,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,IAAI,CAAC,QAAA,EAAU;AACb,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,uBACE,GAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,GAAG,iBAAA,CAAkB;AAAA,YAC9B;AAAA,WACD,CAAC,CAAA,CAAA;AAAA,UACF,GAAA;AAAA,UAEC,QAAA,EAAA,KAAA,CAAM,IAAA,CAAK,EAAE,MAAA,EAAQ,MAAA,EAAQ,CAAA,CAAE,GAAA,CAAI,CAAC,CAAA,EAAG,KAAA,qBACtC,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cAEC,SAAA,EAAW,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,iBAAA,CAAkB;AAAA,gBAC5C,KAAA,EAAO;AAAA,eACR,CAAC,CAAA,CAAA;AAAA,cACD,GAAG;AAAA,aAAA;AAAA,YAJC;AAAA,WAMR;AAAA;AAAA,OACH;AAAA,IAEJ,CAAA,MAAO;AACL,MAAA,uBACE,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,iBAAA,CAAkB;AAAA,YAC5C,KAAA,EAAO;AAAA,WACR,CAAC,CAAA,CAAA;AAAA,UACD,GAAG,KAAA;AAAA,UACJ;AAAA;AAAA,OACF;AAAA,IAEJ;AAAA,EACF,CAAA,MAAO;AACL,IAAA,OAAO,QAAA;AAAA,EACT;AACF,CAAC;AAED,QAAA,CAAS,WAAA,GAAc,UAAA;AACvB,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}

package/apps/mobile/src/ui/skeleton/styles.cjs

@@ -0,0 +1,41 @@
+'use strict';
+
+var nativewindUtils = require('@gluestack-ui/utils/nativewind-utils');
+
+const skeletonStyle = nativewindUtils.tva({
+  base: "w-full h-full",
+  variants: {
+    variant: {
+      sharp: "rounded-none",
+      circular: "rounded-full",
+      rounded: "rounded-md"
+    },
+    speed: {
+      1: "duration-75",
+      2: "duration-100",
+      3: "duration-150",
+      4: "duration-200"
+    }
+  }
+});
+const skeletonTextStyle = nativewindUtils.tva({
+  base: "rounded-sm w-full",
+  variants: {
+    speed: {
+      1: "duration-75",
+      2: "duration-100",
+      3: "duration-150",
+      4: "duration-200"
+    },
+    gap: {
+      1: "gap-1",
+      2: "gap-2",
+      3: "gap-3",
+      4: "gap-4"
+    }
+  }
+});
+
+exports.skeletonStyle = skeletonStyle;
+exports.skeletonTextStyle = skeletonTextStyle;
+//# sourceMappingURL=styles.cjs.map

package/apps/mobile/src/ui/skeleton/styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.cjs","sources":["../../../../../../../../../apps/mobile/src/ui/skeleton/styles.tsx"],"sourcesContent":["import { tva } from '@gluestack-ui/utils/nativewind-utils';\n\nexport const skeletonStyle = tva({\n  base: 'w-full h-full',\n  variants: {\n    variant: {\n      sharp: 'rounded-none',\n      circular: 'rounded-full',\n      rounded: 'rounded-md',\n    },\n    speed: {\n      1: 'duration-75',\n      2: 'duration-100',\n      3: 'duration-150',\n      4: 'duration-200',\n    },\n  },\n});\nexport const skeletonTextStyle = tva({\n  base: 'rounded-sm w-full',\n  variants: {\n    speed: {\n      1: 'duration-75',\n      2: 'duration-100',\n      3: 'duration-150',\n      4: 'duration-200',\n    },\n    gap: {\n      1: 'gap-1',\n      2: 'gap-2',\n      3: 'gap-3',\n      4: 'gap-4',\n    },\n  },\n});\n"],"names":["tva"],"mappings":";;;;AAEO,MAAM,gBAAgBA,mBAAA,CAAI;AAAA,EAC/B,IAAA,EAAM,eAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,cAAA;AAAA,MACP,QAAA,EAAU,cAAA;AAAA,MACV,OAAA,EAAS;AAAA,KACX;AAAA,IACA,KAAA,EAAO;AAAA,MACL,CAAA,EAAG,aAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG;AAAA;AACL;AAEJ,CAAC;AACM,MAAM,oBAAoBA,mBAAA,CAAI;AAAA,EACnC,IAAA,EAAM,mBAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA,MACL,CAAA,EAAG,aAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG;AAAA,KACL;AAAA,IACA,GAAA,EAAK;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG;AAAA;AACL;AAEJ,CAAC;;;;;"}

package/apps/mobile/src/ui/skeleton/styles.js

@@ -0,0 +1,38 @@
+import { tva } from '@gluestack-ui/utils/nativewind-utils';
+
+const skeletonStyle = tva({
+  base: "w-full h-full",
+  variants: {
+    variant: {
+      sharp: "rounded-none",
+      circular: "rounded-full",
+      rounded: "rounded-md"
+    },
+    speed: {
+      1: "duration-75",
+      2: "duration-100",
+      3: "duration-150",
+      4: "duration-200"
+    }
+  }
+});
+const skeletonTextStyle = tva({
+  base: "rounded-sm w-full",
+  variants: {
+    speed: {
+      1: "duration-75",
+      2: "duration-100",
+      3: "duration-150",
+      4: "duration-200"
+    },
+    gap: {
+      1: "gap-1",
+      2: "gap-2",
+      3: "gap-3",
+      4: "gap-4"
+    }
+  }
+});
+
+export { skeletonStyle, skeletonTextStyle };
+//# sourceMappingURL=styles.js.map

package/apps/mobile/src/ui/skeleton/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../../../../apps/mobile/src/ui/skeleton/styles.tsx"],"sourcesContent":["import { tva } from '@gluestack-ui/utils/nativewind-utils';\n\nexport const skeletonStyle = tva({\n  base: 'w-full h-full',\n  variants: {\n    variant: {\n      sharp: 'rounded-none',\n      circular: 'rounded-full',\n      rounded: 'rounded-md',\n    },\n    speed: {\n      1: 'duration-75',\n      2: 'duration-100',\n      3: 'duration-150',\n      4: 'duration-200',\n    },\n  },\n});\nexport const skeletonTextStyle = tva({\n  base: 'rounded-sm w-full',\n  variants: {\n    speed: {\n      1: 'duration-75',\n      2: 'duration-100',\n      3: 'duration-150',\n      4: 'duration-200',\n    },\n    gap: {\n      1: 'gap-1',\n      2: 'gap-2',\n      3: 'gap-3',\n      4: 'gap-4',\n    },\n  },\n});\n"],"names":[],"mappings":";;AAEO,MAAM,gBAAgB,GAAA,CAAI;AAAA,EAC/B,IAAA,EAAM,eAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,cAAA;AAAA,MACP,QAAA,EAAU,cAAA;AAAA,MACV,OAAA,EAAS;AAAA,KACX;AAAA,IACA,KAAA,EAAO;AAAA,MACL,CAAA,EAAG,aAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG;AAAA;AACL;AAEJ,CAAC;AACM,MAAM,oBAAoB,GAAA,CAAI;AAAA,EACnC,IAAA,EAAM,mBAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA,MACL,CAAA,EAAG,aAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG,cAAA;AAAA,MACH,CAAA,EAAG;AAAA,KACL;AAAA,IACA,GAAA,EAAK;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG;AAAA;AACL;AAEJ,CAAC;;;;"}

package/apps/mobile/src/ui/slider/index.cjs

@@ -0,0 +1,225 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var creator = require('@gluestack-ui/core/slider/creator');
+var reactNative = require('react-native');
+var React = require('react');
+var nativewindUtils = require('@gluestack-ui/utils/nativewind-utils');
+var nativewind = require('nativewind');
+
+const SCOPE = "SLIDER";
+const Root = nativewindUtils.withStyleContext(reactNative.View, SCOPE);
+const UISlider = creator.createSlider({
+  Root,
+  Thumb: reactNative.View,
+  Track: reactNative.Pressable,
+  FilledTrack: reactNative.View,
+  ThumbInteraction: reactNative.View
+});
+nativewind.cssInterop(UISlider.Track, { className: "style" });
+const sliderStyle = nativewindUtils.tva({
+  base: "justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:web:pointer-events-none",
+  variants: {
+    orientation: {
+      horizontal: "w-full",
+      vertical: "h-full"
+    },
+    size: {
+      sm: "",
+      md: "",
+      lg: ""
+    },
+    isReversed: {
+      true: "",
+      false: ""
+    }
+  }
+});
+const sliderThumbStyle = nativewindUtils.tva({
+  base: "bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 web:cursor-pointer web:data-[active=true]:outline web:data-[active=true]:outline-4 web:data-[active=true]:outline-primary-400 shadow-hard-1",
+  parentVariants: {
+    size: {
+      sm: "h-4 w-4",
+      md: "h-5 w-5",
+      lg: "h-6 w-6"
+    }
+  }
+});
+const sliderTrackStyle = nativewindUtils.tva({
+  base: "bg-background-300 rounded-lg overflow-hidden",
+  parentVariants: {
+    orientation: {
+      horizontal: "w-full",
+      vertical: "h-full"
+    },
+    isReversed: {
+      true: "",
+      false: ""
+    },
+    size: {
+      sm: "",
+      md: "",
+      lg: ""
+    }
+  },
+  parentCompoundVariants: [
+    {
+      orientation: "horizontal",
+      size: "sm",
+      class: "h-1 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "sm",
+      isReversed: true,
+      class: "h-1 flex-row-reverse"
+    },
+    {
+      orientation: "horizontal",
+      size: "md",
+      class: "h-1 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "md",
+      isReversed: true,
+      class: "h-[5px] flex-row-reverse"
+    },
+    {
+      orientation: "horizontal",
+      size: "lg",
+      class: "h-1.5 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "lg",
+      isReversed: true,
+      class: "h-1.5 flex-row-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "sm",
+      class: "w-1 flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "sm",
+      isReversed: true,
+      class: "w-1 flex-col"
+    },
+    {
+      orientation: "vertical",
+      size: "md",
+      class: "w-[5px] flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "md",
+      isReversed: true,
+      class: "w-[5px] flex-col"
+    },
+    {
+      orientation: "vertical",
+      size: "lg",
+      class: "w-1.5 flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "lg",
+      isReversed: true,
+      class: "w-1.5 flex-col"
+    }
+  ]
+});
+const sliderFilledTrackStyle = nativewindUtils.tva({
+  base: "bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600",
+  parentVariants: {
+    orientation: {
+      horizontal: "h-full",
+      vertical: "w-full"
+    }
+  }
+});
+React.forwardRef(function Slider2({
+  //@ts-ignore
+  className,
+  //@ts-ignore
+  size = "md",
+  orientation = "horizontal",
+  isReversed = false,
+  ...props
+}, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UISlider,
+    {
+      ref,
+      isReversed,
+      orientation,
+      ...props,
+      className: sliderStyle({
+        orientation,
+        isReversed,
+        class: className
+      }),
+      context: { size, orientation, isReversed }
+    }
+  );
+});
+React.forwardRef(function SliderThumb2({ className, size, ...props }, ref) {
+  const { size: parentSize } = nativewindUtils.useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UISlider.Thumb,
+    {
+      ref,
+      ...props,
+      className: sliderThumbStyle({
+        parentVariants: {
+          size: parentSize
+        },
+        size,
+        class: className
+      })
+    }
+  );
+});
+React.forwardRef(function SliderTrack2({ className, ...props }, ref) {
+  const {
+    orientation: parentOrientation,
+    size: parentSize,
+    isReversed
+  } = nativewindUtils.useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UISlider.Track,
+    {
+      ref,
+      ...props,
+      className: sliderTrackStyle({
+        parentVariants: {
+          orientation: parentOrientation,
+          size: parentSize,
+          isReversed
+        },
+        class: className
+      })
+    }
+  );
+});
+React.forwardRef(function SliderFilledTrack2({ className, ...props }, ref) {
+  const { orientation: parentOrientation } = nativewindUtils.useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    UISlider.FilledTrack,
+    {
+      ref,
+      ...props,
+      className: sliderFilledTrackStyle({
+        parentVariants: {
+          orientation: parentOrientation
+        },
+        class: className
+      })
+    }
+  );
+});
+
+exports.UISlider = UISlider;
+//# sourceMappingURL=index.cjs.map

package/apps/mobile/src/ui/slider/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../../../../../apps/mobile/src/ui/slider/index.tsx"],"sourcesContent":["'use client';\nimport { createSlider, ISliderProps } from '@gluestack-ui/core/slider/creator';\nimport { Pressable } from 'react-native';\nimport { View } from 'react-native';\nimport React from 'react';\nimport { tva } from '@gluestack-ui/utils/nativewind-utils';\nimport {\n  withStyleContext,\n  useStyleContext,\n} from '@gluestack-ui/utils/nativewind-utils';\nimport type { VariantProps } from '@gluestack-ui/utils/nativewind-utils';\nimport { cssInterop } from 'nativewind';\n\nconst SCOPE = 'SLIDER';\nconst Root = withStyleContext(View, SCOPE);\nexport const UISlider = createSlider({\n  Root: Root,\n  Thumb: View,\n  Track: Pressable,\n  FilledTrack: View,\n  ThumbInteraction: View,\n});\n\ncssInterop(UISlider.Track, { className: 'style' });\n\nconst sliderStyle = tva({\n  base: 'justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:web:pointer-events-none',\n  variants: {\n    orientation: {\n      horizontal: 'w-full',\n      vertical: 'h-full',\n    },\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n    isReversed: {\n      true: '',\n      false: '',\n    },\n  },\n});\n\nconst sliderThumbStyle = tva({\n  base: 'bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 web:cursor-pointer web:data-[active=true]:outline web:data-[active=true]:outline-4 web:data-[active=true]:outline-primary-400 shadow-hard-1',\n\n  parentVariants: {\n    size: {\n      sm: 'h-4 w-4',\n      md: 'h-5 w-5',\n      lg: 'h-6 w-6',\n    },\n  },\n});\n\nconst sliderTrackStyle = tva({\n  base: 'bg-background-300 rounded-lg overflow-hidden',\n  parentVariants: {\n    orientation: {\n      horizontal: 'w-full',\n      vertical: 'h-full',\n    },\n    isReversed: {\n      true: '',\n      false: '',\n    },\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n  },\n  parentCompoundVariants: [\n    {\n      orientation: 'horizontal',\n      size: 'sm',\n      class: 'h-1 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'sm',\n      isReversed: true,\n      class: 'h-1 flex-row-reverse',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'md',\n      class: 'h-1 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'md',\n      isReversed: true,\n      class: 'h-[5px] flex-row-reverse',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'lg',\n      class: 'h-1.5 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'lg',\n      isReversed: true,\n      class: 'h-1.5 flex-row-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'sm',\n      class: 'w-1 flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'sm',\n      isReversed: true,\n      class: 'w-1 flex-col',\n    },\n    {\n      orientation: 'vertical',\n      size: 'md',\n      class: 'w-[5px] flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'md',\n      isReversed: true,\n      class: 'w-[5px] flex-col',\n    },\n    {\n      orientation: 'vertical',\n      size: 'lg',\n      class: 'w-1.5 flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'lg',\n      isReversed: true,\n      class: 'w-1.5 flex-col',\n    },\n  ],\n});\n\nconst sliderFilledTrackStyle = tva({\n  base: 'bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600',\n  parentVariants: {\n    orientation: {\n      horizontal: 'h-full',\n      vertical: 'w-full',\n    },\n  },\n});\n\nexport type SliderProps = React.ComponentProps<typeof UISlider> &\n  VariantProps<typeof sliderStyle>;\n\nconst Slider = React.forwardRef<\n  React.ComponentRef<typeof UISlider>,\n  ISliderProps\n>(function Slider(\n  {\n    //@ts-ignore\n    className,\n    //@ts-ignore\n    size = 'md',\n    orientation = 'horizontal',\n    isReversed = false,\n    ...props\n  },\n  ref\n) {\n  return (\n    <UISlider\n      ref={ref}\n      isReversed={isReversed}\n      orientation={orientation}\n      {...props}\n      className={sliderStyle({\n        orientation,\n        isReversed,\n        class: className,\n      })}\n      context={{ size, orientation, isReversed }}\n    />\n  );\n});\n\nexport type ISliderThumbProps = React.ComponentProps<typeof UISlider.Thumb> &\n  VariantProps<typeof sliderThumbStyle>;\n\nconst SliderThumb = React.forwardRef<\n  React.ComponentRef<typeof UISlider.Thumb>,\n  ISliderThumbProps\n>(function SliderThumb({ className, size, ...props }, ref) {\n  const { size: parentSize } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.Thumb\n      ref={ref}\n      {...props}\n      className={sliderThumbStyle({\n        parentVariants: {\n          size: parentSize,\n        },\n        size,\n        class: className,\n      })}\n    />\n  );\n});\n\nexport type ISliderTrackProps = React.ComponentProps<typeof UISlider.Track> &\n  VariantProps<typeof sliderTrackStyle>;\n\nconst SliderTrack = React.forwardRef<\n  React.ComponentRef<typeof UISlider.Track>,\n  ISliderTrackProps\n>(function SliderTrack({ className, ...props }, ref) {\n  const {\n    orientation: parentOrientation,\n    size: parentSize,\n    isReversed,\n  } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.Track\n      ref={ref}\n      {...props}\n      className={sliderTrackStyle({\n        parentVariants: {\n          orientation: parentOrientation,\n          size: parentSize,\n          isReversed,\n        },\n        class: className,\n      })}\n    />\n  );\n});\n\nexport type ISliderFilledTrackProps = React.ComponentProps<\n  typeof UISlider.FilledTrack\n> &\n  VariantProps<typeof sliderFilledTrackStyle>;\n\nconst SliderFilledTrack = React.forwardRef<\n  React.ComponentRef<typeof UISlider.FilledTrack>,\n  ISliderFilledTrackProps\n>(function SliderFilledTrack({ className, ...props }, ref) {\n  const { orientation: parentOrientation } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.FilledTrack\n      ref={ref}\n      {...props}\n      className={sliderFilledTrackStyle({\n        parentVariants: {\n          orientation: parentOrientation,\n        },\n        class: className,\n      })}\n    />\n  );\n});\n\nexport { Slider, SliderThumb, SliderTrack, SliderFilledTrack };\n"],"names":["withStyleContext","View","createSlider","Pressable","cssInterop","tva","Slider","jsx","SliderThumb","useStyleContext","SliderTrack","SliderFilledTrack"],"mappings":"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"}

package/apps/mobile/src/ui/slider/index.js

@@ -0,0 +1,223 @@
+import { jsx } from 'react/jsx-runtime';
+import { createSlider } from '@gluestack-ui/core/slider/creator';
+import { View, Pressable } from 'react-native';
+import React from 'react';
+import { withStyleContext, tva, useStyleContext } from '@gluestack-ui/utils/nativewind-utils';
+import { cssInterop } from 'nativewind';
+
+const SCOPE = "SLIDER";
+const Root = withStyleContext(View, SCOPE);
+const UISlider = createSlider({
+  Root,
+  Thumb: View,
+  Track: Pressable,
+  FilledTrack: View,
+  ThumbInteraction: View
+});
+cssInterop(UISlider.Track, { className: "style" });
+const sliderStyle = tva({
+  base: "justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:web:pointer-events-none",
+  variants: {
+    orientation: {
+      horizontal: "w-full",
+      vertical: "h-full"
+    },
+    size: {
+      sm: "",
+      md: "",
+      lg: ""
+    },
+    isReversed: {
+      true: "",
+      false: ""
+    }
+  }
+});
+const sliderThumbStyle = tva({
+  base: "bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 web:cursor-pointer web:data-[active=true]:outline web:data-[active=true]:outline-4 web:data-[active=true]:outline-primary-400 shadow-hard-1",
+  parentVariants: {
+    size: {
+      sm: "h-4 w-4",
+      md: "h-5 w-5",
+      lg: "h-6 w-6"
+    }
+  }
+});
+const sliderTrackStyle = tva({
+  base: "bg-background-300 rounded-lg overflow-hidden",
+  parentVariants: {
+    orientation: {
+      horizontal: "w-full",
+      vertical: "h-full"
+    },
+    isReversed: {
+      true: "",
+      false: ""
+    },
+    size: {
+      sm: "",
+      md: "",
+      lg: ""
+    }
+  },
+  parentCompoundVariants: [
+    {
+      orientation: "horizontal",
+      size: "sm",
+      class: "h-1 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "sm",
+      isReversed: true,
+      class: "h-1 flex-row-reverse"
+    },
+    {
+      orientation: "horizontal",
+      size: "md",
+      class: "h-1 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "md",
+      isReversed: true,
+      class: "h-[5px] flex-row-reverse"
+    },
+    {
+      orientation: "horizontal",
+      size: "lg",
+      class: "h-1.5 flex-row"
+    },
+    {
+      orientation: "horizontal",
+      size: "lg",
+      isReversed: true,
+      class: "h-1.5 flex-row-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "sm",
+      class: "w-1 flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "sm",
+      isReversed: true,
+      class: "w-1 flex-col"
+    },
+    {
+      orientation: "vertical",
+      size: "md",
+      class: "w-[5px] flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "md",
+      isReversed: true,
+      class: "w-[5px] flex-col"
+    },
+    {
+      orientation: "vertical",
+      size: "lg",
+      class: "w-1.5 flex-col-reverse"
+    },
+    {
+      orientation: "vertical",
+      size: "lg",
+      isReversed: true,
+      class: "w-1.5 flex-col"
+    }
+  ]
+});
+const sliderFilledTrackStyle = tva({
+  base: "bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600",
+  parentVariants: {
+    orientation: {
+      horizontal: "h-full",
+      vertical: "w-full"
+    }
+  }
+});
+React.forwardRef(function Slider2({
+  //@ts-ignore
+  className,
+  //@ts-ignore
+  size = "md",
+  orientation = "horizontal",
+  isReversed = false,
+  ...props
+}, ref) {
+  return /* @__PURE__ */ jsx(
+    UISlider,
+    {
+      ref,
+      isReversed,
+      orientation,
+      ...props,
+      className: sliderStyle({
+        orientation,
+        isReversed,
+        class: className
+      }),
+      context: { size, orientation, isReversed }
+    }
+  );
+});
+React.forwardRef(function SliderThumb2({ className, size, ...props }, ref) {
+  const { size: parentSize } = useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsx(
+    UISlider.Thumb,
+    {
+      ref,
+      ...props,
+      className: sliderThumbStyle({
+        parentVariants: {
+          size: parentSize
+        },
+        size,
+        class: className
+      })
+    }
+  );
+});
+React.forwardRef(function SliderTrack2({ className, ...props }, ref) {
+  const {
+    orientation: parentOrientation,
+    size: parentSize,
+    isReversed
+  } = useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsx(
+    UISlider.Track,
+    {
+      ref,
+      ...props,
+      className: sliderTrackStyle({
+        parentVariants: {
+          orientation: parentOrientation,
+          size: parentSize,
+          isReversed
+        },
+        class: className
+      })
+    }
+  );
+});
+React.forwardRef(function SliderFilledTrack2({ className, ...props }, ref) {
+  const { orientation: parentOrientation } = useStyleContext(SCOPE);
+  return /* @__PURE__ */ jsx(
+    UISlider.FilledTrack,
+    {
+      ref,
+      ...props,
+      className: sliderFilledTrackStyle({
+        parentVariants: {
+          orientation: parentOrientation
+        },
+        class: className
+      })
+    }
+  );
+});
+
+export { UISlider };
+//# sourceMappingURL=index.js.map

package/apps/mobile/src/ui/slider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../../../apps/mobile/src/ui/slider/index.tsx"],"sourcesContent":["'use client';\nimport { createSlider, ISliderProps } from '@gluestack-ui/core/slider/creator';\nimport { Pressable } from 'react-native';\nimport { View } from 'react-native';\nimport React from 'react';\nimport { tva } from '@gluestack-ui/utils/nativewind-utils';\nimport {\n  withStyleContext,\n  useStyleContext,\n} from '@gluestack-ui/utils/nativewind-utils';\nimport type { VariantProps } from '@gluestack-ui/utils/nativewind-utils';\nimport { cssInterop } from 'nativewind';\n\nconst SCOPE = 'SLIDER';\nconst Root = withStyleContext(View, SCOPE);\nexport const UISlider = createSlider({\n  Root: Root,\n  Thumb: View,\n  Track: Pressable,\n  FilledTrack: View,\n  ThumbInteraction: View,\n});\n\ncssInterop(UISlider.Track, { className: 'style' });\n\nconst sliderStyle = tva({\n  base: 'justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:web:pointer-events-none',\n  variants: {\n    orientation: {\n      horizontal: 'w-full',\n      vertical: 'h-full',\n    },\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n    isReversed: {\n      true: '',\n      false: '',\n    },\n  },\n});\n\nconst sliderThumbStyle = tva({\n  base: 'bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 web:cursor-pointer web:data-[active=true]:outline web:data-[active=true]:outline-4 web:data-[active=true]:outline-primary-400 shadow-hard-1',\n\n  parentVariants: {\n    size: {\n      sm: 'h-4 w-4',\n      md: 'h-5 w-5',\n      lg: 'h-6 w-6',\n    },\n  },\n});\n\nconst sliderTrackStyle = tva({\n  base: 'bg-background-300 rounded-lg overflow-hidden',\n  parentVariants: {\n    orientation: {\n      horizontal: 'w-full',\n      vertical: 'h-full',\n    },\n    isReversed: {\n      true: '',\n      false: '',\n    },\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n  },\n  parentCompoundVariants: [\n    {\n      orientation: 'horizontal',\n      size: 'sm',\n      class: 'h-1 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'sm',\n      isReversed: true,\n      class: 'h-1 flex-row-reverse',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'md',\n      class: 'h-1 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'md',\n      isReversed: true,\n      class: 'h-[5px] flex-row-reverse',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'lg',\n      class: 'h-1.5 flex-row',\n    },\n    {\n      orientation: 'horizontal',\n      size: 'lg',\n      isReversed: true,\n      class: 'h-1.5 flex-row-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'sm',\n      class: 'w-1 flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'sm',\n      isReversed: true,\n      class: 'w-1 flex-col',\n    },\n    {\n      orientation: 'vertical',\n      size: 'md',\n      class: 'w-[5px] flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'md',\n      isReversed: true,\n      class: 'w-[5px] flex-col',\n    },\n    {\n      orientation: 'vertical',\n      size: 'lg',\n      class: 'w-1.5 flex-col-reverse',\n    },\n    {\n      orientation: 'vertical',\n      size: 'lg',\n      isReversed: true,\n      class: 'w-1.5 flex-col',\n    },\n  ],\n});\n\nconst sliderFilledTrackStyle = tva({\n  base: 'bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600',\n  parentVariants: {\n    orientation: {\n      horizontal: 'h-full',\n      vertical: 'w-full',\n    },\n  },\n});\n\nexport type SliderProps = React.ComponentProps<typeof UISlider> &\n  VariantProps<typeof sliderStyle>;\n\nconst Slider = React.forwardRef<\n  React.ComponentRef<typeof UISlider>,\n  ISliderProps\n>(function Slider(\n  {\n    //@ts-ignore\n    className,\n    //@ts-ignore\n    size = 'md',\n    orientation = 'horizontal',\n    isReversed = false,\n    ...props\n  },\n  ref\n) {\n  return (\n    <UISlider\n      ref={ref}\n      isReversed={isReversed}\n      orientation={orientation}\n      {...props}\n      className={sliderStyle({\n        orientation,\n        isReversed,\n        class: className,\n      })}\n      context={{ size, orientation, isReversed }}\n    />\n  );\n});\n\nexport type ISliderThumbProps = React.ComponentProps<typeof UISlider.Thumb> &\n  VariantProps<typeof sliderThumbStyle>;\n\nconst SliderThumb = React.forwardRef<\n  React.ComponentRef<typeof UISlider.Thumb>,\n  ISliderThumbProps\n>(function SliderThumb({ className, size, ...props }, ref) {\n  const { size: parentSize } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.Thumb\n      ref={ref}\n      {...props}\n      className={sliderThumbStyle({\n        parentVariants: {\n          size: parentSize,\n        },\n        size,\n        class: className,\n      })}\n    />\n  );\n});\n\nexport type ISliderTrackProps = React.ComponentProps<typeof UISlider.Track> &\n  VariantProps<typeof sliderTrackStyle>;\n\nconst SliderTrack = React.forwardRef<\n  React.ComponentRef<typeof UISlider.Track>,\n  ISliderTrackProps\n>(function SliderTrack({ className, ...props }, ref) {\n  const {\n    orientation: parentOrientation,\n    size: parentSize,\n    isReversed,\n  } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.Track\n      ref={ref}\n      {...props}\n      className={sliderTrackStyle({\n        parentVariants: {\n          orientation: parentOrientation,\n          size: parentSize,\n          isReversed,\n        },\n        class: className,\n      })}\n    />\n  );\n});\n\nexport type ISliderFilledTrackProps = React.ComponentProps<\n  typeof UISlider.FilledTrack\n> &\n  VariantProps<typeof sliderFilledTrackStyle>;\n\nconst SliderFilledTrack = React.forwardRef<\n  React.ComponentRef<typeof UISlider.FilledTrack>,\n  ISliderFilledTrackProps\n>(function SliderFilledTrack({ className, ...props }, ref) {\n  const { orientation: parentOrientation } = useStyleContext(SCOPE);\n\n  return (\n    <UISlider.FilledTrack\n      ref={ref}\n      {...props}\n      className={sliderFilledTrackStyle({\n        parentVariants: {\n          orientation: parentOrientation,\n        },\n        class: className,\n      })}\n    />\n  );\n});\n\nexport { Slider, SliderThumb, SliderTrack, SliderFilledTrack };\n"],"names":["Slider","SliderThumb","SliderTrack","SliderFilledTrack"],"mappings":"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"}

package/apps/mobile/src/ui/spinner/index.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactNative = require('react-native');
+var React = require('react');
+var nativewindUtils = require('@gluestack-ui/utils/nativewind-utils');
+var nativewind = require('nativewind');
+
+nativewind.cssInterop(reactNative.ActivityIndicator, {
+  className: { target: "style", nativeStyleToProp: { color: true } }
+});
+const spinnerStyle = nativewindUtils.tva({});
+const Spinner = React.forwardRef(function Spinner2({
+  className,
+  color,
+  focusable = false,
+  "aria-label": ariaLabel = "loading",
+  ...props
+}, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.ActivityIndicator,
+    {
+      ref,
+      focusable,
+      "aria-label": ariaLabel,
+      ...props,
+      color,
+      className: spinnerStyle({ class: className })
+    }
+  );
+});
+Spinner.displayName = "Spinner";
+
+exports.Spinner = Spinner;
+//# sourceMappingURL=index.cjs.map

package/apps/mobile/src/ui/spinner/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../../../../../../apps/mobile/src/ui/spinner/index.tsx"],"sourcesContent":["'use client';\nimport { ActivityIndicator } from 'react-native';\nimport React from 'react';\nimport { tva } from '@gluestack-ui/utils/nativewind-utils';\nimport { cssInterop } from 'nativewind';\n\ncssInterop(ActivityIndicator, {\n  className: { target: 'style', nativeStyleToProp: { color: true } },\n});\n\nconst spinnerStyle = tva({});\n\nconst Spinner = React.forwardRef<\n  React.ComponentRef<typeof ActivityIndicator>,\n  React.ComponentProps<typeof ActivityIndicator>\n>(function Spinner(\n  {\n    className,\n    color,\n    focusable = false,\n    'aria-label': ariaLabel = 'loading',\n    ...props\n  },\n  ref\n) {\n  return (\n    <ActivityIndicator\n      ref={ref}\n      focusable={focusable}\n      aria-label={ariaLabel}\n      {...props}\n      color={color}\n      className={spinnerStyle({ class: className })}\n    />\n  );\n});\n\nSpinner.displayName = 'Spinner';\n\nexport { Spinner };\n"],"names":["cssInterop","ActivityIndicator","tva","Spinner","jsx"],"mappings":";;;;;;;;AAMAA,qBAAA,CAAWC,6BAAA,EAAmB;AAAA,EAC5B,SAAA,EAAW,EAAE,MAAA,EAAQ,OAAA,EAAS,mBAAmB,EAAE,KAAA,EAAO,MAAK;AACjE,CAAC,CAAA;AAED,MAAM,YAAA,GAAeC,mBAAA,CAAI,EAAE,CAAA;AAE3B,MAAM,OAAA,GAAU,KAAA,CAAM,UAAA,CAGpB,SAASC,QAAAA,CACT;AAAA,EACE,SAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,cAAc,SAAA,GAAY,SAAA;AAAA,EAC1B,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,uBACEC,cAAA;AAAA,IAACH,6BAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA,EAAY,SAAA;AAAA,MACX,GAAG,KAAA;AAAA,MACJ,KAAA;AAAA,MACA,SAAA,EAAW,YAAA,CAAa,EAAE,KAAA,EAAO,WAAW;AAAA;AAAA,GAC9C;AAEJ,CAAC;AAED,OAAA,CAAQ,WAAA,GAAc,SAAA;;;;"}