@xqmsg/ui-core 0.24.2 → 0.24.4

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.24.2",
+  "version": "0.24.4",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -37,7 +37,11 @@
     "trailingComma": "es5"
   },
   "name": "@xqmsg/ui-core",
-  "author": "josh@xqmsg.com",
+  "author": {
+    "name": "XQ",
+    "email": "ike@xqmsg.com",
+    "url": "https://xqmsg.co"
+  },
   "module": "dist/ui-core.esm.js",
   "size-limit": [
     {

package/src/components/icons/checkmark/index.tsx

@@ -9,5 +9,5 @@ export interface CheckmarkProps {
  * A functional React component utilized to render the `Checkmark` icon component
  */
 export const Checkmark: React.FC<CheckmarkProps> = ({ boxSize }) => {
-  return <CheckmarkIcon boxSize={boxSize} />;
+  return <CheckmarkIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/chevron/down/index.tsx

@@ -10,5 +10,11 @@ export interface ChevronDownProps {
  * A functional React component utilized to render the `ChevronDown` icon component
  */
 export const ChevronDown: React.FC<ChevronDownProps> = ({ boxSize }) => {
-  return <ChevronDownIcon boxSize={boxSize} fill={colors.fill.action} />;
+  return (
+    <ChevronDownIcon
+      width={boxSize}
+      height={boxSize}
+      fill={colors.fill.action}
+    />
+  );
 };

package/src/components/icons/chevron/right/index.tsx

@@ -9,5 +9,5 @@ export interface ChevronRightProps {
  * A functional React component utilized to render the `ChevronRight` icon component
  */
 export const ChevronRight: React.FC<ChevronRightProps> = ({ boxSize }) => {
-  return <ChevronRightIcon boxSize={boxSize} />;
+  return <ChevronRightIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/clock/index.tsx

@@ -9,5 +9,5 @@ export interface ClockProps {
  * A functional React component utilized to render the `Clock` icon component
  */
 export const Clock: React.FC<ClockProps> = ({ boxSize }) => {
-  return <ClockIcon boxSize={boxSize} />;
+  return <ClockIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/dropdown/index.tsx

@@ -11,6 +11,10 @@ export interface DropdownProps {
  */
 export const Dropdown: React.FC<DropdownProps> = ({ boxSize, disabled }) => {
   return (
-    <DropdownIcon boxSize={boxSize} fill={disabled ? '#3C3C4399' : '#0082FF'} />
+    <DropdownIcon
+      width={boxSize}
+      height={boxSize}
+      fill={disabled ? '#3C3C4399' : '#0082FF'}
+    />
   );
 };

package/src/components/icons/error/index.tsx

@@ -9,5 +9,5 @@ export interface ErrorProps {
  * A functional React component utilized to render the `Error` icon component
  */
 export const Error: React.FC<ErrorProps> = ({ boxSize }) => {
-  return <ErrorIcon boxSize={boxSize} />;
+  return <ErrorIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/file/fill/index.tsx

@@ -9,5 +9,5 @@ export interface FileFillProps {
  * A functional React component utilized to render the `FileFill` icon component
  */
 export const FileFill: React.FC<FileFillProps> = ({ boxSize }) => {
-  return <FileFillIcon boxSize={boxSize} />;
+  return <FileFillIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/file/outline/index.tsx

@@ -9,5 +9,5 @@ export interface FileOutlineProps {
  * A functional React component utilized to render the `FileOutline` icon component
  */
 export const FileOutline: React.FC<FileOutlineProps> = ({ boxSize }) => {
-  return <FileOutlineIcon boxSize={boxSize} />;
+  return <FileOutlineIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/folder/add/fill/index.tsx

@@ -9,5 +9,5 @@ export interface FolderAddFillProps {
  * A functional React component utilized to render the `FolderAddFill` icon component
  */
 export const FolderAddFill: React.FC<FolderAddFillProps> = ({ boxSize }) => {
-  return <FolderAddFillIcon boxSize={boxSize} />;
+  return <FolderAddFillIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/folder/add/outline/index.tsx

@@ -11,5 +11,5 @@ export interface FolderAddOutlineProps {
 export const FolderAddOutline: React.FC<FolderAddOutlineProps> = ({
   boxSize,
 }) => {
-  return <FolderAddOutlineIcon boxSize={boxSize} />;
+  return <FolderAddOutlineIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/folder/outline/index.tsx

@@ -9,5 +9,5 @@ export interface FolderOutlineProps {
  * A functional React component utilized to render the `FolderOutline` icon component
  */
 export const FolderOutline: React.FC<FolderOutlineProps> = ({ boxSize }) => {
-  return <FolderOutlineIcon boxSize={boxSize} />;
+  return <FolderOutlineIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/group/index.tsx

@@ -9,5 +9,5 @@ export interface GroupProps {
  * A functional React component utilized to render the `Group` icon component
  */
 export const Group: React.FC<GroupProps> = ({ boxSize }) => {
-  return <GroupIcon boxSize={boxSize} />;
+  return <GroupIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/home/index.tsx

@@ -9,5 +9,5 @@ export interface HomeProps {
  * A functional React component utilized to render the `Home` icon component
  */
 export const Home: React.FC<HomeProps> = ({ boxSize }) => {
-  return <HomeIcon boxSize={boxSize} />;
+  return <HomeIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/image/index.tsx

@@ -9,5 +9,5 @@ export interface ImageProps {
  * A functional React component utilized to render the `Image` icon component
  */
 export const Image: React.FC<ImageProps> = ({ boxSize }) => {
-  return <ImageIcon boxSize={boxSize} />;
+  return <ImageIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/link/index.tsx

@@ -9,5 +9,5 @@ export interface LinkProps {
  * A functional React component utilized to render the `Link` icon component
  */
 export const Link: React.FC<LinkProps> = ({ boxSize }) => {
-  return <LinkIcon boxSize={boxSize} />;
+  return <LinkIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/menu/index.tsx

@@ -9,5 +9,5 @@ export interface MenuProps {
  * A functional React component utilized to render the `Menu` icon component
  */
 export const Menu: React.FC<MenuProps> = ({ boxSize }) => {
-  return <MenuIcon boxSize={boxSize} />;
+  return <MenuIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/microsoft/index.tsx

@@ -9,5 +9,5 @@ export interface MicrosoftProps {
  * A functional React component utilized to render the `Microsoft` icon component
  */
 export const Microsoft: React.FC<MicrosoftProps> = ({ boxSize }) => {
-  return <MicrosoftLogo boxSize={boxSize} />;
+  return <MicrosoftLogo width={boxSize} height={boxSize} />;
 };

package/src/components/icons/neutral/index.tsx

@@ -10,5 +10,7 @@ export interface NeutralProps {
  * A functional React component utilized to render the `Neutral` icon component
  */
 export const Neutral: React.FC<NeutralProps> = ({ color, boxSize }) => {
-  return <NeutralIcon boxSize={boxSize} fill={color || '#3C3C43'} />;
+  return (
+    <NeutralIcon width={boxSize} height={boxSize} fill={color || '#3C3C43'} />
+  );
 };

package/src/components/icons/page/index.tsx

@@ -9,5 +9,5 @@ export interface PageProps {
  * A functional React component utilized to render the `Page` icon component
  */
 export const Page: React.FC<PageProps> = ({ boxSize }) => {
-  return <PageIcon boxSize={boxSize} />;
+  return <PageIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/positive/index.tsx

@@ -9,5 +9,5 @@ export interface PositiveProps {
  * A functional React component utilized to render the `Positive` icon component
  */
 export const Positive: React.FC<PositiveProps> = ({ boxSize }) => {
-  return <PositiveIcon boxSize={boxSize} />;
+  return <PositiveIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/question/index.tsx

@@ -9,5 +9,5 @@ export interface QuestionProps {
  * A functional React component utilized to render the `Question` icon component
  */
 export const Question: React.FC<QuestionProps> = ({ boxSize }) => {
-  return <QuestionIcon boxSize={boxSize} />;
+  return <QuestionIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/search/index.tsx

@@ -9,5 +9,5 @@ export interface SearchProps {
  * A functional React component utilized to render the `Search` icon component
  */
 export const Search: React.FC<SearchProps> = ({ boxSize }) => {
-  return <SearchIcon boxSize={boxSize} />;
+  return <SearchIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/services/index.tsx

@@ -9,5 +9,5 @@ export interface ServicesProps {
  * A functional React component utilized to render the `Services` icon component
  */
 export const Services: React.FC<ServicesProps> = ({ boxSize }) => {
-  return <ServicesIcon boxSize={boxSize} />;
+  return <ServicesIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/settings/index.tsx

@@ -10,5 +10,7 @@ export interface SettingsProps {
  * A functional React component utilized to render the `Settings` icon component
  */
 export const Settings: React.FC<SettingsProps> = ({ boxSize }) => {
-  return <SettingsIcon boxSize={boxSize} fill={colors.fill.action} />;
+  return (
+    <SettingsIcon width={boxSize} height={boxSize} fill={colors.fill.action} />
+  );
 };

package/src/components/icons/table/fill/index.tsx

@@ -9,5 +9,5 @@ export interface TableFillProps {
  * A functional React component utilized to render the `TableFill` icon component
  */
 export const TableFill: React.FC<TableFillProps> = ({ boxSize }) => {
-  return <TableFillIcon boxSize={boxSize} />;
+  return <TableFillIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/table/outline/index.tsx

@@ -9,5 +9,5 @@ export interface TableOutlineProps {
  * A functional React component utilized to render the `TableOutline` icon component
  */
 export const TableOutline: React.FC<TableOutlineProps> = ({ boxSize }) => {
-  return <TableOutlineIcon boxSize={boxSize} />;
+  return <TableOutlineIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/task/index.tsx

@@ -6,5 +6,5 @@ import { IconProps } from '..';
  * A functional React component utilized to render the `Task` icon component
  */
 export const Task: React.FC<IconProps> = ({ boxSize }) => {
-  return <TaskIcon boxSize={boxSize} />;
+  return <TaskIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/trash/index.tsx

@@ -9,5 +9,5 @@ export interface TrashProps {
  * A functional React component utilized to render the `Trash` icon component
  */
 export const Trash: React.FC<TrashProps> = ({ boxSize }) => {
-  return <TrashIcon boxSize={boxSize} />;
+  return <TrashIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/video/index.tsx

@@ -9,5 +9,5 @@ export interface VideoProps {
  * A functional React component utilized to render the `Video` icon component
  */
 export const Video: React.FC<VideoProps> = ({ boxSize }) => {
-  return <VideoIcon boxSize={boxSize} />;
+  return <VideoIcon width={boxSize} height={boxSize} />;
 };

package/src/components/icons/warning/index.tsx

@@ -9,5 +9,5 @@ export interface WarningProps {
  * A functional React component utilized to render the `Warning` icon component
  */
 export const Warning: React.FC<WarningProps> = ({ boxSize }) => {
-  return <WarningIcon boxSize={boxSize} />;
+  return <WarningIcon width={boxSize} height={boxSize} />;
 };

package/src/components/input/Input.stories.tsx

@@ -132,6 +132,7 @@ const Template: Story<InputProps<StoryFormSchema>> = args => {
         isInvalid={!!form.formState.errors['prop5']?.message}
         errorText={form.formState.errors['prop5']?.message}
         name="prop5"
+        loadingOptions={true}
       />
       <Input
         {...args}
@@ -206,6 +207,14 @@ const Template: Story<InputProps<StoryFormSchema>> = args => {
         name="prop4"
         defaultValue={'value1'}
       />
+      <Input
+        {...args}
+        inputType="select"
+        setValue={form.setValue}
+        name="prop4"
+        defaultValue={'value1'}
+        loadingOptions={true}
+      />
       <Input
         {...args}
         inputType="select"