@xqmsg/ui-core 0.21.5 → 0.21.7

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.21.5",
+  "version": "0.21.7",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/icons/dropdown/dropdown.svg

@@ -1,3 +1,3 @@
 <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C0.89543 12 -3.91405e-08 11.1046 -8.74228e-08 10L-4.37114e-07 2C-4.85396e-07 0.895431 0.89543 -3.91405e-08 2 -8.74228e-08L10 -4.37114e-07C11.1046 -4.85396e-07 12 0.89543 12 2L12 10C12 11.1046 11.1046 12 10 12L2 12ZM6 2.5C6.13261 2.5 6.25979 2.55268 6.35355 2.64645L7.85355 4.14645C8.04881 4.34171 8.04881 4.65829 7.85355 4.85355C7.65829 5.04882 7.34171 5.04882 7.14645 4.85355L6 3.70711L4.85355 4.85355C4.65829 5.04882 4.34171 5.04882 4.14645 4.85355C3.95118 4.65829 3.95118 4.34171 4.14645 4.14645L5.64645 2.64645C5.74021 2.55268 5.86739 2.5 6 2.5ZM5.64645 9.35355C5.74021 9.44732 5.86739 9.5 6 9.5C6.13261 9.5 6.25978 9.44732 6.35355 9.35355L7.85355 7.85355C8.04882 7.65829 8.04882 7.34171 7.85355 7.14645C7.65829 6.95118 7.34171 6.95118 7.14645 7.14645L6 8.29289L4.85355 7.14645C4.65829 6.95118 4.34171 6.95118 4.14645 7.14645C3.95118 7.34171 3.95118 7.65829 4.14645 7.85355L5.64645 9.35355Z" fill="#0082FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C0.89543 12 -3.91405e-08 11.1046 -8.74228e-08 10L-4.37114e-07 2C-4.85396e-07 0.895431 0.89543 -3.91405e-08 2 -8.74228e-08L10 -4.37114e-07C11.1046 -4.85396e-07 12 0.89543 12 2L12 10C12 11.1046 11.1046 12 10 12L2 12ZM6 2.5C6.13261 2.5 6.25979 2.55268 6.35355 2.64645L7.85355 4.14645C8.04881 4.34171 8.04881 4.65829 7.85355 4.85355C7.65829 5.04882 7.34171 5.04882 7.14645 4.85355L6 3.70711L4.85355 4.85355C4.65829 5.04882 4.34171 5.04882 4.14645 4.85355C3.95118 4.65829 3.95118 4.34171 4.14645 4.14645L5.64645 2.64645C5.74021 2.55268 5.86739 2.5 6 2.5ZM5.64645 9.35355C5.74021 9.44732 5.86739 9.5 6 9.5C6.13261 9.5 6.25978 9.44732 6.35355 9.35355L7.85355 7.85355C8.04882 7.65829 8.04882 7.34171 7.85355 7.14645C7.65829 6.95118 7.34171 6.95118 7.14645 7.14645L6 8.29289L4.85355 7.14645C4.65829 6.95118 4.34171 6.95118 4.14645 7.14645C3.95118 7.34171 3.95118 7.65829 4.14645 7.85355L5.64645 9.35355Z" fill="current"/>
 </svg>

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

@@ -3,11 +3,14 @@ import { ReactComponent as DropdownIcon } from './dropdown.svg';
 
 export interface DropdownProps {
   boxSize: number | string;
+  disabled?: boolean;
 }
 
 /**
  * A functional React component utilized to render the `Dropdown` icon component
  */
-export const Dropdown: React.FC<DropdownProps> = ({ boxSize }) => {
-  return <DropdownIcon boxSize={boxSize} />;
+export const Dropdown: React.FC<DropdownProps> = ({ boxSize, disabled }) => {
+  return (
+    <DropdownIcon boxSize={boxSize} fill={disabled ? '#3C3C4399' : '#0082FF'} />
+  );
 };

package/src/components/icons/index.tsx

@@ -33,6 +33,7 @@ import { Vault } from './vault';
 import { Question } from './question';
 import { Video } from './video';
 import { Page } from './page';
+import { Workspace } from './workspace';
 
 export {
   Checkmark,
@@ -70,4 +71,5 @@ export {
   Vault,
   Video,
   Warning,
+  Workspace,
 };

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

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Image } from '@chakra-ui/react';
+import path from './workspace.png';
+
+export interface WorkspaceProps {
+  boxSize: number | string;
+}
+
+/**
+ * A functional React component utilized to render the `Workspace` icon component
+ */
+export const Workspace: React.FC<WorkspaceProps> = ({ boxSize }) => {
+  return <Image src={path} boxSize={boxSize} />;
+};

package/src/components/input/StackedMultiSelect/index.tsx

@@ -330,7 +330,7 @@ const StackedMultiSelect = React.forwardRef<
           _focus={{ boxShadow: 'none !important' }}
         />
         <Flex mr="4px" justifyContent="center" alignItems="center">
-          <DropdownIcon boxSize="16px" />
+          <DropdownIcon boxSize="16px" disabled={disabled} />
         </Flex>
       </Flex>
       {isFocussed && (

package/src/components/input/StackedPilledInput/index.tsx

@@ -288,34 +288,36 @@ const StackedPilledInput = React.forwardRef<
             </Text>
           ) : null}
         </Flex>
-        <Flex flex={1} minWidth={isFocussed && !tokenIndex ? '20%' : 0}>
-          <Input
-            onKeyDown={onHandleKeyDown}
-            type="text"
-            padding={0}
-            alignContent="flex-start"
-            float="right"
-            border="none"
-            height="auto"
-            color={tokenIndex !== null ? 'transparent' : colors.label.primary}
-            _focus={{ boxShadow: 'none !important' }}
-            value={localValue}
-            onChange={e =>
-              tokenIndex === null &&
-              setLocalValue(
-                e.target.value.trim().replace(',', '').length
-                  ? e.target.value
-                  : ''
-              )
-            }
-            ref={inputRef}
-            onFocus={() => setIsFocussed(true)}
-            onBlur={() => {
-              setIsFocussed(false);
-              return setTokenIndex(null);
-            }}
-          />
-        </Flex>
+        {!disabled && (
+          <Flex flex={1} minWidth={isFocussed && !tokenIndex ? '20%' : 0}>
+            <Input
+              onKeyDown={onHandleKeyDown}
+              type="text"
+              padding={0}
+              alignContent="flex-start"
+              float="right"
+              border="none"
+              height="auto"
+              color={tokenIndex !== null ? 'transparent' : colors.label.primary}
+              _focus={{ boxShadow: 'none !important' }}
+              value={localValue}
+              onChange={e =>
+                tokenIndex === null &&
+                setLocalValue(
+                  e.target.value.trim().replace(',', '').length
+                    ? e.target.value
+                    : ''
+                )
+              }
+              ref={inputRef}
+              onFocus={() => setIsFocussed(true)}
+              onBlur={() => {
+                setIsFocussed(false);
+                return setTokenIndex(null);
+              }}
+            />
+          </Flex>
+        )}
       </Flex>
     </Box>
   );

package/src/components/input/StackedSelect/index.tsx

@@ -212,7 +212,7 @@ const StackedSelect = React.forwardRef<HTMLInputElement, StackedSelectProps>(
             cursor={disabled ? 'not-allowed' : 'pointer'}
             onClick={() => !disabled && setIsFocussed(!isFocussed)}
           >
-            <DropdownIcon boxSize="16px" />
+            <DropdownIcon boxSize="16px" disabled={disabled} />
           </InputRightElement>
         </InputGroup>
         {isFocussed && (