@seeqdev/qomponents 0.0.93 → 0.0.95

package/dist/index.js

@@ -4695,11 +4695,11 @@ const borderColorClasses$2 = [
     'active:tw-border-sq-color-dark',
 ].join(' ');
 const baseClasses$3 = 'tw-h-inputs tw-leading-normal tw-outline-none tw-py-1 tw-px-3' +
-    ' disabled:tw-pointer-events-none' +
+    ' disabled:tw-pointer-events-none disabled:tw-bg-sq-light-gray  disabled:dark:tw-bg-sq-dark-disabled-gray' +
     ' disabled:tw-cursor-not-allowed tw-p-1 tw-border-solid tw-border tw-placeholder-gray-400' +
     '  dark:tw-placeholder-sq-dark-text-lighter specTextField';
-const darkTheme$1 = 'dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text';
-const lightTheme$1 = 'tw-text-sq-text-color';
+const darkTheme$1 = 'dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text disabled:dark:tw-text-sq-dark-text-lighter';
+const lightTheme$1 = 'tw-text-sq-text-color disabled:tw-text-sq-darkish-gray';
 const sizeClasses = {
     sm: 'tw-text-sm',
     lg: 'tw-text-xl',
@@ -4708,7 +4708,7 @@ const sizeClasses = {
  * Textfield.
  */
 const TextField = React.forwardRef((props, ref) => {
-    const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, } = props;
+    const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, maxLength, minLength, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, autoFocus = false, } = props;
     const internalRef = React.useRef(null);
     const [cursor, setCursor] = React.useState(null);
     const setAllRefs = (receivedRef) => {
@@ -4718,7 +4718,7 @@ const TextField = React.forwardRef((props, ref) => {
     };
     React.useEffect(() => {
         const input = internalRef.current;
-        if (input && type !== 'number')
+        if (input && type !== 'number' && type !== 'email')
             input.setSelectionRange(cursor, cursor);
     }, [ref, cursor, value]);
     const handleChange = (e) => {
@@ -4744,13 +4744,18 @@ const TextField = React.forwardRef((props, ref) => {
         borderRadius = 'tw-rounded-r-sm tw-border-l-0 focus:tw-border-l active:tw-border-l';
     }
     const appliedClasses = `${baseClasses$3} ${sizeClasses[size]} ${extraClassNames} ${lightTheme$1} ${darkTheme$1} ${borderRadius} ${showError ? errorClasses$2 : borderColorClasses$2} `;
-    const styleProp = setValidInputDimension(inputWidth, inputHeight)
+    const inputProp = setValidInputDimension(inputWidth, inputHeight)
         ? {
             style: setValidInputDimension(inputWidth, inputHeight),
         }
         : {};
+    const inputLenghtProp = {};
+    if (maxLength)
+        inputLenghtProp.maxLength = maxLength;
+    if (minLength)
+        inputLenghtProp.minLength = minLength;
     return (React.createElement(React.Fragment, null,
-        React.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, ...styleProp }),
+        React.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, autoFocus: autoFocus, ...inputLenghtProp, ...inputProp }),
         errorText && showError && React.createElement("div", { className: "tw-text-sq-danger-color tw-text-xs tw-mt-1" }, errorText)));
 });
 
@@ -4778,9 +4783,11 @@ const Checkbox = (props) => {
 };
 
 const baseClasses$1 = 'tw-leading-normal tw-outline-none tw-py-1 tw-px-3 tw-rounded-sm' +
+    ' disabled:tw-pointer-events-none disabled:tw-bg-sq-light-gray  disabled:dark:tw-bg-sq-dark-disabled-gray' +
     ' disabled:tw-cursor-not-allowed tw-p-1 tw-border-solid tw-border tw-text-sm';
-const darkTheme = 'dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text ' + 'dark:tw-placeholder-sq-dark-text-lighter';
-const lightTheme = 'tw-text-sq-text-color tw-placeholder-gray-400';
+const darkTheme = 'dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text ' +
+    'dark:tw-placeholder-sq-dark-text-lighter  disabled:dark:tw-text-sq-dark-text-lighter';
+const lightTheme = 'tw-text-sq-text-color tw-placeholder-gray-400  disabled:tw-text-sq-darkish-gray';
 const errorClasses$1 = 'tw-border-sq-danger-color';
 const borderColorClasses$1 = [
     'tw-border-sq-disabled-gray',
@@ -4793,9 +4800,9 @@ const borderColorClasses$1 = [
 /**
  * TextArea.
  */
-const TextArea = ({ readonly = false, onChange, onKeyUp, id, name, rows = 3, cols = undefined, value, placeholder, extraClassNames, testId, autofocus = false, showError, }) => {
+const TextArea = ({ readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, rows = 3, cols = undefined, value, placeholder, showError, extraClassNames, testId, autoFocus = false, }) => {
     const appliedClasses = `${baseClasses$1} ${extraClassNames} ${lightTheme} ${darkTheme} ${showError ? errorClasses$1 : borderColorClasses$1}`;
-    return (React.createElement("textarea", { "data-testid": testId, name: name, id: id, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, onChange: onChange, onKeyUp: onKeyUp, rows: rows, cols: cols, autoFocus: autofocus }));
+    return (React.createElement("textarea", { "data-testid": testId, name: name, id: id, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, onChange: onChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, rows: rows, cols: cols, autoFocus: autoFocus }));
 };
 
 /**
@@ -16182,7 +16189,7 @@ const ButtonWithDropdown = ({ dropdownItems, triggerIcon, id, extraClassNames, c
                     }))))));
 };
 
-const NewWorkbenchItem = (item) => {
+const SeeqActionDropdownItem = (item) => {
     return (React.createElement("div", { className: "tw-flex-col tw-flex tw-p-[10px] tw-pl-5 tw-w-[600px]" },
         React.createElement("div", { className: "tw-flex tw-flex-row tw-gap-2 tw-items-end" },
             item.icon && (React.createElement(Icon, { icon: item.icon, type: "text", extraClassNames: 'tw-rounded-[3px] tw-h-8 tw-w-8 tw-flex tw-justify-center tw-items-center tw-bg-sq-color-dark dark:tw-text-sq-white tw-text-[22px] tw-text-sq-white ' +
@@ -16215,16 +16222,16 @@ const disabledClasses = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
 const renderItem = (variant, item) => {
     switch (variant) {
         case 'create-workbench':
-            return React__namespace.createElement(NewWorkbenchItem, { ...item });
+            return React__namespace.createElement(SeeqActionDropdownItem, { ...item });
         case 'view-workbench':
             return React__namespace.createElement(ViewWorkbench, { ...item });
         case 'insert-seeq-content':
             return React__namespace.createElement(InsertSeeqContent, { ...item });
         default:
-            return React__namespace.createElement(NewWorkbenchItem, { ...item });
+            return React__namespace.createElement(SeeqActionDropdownItem, { ...item });
     }
 };
-const NewWorkbench = ({ newWorkbenchItems, trigger, id, extraClassNames, containerTestId, disabled = false, align = 'end', placement = 'bottom', placementOffset = 5, alignOffset = -35, hasArrow = false, onOpenChange, isOpen, setFocusOnTriggerOnClose = true, keepFocusInsideDropdown = true, variant, ...tooltipProps }) => {
+const SeeqActionDropdown = ({ seeqActionDropdownItems, trigger, id, extraClassNames, containerTestId, disabled = false, align = 'end', placement = 'bottom', placementOffset = 5, alignOffset = -35, hasArrow = false, onOpenChange, isOpen, setFocusOnTriggerOnClose = true, keepFocusInsideDropdown = true, variant, ...tooltipProps }) => {
     const tooltipData = getQTipData(tooltipProps);
     return (React__namespace.createElement($d08ef79370b62062$export$be92b6f5f03c0fe9, { defaultOpen: false, open: isOpen, onOpenChange: onOpenChange, modal: keepFocusInsideDropdown },
         React__namespace.createElement($d08ef79370b62062$export$41fb9f06171c75f4, { id: id, "data-testid": id, className: `tw-border-none focus-visible:tw-outline-none focus:tw-outline-none focus-within:tw-outline-none`, asChild: true, disabled: disabled },
@@ -16237,7 +16244,7 @@ const NewWorkbench = ({ newWorkbenchItems, trigger, id, extraClassNames, contain
                     borderStyles },
                 hasArrow && (React__namespace.createElement($d08ef79370b62062$export$21b07c8f274aebd5, { asChild: true },
                     React__namespace.createElement("div", { className: " tw-fill-transparent tw-bg-white tw-w-[15px] tw-h-[15px] tw-rotate-45 dark:tw-bg-sq-dark-background tw-border-b tw-border-r tw-border-sq-disabled-gray dark:tw-border-gray-500 tw-mt-[-7px]" }))),
-                newWorkbenchItems.map((item, index) => {
+                seeqActionDropdownItems.map((item, index) => {
                     return (React__namespace.createElement("div", { key: item.display + index },
                         React__namespace.createElement($d08ef79370b62062$export$6d08773d2e66f8f2, { onSelect: (e) => {
                                 item.action(e);
@@ -16253,8 +16260,8 @@ exports.ButtonWithPopover = ButtonWithPopover;
 exports.Checkbox = Checkbox;
 exports.Icon = Icon;
 exports.Modal = Modal;
-exports.NewWorkbench = NewWorkbench;
 exports.QTip = QTip;
+exports.SeeqActionDropdown = SeeqActionDropdown;
 exports.Select = Select;
 exports.SelectCompoents = components;
 exports.Tabs = Tabs;