@agility/plenum-ui 2.0.0-rc49 → 2.0.0-rc50

package/stories/atoms/icons/DynamicIcon.tsx

@@ -1,90 +1,90 @@
-import React from "react"
-// TODO: Fix heroicons support
-import * as SolidIcons from "@heroicons/react/solid"
-import * as OutlineIcons from "@heroicons/react/outline"
-import * as FA from "react-icons/fa"
-import { tablerIconNames, TablerIconName } from "./tablerIconNames"
-import { default as cn } from "classnames"
-
-import { ClassNameWithAutocomplete } from "@/utils/types"
-import TablerIcon from "./TablerIcon"
-
-export type IconName = keyof typeof SolidIcons | keyof typeof OutlineIcons
-export type FAIconName = keyof typeof FA
-
-export type UnifiedIconName = TablerIconName | IconName | FAIconName
-
-export function isHeroIcon(name: UnifiedIconName): name is keyof typeof SolidIcons | keyof typeof OutlineIcons {
-	return name in SolidIcons || name in OutlineIcons
-}
-
-export function isTablerIcon(name: UnifiedIconName): name is TablerIconName {
-	return tablerIconNames.includes(name as TablerIconName)
-}
-
-export function isFAIcon(name: UnifiedIconName): name is keyof typeof FA {
-	return name in FA
-}
-
-export function isUnifiedIconName(name: UnifiedIconName): name is UnifiedIconName {
-	return isTablerIcon(name) // || isHeroIcon(name) || isFAIcon(name)
-}
-
-export interface IDynamicIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
-	icon: UnifiedIconName
-	className?: ClassNameWithAutocomplete
-	outline?: boolean
-	CustomSVG?: React.ReactNode
-}
-
-export const DynamicIcon = ({
-	icon,
-	className = "w-5 h-5 text-gray-400",
-	outline,
-	CustomSVG,
-	...props
-}: IDynamicIconProps): JSX.Element => {
-	if (CustomSVG) {
-		return <i {...{ ...props, className: "flex items-center justify-center" }}>{CustomSVG}</i>
-	}
-
-	if (isTablerIcon(icon)) {
-		return (
-			<TablerIcon
-				{...{
-					icon,
-					className: cn(className, {
-						"text-gray-600 h-5 w-5": !className
-					}),
-					outline
-				}}
-			/>
-		)
-	}
-
-	if (isFAIcon(icon)) {
-		const Icon = FA[icon]
-		return (
-			<i {...{ ...props, className: "flex items-center justify-center" }}>
-				<Icon
-					className={cn(className, {
-						"h-5 w-5 text-gray-600": !className
-					})}
-				/>
-			</i>
-		)
-	}
-	if (isHeroIcon(icon)) {
-		const Icon = outline ? OutlineIcons[icon] : SolidIcons[icon]
-		return (
-			<i {...{ ...props, className: "flex items-center justify-center" }}>
-				<Icon
-					className={cn(className, {
-						"h-5 w-5 text-gray-600": !className
-					})}
-				/>
-			</i>
-		)
-	}
-	return <></>
-}
+import React from "react"
+// TODO: Fix heroicons support
+import * as SolidIcons from "@heroicons/react/solid"
+import * as OutlineIcons from "@heroicons/react/outline"
+import * as FA from "react-icons/fa"
+import { tablerIconNames, TablerIconName } from "./tablerIconNames"
+import { default as cn } from "classnames"
+
+import { ClassNameWithAutocomplete } from "@/utils/types"
+import TablerIcon from "./TablerIcon"
+
+export type IconName = keyof typeof SolidIcons | keyof typeof OutlineIcons
+export type FAIconName = keyof typeof FA
+
+export type UnifiedIconName = TablerIconName | IconName | FAIconName
+
+export function isHeroIcon(name: UnifiedIconName): name is keyof typeof SolidIcons | keyof typeof OutlineIcons {
+	return name in SolidIcons || name in OutlineIcons
+}
+
+export function isTablerIcon(name: UnifiedIconName): name is TablerIconName {
+	return tablerIconNames.includes(name as TablerIconName)
+}
+
+export function isFAIcon(name: UnifiedIconName): name is keyof typeof FA {
+	return name in FA
+}
+
+export function isUnifiedIconName(name: UnifiedIconName): name is UnifiedIconName {
+	return isTablerIcon(name) // || isHeroIcon(name) || isFAIcon(name)
+}
+
+export interface IDynamicIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
+	icon: UnifiedIconName
+	className?: ClassNameWithAutocomplete
+	outline?: boolean
+	CustomSVG?: React.ReactNode
+}
+
+export const DynamicIcon = ({
+	icon,
+	className = "w-5 h-5 text-gray-400",
+	outline,
+	CustomSVG,
+	...props
+}: IDynamicIconProps): JSX.Element => {
+	if (CustomSVG) {
+		return <i {...{ ...props, className: "flex items-center justify-center" }}>{CustomSVG}</i>
+	}
+
+	if (isTablerIcon(icon)) {
+		return (
+			<TablerIcon
+				{...{
+					icon,
+					className: cn(className, {
+						"text-gray-600 h-5 w-5": !className
+					}),
+					outline
+				}}
+			/>
+		)
+	}
+
+	if (isFAIcon(icon)) {
+		const Icon = FA[icon]
+		return (
+			<i {...{ ...props, className: "flex items-center justify-center" }}>
+				<Icon
+					className={cn(className, {
+						"h-5 w-5 text-gray-600": !className
+					})}
+				/>
+			</i>
+		)
+	}
+	if (isHeroIcon(icon)) {
+		const Icon = outline ? OutlineIcons[icon] : SolidIcons[icon]
+		return (
+			<i {...{ ...props, className: "flex items-center justify-center" }}>
+				<Icon
+					className={cn(className, {
+						"h-5 w-5 text-gray-600": !className
+					})}
+				/>
+			</i>
+		)
+	}
+	return <></>
+}

package/stories/atoms/icons/IconWithShadow.stories.ts

@@ -1,43 +1,43 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import IconWithShadow from "./IconWithShadow"
-
-const meta: Meta<typeof IconWithShadow> = {
-	title: "Design System/atoms/Icons/Icon With Shadow",
-	component: IconWithShadow,
-	tags: ["autodocs"]
-}
-
-type Story = StoryObj<typeof IconWithShadow>
-
-export const HeroIconSolid: Story = {
-	args: {
-		icon: "IconCube",
-		outline: false
-	}
-}
-export const HeroIconOutline: Story = {
-	args: {
-		icon: "IconCube",
-		outline: true
-	}
-}
-export const TablerIconSolid: Story = {
-	args: {
-		icon: "IconPaperclip",
-		outline: false
-	}
-}
-export const TablerIconOutline: Story = {
-	args: {
-		icon: "IconPaperclip",
-		outline: true
-	}
-}
-export const FAIcon: Story = {
-	args: {
-		icon: "IconBrandGithub",
-		outline: true
-	}
-}
-
-export default meta
+import type { Meta, StoryObj } from "@storybook/react"
+import IconWithShadow from "./IconWithShadow"
+
+const meta: Meta<typeof IconWithShadow> = {
+	title: "Design System/atoms/Icons/Icon With Shadow",
+	component: IconWithShadow,
+	tags: ["autodocs"]
+}
+
+type Story = StoryObj<typeof IconWithShadow>
+
+export const HeroIconSolid: Story = {
+	args: {
+		icon: "IconCube",
+		outline: false
+	}
+}
+export const HeroIconOutline: Story = {
+	args: {
+		icon: "IconCube",
+		outline: true
+	}
+}
+export const TablerIconSolid: Story = {
+	args: {
+		icon: "IconPaperclip",
+		outline: false
+	}
+}
+export const TablerIconOutline: Story = {
+	args: {
+		icon: "IconPaperclip",
+		outline: true
+	}
+}
+export const FAIcon: Story = {
+	args: {
+		icon: "IconBrandGithub",
+		outline: true
+	}
+}
+
+export default meta

package/stories/atoms/icons/IconWithShadow.tsx

@@ -1,16 +1,16 @@
-import { DynamicIcon } from "./DynamicIcon"
-import { default as cn } from "classnames"
-import { IDynamicIconProps } from "./DynamicIcon"
-
-export interface IIconWithShadowProps extends IDynamicIconProps {}
-
-const IconWithShadow: React.FC<IIconWithShadowProps> = (props) => {
-	return (
-		<div className="flex flex-col  items-center justify-center ">
-			<DynamicIcon {...{ ...props, className: cn("h-12 w-12 text-gray-400") }} outline />
-			<div className={cn("mt-2 h-2 w-24 bg-gray-100")} style={{ borderRadius: "40%" }} />
-		</div>
-	)
-}
-
-export default IconWithShadow
+import { DynamicIcon } from "./DynamicIcon"
+import { default as cn } from "classnames"
+import { IDynamicIconProps } from "./DynamicIcon"
+
+export interface IIconWithShadowProps extends IDynamicIconProps {}
+
+const IconWithShadow: React.FC<IIconWithShadowProps> = (props) => {
+	return (
+		<div className="flex flex-col  items-center justify-center ">
+			<DynamicIcon {...{ ...props, className: cn("h-12 w-12 text-gray-400") }} outline />
+			<div className={cn("mt-2 h-2 w-24 bg-gray-100")} style={{ borderRadius: "40%" }} />
+		</div>
+	)
+}
+
+export default IconWithShadow

package/stories/atoms/icons/TablerIcon.tsx

@@ -1,22 +1,22 @@
-import React from "react"
-import { TablerIconName } from "./tablerIconNames"
-import * as TablerIcons from "@tabler/icons-react"
-import { ClassNameWithAutocomplete } from "@/utils/types"
-
-export interface ITablerIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
-	icon: TablerIconName
-	className?: ClassNameWithAutocomplete
-}
-
-const TablerIcon: React.FC<ITablerIconProps> = ({
-	icon,
-	className = "w-6 h-6 text-gray-600"
-}: ITablerIconProps): JSX.Element => {
-	const Icon = TablerIcons[icon]
-	return (
-		<i>
-			<Icon className={className} />
-		</i>
-	)
-}
-export default TablerIcon
+import React from "react"
+import { TablerIconName } from "./tablerIconNames"
+import * as TablerIcons from "@tabler/icons-react"
+import { ClassNameWithAutocomplete } from "@/utils/types"
+
+export interface ITablerIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
+	icon: TablerIconName
+	className?: ClassNameWithAutocomplete
+}
+
+const TablerIcon: React.FC<ITablerIconProps> = ({
+	icon,
+	className = "w-6 h-6 text-gray-600"
+}: ITablerIconProps): JSX.Element => {
+	const Icon = TablerIcons[icon]
+	return (
+		<i>
+			<Icon className={className} />
+		</i>
+	)
+}
+export default TablerIcon

package/stories/atoms/icons/index.tsx

@@ -1,14 +1,14 @@
-import {
-	DynamicIcon,
-	FAIconName,
-	IDynamicIconProps,
-	IconName,
-	UnifiedIconName,
-	isFAIcon,
-	isHeroIcon,
-	isTablerIcon,
-	isUnifiedIconName
-} from "./DynamicIcon"
-import IconWithShadow, { IIconWithShadowProps } from "./IconWithShadow"
-export { DynamicIcon, isFAIcon, isHeroIcon, isTablerIcon, isUnifiedIconName, IconWithShadow }
-export type { FAIconName, IDynamicIconProps, IconName, UnifiedIconName, IIconWithShadowProps }
+import {
+	DynamicIcon,
+	FAIconName,
+	IDynamicIconProps,
+	IconName,
+	UnifiedIconName,
+	isFAIcon,
+	isHeroIcon,
+	isTablerIcon,
+	isUnifiedIconName
+} from "./DynamicIcon"
+import IconWithShadow, { IIconWithShadowProps } from "./IconWithShadow"
+export { DynamicIcon, isFAIcon, isHeroIcon, isTablerIcon, isUnifiedIconName, IconWithShadow }
+export type { FAIconName, IDynamicIconProps, IconName, UnifiedIconName, IIconWithShadowProps }