@multiplatform.one/components 5.0.27 → 6.0.1

package/src/organize/SimpleListItem/SimpleListItem.stories.tsx

@@ -1,117 +0,0 @@
-/**
- * File: /src/organize/SimpleListItem/SimpleListItem.stories.tsx
- * Project: @multiplatform.one/components
- * File Created: 16-10-2023 14:55:52
- * 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 { ChevronRight, Star } from "@tamagui/lucide-icons";
-import { useEffect, useState } from "react";
-import { Label, Separator, Switch, XStack, YStack } from "tamagui";
-import {
-  SimpleList,
-  SimpleListItem,
-  type SimpleListItemProps,
-  type SimpleListProps,
-} from "./index";
-export default {
-  title: "organize/SimpleListItem",
-  component: SimpleList,
-  parameters: {
-    status: { type: "beta" },
-  },
-};
-
-function Main(args: SimpleListProps & SimpleListItemProps) {
-  const [orientation, setOrientation] = useState(
-    args.orientation === "horizontal",
-  );
-  useEffect(() => {
-    if (args.orientation === "horizontal") {
-      setOrientation(true);
-    } else {
-      setOrientation(false);
-    }
-  }, [args.orientation]);
-  return (
-    <YStack fullscreen>
-      <XStack width={200} alignItems="center" gap="$4" alignSelf="flex-start">
-        <Label
-          paddingRight="$0"
-          minWidth={90}
-          justifyContent="flex-end"
-          size="$2"
-        >
-          {orientation ? "Horizontal" : "Vertical"}
-        </Label>
-        <Separator minHeight={20} vertical />
-        <Switch
-          size="$2"
-          checked={orientation}
-          onCheckedChange={setOrientation}
-        >
-          <Switch.Thumb animation="quick" />
-        </Switch>
-      </XStack>
-      <SimpleList orientation={args.orientation}>
-        <SimpleListItem
-          title="hello"
-          icon={Star}
-          subTitle="how are you"
-          iconAfter={ChevronRight}
-          width={200}
-        />
-        <SimpleListItem
-          title="hello"
-          icon={Star}
-          subTitle="how are you"
-          iconAfter={ChevronRight}
-          width={200}
-        />
-        <SimpleListItem
-          title="hello"
-          icon={Star}
-          subTitle="how are you"
-          iconAfter={ChevronRight}
-          width={200}
-        />
-        <SimpleListItem
-          title="hello"
-          icon={Star}
-          subTitle="how are you"
-          iconAfter={ChevronRight}
-          width={200}
-        />
-        <SimpleListItem
-          title="hello"
-          icon={Star}
-          subTitle="how are you"
-          iconAfter={ChevronRight}
-          width={200}
-        />
-      </SimpleList>
-    </YStack>
-  );
-}
-
-export const main = (args: SimpleListProps & SimpleListItemProps) => (
-  <Main {...args} />
-);
-
-main.args = {
-  orientation: "horizontal",
-};

package/src/organize/SimpleListItem/index.tsx

@@ -1,79 +0,0 @@
-/**
- * File: /src/organize/SimpleListItem/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 { createContext, useContext, useMemo } from "react";
-import type { ListItemProps, YStackProps } from "tamagui";
-import { ListItem, XGroup, YGroup } from "tamagui";
-
-export type SimpleListProps = YStackProps & {
-  orientation?: "horizontal" | "vertical";
-  bg?: any;
-};
-export type SimpleListItemProps = ListItemProps & {};
-
-const ListContext = createContext<SimpleListProps | null>(null);
-
-export function SimpleList({
-  children,
-  orientation = "vertical",
-  backgroundColor,
-  bg,
-  ...props
-}: SimpleListProps) {
-  const contextValue = useMemo(
-    () => ({ orientation, backgroundColor, bg }),
-    [orientation, backgroundColor, bg],
-  );
-
-  const renderView = () => {
-    if (orientation === "horizontal") {
-      return <XGroup {...props}>{children}</XGroup>;
-    }
-    return <YGroup {...props}>{children}</YGroup>;
-  };
-  return (
-    <ListContext.Provider value={contextValue}>
-      {renderView()}
-    </ListContext.Provider>
-  );
-}
-
-export function SimpleListItem({ ...props }: SimpleListItemProps) {
-  const context = useContext(ListContext);
-  if (!context) {
-    throw new Error("SimpleListItem must be used within a SimpleList");
-  }
-
-  function renderItem() {
-    return (
-      <ListItem
-        hoverTheme
-        backgroundColor={context?.backgroundColor || (context as any)?.bg}
-        {...props}
-      />
-    );
-  }
-
-  if (context.orientation === "horizontal") {
-    return <XGroup.Item>{renderItem()}</XGroup.Item>;
-  }
-  return <YGroup.Item>{renderItem()}</YGroup.Item>;
-}

package/src/organize/SimpleParagraph/SimpleParagraph.stories.tsx

@@ -1,36 +0,0 @@
-/**
- * File: /src/organize/SimpleParagraph/SimpleParagraph.stories.tsx
- * Project: @multiplatform.one/components
- * File Created: 19-11-2024 20:26:31
- * 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 { SimpleParagraph } from ".";
-
-export default {
-  title: "Components/SimpleParagraph",
-  component: SimpleParagraph,
-  parameters: { status: { type: "beta" } },
-};
-
-export const main = () => (
-  <SimpleParagraph>{`
-function helloWorld() {
-  console.info("Hello, World!");
-}
-`}</SimpleParagraph>
-);

package/src/organize/SimpleParagraph/index.tsx

@@ -1,115 +0,0 @@
-/**
- * File: /src/organize/SimpleParagraph/index.tsx
- * Project: @multiplatform.one/components
- * File Created: 11-09-2024 14:21:33
- * 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 type { ReactNode } from "react";
-import type { ParagraphProps, YStackProps } from "tamagui";
-import { Paragraph, ScrollView, Text, XStack, YStack } from "tamagui";
-import { CodeBlock } from "../../code";
-
-export interface SimpleParagraphProps
-  extends YStackProps,
-    Pick<ParagraphProps, "color" | "fontSize"> {
-  children: string;
-}
-
-export const SimpleParagraph = ({
-  children,
-  ...props
-}: SimpleParagraphProps) => {
-  if (typeof children !== "string") return null;
-
-  function parseContent(data) {
-    const regex = /```(.*?)\n([\s\S]*?)```|[\s\S]+?(?=```|$)/g;
-    const boldTextRegex = /\*\*(.*?)\*\*/g;
-    const segments = data?.match(regex);
-    const parsedSegments: {
-      type: string;
-      content?: ReactNode;
-      language?: string;
-      code?: string;
-      isBold?: boolean;
-    }[] = [];
-
-    segments?.forEach((segment) => {
-      const codeMatch = segment.match(/```(.*?)\n([\s\S]*?)```/);
-      if (codeMatch) {
-        parsedSegments.push({
-          type: "code",
-          language: codeMatch[1],
-          code: codeMatch[2].trim(),
-        });
-      } else {
-        // Splitting the text segment by new lines and treating each new line as a separate text segment
-        segment.split("\n").forEach((line) => {
-          const content: ReactNode[] = [];
-          let lastIndex = 0;
-          line.replace(boldTextRegex, (match, p1, offset) => {
-            if (offset > lastIndex) {
-              content.push(line.substring(lastIndex, offset));
-            }
-            content.push(<Text fontWeight="bold">{p1}</Text>);
-            lastIndex = offset + match.length;
-            return match; // This return is not used but necessary for replace function
-          });
-          if (lastIndex < line.length) {
-            content.push(line.substring(lastIndex));
-          }
-          parsedSegments.push({
-            type: "text",
-            content: content.length === 1 ? content[0] : content,
-            isBold: false,
-          });
-        });
-      }
-    });
-    return parsedSegments;
-  }
-
-  const parsedSegments = parseContent(children);
-
-  return (
-    <YStack {...props}>
-      {parsedSegments.map((segment, index) => {
-        if (segment.type === "text") {
-          return (
-            <XStack key={index}>
-              <Paragraph
-                overflow="hidden"
-                fontSize={props.fontSize}
-                color={props.color}
-              >
-                {segment.content}
-              </Paragraph>
-            </XStack>
-          );
-        }
-        if (segment.type === "code") {
-          return (
-            <ScrollView key={index} flexShrink={1} scrollEnabled>
-              <CodeBlock>{segment.code}</CodeBlock>
-            </ScrollView>
-          );
-        }
-        return null;
-      })}
-    </YStack>
-  );
-};

package/src/organize/SimpleTabs/SimpleTabs.stories.tsx

@@ -1,112 +0,0 @@
-/**
- * File: /src/organize/SimpleTabs/SimpleTabs.stories.tsx
- * Project: @multiplatform.one/components
- * File Created: 10-01-2025 21:02:36
- * Author: Clay Risser
- * -----
- * BitSpur (c) Copyright 2021 - 2025
- *
- * 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 { useEffect, useState } from "react";
-import {
-  H5,
-  Separator,
-  SizableText,
-  Switch,
-  Tabs,
-  Text,
-  XStack,
-  YStack,
-} from "tamagui";
-import { SimpleTabs, TabsContent, TabsList } from "./index";
-import type { SimpleTabsProps } from "./index";
-
-export default {
-  title: "organize/SimpleTabs",
-  component: SimpleTabs,
-  parameters: {
-    status: {
-      type: "beta",
-    },
-  },
-};
-
-export const Main = (args: SimpleTabsProps) => {
-  const [orientation, setOrientation] = useState(
-    args.orientation === "horizontal",
-  );
-  const [isHorizontal, setIsHorizontal] = useState(true);
-
-  useEffect(() => {
-    if (args.orientation === "horizontal") {
-      setOrientation(true);
-    } else {
-      setOrientation(false);
-    }
-  }, [args.orientation]);
-
-  return (
-    <YStack gap="$4" padding="$4">
-      <XStack gap="$4">
-        <Switch
-          size="$3"
-          checked={orientation}
-          onCheckedChange={setIsHorizontal}
-        >
-          <Switch.Thumb animation="bouncy" />
-        </Switch>
-        <Text>{orientation ? "Horizontal" : "Vertical"}</Text>
-      </XStack>
-      <SimpleTabs
-        orientation={orientation ? "horizontal" : "vertical"}
-        defaultValue="home"
-      >
-        <TabsList
-          justifyContent="space-between"
-          orientation={orientation ? "horizontal" : "vertical"}
-        >
-          <Tabs.Tab value="home" flex={1}>
-            <SizableText textAlign="center">Home</SizableText>
-          </Tabs.Tab>
-          <Tabs.Tab value="about" flex={1}>
-            <SizableText textAlign="center">About</SizableText>
-          </Tabs.Tab>
-          <Tabs.Tab value="contact" flex={1}>
-            <SizableText textAlign="center">Contact</SizableText>
-          </Tabs.Tab>
-        </TabsList>
-        <Separator vertical={!orientation} />
-        <TabsContent value="home">
-          <H5>Home</H5>
-        </TabsContent>
-        <TabsContent value="about">
-          <H5>About</H5>
-        </TabsContent>
-        <TabsContent value="contact">
-          <H5>Contact</H5>
-        </TabsContent>
-      </SimpleTabs>
-    </YStack>
-  );
-};
-
-export const main = (args) => {
-  return <Main {...args} />;
-};
-
-const mainArgs = {
-  orientation: "horizontal",
-};
-main.args = mainArgs;

package/src/organize/SimpleTabs/index.tsx

@@ -1,102 +0,0 @@
-/**
- * File: /src/organize/SimpleTabs/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 { TabsContentProps, TabsListProps, TabsProps } from "tamagui";
-import { Separator } from "tamagui";
-import { Tabs } from "tamagui";
-
-export type SimpleTabsProps = TabsProps;
-
-export function SimpleTabs({ ...props }: SimpleTabsProps) {
-  if (props.orientation === "vertical") return <VerticalTabs {...props} />;
-  return <HorizontalTabs {...props} />;
-}
-
-function HorizontalTabs({ children, ...props }: SimpleTabsProps) {
-  return (
-    <Tabs
-      flexDirection="column"
-      width={400}
-      height={150}
-      borderRadius="$4"
-      borderWidth="$0.25"
-      overflow="hidden"
-      borderColor="$borderColor"
-      {...props}
-      orientation="horizontal"
-    >
-      {children}
-    </Tabs>
-  );
-}
-
-function VerticalTabs({ children, ...props }: SimpleTabsProps) {
-  return (
-    <Tabs
-      flexDirection="row"
-      width={400}
-      borderRadius="$4"
-      borderWidth="$0.25"
-      overflow="hidden"
-      borderColor="$borderColor"
-      {...props}
-      orientation="vertical"
-    >
-      {children}
-    </Tabs>
-  );
-}
-
-export function TabsContent(props: TabsContentProps) {
-  return (
-    <Tabs.Content
-      backgroundColor="$background"
-      key="tab3"
-      padding="$2"
-      alignItems="center"
-      justifyContent="center"
-      flex={1}
-      borderColor="$background"
-      borderRadius="$2"
-      borderTopLeftRadius={0}
-      borderTopRightRadius={0}
-      borderWidth="$2"
-      {...props}
-    >
-      {props.children}
-    </Tabs.Content>
-  );
-}
-
-export function TabsList(props: TabsListProps) {
-  return (
-    <Tabs.List
-      separator={<Separator vertical={props.orientation === "horizontal"} />}
-      disablePassBorderRadius={
-        props.orientation === "horizontal" ? "bottom" : "end"
-      }
-      aria-label="Manage your account"
-      {...props}
-    >
-      {props.children}
-    </Tabs.List>
-  );
-}

package/src/organize/index.ts

@@ -1,27 +0,0 @@
-/*
- * File: /src/organize/index.ts
- * Project: @multiplatform.one/components
- * File Created: 20-10-2023 18:17:40
- * 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.
- */
-
-export * from "./SimpleAccordion";
-export * from "./SimpleCarousel";
-export * from "./SimpleInput";
-export * from "./SimpleListItem";
-export * from "./SimpleTabs";
-export * from "./SimpleParagraph";

package/src/panels/SimpleAlertDialog/SimpleAlertDialog.stories.tsx

@@ -1,95 +0,0 @@
-/**
- * File: /src/panels/SimpleAlertDialog/SimpleAlertDialog.stories.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 { useState } from "react";
-import { AlertDialog, Button, XStack, YStack } from "tamagui";
-import type { AlterDialogSimpleProps } from "./index";
-import { SimpleAlertDialog } from "./index";
-
-export default {
-  title: "panels/SimpleAlertDialog",
-  component: SimpleAlertDialog,
-  parameters: { status: { type: "beta" } },
-};
-
-export const main = (args) => (
-  <SimpleAlertDialog
-    title="Are you sure?"
-    description="This action cannot be undone"
-    cancel="Cancel"
-    accept="Delete"
-    trigger={<Button>Get Alert</Button>}
-    {...args}
-  />
-);
-
-const mainArgs: AlterDialogSimpleProps = {
-  title: "Are you sure?",
-  description: "This action cannot be undone",
-  cancel: "Cancel",
-  accept: "Delete",
-};
-main.args = mainArgs;
-export const Custom = (args) => (
-  <SimpleAlertDialog
-    title="Are you sure?"
-    cancel="Cancel"
-    accept="Yes, Delete"
-    trigger={<Button>Get Alert</Button>}
-    {...mainArgs}
-    {...args}
-  >
-    <YStack gap="$4" width={400}>
-      <AlertDialog.Title>Custom Alert</AlertDialog.Title>
-      <AlertDialog.Description>this is a custom alert</AlertDialog.Description>
-      <XStack gap="$3" justifyContent="flex-end">
-        <AlertDialog.Cancel asChild>
-          <Button>cancel</Button>
-        </AlertDialog.Cancel>
-        <AlertDialog.Action asChild>
-          <Button theme="active">ok</Button>
-        </AlertDialog.Action>
-      </XStack>
-    </YStack>
-  </SimpleAlertDialog>
-);
-
-const Open = (args) => {
-  const [open, setOpen] = useState(true);
-  return (
-    <YStack>
-      <SimpleAlertDialog
-        title="Are you sure?"
-        description="This action cannot be undone"
-        cancel="Cancel"
-        accept="Yes, Delete"
-        open={open}
-        onOpenChange={setOpen}
-        {...args}
-      />
-      <Button onPress={() => setOpen((prev) => !prev)}>
-        {open ? "close" : "open"}
-      </Button>
-    </YStack>
-  );
-};
-
-export const OpenClose = (args) => <Open {...mainArgs} {...args} />;