@butternutbox/pawprint-native 1.5.0 → 1.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@butternutbox/pawprint-native",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "type": "module",
   "description": "ButternutBox Pawprint Design System - React Native Components",
   "main": "./dist/index.cjs",

package/src/components/atoms/index.ts

@@ -3,7 +3,6 @@ export * from "./CarouselControls"
 export * from "./Typography"
 export * from "./Badge"
 export * from "./Button"
-export * from "./ChefDogLoader"
 export * from "./Divider"
 export * from "./Hint"
 export * from "./Icon"

package/src/components/atoms/ChefDogLoader/ChefDogLoader.stories.tsx

@@ -1,21 +0,0 @@
-import React from "react"
-import { ChefDogLoader } from "./ChefDogLoader"
-import type { ChefDogLoaderProps } from "./ChefDogLoader"
-
-export default {
-  title: "Atoms/ChefDogLoader",
-  component: ChefDogLoader,
-  argTypes: {
-    size: {
-      control: { type: "number" },
-      description: "Width and height in points"
-    }
-  }
-}
-
-export const Playground = (args: ChefDogLoaderProps) => (
-  <ChefDogLoader {...args} />
-)
-Playground.args = {
-  size: 240
-}

package/src/components/atoms/ChefDogLoader/ChefDogLoader.test.tsx

@@ -1,33 +0,0 @@
-import React from "react"
-import { View } from "react-native"
-import { screen } from "@testing-library/react"
-import { describe, it, expect } from "vitest"
-import { renderWithTheme } from "../../../test-utils"
-import { ChefDogLoader } from "./ChefDogLoader"
-
-describe("ChefDogLoader", () => {
-  describe("when component is rendering", () => {
-    it("renders with progressbar role", () => {
-      renderWithTheme(<ChefDogLoader />)
-      expect(screen.getByRole("progressbar")).toBeInTheDocument()
-    })
-
-    it("has accessible loading label", () => {
-      renderWithTheme(<ChefDogLoader />)
-      expect(screen.getByLabelText("Loading")).toBeInTheDocument()
-    })
-
-    it("accepts a custom accessibility label", () => {
-      renderWithTheme(<ChefDogLoader accessibilityLabel="Fetching your plan" />)
-      expect(screen.getByLabelText("Fetching your plan")).toBeInTheDocument()
-    })
-  })
-
-  describe("when using with ref", () => {
-    it("forwards ref", () => {
-      const ref = React.createRef<View>()
-      renderWithTheme(<ChefDogLoader ref={ref} />)
-      expect(ref.current).toBeTruthy()
-    })
-  })
-})

package/src/components/atoms/ChefDogLoader/ChefDogLoader.tsx

@@ -1,115 +0,0 @@
-import React from "react"
-import { StyleSheet, View, ViewProps } from "react-native"
-import Svg, { ClipPath, Defs, G, Polygon } from "react-native-svg"
-import Reanimated, {
-  cancelAnimation,
-  Easing,
-  useAnimatedStyle,
-  useReducedMotion,
-  useSharedValue,
-  withRepeat,
-  withTiming
-} from "react-native-reanimated"
-import { LabradorChefsHat } from "@butternutbox/pawprint-illustrations/breeds"
-
-type ChefDogLoaderOwnProps = {
-  size?: number
-}
-
-type ChefDogLoaderProps = ChefDogLoaderOwnProps &
-  Omit<ViewProps, keyof ChefDogLoaderOwnProps>
-
-const DEFAULT_SIZE = 240
-const TAIL_REGION = "0,0 15.5,0 15.5,22.4 12,26.5 0,26.5"
-const BODY_REGION = "15.5,0 48,0 48,48 0,48 0,26.5 12,26.5 15.5,22.4"
-const TAIL_ORIGIN = { x: 13.4 / 48 - 0.5, y: 24.6 / 48 - 0.5 }
-const TAIL_DOWN = -6
-const TAIL_UP = 14
-const WAG_DURATION = 180
-
-/**
- * The labrador in a chef's hat wagging its tail, for indeterminate loading states.
- *
- * @example
- * ```tsx
- * import { ChefDogLoader } from "@butternutbox/pawprint-native"
- *
- * <ChefDogLoader />
- * <ChefDogLoader size={160} />
- * ```
- *
- * @param size - *(optional)* Width and height in points (default: 240)
- */
-const ChefDogLoader = React.forwardRef<View, ChefDogLoaderProps>(
-  ({ size = DEFAULT_SIZE, ...rest }, ref) => {
-    const reducedMotion = useReducedMotion()
-    const rotation = useSharedValue(TAIL_DOWN)
-    const clipId = React.useId().replace(/:/g, "")
-
-    React.useEffect(() => {
-      if (reducedMotion) return
-      rotation.value = withRepeat(
-        withTiming(TAIL_UP, {
-          duration: WAG_DURATION,
-          easing: Easing.inOut(Easing.quad)
-        }),
-        -1,
-        true
-      )
-      return () => cancelAnimation(rotation)
-    }, [reducedMotion, rotation])
-
-    const originX = TAIL_ORIGIN.x * size
-    const originY = TAIL_ORIGIN.y * size
-
-    const tailStyle = useAnimatedStyle(() => ({
-      transform: [
-        { translateX: originX },
-        { translateY: originY },
-        { rotate: `${rotation.value}deg` },
-        { translateX: -originX },
-        { translateY: -originY }
-      ]
-    }))
-
-    return (
-      <View
-        ref={ref}
-        accessibilityRole="progressbar"
-        accessibilityLabel="Loading"
-        {...rest}
-      >
-        <Svg width={size} height={size} viewBox="0 0 48 48">
-          <Defs>
-            <ClipPath id={`${clipId}-body`}>
-              <Polygon points={BODY_REGION} />
-            </ClipPath>
-          </Defs>
-          <G clipPath={`url(#${clipId}-body)`}>
-            <LabradorChefsHat />
-          </G>
-        </Svg>
-        <Reanimated.View
-          pointerEvents="none"
-          style={[StyleSheet.absoluteFill, tailStyle]}
-        >
-          <Svg width={size} height={size} viewBox="0 0 48 48">
-            <Defs>
-              <ClipPath id={`${clipId}-tail`}>
-                <Polygon points={TAIL_REGION} />
-              </ClipPath>
-            </Defs>
-            <G clipPath={`url(#${clipId}-tail)`}>
-              <LabradorChefsHat />
-            </G>
-          </Svg>
-        </Reanimated.View>
-      </View>
-    )
-  }
-)
-
-ChefDogLoader.displayName = "ChefDogLoader"
-
-export { ChefDogLoader }
-export type { ChefDogLoaderProps }

package/src/components/atoms/ChefDogLoader/index.ts

@@ -1,2 +0,0 @@
-export { ChefDogLoader } from "./ChefDogLoader"
-export type { ChefDogLoaderProps } from "./ChefDogLoader"