@platformatic/ui-components 0.13.2 → 0.13.4

package/src/components/icons/index.js

@@ -1,27 +1,28 @@
-import AddIcon from './AddIcon'
 import AddEnvVariableIcon from './AddEnvVariableIcon'
+import AddIcon from './AddIcon'
 import AddRouteIcon from './AddRouteIcon'
 import AddUserIcon from './AddUserIcon'
 import AlertIcon from './AlertIcon'
 import AllAppsIcon from './AllAppsIcon'
 import AllInOneIcon from './AllInOneIcon'
-import APIDocsIcon from './APIDocsIcon'
 import ApiCloudIcon from './ApiCloudIcon'
-import APIKeyIcon from './APIKeyIcon'
+import ApiEmptyIcon from './ApiEmptyIcon'
 import ApiIcon from './ApiIcon'
 import ApiIconClosed from './ApiIconClosed'
-import ApiEmptyIcon from './ApiEmptyIcon'
 import ApiPerformanceIcon from './ApiPerformanceIcon'
+import APIDocsIcon from './APIDocsIcon'
+import APIKeyIcon from './APIKeyIcon'
 import AppConfigurationIcon from './AppConfigurationIcon'
 import AppDetailsIcon from './AppDetailsIcon'
 import AppEditIcon from './AppEditIcon'
 import AppEmptyIcon from './AppEmptyIcon'
 import AppIcon from './AppIcon'
+import ApplicationTypeIcon from './ApplicationTypeIcon'
 import AppListIcon from './AppListIcon'
 import AppMissingIcon from './AppMissingIcon'
 import AppOptimizedIcon from './AppOptimizedIcon'
 import AppSettingsIcon from './AppSettingsIcon'
-import ApplicationTypeIcon from './ApplicationTypeIcon'
+import AppStoppedIcon from './AppStoppedIcon'
 import AppWorkspace from './AppWorkspace'
 import ArrowDownFullIcon from './ArrowDownFullIcon'
 import ArrowDownIcon from './ArrowDownIcon'
@@ -35,51 +36,50 @@ import ArrowUpIcon from './ArrowUpIcon'
 import AWSIcon from './AWSIcon'
 import BellIcon from './BellIcon'
 import BillingIcon from './BillingIcon'
-import BuiltInLoggingIcon from './BuiltInLoggingIcon'
 import BranchIcon from './BranchIcon'
+import BuiltInLoggingIcon from './BuiltInLoggingIcon'
 import CachingIcon from './CachingIcon'
-import CalendarIcon from './CalendarIcon'
 import Calendar1DayIcon from './Calendar1DayIcon'
 import Calendar7DaysIcon from './Calendar7DaysIcon'
+import CalendarIcon from './CalendarIcon'
 import CheckListIcon from './CheckListIcon'
 import CheckListReviewIcon from './CheckListReviewIcon'
 import CircleAddIcon from './CircleAddIcon'
 import CircleArrowLeftIcon from './CircleArrowLeftIcon'
 import CircleArrowRightIcon from './CircleArrowRightIcon'
 import CircleCheckMarkButtonIcon from './CircleCheckMarkButtonIcon'
-import CircleCheckMarkIcon from './CircleCheckMarkIcon'
 import CircleCheckMarkFullIcon from './CircleCheckMarkFullIcon'
-import CircleCopyPasteIcon from './CircleCopyPasteIcon'
-import CircleCloseIcon from './CircleCloseIcon'
+import CircleCheckMarkIcon from './CircleCheckMarkIcon'
 import CircleCloseHoverIcon from './CircleCloseHoverIcon'
+import CircleCloseIcon from './CircleCloseIcon'
+import CircleCopyPasteIcon from './CircleCopyPasteIcon'
 import CircleDownloadIcon from './CircleDownloadIcon'
-import CircleExclamationIcon from './CircleExclamationIcon'
 import CircleEditIcon from './CircleEditIcon'
+import CircleExclamationIcon from './CircleExclamationIcon'
 import CircleFullIcon from './CircleFullIcon'
 import CircleGearIcon from './CircleGearIcon'
-import CircleRestartIcon from './CircleRestartIcon'
 import CirclePlayIcon from './CirclePlayIcon'
-import CircleSubtractIcon from './CircleSubtractIcon'
+import CircleRestartIcon from './CircleRestartIcon'
 import CircleStopIcon from './CircleStopIcon'
+import CircleSubtractIcon from './CircleSubtractIcon'
 import CircleTwoArrowsDownIcon from './CircleTwoArrowsDownIcon'
 import CircleTwoArrowsUpIcon from './CircleTwoArrowsUpIcon'
+import CLIIcon from './CLIIcon'
 import CloseIcon from './CloseIcon'
 import CloudIcon from './CloudIcon'
-import CLIIcon from './CLIIcon'
 import CodeTestingIcon from './CodeTestingIcon'
 import CollapseIcon from './CollapseIcon'
 import CollapseSquareIcon from './CollapseSquareIcon'
 import ComputerIcon from './ComputerIcon'
 import ComputerInIcon from './ComputerInIcon'
 import ComputerOutIcon from './ComputerOutIcon'
-import CopyPasteIcon from './CopyPasteIcon'
-import CreditCardIcon from './CreditCardIcon'
 import ConfigureDatabaseIcon from './ConfigureDatabaseIcon'
+import CopyPasteIcon from './CopyPasteIcon'
 import CreateAppIcon from './CreateAppIcon'
 import CreatingAppIcon from './CreatingAppIcon'
-import RunningAppIcon from './RunningAppIcon'
-import DatabaseIcon from './DatabaseIcon'
+import CreditCardIcon from './CreditCardIcon'
 import DatabaseEditIcon from './DatabaseEditIcon'
+import DatabaseIcon from './DatabaseIcon'
 import DatabaseMigrationIcon from './DatabaseMigrationIcon'
 import DepencenciesReloadIcon from './DepencenciesReloadIcon'
 import DeploymentHistoryIcon from './DeploymentHistoryIcon'
@@ -87,9 +87,9 @@ import DocumentIcon from './DocumentIcon'
 import DownloadIcon from './DownloadIcon'
 import EditDocumentIcon from './EditDocumentIcon'
 import EditIcon from './EditIcon'
-import EntrypointIcon from './EntrypointIcon'
 import EnlargeIcon from './EnlargeIcon'
 import EntryIcon from './EntryIcon'
+import EntrypointIcon from './EntrypointIcon'
 import EnvVariableszIcon from './EnvVariableszIcon'
 import ExpandIcon from './ExpandIcon'
 import ExpandSquareIcon from './ExpandSquadreIcon'
@@ -102,16 +102,13 @@ import FolderIcon from './FolderIcon'
 import FoldersIcon from './FoldersIcon'
 import GearIcon from './GearIcon'
 import GenerationLoadingIcon from './GenerationLoadingIcon'
-import GiveOwnershipIcon from './GiveOwnershipIcon'
-import GitHubRepoIcon from './GitHubRepoIcon'
 import GitHubRepo2Icon from './GitHubRepo2Icon'
-import GraphQLIcon from './GraphQLIcon'
+import GitHubRepoIcon from './GitHubRepoIcon'
+import GiveOwnershipIcon from './GiveOwnershipIcon'
 import GraphQLEditsIcon from './GraphQLEditsIcon'
+import GraphQLIcon from './GraphQLIcon'
 import HorizontalPodAutoscalerIcon from './HorizontalPodAutoscalerIcon'
 import HourglassIcon from './HourglassIcon'
-import K8SIcon from './K8SIcon'
-import K8SMetricsIcon from './K8SMetricsIcon'
-import KeyIcon from './KeyIcon'
 import ImportAppIcon from './ImportAppIcon'
 import ImportIcon from './ImportIcon'
 import InfoCircleIcon from './InfoCircleIcon'
@@ -119,6 +116,9 @@ import InfrastructureIcon from './InfrastructureIcon'
 import IngressControllIcon from './IngressControllIcon'
 import InternalLinkIcon from './InternalLinkIcon'
 import InternetIcon from './InternetIcon'
+import K8SIcon from './K8SIcon'
+import K8SMetricsIcon from './K8SMetricsIcon'
+import KeyIcon from './KeyIcon'
 import LabelIcon from './LabelIcon'
 import LayersIcon from './LayersIcon'
 import LensIcon from './LensIcon'
@@ -133,18 +133,18 @@ import MetricsLogsIcon from './MetricsLogsIcon'
 import MissingTemplateIcon from './MissingTemplateIcon'
 import NameAppIcon from './NameAppIcon'
 import NextJSIcon from './NextJSIcon'
-import NodeJSMetricsIcon from './NodeJSMetricsIcon'
 import NoActivitiesIcon from './NoActivitiesIcon'
-import NoDeploymentsIcon from './NoDeploymentsIcon'
 import NodeJSIcon from './NodeJSIcon'
+import NodeJSMetricsIcon from './NodeJSMetricsIcon'
+import NoDeploymentsIcon from './NoDeploymentsIcon'
 import NoMetricsIcon from './NoMetricsIcon'
 import NoResultsIcon from './NoResultsIcon'
 import NotCompliantServiceIcon from './NotCompliantServiceIcon'
 import OpenAPIEditsIcon from './OpenAPIEditsIcon'
 import OrganizationIcon from './OrganizationIcon'
-import OutOfBoxGraphQLIcon from './OutOfBoxGraphQLIcon'
-import OutdatedServiceIcon from './OutdatedServiceIcon'
 import OtherLogosGoogleIcon from './OtherLogosGoogleIcon'
+import OutdatedServiceIcon from './OutdatedServiceIcon'
+import OutOfBoxGraphQLIcon from './OutOfBoxGraphQLIcon'
 import PlatformaticComposerIcon from './PlatformaticComposerIcon'
 import PlatformaticDBIcon from './PlatformaticDBIcon'
 import PlatformaticRuntimeIcon from './PlatformaticRuntimeIcon'
@@ -154,8 +154,8 @@ import PodDetailsIcon from './PodDetailsIcon'
 import PodhealthIcon from './PodhealthIcon'
 import PodLogsIcon from './PodLogsIcon'
 import PodMetricsIcon from './PodMetricsIcon'
-import PodServicesIcon from './PodServicesIcon'
 import PodPerformanceIcon from './PodPerformanceIcon'
+import PodServicesIcon from './PodServicesIcon'
 import PreviewPRIcon from './PreviewPRIcon'
 import PullRequestIcon from './PullRequestIcon'
 import PullRequestLoadingIcon from './PullRequestLoadingIcon'
@@ -167,18 +167,19 @@ import RequestsIcon from './RequestsIcon'
 import ResourceIcon from './ResourceIcon'
 import RestartIcon from './RestartIcon'
 import RocketIcon from './RocketIcon'
+import RunningAppIcon from './RunningAppIcon'
 import RunningIcon from './RunningIcon'
-import ScheduledJobsIcon from './ScheduledJobsIcon'
-import ScheduledJobSettingsIcon from './ScheduledJobSettingsIcon'
-import ScheduledJobsSuspendIcon from './ScheduledJobsSuspendIcon'
-import ScheduledJobsDetailIcon from './ScheduledJobsDetailIcon'
 import ScalerDetailsIcon from './ScalerDetailsIcon'
 import ScalerHistoryIcon from './ScalerHistoryIcon'
+import ScheduledJobsAppIcon from './ScheduledJobsAppIcon'
+import ScheduledJobsDetailIcon from './ScheduledJobsDetailIcon'
+import ScheduledJobSettingsIcon from './ScheduledJobSettingsIcon'
+import ScheduledJobsIcon from './ScheduledJobsIcon'
+import ScheduledJobsSuspendIcon from './ScheduledJobsSuspendIcon'
 import SendIcon from './SendIcon'
 import ServiceIcon from './ServiceIcon'
 import ServicesWorkingIcon from './ServicesWorkingIcon'
 import SlotIcon from './SlotIcon'
-import SwitchIcon from './SwitchIcon'
 import SocialDiscordIcon from './SocialDiscordIcon'
 import SocialGitHubIcon from './SocialGitHubIcon'
 import SocialGitLabIcon from './SocialGitLabIcon'
@@ -186,22 +187,23 @@ import SocialLinkedInIcon from './SocialLinkedInIcon'
 import SocialNPMIcon from './SocialNPMIcon'
 import SocialXIcon from './SocialXIcon'
 import SortableIcon from './SortableIcon'
-import SortIcon from './SortIcon'
 import SortDownArrowAndBarIcon from './SortDownArrowAndBarIcon'
 import SortDownIcon from './SortDownIcon'
+import SortIcon from './SortIcon'
 import SortUpArrowAndBarIcon from './SortUpArrowAndBarIcon'
 import SortUpIcon from './SortUpIcon'
 import StackablesIcon from './StackablesIcon'
 import StackablesPluginIcon from './StackablesPluginIcon'
 import StackablesTemplateIcon from './StackablesTemplateIcon'
 import StopIcon from './StopIcon'
-import AppStoppedIcon from './AppStoppedIcon'
+import SuspendIcon from './SuspendIcon'
+import SwitchIcon from './SwitchIcon'
 import TableIcon from './TableIcon'
 import TaxonomyIcon from './TaxonomyIcon'
-import TerminalIcon from './TerminalIcon'
-import TwoUsersIcon from './TwoUsersIcon'
 import TeamsIcon from './TeamsIcon'
+import TerminalIcon from './TerminalIcon'
 import TrashIcon from './TrashIcon'
+import TwoUsersIcon from './TwoUsersIcon'
 import UpgradeIcon from './UpgradeIcon'
 import UploadFileIcon from './UploadFileIcon'
 import UserComputerIcon from './UserComputerIcon'
@@ -210,8 +212,8 @@ import UserRemoveIcon from './UserRemoveIcon'
 import UserRoleIcon from './UserRoleIcon'
 import WorkspaceDynamicIcon from './WorkspaceDynamicIcon'
 import WorkspaceEmptyIcon from './WorkspaceEmptyIcon'
-import WorkspaceGitHubIcon from './WorkspaceGitHubIcon'
 import WorkspaceFailIcon from './WorkspaceFailIcon'
+import WorkspaceGitHubIcon from './WorkspaceGitHubIcon'
 import WorkspaceLoadingIcon from './WorkspaceLoadingIcon'
 import WorkspaceReadyIcon from './WorkspaceReadyIcon'
 import WorkspaceStaticIcon from './WorkspaceStaticIcon'
@@ -219,20 +221,20 @@ import ZoomInIcon from './ZoomInIcon'
 import ZoomOutIcon from './ZoomOutIcon'
 
 export default {
-  AddIcon,
   AddEnvVariableIcon,
+  AddIcon,
   AddRouteIcon,
   AddUserIcon,
   AlertIcon,
   AllAppsIcon,
   AllInOneIcon,
-  APIDocsIcon,
   ApiCloudIcon,
-  APIKeyIcon,
+  ApiEmptyIcon,
   ApiIcon,
   ApiIconClosed,
-  ApiEmptyIcon,
   ApiPerformanceIcon,
+  APIDocsIcon,
+  APIKeyIcon,
   AppConfigurationIcon,
   AppDetailsIcon,
   AppEditIcon,
@@ -243,6 +245,7 @@ export default {
   AppMissingIcon,
   AppOptimizedIcon,
   AppSettingsIcon,
+  AppStoppedIcon,
   AppWorkspace,
   ArrowDownFullIcon,
   ArrowDownIcon,
@@ -256,51 +259,50 @@ export default {
   AWSIcon,
   BellIcon,
   BillingIcon,
-  BuiltInLoggingIcon,
   BranchIcon,
+  BuiltInLoggingIcon,
   CachingIcon,
-  CalendarIcon,
   Calendar1DayIcon,
   Calendar7DaysIcon,
+  CalendarIcon,
   CheckListIcon,
   CheckListReviewIcon,
   CircleAddIcon,
   CircleArrowLeftIcon,
   CircleArrowRightIcon,
   CircleCheckMarkButtonIcon,
-  CircleCheckMarkIcon,
   CircleCheckMarkFullIcon,
-  CircleCopyPasteIcon,
-  CircleCloseIcon,
+  CircleCheckMarkIcon,
   CircleCloseHoverIcon,
+  CircleCloseIcon,
+  CircleCopyPasteIcon,
   CircleDownloadIcon,
-  CircleExclamationIcon,
   CircleEditIcon,
+  CircleExclamationIcon,
   CircleFullIcon,
   CircleGearIcon,
-  CircleRestartIcon,
   CirclePlayIcon,
-  CircleSubtractIcon,
+  CircleRestartIcon,
   CircleStopIcon,
+  CircleSubtractIcon,
   CircleTwoArrowsDownIcon,
   CircleTwoArrowsUpIcon,
+  CLIIcon,
   CloseIcon,
   CloudIcon,
-  CLIIcon,
   CodeTestingIcon,
   CollapseIcon,
   CollapseSquareIcon,
   ComputerIcon,
   ComputerInIcon,
   ComputerOutIcon,
-  CopyPasteIcon,
-  CreditCardIcon,
   ConfigureDatabaseIcon,
+  CopyPasteIcon,
   CreateAppIcon,
   CreatingAppIcon,
-  RunningAppIcon,
-  DatabaseIcon,
+  CreditCardIcon,
   DatabaseEditIcon,
+  DatabaseIcon,
   DatabaseMigrationIcon,
   DepencenciesReloadIcon,
   DeploymentHistoryIcon,
@@ -308,9 +310,9 @@ export default {
   DownloadIcon,
   EditDocumentIcon,
   EditIcon,
-  EntrypointIcon,
   EnlargeIcon,
   EntryIcon,
+  EntrypointIcon,
   EnvVariableszIcon,
   ExpandIcon,
   ExpandSquareIcon,
@@ -323,16 +325,13 @@ export default {
   FoldersIcon,
   GearIcon,
   GenerationLoadingIcon,
-  GiveOwnershipIcon,
-  GitHubRepoIcon,
   GitHubRepo2Icon,
-  GraphQLIcon,
+  GitHubRepoIcon,
+  GiveOwnershipIcon,
   GraphQLEditsIcon,
+  GraphQLIcon,
   HorizontalPodAutoscalerIcon,
   HourglassIcon,
-  K8SIcon,
-  K8SMetricsIcon,
-  KeyIcon,
   ImportAppIcon,
   ImportIcon,
   InfoCircleIcon,
@@ -340,6 +339,9 @@ export default {
   IngressControllIcon,
   InternalLinkIcon,
   InternetIcon,
+  K8SIcon,
+  K8SMetricsIcon,
+  KeyIcon,
   LabelIcon,
   LayersIcon,
   LensIcon,
@@ -354,18 +356,18 @@ export default {
   MissingTemplateIcon,
   NameAppIcon,
   NextJSIcon,
-  NodeJSMetricsIcon,
   NoActivitiesIcon,
-  NoDeploymentsIcon,
   NodeJSIcon,
+  NodeJSMetricsIcon,
+  NoDeploymentsIcon,
   NoMetricsIcon,
   NoResultsIcon,
   NotCompliantServiceIcon,
   OpenAPIEditsIcon,
   OrganizationIcon,
-  OutOfBoxGraphQLIcon,
-  OutdatedServiceIcon,
   OtherLogosGoogleIcon,
+  OutdatedServiceIcon,
+  OutOfBoxGraphQLIcon,
   PlatformaticComposerIcon,
   PlatformaticDBIcon,
   PlatformaticRuntimeIcon,
@@ -375,8 +377,8 @@ export default {
   PodhealthIcon,
   PodLogsIcon,
   PodMetricsIcon,
-  PodServicesIcon,
   PodPerformanceIcon,
+  PodServicesIcon,
   PreviewPRIcon,
   PullRequestIcon,
   PullRequestLoadingIcon,
@@ -388,18 +390,19 @@ export default {
   ResourceIcon,
   RestartIcon,
   RocketIcon,
+  RunningAppIcon,
   RunningIcon,
-  ScheduledJobsIcon,
-  ScheduledJobSettingsIcon,
-  ScheduledJobsSuspendIcon,
-  ScheduledJobsDetailIcon,
   ScalerDetailsIcon,
   ScalerHistoryIcon,
+  ScheduledJobsAppIcon,
+  ScheduledJobsDetailIcon,
+  ScheduledJobSettingsIcon,
+  ScheduledJobsIcon,
+  ScheduledJobsSuspendIcon,
   SendIcon,
   ServiceIcon,
   ServicesWorkingIcon,
   SlotIcon,
-  SwitchIcon,
   SocialDiscordIcon,
   SocialGitHubIcon,
   SocialGitLabIcon,
@@ -407,22 +410,23 @@ export default {
   SocialNPMIcon,
   SocialXIcon,
   SortableIcon,
-  SortIcon,
   SortDownArrowAndBarIcon,
   SortDownIcon,
+  SortIcon,
   SortUpArrowAndBarIcon,
   SortUpIcon,
   StackablesIcon,
   StackablesPluginIcon,
   StackablesTemplateIcon,
   StopIcon,
-  AppStoppedIcon,
+  SuspendIcon,
+  SwitchIcon,
   TableIcon,
   TaxonomyIcon,
-  TerminalIcon,
-  TwoUsersIcon,
   TeamsIcon,
+  TerminalIcon,
   TrashIcon,
+  TwoUsersIcon,
   UpgradeIcon,
   UploadFileIcon,
   UserComputerIcon,
@@ -431,8 +435,8 @@ export default {
   UserRoleIcon,
   WorkspaceDynamicIcon,
   WorkspaceEmptyIcon,
-  WorkspaceGitHubIcon,
   WorkspaceFailIcon,
+  WorkspaceGitHubIcon,
   WorkspaceLoadingIcon,
   WorkspaceReadyIcon,
   WorkspaceStaticIcon,

package/src/stories/icons/Icons.stories.jsx

@@ -5,7 +5,7 @@ import CircleCloseIcon from '../../components/icons/CircleCloseIcon'
 import WorkspaceStaticIcon from '../../components/icons/WorkspaceStaticIcon'
 import UpgradeIcon from '../../components/icons/UpgradeIcon'
 import WorkspaceDynamicIcon from '../../components/icons/WorkspaceDynamicIcon'
-import { COLORS_ICON, RICH_BLACK } from '../../components/constants'
+import { COLORS_ICON, LARGE, MEDIUM, RICH_BLACK, SIZES, SMALL } from '../../components/constants'
 import icons from '../../components/icons/index.js'
 
 const divStyle = {
@@ -121,3 +121,39 @@ export const AlertIcon = AllSizesIcons(icons.AlertIcon).bind({})
 export const ScheduledJobSettingsIcons = AllSizesIcons(icons.ScheduledJobSettingsIcon).bind({})
 export const ScheduledJobsSuspendIcons = AllSizesIcons(icons.ScheduledJobsSuspendIcon).bind({})
 export const ScheduledJobsDetailIcons = AllSizesIcons(icons.ScheduledJobsDetailIcon).bind({})
+
+const IconPreviewTemplate = ({ iconName, size, color }) => {
+  const Icon = icons[iconName]
+  if (!Icon) return <div>Icon not found</div>
+
+  return (
+    <div style={{ backgroundColor: RICH_BLACK, padding: '20px', display: 'flex', gap: '10px' }}>
+      <Icon size={SMALL} color={color} />
+      <Icon size={MEDIUM} color={color} />
+      <Icon size={LARGE} color={color} />
+    </div>
+  )
+}
+
+export const IconPreview = IconPreviewTemplate.bind({})
+IconPreview.args = {
+  iconName: 'AddIcon',
+  color: 'rich-black'
+}
+IconPreview.argTypes = {
+  iconName: {
+    control: 'select',
+    options: Object.keys(icons),
+    description: 'Select an icon to preview'
+  },
+  size: {
+    control: 'select',
+    options: SIZES,
+    description: 'Select icon size'
+  },
+  color: {
+    control: 'select',
+    options: COLORS_ICON,
+    description: 'Select icon color'
+  }
+}