feat: add hierarchy icons (#550)

.changeset/popular-taxis-lay.md

@@ -0,0 +1,5 @@
+---
+'@cube-dev/ui-kit': patch
+---
+
+Add new icons: Folder, FolderFilled, FolderOpen, FolderOpenFilled, Hierarchy.

.size-limit.js

@@ -19,20 +19,20 @@ module.exports = [
         }),
       );
     },
-    limit: '230kB',
+    limit: '235kB',
   },
   {
     name: 'Tree shaking (just a Button)',
     path: './dist/es/index.js',
     webpack: true,
     import: '{ Button }',
-    limit: '37 kB',
+    limit: '38 kB',
   },
   {
     name: 'Tree shaking (just an Icon)',
     path: './dist/es/index.js',
     webpack: true,
     import: '{ AiIcon }',
-    limit: '27 kB',
+    limit: '28 kB',
   },
 ];

src/components/fields/RadioGroup/Radio.tsx

@@ -162,6 +162,7 @@ export interface CubeRadioProps
   inputStyles?: Styles;
   /* The visual type of the radio button */
   type?: 'button' | 'radio';
+  value?: string;
 }
 
 function Radio(props: CubeRadioProps, ref) {

src/icons/FolderFilledIcon.tsx

@@ -0,0 +1,14 @@
+export const FolderFilledIcon = (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    fill="none"
+    viewBox="0 0 16 16"
+  >
+    <path
+      fill="currentColor"
+      d="M1.386 3.041v9.918a1 1 0 0 0 1 1h11.27a1 1 0 0 0 1-1V5.23a1 1 0 0 0-1-1H8.16a1 1 0 0 1-.716-.302L5.9 2.344a1 1 0 0 0-.717-.303H2.386a1 1 0 0 0-1 1"
+    />
+  </svg>
+);

src/icons/FolderIcon.tsx

@@ -0,0 +1,16 @@
+export const FolderIcon = (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    fill="none"
+    viewBox="0 0 16 16"
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M2.286 3.251v9.498h11.429V5.343H7.98a1.25 1.25 0 0 1-.894-.376L5.41 3.25zm-1.3-.05c0-.69.56-1.25 1.25-1.25H5.43c.337 0 .659.136.894.376l1.677 1.716h5.762c.69 0 1.25.56 1.25 1.25V12.8c0 .69-.56 1.25-1.25 1.25H2.236c-.69 0-1.25-.56-1.25-1.25z"
+      clipRule="evenodd"
+    />
+  </svg>
+);

src/icons/FolderOpenFilledIcon.tsx

@@ -0,0 +1,16 @@
+export const FolderOpenFilledIcon = (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    fill="none"
+    viewBox="0 0 16 16"
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M1.3 11.346V3.3h3.13L6.11 4.97c.233.233.55.364.88.364h5.225V7H3.569a.8.8 0 0 0-.743.505zM1.25 14C.56 14 0 13.44 0 12.75v-9.5C0 2.56.56 2 1.25 2h3.2c.331 0 .648.13.882.364l1.68 1.67h5.253c.69 0 1.25.56 1.25 1.25V7h1.539a.8.8 0 0 1 .743 1.095l-2.145 5.4a.8.8 0 0 1-.743.505z"
+      clipRule="evenodd"
+    />
+  </svg>
+);

src/icons/FolderOpenIcon.tsx

@@ -0,0 +1,16 @@
+export const FolderOpenIcon = (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    fill="none"
+    viewBox="0 0 16 16"
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M1.3 11.059V3.3h3.13l1.68 1.671c.233.233.55.364.88.364h5.225v1.693l-8.467-.026a1 1 0 0 0-.918.596zm.696 1.641h10.233l1.942-4.366L3.94 8.303zM1.25 14C.56 14 0 13.44 0 12.75v-9.5C0 2.56.56 2 1.25 2h3.2c.331 0 .648.13.882.364l1.68 1.671h5.253c.69 0 1.25.56 1.25 1.25v1.747l1.12.003a1 1 0 0 1 .91 1.406l-2.207 4.965a1 1 0 0 1-.914.594z"
+      clipRule="evenodd"
+    />
+  </svg>
+);

src/icons/HierarchyIcon.tsx

@@ -0,0 +1,16 @@
+export const HierarchyIcon = (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    fill="none"
+    viewBox="0 0 16 16"
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M1.637 1.25c0-.69.56-1.25 1.25-1.25h3.2c.69 0 1.25.56 1.25 1.25v2.5c0 .69-.56 1.25-1.25 1.25h-.924v1.993h3.474V6.25c0-.69.56-1.25 1.25-1.25h3.193c.69 0 1.25.56 1.25 1.25v2.5c0 .69-.56 1.25-1.25 1.25H9.887c-.69 0-1.25-.56-1.25-1.25v-.457H5.163v4.704h3.474v-.747c0-.69.56-1.25 1.25-1.25h3.193c.69 0 1.25.56 1.25 1.25v2.5c0 .69-.56 1.25-1.25 1.25H9.887c-.69 0-1.25-.56-1.25-1.25v-.453H5.113c-.69 0-1.25-.56-1.25-1.25V5h-.976c-.69 0-1.25-.56-1.25-1.25zm1.3.05v2.4h3.1V1.3zm7 5v2.4h3.093V6.3zm0 8.4v-2.4h3.093v2.4z"
+      clipRule="evenodd"
+    />
+  </svg>
+);

src/icons/index.ts

@@ -73,6 +73,11 @@ import { UserGroupIcon as _UserGroupIcon } from './UserGroupIcon';
 import { UserLockIcon as _UserLockIcon } from './UserLockIcon';
 import { ShieldIcon as _ShieldIcon } from './ShieldIcon';
 import { ShieldFilledIcon as _ShieldFilledIcon } from './ShieldFilledIcon';
+import { FolderIcon as _FolderIcon } from './FolderIcon';
+import { FolderFilledIcon as _FolderFilledIcon } from './FolderFilledIcon';
+import { FolderOpenIcon as _FolderOpenIcon } from './FolderOpenIcon';
+import { FolderOpenFilledIcon as _FolderOpenFilledIcon } from './FolderOpenFilledIcon';
+import { HierarchyIcon as _HierarchyIcon } from './HierarchyIcon';
 
 export const CloseIcon = wrapIcon('CloseIcon', _CloseIcon);
 export const ExclamationIcon = wrapIcon('ExclamationIcon', _ExclamationIcon);
@@ -172,6 +177,14 @@ export const UserGroupIcon = wrapIcon('UserGroupIcon', _UserGroupIcon);
 export const UserLockIcon = wrapIcon('UserLockIcon', _UserLockIcon);
 export const ShieldIcon = wrapIcon('ShieldIcon', _ShieldIcon);
 export const ShieldFilledIcon = wrapIcon('ShieldFilledIcon', _ShieldFilledIcon);
+export const FolderIcon = wrapIcon('FolderIcon', _FolderIcon);
+export const FolderFilledIcon = wrapIcon('FolderFilledIcon', _FolderFilledIcon);
+export const FolderOpenIcon = wrapIcon('FolderOpenIcon', _FolderOpenIcon);
+export const FolderOpenFilledIcon = wrapIcon(
+  'FolderOpenFilledIcon',
+  _FolderOpenFilledIcon,
+);
+export const HierarchyIcon = wrapIcon('HierarchyIcon', _HierarchyIcon);
 
 export { IconContainer } from './IconContainer';