@multiplatform.one/components 5.0.27 → 6.0.1

package/src/panels/SimpleSheet/index.tsx

@@ -1,56 +0,0 @@
-/**
- * File: /src/panels/SimpleSheet/index.tsx
- * Project: @multiplatform.one/components
- * File Created: 25-01-2024 09:49:47
- * Author: Lalit rajak
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Sheet } from "@tamagui/sheet";
-import type { DialogOverlayProps, SheetProps, YStackProps } from "tamagui";
-
-export type SimpleSheetProps = SheetProps & {
-  overlayStyle?: DialogOverlayProps;
-  frameStyle?: YStackProps;
-};
-
-export function SimpleSheet({
-  children,
-  overlayStyle,
-  frameStyle,
-  ...props
-}: SimpleSheetProps) {
-  return (
-    <Sheet zIndex={100_000} {...props}>
-      <Sheet.Overlay
-        animation="lazy"
-        enterStyle={{ opacity: 0 }}
-        exitStyle={{ opacity: 0 }}
-        {...overlayStyle}
-      />
-      <Sheet.Handle />
-      <Sheet.Frame
-        padding="$4"
-        justifyContent="center"
-        alignItems="center"
-        gap="$5"
-        {...frameStyle}
-      >
-        {children}
-      </Sheet.Frame>
-    </Sheet>
-  );
-}

package/src/panels/SimpleTooltip/SimpleTooltip.stories.tsx

@@ -1,63 +0,0 @@
-/**
- * File: /src/panels/SimpleTooltip/SimpleTooltip.stories.tsx
- * Project: @multiplatform.one/components
- * File Created: 18-10-2023 15:23:17
- * Author: Lalit rajak
- * -----
- * BitSpur (c) Copyright 2021 - 2023
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import type { Meta } from "@storybook/react";
-import { useEffect, useState } from "react";
-import { Button, Label, Switch, Text, XStack, YStack } from "tamagui";
-import { type SimpleToolTipProps, SimpleTooltip } from "./index";
-
-const meta: Meta = {
-  title: "panels/SimpleTooltip",
-  component: SimpleTooltip,
-  parameters: { status: { type: "beta" } },
-};
-
-function Tooltip(args: SimpleToolTipProps) {
-  const [arrow, setArrow] = useState(args.arrow);
-
-  useEffect(() => {
-    setArrow(args.arrow);
-  }, [args.arrow]);
-  return (
-    <YStack gap="$4">
-      <XStack gap="$4" padding="$4" alignItems="center">
-        <Switch size="$3" checked={arrow} onCheckedChange={setArrow}>
-          <Switch.Thumb animation="bouncy" />
-        </Switch>
-        <Label>arrow</Label>
-        <SimpleTooltip {...args} arrow={arrow} trigger={<Button>?</Button>}>
-          <Text>tooltip content</Text>
-        </SimpleTooltip>
-      </XStack>
-    </YStack>
-  );
-}
-
-export const main = (args) => <Tooltip {...args} />;
-main.args = {
-  arrow: true,
-  themeStyle: { background: "black", color: "white" },
-  triggerStyle: { background: "black", color: "white" },
-  contentStyle: { background: "black", color: "white" },
-  arrowStyle: { background: "black" },
-};
-
-export default meta;

package/src/panels/SimpleTooltip/index.tsx

@@ -1,79 +0,0 @@
-/**
- * File: /src/panels/SimpleTooltip/index.tsx
- * Project: @multiplatform.one/components
- * File Created: 18-10-2023 15:23:17
- * Author: Lalit rajak
- * -----
- * BitSpur (c) Copyright 2021 - 2023
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import type { ReactNode } from "react";
-import type {
-  PopoverArrowProps,
-  PopoverContentProps,
-  PopoverTriggerProps,
-  ThemeProps,
-  TooltipProps,
-} from "tamagui";
-import { Theme, Tooltip } from "tamagui";
-
-export type SimpleToolTipProps = TooltipProps & {
-  trigger: ReactNode;
-  themeStyle?: ThemeProps;
-  contentStyle?: PopoverContentProps;
-  triggerStyle?: PopoverTriggerProps;
-  arrow: boolean;
-  arrowStyle?: PopoverArrowProps;
-};
-
-export function SimpleTooltip({
-  Icon,
-  children,
-  trigger,
-  arrow,
-  themeStyle,
-  triggerStyle,
-  contentStyle,
-  arrowStyle,
-  ...props
-}: SimpleToolTipProps & { Icon?: any }) {
-  return (
-    <Tooltip {...props}>
-      <Tooltip.Trigger {...triggerStyle}>{trigger}</Tooltip.Trigger>
-      <Theme inverse {...themeStyle}>
-        <Tooltip.Content
-          enterStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
-          exitStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
-          scale={1}
-          x={0}
-          y={0}
-          opacity={1}
-          animation={[
-            "quick",
-            {
-              opacity: {
-                overshootClamping: true,
-              },
-            },
-          ]}
-          {...contentStyle}
-        >
-          {arrow && <Tooltip.Arrow {...arrowStyle} />}
-          {children}
-        </Tooltip.Content>
-      </Theme>
-    </Tooltip>
-  );
-}

package/src/panels/index.ts

@@ -1,5 +0,0 @@
-export * from "./SimpleAlertDialog";
-export * from "./SimpleDialog";
-export * from "./SimplePopover";
-export * from "./SimpleSheet";
-export * from "./SimpleTooltip";

package/src/providers/AnimationDriverTogglerContextProvider.tsx

@@ -1,75 +0,0 @@
-/**
- * File: /src/providers/AnimationDriverTogglerContextProvider.tsx
- * Project: @multiplatform.one/components
- * File Created: 04-04-2024 15:50:39
- * Author: Clay Risser
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { createAnimations as createAnimationsCss } from "@tamagui/animations-css";
-import type { AnimationDriver } from "@tamagui/web";
-import type { PropsWithChildren } from "react";
-import { createContext, useMemo, useState } from "react";
-import type { TamaguiInternalConfig } from "tamagui";
-
-const ANIMATION_DRIVERS = ["css", "react-native"] as const;
-
-export const AnimationDriverTogglerContext = createContext<{
-  driver: AnimationDriver;
-  driverName: (typeof ANIMATION_DRIVERS)[number];
-  nextDriver: () => void;
-  setDriverName: (driverName: (typeof ANIMATION_DRIVERS)[number]) => void;
-} | null>(null);
-
-export interface AnimationDriverTogglerContextProviderProps
-  extends PropsWithChildren {
-  tamaguiConfig: TamaguiInternalConfig;
-}
-
-export const AnimationDriverTogglerContextProvider = ({
-  children,
-  tamaguiConfig,
-}: AnimationDriverTogglerContextProviderProps) => {
-  const [driverName, setDriverName] =
-    useState<(typeof ANIMATION_DRIVERS)[number]>("react-native");
-
-  const nextDriver = () => {
-    const nextIndex =
-      (ANIMATION_DRIVERS.indexOf(driverName) + 1) % ANIMATION_DRIVERS.length;
-    const nextDriverName = ANIMATION_DRIVERS[nextIndex];
-    setDriverName(nextDriverName as (typeof ANIMATION_DRIVERS)[number]);
-  };
-
-  const driver = useMemo(() => {
-    if (driverName === "css")
-      return createAnimationsCss({
-        bouncy: "ease-in 200ms",
-        lazy: "ease-in 600ms",
-        slow: "ease-in 500ms",
-        quick: "ease-in 100ms",
-        tooltip: "ease-in 400ms",
-      });
-    return tamaguiConfig.animations;
-  }, [driverName]);
-
-  return (
-    <AnimationDriverTogglerContext.Provider
-      value={{ driverName, nextDriver, setDriverName, driver }}
-    >
-      {children}
-    </AnimationDriverTogglerContext.Provider>
-  );
-};

package/src/table/Table/Table.stories.tsx

@@ -1,76 +0,0 @@
-/**
- * File: /src/table/Table/Table.stories.tsx
- * Project: @multiplatform.one/components
- * File Created: 25-06-2024 16:50:25
- * Author: Lavanya Katari
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Table } from "./index";
-
-export default {
-  title: "table/Table",
-  component: Table,
-  parameters: {
-    status: { type: "beta" },
-  },
-};
-
-export const Main = () => (
-  <Table heading="Choose your journey">
-    <Table.Col>
-      <Table.Cell head />
-      <Table.Cell>1</Table.Cell>
-      <Table.Cell>2</Table.Cell>
-      <Table.Cell>3</Table.Cell>
-    </Table.Col>
-    <Table.Col>
-      <Table.Cell head>Strategy</Table.Cell>
-      <Table.Cell>Universal</Table.Cell>
-      <Table.Cell>Lean</Table.Cell>
-      <Table.Cell>Big-Budget</Table.Cell>
-    </Table.Col>
-    <Table.Col>
-      <Table.Cell head>Native + Web</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-      <Table.Cell>❌</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-    </Table.Col>
-    <Table.Col>
-      <Table.Cell head>Code Sharing</Table.Cell>
-      <Table.Cell>{">"} 70%</Table.Cell>
-      <Table.Cell>-</Table.Cell>
-      <Table.Cell>{"<"} 30%</Table.Cell>
-    </Table.Col>
-    <Table.Col>
-      <Table.Cell head>Feels native</Table.Cell>
-      <Table.Cell>❌</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-    </Table.Col>
-    <Table.Col>
-      <Table.Cell head>Ship Fast</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-      <Table.Cell>✅</Table.Cell>
-      <Table.Cell>❌</Table.Cell>
-    </Table.Col>
-  </Table>
-);
-export const main = (args) => <Main {...args} />;
-main.args = {
-  overflow: "visible",
-  type: "multiple",
-};

package/src/table/Table/index.tsx

@@ -1,62 +0,0 @@
-/**
- * File: /src/table/Table/index.tsx
- * Project: @multiplatform.one/components
- * File Created: 04-04-2024 15:50:39
- * Author: Clay Risser
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { ThemeableStack, XStack, styled, withStaticProperties } from "tamagui";
-import { TableCell } from "../TableCell";
-import { TableCol } from "../TableCol";
-import { TableContext } from "../TableContext";
-
-export const StyledTableFrame = styled(ThemeableStack, {
-  name: "Table",
-  context: TableContext,
-  bordered: true,
-  borderRadius: "$4",
-  overflow: "scroll" as "scroll" | "hidden" | "visible",
-  marginVertical: "$4",
-});
-
-export const TableFrame = ({ heading, children, ...props }) => {
-  return (
-    <StyledTableFrame
-      overflow={"scroll" as "scroll" | "hidden" | "visible"}
-      {...props}
-    >
-      {!!heading && (
-        <TableCell
-          size="$4"
-          backgroundColor="$color1"
-          fontWeight="500"
-          color="$color9"
-        >
-          {heading}
-        </TableCell>
-      )}
-      <XStack minWidth="100%" alignItems="stretch">
-        {children}
-      </XStack>
-    </StyledTableFrame>
-  );
-};
-
-export const Table = withStaticProperties(TableFrame, {
-  Cell: TableCell,
-  Col: TableCol,
-});

package/src/table/TableCell/index.ts

@@ -1,53 +0,0 @@
-/*
- * File: /src/table/TableCell/index.ts
- * Project: @multiplatform.one/components
- * File Created: 04-04-2024 15:50:39
- * Author: Clay Risser
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Paragraph, styled } from "tamagui";
-import { TableContext } from "../TableContext";
-
-export const TableCell = styled(Paragraph, {
-  name: "TableCell",
-  context: TableContext,
-  borderWidth: 1,
-  borderColor: "$borderColor",
-  flexDirection: "row",
-  alignItems: "center",
-  position: "relative",
-  flex: 1,
-  justifyContent: "center",
-  textAlign: "center",
-  height: "$4",
-  padding: "$2",
-  paddingHorizontal: "$3",
-  fontSize: "$5",
-  ellipse: true,
-  variants: {
-    head: {
-      true: {
-        bc: "$color1",
-      },
-    },
-    highlight: {
-      true: {
-        bc: "$yellow2",
-      },
-    },
-  } as const,
-});

package/src/table/TableCol/index.ts

@@ -1,33 +0,0 @@
-/*
- * File: /src/table/TableCol/index.ts
- * Project: @multiplatform.one/components
- * File Created: 04-04-2024 15:50:39
- * Author: Clay Risser
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { ThemeableStack, styled } from "tamagui";
-import { TableContext } from "../TableContext";
-
-export const TableCol = styled(ThemeableStack, {
-  name: "TableCol",
-  context: TableContext,
-  borderWidth: 1,
-  borderColor: "$borderColor",
-  flex: 1,
-  marginRight: -1,
-  flexDirection: "column",
-});

package/src/table/TableContext.ts

@@ -1,3 +0,0 @@
-import { createStyledContext } from "tamagui";
-
-export const TableContext = createStyledContext({});

package/src/table/index.ts

@@ -1,3 +0,0 @@
-export * from "./Table";
-export * from "./TableCell";
-export * from "./TableCol";

package/src/tints.tsx

@@ -1,178 +0,0 @@
-/**
- * File: /src/tints.tsx
- * Project: @multiplatform.one/components
- * File Created: 22-04-2024 16:34:20
- * Author: Nate Wienert
- * Author: Clay Risser
- * Reference: https://github.com/tamagui/tamagui/blob/v1.94.5/packages/logo/src/tints.tsx
- * -----
- * BitSpur (c) Copyright 2021 - 2024
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import type { Dispatch, SetStateAction } from "react";
-import type { ReactNode } from "react";
-import { createContext, useContext, useMemo, useState } from "react";
-import type { ThemeName, ThemeProps } from "tamagui";
-import { Theme } from "tamagui";
-
-export type TintFamily = string | number | symbol;
-
-export interface TintFamilies {
-  [family: TintFamily]: ThemeName[];
-}
-
-export interface TintFamiliesContextValue {
-  families: TintFamilies;
-  family: TintFamily;
-  tintIndex: number;
-  setFamily: Dispatch<SetStateAction<TintFamily>>;
-  setTintIndex: (next: number) => void;
-}
-
-export interface Tint {
-  families: TintFamilies;
-  name: TintFamily;
-  tints: ThemeName[];
-}
-
-const defaultTintFamiliesContextValue: TintFamiliesContextValue = {
-  setFamily: () => {
-    return;
-  },
-  setTintIndex: (_next: number) => {
-    return;
-  },
-  family: "tamagui",
-  tintIndex: -3,
-  families: {
-    easter: ["yellow", "pink", "yellow", "pink", "yellow", "pink", "yellow"],
-    halloween: [
-      "orange",
-      "gray",
-      "orange",
-      "gray",
-      "orange",
-      "gray",
-      "orange",
-    ] as ThemeName[],
-    lunar: ["yellow", "red", "red", "red", "red", "red", "yellow"],
-    tamagui: ["orange", "yellow", "green", "blue", "purple", "pink", "red"],
-    valentine: ["pink", "red", "pink", "red", "pink", "red", "pink"],
-    xmas: ["red", "green", "red", "green", "red", "green", "red"],
-  },
-};
-
-const TintFamiliesContext = createContext<TintFamiliesContextValue>(
-  defaultTintFamiliesContextValue,
-);
-
-export interface TintFamiliesProviderProps {
-  children: ReactNode;
-  defaultFamily?: TintFamily;
-  defaultIndex?: number;
-  families?: TintFamilies;
-}
-
-export function TintFamiliesProvider(props: TintFamiliesProviderProps) {
-  const [family, setFamily] = useState<TintFamily>(
-    props.defaultFamily || defaultTintFamiliesContextValue.family,
-  );
-  const [tintIndex, setTintIndex] = useState<number>(
-    props.defaultIndex || defaultTintFamiliesContextValue.tintIndex,
-  );
-  const families = props.families || defaultTintFamiliesContextValue.families;
-  const value = useMemo(
-    () => ({
-      families,
-      family,
-      tintIndex,
-      setFamily,
-      setTintIndex: (next: number) => {
-        setTintIndex(next % (families[family]?.length || 0));
-      },
-    }),
-    [family, setFamily, families, tintIndex, setTintIndex],
-  );
-  return (
-    <TintFamiliesContext.Provider value={value}>
-      {props.children}
-    </TintFamiliesContext.Provider>
-  );
-}
-
-export function useTint(altOffset = -1) {
-  const { families, family, setFamily, setTintIndex, tintIndex } =
-    useContext(TintFamiliesContext);
-  const tints = families[family];
-  const tintAltIndex = Math.abs((tintIndex + altOffset) % (tints?.length || 0));
-  const familiesNames = useMemo(() => Object.keys(families), [families]);
-  return {
-    families,
-    familiesNames,
-    name: family,
-    tint: tints?.[tintIndex] as ThemeName,
-    tintAlt: tints?.[tintAltIndex] as ThemeName,
-    tintAltIndex,
-    tintIndex,
-    tints,
-    setFamily,
-    setTintIndex,
-    setNextTint: () => {
-      setTintIndex(tintIndex + 1);
-    },
-    setNextTintFamily: () => {
-      setFamily(
-        (prevFamily: TintFamily) =>
-          familiesNames[
-            (familiesNames.indexOf(prevFamily as string) + 1) %
-              familiesNames.length
-          ] as TintFamily,
-      );
-    },
-  } as const;
-}
-
-export interface ThemeTintProps extends ThemeProps {
-  disable?: boolean;
-}
-
-export function ThemeTint({ disable, children, ...rest }: ThemeTintProps) {
-  const curTint = useTint().tint;
-  return (
-    <Theme {...rest} name={disable ? null : curTint}>
-      {children}
-    </Theme>
-  );
-}
-
-export interface ThemeTintAltProps extends ThemeProps {
-  disable?: boolean;
-  offset?: number;
-}
-
-export function ThemeTintAlt({
-  children,
-  disable,
-  offset = 1,
-  ...rest
-}: ThemeTintAltProps) {
-  const curTint = useTint(offset).tintAlt;
-  const name = disable ? null : curTint;
-  return (
-    <Theme name={name} {...rest}>
-      {children}
-    </Theme>
-  );
-}