@tamagui/slider 2.0.0-1769546410712 → 2.0.0-1769573246601

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/slider",
-  "version": "2.0.0-1769546410712",
+  "version": "2.0.0-1769573246601",
   "type": "module",
   "sideEffects": [
     "*.css"
@@ -39,23 +39,23 @@
     }
   },
   "dependencies": {
-    "@tamagui/compose-refs": "2.0.0-1769546410712",
-    "@tamagui/constants": "2.0.0-1769546410712",
-    "@tamagui/core": "2.0.0-1769546410712",
-    "@tamagui/create-context": "2.0.0-1769546410712",
-    "@tamagui/get-token": "2.0.0-1769546410712",
-    "@tamagui/helpers": "2.0.0-1769546410712",
-    "@tamagui/stacks": "2.0.0-1769546410712",
-    "@tamagui/use-controllable-state": "2.0.0-1769546410712",
-    "@tamagui/use-debounce": "2.0.0-1769546410712",
-    "@tamagui/use-direction": "2.0.0-1769546410712"
+    "@tamagui/compose-refs": "2.0.0-1769573246601",
+    "@tamagui/constants": "2.0.0-1769573246601",
+    "@tamagui/core": "2.0.0-1769573246601",
+    "@tamagui/create-context": "2.0.0-1769573246601",
+    "@tamagui/get-token": "2.0.0-1769573246601",
+    "@tamagui/helpers": "2.0.0-1769573246601",
+    "@tamagui/stacks": "2.0.0-1769573246601",
+    "@tamagui/use-controllable-state": "2.0.0-1769573246601",
+    "@tamagui/use-debounce": "2.0.0-1769573246601",
+    "@tamagui/use-direction": "2.0.0-1769573246601"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "2.0.0-1769546410712",
+    "@tamagui/build": "2.0.0-1769573246601",
     "react": "*",
     "react-native": "0.81.5"
   },

package/src/Slider.tsx

@@ -299,12 +299,10 @@ const SliderVertical = React.forwardRef<View, SliderVerticalProps>(
  * SliderTrack
  * -----------------------------------------------------------------------------------------------*/
 
-const TRACK_NAME = 'SliderTrack'
-
 type SliderTrackElement = TamaguiElement
 
 export const SliderTrackFrame = styled(SliderFrame, {
-  name: 'SliderTrack',
+  name: 'Slider',
 
   variants: {
     unstyled: {
@@ -325,7 +323,7 @@ export const SliderTrackFrame = styled(SliderFrame, {
 })
 
 const SliderTrack = React.forwardRef<SliderTrackElement, SliderTrackProps>(
-  (props: ScopedProps<SliderTrackProps>, forwardedRef) => {
+  function SliderTrack(props: ScopedProps<SliderTrackProps>, forwardedRef) {
     const { __scopeSlider, ...trackProps } = props
     const context = useSliderContext(__scopeSlider)
     return (
@@ -341,23 +339,19 @@ const SliderTrack = React.forwardRef<SliderTrackElement, SliderTrackProps>(
   }
 )
 
-SliderTrack.displayName = TRACK_NAME
-
 /* -------------------------------------------------------------------------------------------------
- * SliderTrackActive
+ * SliderActive
  * -----------------------------------------------------------------------------------------------*/
 
-const RANGE_NAME = 'SliderTrackActive'
-
-export const SliderTrackActiveFrame = styled(SliderFrame, {
-  name: 'SliderTrackActive',
+export const SliderActiveFrame = styled(SliderFrame, {
+  name: 'SliderActive',
   position: 'absolute',
   pointerEvents: 'box-none',
 
   variants: {
     unstyled: {
       false: {
-        backgroundColor: '$backgroundActive',
+        backgroundColor: '$background',
         borderRadius: 100_000,
       },
     },
@@ -368,49 +362,48 @@ export const SliderTrackActiveFrame = styled(SliderFrame, {
   },
 })
 
-type SliderTrackActiveProps = GetProps<typeof SliderTrackActiveFrame>
-
-const SliderTrackActive = React.forwardRef<View, SliderTrackActiveProps>(
-  (props: ScopedProps<SliderTrackActiveProps>, forwardedRef) => {
-    const { __scopeSlider, ...rangeProps } = props
-    const context = useSliderContext(__scopeSlider)
-    const orientation = useSliderOrientationContext(__scopeSlider)
-    const ref = React.useRef<View>(null)
-    const composedRefs = useComposedRefs(forwardedRef, ref)
-    const valuesCount = context.values.length
-    const percentages = context.values.map((value) =>
-      convertValueToPercentage(value, context.min, context.max)
-    )
-    const offsetStart = valuesCount > 1 ? Math.min(...percentages) : 0
-    const offsetEnd = 100 - Math.max(...percentages)
-
-    return (
-      <SliderTrackActiveFrame
-        orientation={context.orientation}
-        data-orientation={context.orientation}
-        data-disabled={context.disabled ? '' : undefined}
-        size={context.size}
-        animateOnly={['left', 'top', 'right', 'bottom']}
-        {...rangeProps}
-        ref={composedRefs}
-        {...{
-          [orientation.startEdge]: `${offsetStart}%`,
-          [orientation.endEdge]: `${offsetEnd}%`,
-        }}
-        {...(orientation.sizeProp === 'width'
-          ? {
-              height: '100%',
-            }
-          : {
-              left: 0,
-              right: 0,
-            })}
-      />
-    )
-  }
-)
-
-SliderTrackActive.displayName = RANGE_NAME
+type SliderActiveProps = GetProps<typeof SliderActiveFrame>
+
+const SliderActive = React.forwardRef<View, SliderActiveProps>(function SliderActive(
+  props: ScopedProps<SliderActiveProps>,
+  forwardedRef
+) {
+  const { __scopeSlider, ...rangeProps } = props
+  const context = useSliderContext(__scopeSlider)
+  const orientation = useSliderOrientationContext(__scopeSlider)
+  const ref = React.useRef<View>(null)
+  const composedRefs = useComposedRefs(forwardedRef, ref)
+  const valuesCount = context.values.length
+  const percentages = context.values.map((value) =>
+    convertValueToPercentage(value, context.min, context.max)
+  )
+  const offsetStart = valuesCount > 1 ? Math.min(...percentages) : 0
+  const offsetEnd = 100 - Math.max(...percentages)
+
+  return (
+    <SliderActiveFrame
+      orientation={context.orientation}
+      data-orientation={context.orientation}
+      data-disabled={context.disabled ? '' : undefined}
+      size={context.size}
+      animateOnly={['left', 'top', 'right', 'bottom']}
+      {...rangeProps}
+      ref={composedRefs}
+      {...{
+        [orientation.startEdge]: `${offsetStart}%`,
+        [orientation.endEdge]: `${offsetEnd}%`,
+      }}
+      {...(orientation.sizeProp === 'width'
+        ? {
+            height: '100%',
+          }
+        : {
+            left: 0,
+            right: 0,
+          })}
+    />
+  )
+})
 
 /* -------------------------------------------------------------------------------------------------
  * SliderThumb
@@ -453,14 +446,15 @@ export const SliderThumbFrame = styled(ThemeableStack, {
           backgroundColor: '$backgroundPress',
           borderColor: '$borderColorPress',
         },
-        focusStyle: {
-          backgroundColor: '$backgroundFocus',
-          borderColor: '$borderColorFocus',
-        },
         hoverStyle: {
           backgroundColor: '$backgroundHover',
           borderColor: '$borderColorHover',
         },
+        focusVisibleStyle: {
+          outlineStyle: 'solid',
+          outlineWidth: 2,
+          outlineColor: '$outlineColor',
+        },
       },
     },
   } as const,
@@ -730,7 +724,7 @@ const SliderComponent = React.forwardRef(
 
 const Slider = withStaticProperties(SliderComponent, {
   Track: SliderTrack,
-  TrackActive: SliderTrackActive,
+  TrackActive: SliderActive,
   Thumb: SliderThumb,
 })
 
@@ -772,7 +766,7 @@ Slider.displayName = SLIDER_NAME
 /* -----------------------------------------------------------------------------------------------*/
 
 const Track = SliderTrack
-const Range = SliderTrackActive
+const Range = SliderActive
 const Thumb = SliderThumb
 
 export {
@@ -780,10 +774,10 @@ export {
   Slider,
   SliderThumb,
   SliderTrack,
-  SliderTrackActive,
+  SliderActive,
   Thumb,
   //
   Track,
 }
 
-export type { SliderProps, SliderTrackActiveProps, SliderTrackProps }
+export type { SliderProps, SliderActiveProps, SliderTrackProps }

package/src/SliderImpl.tsx

@@ -6,10 +6,9 @@ import { isWeb } from '@tamagui/constants'
 import type { TamaguiElement } from '@tamagui/core'
 import { getVariableValue, styled } from '@tamagui/core'
 import { getSize } from '@tamagui/get-token'
-import { composeEventHandlers } from '@tamagui/helpers'
 import { YStack } from '@tamagui/stacks'
 import * as React from 'react'
-import type { View } from 'react-native'
+import { View } from 'react-native'
 
 import { ARROW_KEYS, PAGE_KEYS, SLIDER_NAME, useSliderContext } from './constants'
 import type { ScopedProps, SliderImplProps } from './types'
@@ -45,30 +44,6 @@ export const SliderFrame = styled(YStack, {
   } as const,
 })
 
-// export const SliderTrackFrame = styled(SliderFrame, {
-//   // name: 'SliderTrack',
-
-//   variants: {
-//     unstyled: {
-//       false: {
-//         height: '100%',
-//         width: '100%',
-//         backgroundColor: '$background',
-//         position: 'relative',
-//         borderRadius: 100_000,
-//         overflow: 'hidden',
-//       },
-//     },
-//   } as const,
-
-//   // defaultVariants: {
-//   //   unstyled: process.env.TAMAGUI_HEADLESS === '1' ? true : false,
-//   // },
-// })
-
-// const XXXX = <SliderFrame margin={10} />
-// const XX = <SliderTrackFrame  />
-
 export const SliderImpl = React.forwardRef<View, SliderImplProps>(
   (props: ScopedProps<SliderImplProps>, forwardedRef) => {
     const {
@@ -79,15 +54,63 @@ export const SliderImpl = React.forwardRef<View, SliderImplProps>(
       onHomeKeyDown,
       onEndKeyDown,
       onStepKeyDown,
+      children,
       ...sliderProps
     } = props
     const context = useSliderContext(__scopeSlider)
+
+    const handleResponderGrant = React.useCallback(
+      (event: any) => {
+        props.onResponderGrant?.(event)
+        const target = event.target as unknown as TamaguiElement | number
+        const thumbIndex = context.thumbs.get(target as TamaguiElement)
+        const isStartingOnThumb = thumbIndex !== undefined
+
+        // Prevent browser focus behaviour because we focus a thumb manually when values change.
+        // Touch devices have a delay before focusing so won't focus if touch immediately moves
+        // away from target (sliding). We want thumb to focus regardless.
+        if (isWeb && target instanceof HTMLElement) {
+          if (context.thumbs.has(target)) {
+            target.focus()
+          }
+        }
+
+        // Thumbs won't receive focus events on native, so we have to manually
+        // set the value index to change when sliding starts on a thumb.
+        if (!isWeb && isStartingOnThumb) {
+          context.valueIndexToChangeRef.current = thumbIndex
+        }
+
+        onSlideStart(event, isStartingOnThumb ? 'thumb' : 'track')
+      },
+      [context, onSlideStart, props.onResponderGrant]
+    )
+
+    const handleResponderMove = React.useCallback(
+      (event: any) => {
+        props.onResponderMove?.(event)
+        event.stopPropagation()
+        onSlideMove(event)
+      },
+      [onSlideMove, props.onResponderMove]
+    )
+
+    const handleResponderRelease = React.useCallback(
+      (event: any) => {
+        props.onResponderRelease?.(event)
+        onSlideEnd(event)
+      },
+      [onSlideEnd, props.onResponderRelease]
+    )
+
     return (
+      // wrap with plain RN View for responder events - tamagui views no longer handle responder events on web
+
       <SliderFrame
         size="$4"
+        ref={forwardedRef as any}
         {...sliderProps}
         data-orientation={sliderProps.orientation}
-        ref={forwardedRef}
         {...(isWeb && {
           onKeyDown: (event) => {
             if (event.key === 'Home') {
@@ -105,47 +128,20 @@ export const SliderImpl = React.forwardRef<View, SliderImplProps>(
             }
           },
         })}
-        onMoveShouldSetResponderCapture={() => true}
-        onScrollShouldSetResponder={() => true}
-        onScrollShouldSetResponderCapture={() => true}
-        onMoveShouldSetResponder={() => true}
-        onStartShouldSetResponder={() => true}
-        // onStartShouldSetResponderCapture={() => true}
-        onResponderTerminationRequest={() => {
-          return false
-        }}
-        onResponderGrant={composeEventHandlers(props.onResponderGrant, (event) => {
-          const target = event.target as unknown as TamaguiElement | number
-          const thumbIndex = context.thumbs.get(target as TamaguiElement)
-          const isStartingOnThumb = thumbIndex !== undefined
-
-          // Prevent browser focus behaviour because we focus a thumb manually when values change.
-          // Touch devices have a delay before focusing so won't focus if touch immediately moves
-          // away from target (sliding). We want thumb to focus regardless.
-          if (isWeb && target instanceof HTMLElement) {
-            if (context.thumbs.has(target)) {
-              target.focus()
-            }
-          }
-
-          // Thumbs won't receive focus events on native, so we have to manually
-          // set the value index to change when sliding starts on a thumb.
-          if (!isWeb && isStartingOnThumb) {
-            context.valueIndexToChangeRef.current = thumbIndex
-          }
-
-          onSlideStart(event, isStartingOnThumb ? 'thumb' : 'track')
-        })}
-        onResponderMove={composeEventHandlers(props.onResponderMove, (event) => {
-          event.stopPropagation()
-          // const target = event.target as HTMLElement
-          onSlideMove(event)
-        })}
-        onResponderRelease={composeEventHandlers(props.onResponderRelease, (event) => {
-          // const target = event.target as HTMLElement
-          onSlideEnd(event)
-        })}
-      />
+      >
+        <View
+          onMoveShouldSetResponderCapture={() => true}
+          onMoveShouldSetResponder={() => true}
+          onStartShouldSetResponder={() => true}
+          onResponderTerminationRequest={() => false}
+          onResponderGrant={handleResponderGrant}
+          onResponderMove={handleResponderMove}
+          onResponderRelease={handleResponderRelease}
+          style={{ inset: 0, position: 'absolute' }}
+        >
+          {children}
+        </View>
+      </SliderFrame>
     )
   }
 )

package/types/Slider.d.ts

@@ -41,15 +41,15 @@ declare const SliderTrack: React.ForwardRefExoticComponent<Omit<import("@tamagui
     chromeless?: boolean | "all" | undefined;
     unstyled?: boolean | undefined;
 }>> & React.RefAttributes<TamaguiElement>>;
-export declare const SliderTrackActiveFrame: import("@tamagui/core").TamaguiComponent<import("@tamagui/core").TamaDefer, TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
+export declare const SliderActiveFrame: import("@tamagui/core").TamaguiComponent<import("@tamagui/core").TamaDefer, TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
     elevation?: number | SizeTokens | undefined;
     size?: any;
     fullscreen?: boolean | undefined;
     unstyled?: boolean | undefined;
     orientation?: "horizontal" | "vertical" | undefined;
 }, import("@tamagui/core").StaticConfigPublic>;
-type SliderTrackActiveProps = GetProps<typeof SliderTrackActiveFrame>;
-declare const SliderTrackActive: React.ForwardRefExoticComponent<Omit<import("@tamagui/core").RNTamaguiViewNonStyleProps, "elevation" | keyof import("@tamagui/core").StackStyleBase | "size" | "fullscreen" | "unstyled" | "orientation"> & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStyleBase> & {
+type SliderActiveProps = GetProps<typeof SliderActiveFrame>;
+declare const SliderActive: React.ForwardRefExoticComponent<Omit<import("@tamagui/core").RNTamaguiViewNonStyleProps, "elevation" | keyof import("@tamagui/core").StackStyleBase | "size" | "fullscreen" | "unstyled" | "orientation"> & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStyleBase> & {
     elevation?: number | SizeTokens | undefined;
     size?: any;
     fullscreen?: boolean | undefined;
@@ -251,6 +251,6 @@ declare const Thumb: import("@tamagui/core").TamaguiComponent<Omit<import("@tama
     chromeless?: boolean | "all" | undefined;
     unstyled?: boolean | undefined;
 }, import("@tamagui/core").StaticConfigPublic>;
-export { Range, Slider, SliderThumb, SliderTrack, SliderTrackActive, Thumb, Track, };
-export type { SliderProps, SliderTrackActiveProps, SliderTrackProps };
+export { Range, Slider, SliderThumb, SliderTrack, SliderActive, Thumb, Track, };
+export type { SliderProps, SliderActiveProps, SliderTrackProps };
 //# sourceMappingURL=Slider.d.ts.map

package/types/Slider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../src/Slider.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAEV,QAAQ,EACR,UAAU,EACV,cAAc,EACf,MAAM,eAAe,CAAA;AAUtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAIxD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAwBxC,OAAO,KAAK,EAIV,WAAW,EACX,gBAAgB,EAEjB,MAAM,SAAS,CAAA;AA0PhB,eAAO,MAAM,gBAAgB;;;;;;8CAmB3B,CAAA;AAEF,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0CAehB,CAAA;AAUD,eAAO,MAAM,sBAAsB;;;;;;8CAiBjC,CAAA;AAEF,KAAK,sBAAsB,GAAG,QAAQ,CAAC,OAAO,sBAAsB,CAAC,CAAA;AAErE,QAAA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;gCAsCtB,CAAA;AA0BD,eAAO,MAAM,gBAAgB;;;;;;;;;;8CAkC3B,CAAA;AAEF,MAAM,WAAW,qBAAqB;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB,EAAE,qBAAqB;CAAG;AAErF,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;8CA+FhB,CAAA;AA6JD,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIV,CAAA;AAuCF,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0CAAc,CAAA;AACzB,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;gCAAoB,CAAA;AAC/B,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;8CAAc,CAAA;AAEzB,OAAO,EACL,KAAK,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,iBAAiB,EACjB,KAAK,EAEL,KAAK,GACN,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../src/Slider.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAEV,QAAQ,EACR,UAAU,EACV,cAAc,EACf,MAAM,eAAe,CAAA;AAUtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAIxD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAwBxC,OAAO,KAAK,EAIV,WAAW,EACX,gBAAgB,EAEjB,MAAM,SAAS,CAAA;AAwPhB,eAAO,MAAM,gBAAgB;;;;;;8CAmB3B,CAAA;AAEF,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0CAehB,CAAA;AAMD,eAAO,MAAM,iBAAiB;;;;;;8CAiB5B,CAAA;AAEF,KAAK,iBAAiB,GAAG,QAAQ,CAAC,OAAO,iBAAiB,CAAC,CAAA;AAE3D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;gCAuChB,CAAA;AAwBF,eAAO,MAAM,gBAAgB;;;;;;;;;;8CAmC3B,CAAA;AAEF,MAAM,WAAW,qBAAqB;IACpC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB,EAAE,qBAAqB;CAAG;AAErF,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;8CA+FhB,CAAA;AA6JD,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIV,CAAA;AAuCF,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0CAAc,CAAA;AACzB,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;gCAAe,CAAA;AAC1B,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;8CAAc,CAAA;AAEzB,OAAO,EACL,KAAK,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,YAAY,EACZ,KAAK,EAEL,KAAK,GACN,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,CAAA"}

package/types/SliderImpl.d.ts

@@ -1,6 +1,6 @@
 import type { TamaguiElement } from '@tamagui/core';
 import * as React from 'react';
-import type { View } from 'react-native';
+import { View } from 'react-native';
 import type { SliderImplProps } from './types';
 export declare const SliderFrame: import("@tamagui/core").TamaguiComponent<import("@tamagui/core").TamaDefer, TamaguiElement, import("@tamagui/core").RNTamaguiViewNonStyleProps, import("@tamagui/core").StackStyleBase, {
     elevation?: number | import("@tamagui/core").SizeTokens | undefined;

package/types/SliderImpl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SliderImpl.d.ts","sourceRoot":"","sources":["../src/SliderImpl.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAKnD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAGxC,OAAO,KAAK,EAAe,eAAe,EAAE,MAAM,SAAS,CAAA;AAE3D,eAAO,MAAM,WAAW;;;;;8CA6BtB,CAAA;AA0BF,eAAO,MAAM,UAAU,8EA+EtB,CAAA"}
+{"version":3,"file":"SliderImpl.d.ts","sourceRoot":"","sources":["../src/SliderImpl.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAInD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAGnC,OAAO,KAAK,EAAe,eAAe,EAAE,MAAM,SAAS,CAAA;AAE3D,eAAO,MAAM,WAAW;;;;;8CA6BtB,CAAA;AAEF,eAAO,MAAM,UAAU,8EAoGtB,CAAA"}