@bookjane2/bookjane-design-library 7.3.55 → 8.0.1

package/lib/components/BKJPillDropdown/BKJPillDropdown.styled.d.ts

@@ -0,0 +1,21 @@
+import { IBKJPillDropdownContext, TextAreaWrapperProps } from './BKJPillDropdown.types.js';
+export declare const InputLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+    disabled?: boolean;
+}>> & string;
+export declare const ErrorMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+export declare const InputMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, Partial<Pick<IBKJPillDropdownContext, "inputValue" | "isMaxLimitReached">>>> & string;
+export declare const RequiredAsterisk: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled"> & {
+    disabled?: boolean;
+}, "disabled" | "key" | keyof import("react").LabelHTMLAttributes<HTMLLabelElement>> & {
+    ref?: import("react").Ref<HTMLLabelElement>;
+}, never>> & string;
+export declare const BKJPillDropdownWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+export declare const TextAreaWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TextAreaWrapperProps>> & string;
+export declare const BKJPillDropdownComboBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxProps<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxOption<string | number, string, string | number>> & {
+    children?: import("react").ReactNode;
+}, {
+    hasValue: boolean;
+    isFocused: boolean;
+}>> & string & Omit<import("react").FC<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxProps<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxOption<string | number, string, string | number>>>, keyof import("react").Component<any, {}, any>>;
+export declare const ArrowIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+//# sourceMappingURL=BKJPillDropdown.styled.d.ts.map

package/lib/components/BKJPillDropdown/BKJPillDropdown.styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillDropdown.styled.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/BKJPillDropdown.styled.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,uBAAuB,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAGxF,eAAO,MAAM,UAAU;eAA6B,OAAO;YAE1D,CAAC;AAEF,eAAO,MAAM,YAAY,sOAExB,CAAC;AAEF,eAAO,MAAM,YAAY,wTAYxB,CAAC;AAEF,eAAO,MAAM,gBAAgB;eAtBuB,OAAO;;;mBAwB1D,CAAC;AAEF,eAAO,MAAM,sBAAsB,sOAIlC,CAAC;AAEF,eAAO,MAAM,eAAe,yPAwB3B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;cACxB,OAAO;eACN,OAAO;6PAuBnB,CAAC;AAEF,eAAO,MAAM,gBAAgB,6NAK5B,CAAC"}

package/lib/components/BKJPillDropdown/BKJPillDropdown.styled.js

@@ -0,0 +1,81 @@
+import styled, { css } from 'styled-components';
+import { InputBaseCSS, InputErrorMessageCSS, InputLabelCSS, InputMessageCSS, InputRequiredAsteriskCSS, InputWrapperCSS, } from '../common/index.js';
+import { BKJComboBox } from '../BKJComboBox/index.js';
+export const InputLabel = styled.label `
+  ${InputLabelCSS}
+`;
+export const ErrorMessage = styled.label `
+  ${InputErrorMessageCSS}
+`;
+export const InputMessage = styled.label `
+  ${InputMessageCSS};
+
+  ${({ isMaxLimitReached }) => {
+    if (isMaxLimitReached)
+        return css `
+        color: ${({ theme }) => theme.colors.ErrorDefault};
+      `;
+    return css ``;
+}}
+`;
+export const RequiredAsterisk = styled(InputLabel) `
+  ${InputRequiredAsteriskCSS}
+`;
+export const BKJPillDropdownWrapper = styled.label `
+  ${InputWrapperCSS};
+  display: flex;
+  flex-direction: column;
+`;
+export const TextAreaWrapper = styled.div `
+  ${InputBaseCSS};
+  border: 1px solid ${({ theme }) => theme.colors.Grey6};
+
+  height: auto;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  overflow-y: overlay;
+  position: relative;
+
+  z-index: 1;
+
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  border-bottom: none;
+
+  ${({ isFocused, hasValue, theme }) => !isFocused &&
+    !hasValue &&
+    css `
+      border-bottom: 1px solid ${theme.colors.Grey6};
+    `};
+`;
+export const BKJPillDropdownComboBox = styled(BKJComboBox) `
+  ${({ hasValue }) => hasValue
+    ? css `
+          input {
+            border-top-left-radius: 0px !important;
+            border-top-right-radius: 0px !important;
+            border-top: none !important;
+            margin-top: -30px;
+            color: transparent;
+          }
+          .bkj-combobox-dropdown-icon {
+            svg {
+              display: none;
+            }
+          }
+        `
+    : css `
+          input {
+            height: 46px;
+          }
+        `};
+`;
+export const ArrowIconWrapper = styled.div `
+  position: absolute;
+  top: 7px;
+  right: 8px;
+  pointer-events: none;
+`;
+//# sourceMappingURL=BKJPillDropdown.styled.js.map

package/lib/components/BKJPillDropdown/BKJPillDropdown.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillDropdown.styled.js","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/BKJPillDropdown.styled.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACL,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,eAAe,EACf,wBAAwB,EACxB,eAAe,GAChB,MAAM,WAAW,CAAC;AAEnB,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAwB;IAC1D,aAAa;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;IACpC,oBAAoB;CACvB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAEvC;IACG,eAAe;;IAEf,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE;IAC1B,IAAI,iBAAiB;QACnB,OAAO,GAAG,CAAA;iBACC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY;OAClD,CAAC;IACJ,OAAO,GAAG,CAAA,EAAE,CAAC;AACf,CAAC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;IAC9C,wBAAwB;CAC3B,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,KAAK,CAAA;IAC9C,eAAe;;;CAGlB,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAsB;IAC3D,YAAY;sBACM,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK;;;;;;;;;;;;;;;;IAgBnD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,CACnC,CAAC,SAAS;IACV,CAAC,QAAQ;IACT,GAAG,CAAA;iCAC0B,KAAK,CAAC,MAAM,CAAC,KAAK;KAC9C;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,WAAW,CAAC,CAGxD;IACE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACN,CAAC,CAAC,GAAG,CAAA;;;;;;;;;;;;;SAaF;IACH,CAAC,CAAC,GAAG,CAAA;;;;SAIF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKzC,CAAC"}

package/lib/components/BKJPillDropdown/BKJPillDropdown.types.d.ts

@@ -0,0 +1,49 @@
+import { Dispatch, FocusEventHandler, InputHTMLAttributes, MouseEventHandler, RefObject, SetStateAction } from 'react';
+import { BKJTextInputValueType, ChangeFunctionType, FormValidationErrorMessageType } from '../../common.types.js';
+import { IBKJComboBoxOption, IBKJComboBoxProps } from '../BKJComboBox/BKJComboBox.types.js';
+export interface IBKJPillDropdownProvider {
+    readonly value?: string[];
+    readonly onChange: IBKJPillDropdownContext['onInputChange'];
+    readonly name: string;
+    readonly validations: IBKJPillDropdown['validations'];
+    readonly max: IBKJPillDropdown['max'];
+}
+export interface IBKJPillDropdownContext extends InputHTMLAttributes<HTMLInputElement> {
+    wrapperRef: RefObject<HTMLDivElement>;
+    inputRef: RefObject<HTMLInputElement>;
+    readonly value: string[];
+    inputValue: string;
+    setInputValue: Dispatch<SetStateAction<string>>;
+    onInputFocused: MouseEventHandler<HTMLDivElement>;
+    onInputChange: ChangeFunctionType;
+    onInputBlur: FocusEventHandler<HTMLInputElement>;
+    isFocused: boolean;
+    onIsOpenChange: (args: {}) => void;
+    onChipRemove: (label: string) => MouseEventHandler<HTMLDivElement>;
+    uuid: string;
+    isMaxLimitReached: boolean;
+    options?: IBKJComboBoxProps['options'];
+}
+export interface IBKJPillDropdown extends InputHTMLAttributes<any> {
+    readonly options: IBKJComboBoxProps<IBKJComboBoxOption<string>>['options'];
+    readonly label?: string;
+    readonly required?: boolean;
+    readonly disabled?: boolean;
+    readonly description?: string;
+    readonly error?: FormValidationErrorMessageType;
+    readonly value: BKJTextInputValueType[];
+    readonly onChange: ChangeFunctionType;
+    readonly name: string;
+    readonly placeholder?: string;
+    readonly validations: Array<() => string | string[] | true>;
+    readonly max: number;
+    readonly showSelectAll?: boolean;
+    children?: JSX.Element | JSX.Element[] | any;
+}
+export interface TextAreaWrapperProps {
+    disabled?: boolean;
+    hasValue?: boolean;
+    isFocused?: boolean;
+    error?: FormValidationErrorMessageType;
+}
+//# sourceMappingURL=BKJPillDropdown.types.d.ts.map

package/lib/components/BKJPillDropdown/BKJPillDropdown.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillDropdown.types.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/BKJPillDropdown.types.ts"],"names":[],"mappings":"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"}

package/lib/components/BKJPillDropdown/BKJPillDropdown.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=BKJPillDropdown.types.js.map

package/lib/components/BKJPillDropdown/BKJPillDropdown.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillDropdown.types.js","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/BKJPillDropdown.types.ts"],"names":[],"mappings":""}

package/lib/components/BKJPillDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export * from './BKJPillDropdown.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/BKJPillDropdown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/lib/components/BKJPillDropdown/index.js

@@ -0,0 +1,2 @@
+export * from './BKJPillDropdown.js';
+//# sourceMappingURL=index.js.map

package/lib/components/BKJPillDropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BKJPillDropdown/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.context.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { IBKJPillSelectContext, IBKJPillSelectProvider } from './BKJPillSelect.types.js';
+export declare const BKJPillSelectProvider: FC<IBKJPillSelectProvider>;
+export declare const useBKJPillSelectContext: () => IBKJPillSelectContext;
+//# sourceMappingURL=BKJPillSelect.context.d.ts.map

package/lib/components/BKJPillSelect/BKJPillSelect.context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.context.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EASH,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAItF,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC,sBAAsB,CAsG5D,CAAC;AAEF,eAAO,MAAM,uBAAuB,6BAAyC,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.context.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useCallback, useContext, useMemo, useRef, useState, } from 'react';
+import { v4 as uuidv4 } from 'uuid';
+const BKJPillSelectContext = createContext(null);
+export const BKJPillSelectProvider = ({ children, value = [], onChange, name, max, }) => {
+    const wrapperRef = useRef(null);
+    const inputRef = useRef(null);
+    const mouseDownTargetRef = useRef(null);
+    const [uuid] = useState(uuidv4());
+    const [inputValue, setInputValue] = useState('');
+    const [isFocused, setFocus] = useState(false);
+    const onInputFocused = useCallback((event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        inputRef.current?.focus();
+        setFocus(true);
+        inputRef.current?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        return void 0;
+    }, []);
+    const setNextValue = useCallback((nextValue) => {
+        if (nextValue) {
+            onChange({ target: { name, value: nextValue } });
+            setInputValue('');
+        }
+        return void 0;
+    }, [name, onChange]);
+    const onInputChange = useCallback((e) => {
+        setNextValue(e.target.value);
+        setFocus(false);
+    }, [setNextValue]);
+    const onChipRemove = useCallback((__VALUE__) => {
+        return (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            const index = value.indexOf(__VALUE__);
+            const nextValue = Array.from(value);
+            nextValue.splice(index, 1);
+            onChange({ target: { name, value: nextValue } });
+        };
+    }, [name, onChange, value]);
+    const onInputBlur = useCallback((event) => {
+        const containsTarget = event.currentTarget.contains(mouseDownTargetRef.current);
+        if (containsTarget)
+            event.stopPropagation();
+        if (isFocused) {
+            event.preventDefault();
+            event.stopPropagation();
+            setFocus(false);
+        }
+    }, [isFocused]);
+    const isMaxLimitReached = useMemo(() => {
+        return value.length > max;
+    }, [max, value.length]);
+    const onIsOpenChange = useCallback(({ isOpen }) => {
+        if (!isOpen)
+            setFocus(false);
+    }, []);
+    return (_jsx(BKJPillSelectContext.Provider, { value: {
+            wrapperRef,
+            inputRef,
+            value,
+            inputValue,
+            onInputFocused,
+            onInputChange,
+            onInputBlur,
+            onChipRemove,
+            isFocused,
+            setInputValue,
+            uuid,
+            isMaxLimitReached,
+            onIsOpenChange,
+        }, children: children }));
+};
+export const useBKJPillSelectContext = () => useContext(BKJPillSelectContext);
+//# sourceMappingURL=BKJPillSelect.context.js.map

package/lib/components/BKJPillSelect/BKJPillSelect.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.context.js","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.context.tsx"],"names":[],"mappings":"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"}

package/lib/components/BKJPillSelect/BKJPillSelect.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { IBKJPillSelect } from './BKJPillSelect.types.js';
+export declare const BKJPillSelect: FC<IBKJPillSelect>;
+//# sourceMappingURL=BKJPillSelect.d.ts.map

package/lib/components/BKJPillSelect/BKJPillSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAwB,MAAM,OAAO,CAAC;AAajD,OAAO,EAAE,cAAc,EAAyB,MAAM,uBAAuB,CAAC;AAmI9E,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,cAAc,CAmB5C,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.js

@@ -0,0 +1,31 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, forwardRef } from 'react';
+import { BKJChip } from '../index.js';
+import { BKJTextInputErrorMessage } from '../BKJTextInput/BKJTextInput.styled.js';
+import { Flex } from '../Flex/index.js';
+import { BKJPillSelectProvider, useBKJPillSelectContext } from './BKJPillSelect.context.js';
+import { BKJPillSelectComboBox, BKJPillSelectWrapper, InputLabel, InputMessage, RequiredAsterisk, TextAreaWrapper, } from './BKJPillSelect.styled.js';
+const InputComponent = forwardRef(({ onInputChange, value, isFocused, onIsOpenChange, options = [], ...rest }, ref) => {
+    return (_jsx(BKJPillSelectComboBox, { ...rest, overrides: ['HIDE_VALUE_LABEL'], ref: ref, action: "OpenToggle", name: "BKJPillSelect_InputValue", options: options, 
+        // onBlur={onBlur}
+        type: "Multiple", onIsOpenChange: onIsOpenChange, onChange: onInputChange, value: value, hasValue: value.length > 0, isFocused: isFocused }));
+});
+const BKJPillSelectComponent = (props) => {
+    const { value, label, required, disabled, description, name, placeholder, error, max, options, ...rest } = props;
+    const { wrapperRef, inputRef, uuid, onChipRemove, onInputFocused, onInputChange, onInputBlur, isMaxLimitReached, onIsOpenChange, isFocused, } = useBKJPillSelectContext();
+    return (_jsxs(BKJPillSelectWrapper, { children: [label && (_jsxs(InputLabel, { disabled: disabled, children: [label, required && _jsx(RequiredAsterisk, { children: "\u00A0*" })] })), value.length !== 0 && (_createElement(TextAreaWrapper, { ...rest, key: `BKJPillSelect_${uuid}`, id: `BKJPillSelect_${uuid}_TextAreaWrapper`, ref: wrapperRef, error: !!error || isMaxLimitReached, disabled: disabled, onMouseDown: onInputFocused, hasValue: value.length > 0, isFocused: isFocused },
+                _jsx(Flex, { flexWrap: "wrap", gap: "4px", padding: value.length > 0 ? '8px 8px 0' : '8px 8px', children: value.map((strValue) => {
+                        const MATCHED = options.find(({ value }) => value === strValue);
+                        if (!MATCHED)
+                            return _jsx(Fragment, {});
+                        return (_jsx(BKJChip, { onClose: onChipRemove(MATCHED.value), variant: "Purple", children: MATCHED.label }, MATCHED.value));
+                    }) }))), value.length === 0 ? (_jsx(InputComponent, { ref: inputRef, options: options, isFocused: isFocused, value: value, onInputChange: onInputChange, onBlur: onInputBlur, onIsOpenChange: onIsOpenChange })) : isFocused ? (_jsx(InputComponent, { ref: inputRef, options: options, isFocused: isFocused, value: value, onInputChange: onInputChange, onBlur: onInputBlur, onIsOpenChange: onIsOpenChange })) : (_jsx(Fragment, {})), description && _jsx(InputMessage, { children: description }), _jsx(InputMessage, { isMaxLimitReached: isMaxLimitReached, children: isMaxLimitReached
+                    ? `You've reached the max of ${max} options (${value.length}/${max})`
+                    : `${value.length}/${max}` }), error && (_jsx(Fragment, { children: error && Array.isArray(error) ? (error.length &&
+                    error.map((err) => _jsx(BKJTextInputErrorMessage, { children: err }, err))) : (_jsx(BKJTextInputErrorMessage, { children: error })) }))] }));
+};
+export const BKJPillSelect = ({ value = [], onChange, name, validations, max = 10, ...rest }) => {
+    return (_jsx(BKJPillSelectProvider, { value: value, onChange: onChange, name: name, validations: validations, max: max, children: _jsx(BKJPillSelectComponent, { name: name, value: value, max: max, ...rest }) }));
+};
+//# sourceMappingURL=BKJPillSelect.js.map

package/lib/components/BKJPillSelect/BKJPillSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.js","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.tsx"],"names":[],"mappings":"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"}

package/lib/components/BKJPillSelect/BKJPillSelect.stories.d.ts

@@ -0,0 +1,34 @@
+import { IBKJPillSelect } from './BKJPillSelect.types.js';
+declare const setup: {
+    title: string;
+    component: import("react").FC<IBKJPillSelect>;
+    argTypes: {
+        label: {
+            name: string;
+        };
+        error: {
+            name: string;
+            control: {
+                type: string;
+            };
+        };
+        height: {
+            name: string;
+        };
+        required: {
+            name: string;
+        };
+        placeholder: {
+            name: string;
+        };
+        disabled: {
+            name: string;
+        };
+        value: {
+            name: string;
+        };
+    };
+};
+export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, IBKJPillSelect>;
+export default setup;
+//# sourceMappingURL=BKJPillSelect.stories.d.ts.map

package/lib/components/BKJPillSelect/BKJPillSelect.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.stories.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAQvD,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6BV,CAAC;AAoDF,eAAO,MAAM,OAAO,qGAAoB,CAAC;AAQzC,eAAe,KAAK,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.stories.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BKJPillSelect } from './BKJPillSelect.js';
+import { useFormBehaviors } from '../../hooks/index.js';
+import uniq from 'lodash/uniq';
+import filter from 'lodash/filter';
+import includes from 'lodash/includes';
+const setup = {
+    title: 'Input Elements/BKJPillSelect',
+    component: BKJPillSelect,
+    argTypes: {
+        label: {
+            name: 'Label Text',
+        },
+        error: {
+            name: 'Error Message',
+            control: {
+                type: 'text',
+            },
+        },
+        height: {
+            name: 'Height',
+        },
+        required: {
+            name: 'Required Field',
+        },
+        placeholder: {
+            name: 'Placeholder',
+        },
+        disabled: {
+            name: 'Disabled',
+        },
+        value: {
+            name: 'Array Items',
+        },
+    },
+};
+const initialState = {
+    data: ['1'],
+};
+// const initialState = {
+//   data: [...Array(201)].map((_, i) => {
+//     return `Field ${i + 1}`;
+//   }) as string[],
+// };
+function VALIDATION_unique(data) {
+    let errs = [];
+    const hasDuplicates = uniq(data).length !== data.length;
+    const duplicates = uniq(filter(data, (val, i, iteratee) => includes(iteratee, val, i + 1)));
+    if (data.length === 0)
+        errs.push('At least 1 option is required');
+    if (hasDuplicates)
+        [`Remove duplicate values`, ...duplicates.map((str) => `\t• ${str}`)].forEach((item) => errs.push(item));
+    if (errs.length)
+        return errs;
+    return '';
+}
+const opts = [...Array(300)].map((_, i) => {
+    return { id: String(i + 1), label: `Item Number #${i + 1}`, value: String(i + 1) };
+});
+const Template = (props) => {
+    const { values: { data }, onChange, fieldErrors, } = useFormBehaviors({
+        initialState,
+        onSubmit: console.log,
+        validations: {
+            data: VALIDATION_unique,
+        },
+    });
+    return (_jsx(BKJPillSelect, { ...props, options: opts, max: 200, onChange: onChange, name: "data", value: data, error: fieldErrors['data'] }));
+};
+export const Default = Template.bind({});
+Default.args = {
+    label: 'Industries',
+    required: true,
+    placeholder: "Type or paste a list of dropdown values, so that there's one value per line.",
+};
+export default setup;
+//# sourceMappingURL=BKJPillSelect.stories.js.map

package/lib/components/BKJPillSelect/BKJPillSelect.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.stories.js","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.stories.tsx"],"names":[],"mappings":"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"}

package/lib/components/BKJPillSelect/BKJPillSelect.styled.d.ts

@@ -0,0 +1,20 @@
+import { IBKJPillSelectContext, TextAreaWrapperProps } from './BKJPillSelect.types.js';
+export declare const InputLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+    disabled?: boolean;
+}>> & string;
+export declare const ErrorMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+export declare const InputMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, Partial<Pick<IBKJPillSelectContext, "isMaxLimitReached">>>> & string;
+export declare const RequiredAsterisk: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled"> & {
+    disabled?: boolean;
+}, "disabled" | "key" | keyof import("react").LabelHTMLAttributes<HTMLLabelElement>> & {
+    ref?: import("react").Ref<HTMLLabelElement>;
+}, never>> & string;
+export declare const BKJPillSelectWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
+export declare const TextAreaWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TextAreaWrapperProps>> & string;
+export declare const BKJPillSelectComboBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxProps<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxOption<string | number, string, string | number>> & {
+    children?: import("react").ReactNode;
+}, {
+    hasValue: boolean;
+    isFocused: boolean;
+}>> & string & Omit<import("react").FC<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxProps<import("../BKJComboBox/BKJComboBox.types.js").IBKJComboBoxOption<string | number, string, string | number>>>, keyof import("react").Component<any, {}, any>>;
+//# sourceMappingURL=BKJPillSelect.styled.d.ts.map

package/lib/components/BKJPillSelect/BKJPillSelect.styled.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.styled.d.ts","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.styled.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAEpF,eAAO,MAAM,UAAU;eAA6B,OAAO;YAE1D,CAAC;AAEF,eAAO,MAAM,YAAY,sOAExB,CAAC;AAEF,eAAO,MAAM,YAAY,uSAUxB,CAAC;AAEF,eAAO,MAAM,gBAAgB;eApBuB,OAAO;;;mBAsB1D,CAAC;AAEF,eAAO,MAAM,oBAAoB,sOAIhC,CAAC;AAEF,eAAO,MAAM,eAAe,yPA2C3B,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;cAAmC,OAAO;eAAa,OAAO;6PAY/F,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.styled.js

@@ -0,0 +1,81 @@
+import styled, { css } from 'styled-components';
+import { BKJComboBox } from '../BKJComboBox/index.js';
+import { InputBaseCSS, InputErrorMessageCSS, InputLabelCSS, InputMessageCSS, InputRequiredAsteriskCSS, InputWrapperCSS, } from '../common/index.js';
+export const InputLabel = styled.label `
+  ${InputLabelCSS}
+`;
+export const ErrorMessage = styled.label `
+  ${InputErrorMessageCSS}
+`;
+export const InputMessage = styled.label `
+  ${InputMessageCSS};
+
+  ${({ isMaxLimitReached }) => {
+    if (isMaxLimitReached)
+        return css `
+        color: ${({ theme }) => theme.colors.ErrorDefault};
+      `;
+    return css ``;
+}}
+`;
+export const RequiredAsterisk = styled(InputLabel) `
+  ${InputRequiredAsteriskCSS}
+`;
+export const BKJPillSelectWrapper = styled.label `
+  ${InputWrapperCSS};
+  display: flex;
+  flex-direction: column;
+`;
+export const TextAreaWrapper = styled.div `
+  ${InputBaseCSS};
+  border: 1px solid ${({ theme }) => theme.colors.Grey6};
+
+  height: auto;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  overflow-y: overlay;
+  position: relative;
+
+  ${({ isFocused, theme }) => !isFocused &&
+    css `
+      border-bottom-left-radius: 8px;
+      border-bottom-right-radius: 8px;
+      border-bottom: 1px solid ${theme.colors.Grey6};
+      padding-bottom: 8px;
+    `};
+  ${({ hasValue }) => !hasValue &&
+    css `
+      border-bottom-left-radius: 0px;
+      border-bottom-right-radius: 0px;
+      border-bottom: none;
+    `};
+  ${({ isFocused, hasValue }) => isFocused &&
+    hasValue &&
+    css `
+      border-bottom-left-radius: 0px;
+      border-bottom-right-radius: 0px;
+      border-bottom: none;
+    `};
+  ${({ isFocused, hasValue, theme }) => !isFocused &&
+    !hasValue &&
+    css `
+      border-bottom-left-radius: 8px;
+      border-bottom-right-radius: 8px;
+      border-bottom: 1px solid ${theme.colors.Grey6};
+    `};
+`;
+export const BKJPillSelectComboBox = styled(BKJComboBox) `
+  ${({ hasValue }) => hasValue &&
+    css `
+      input {
+        border-top-left-radius: 0px !important;
+        border-top-right-radius: 0px !important;
+        border-top: none !important;
+      }
+    `};
+
+  ${({ isFocused }) => (isFocused ? css `` : css ``)}
+`;
+//# sourceMappingURL=BKJPillSelect.styled.js.map

package/lib/components/BKJPillSelect/BKJPillSelect.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BKJPillSelect.styled.js","sourceRoot":"","sources":["../../../src/components/BKJPillSelect/BKJPillSelect.styled.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EACL,YAAY,EACZ,oBAAoB,EACpB,aAAa,EACb,eAAe,EACf,wBAAwB,EACxB,eAAe,GAChB,MAAM,WAAW,CAAC;AAGnB,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAwB;IAC1D,aAAa;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAA;IACpC,oBAAoB;CACvB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAA2D;IAC/F,eAAe;;IAEf,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE;IAC1B,IAAI,iBAAiB;QACnB,OAAO,GAAG,CAAA;iBACC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY;OAClD,CAAC;IACJ,OAAO,GAAG,CAAA,EAAE,CAAC;AACf,CAAC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;IAC9C,wBAAwB;CAC3B,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAAA;IAC5C,eAAe;;;CAGlB,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAsB;IAC3D,YAAY;sBACM,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK;;;;;;;;;;IAUnD,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,CACzB,CAAC,SAAS;IACV,GAAG,CAAA;;;iCAG0B,KAAK,CAAC,MAAM,CAAC,KAAK;;KAE9C;IACD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,CAAC,QAAQ;IACT,GAAG,CAAA;;;;KAIF;IACD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC5B,SAAS;IACT,QAAQ;IACR,GAAG,CAAA;;;;KAIF;IACD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,CACnC,CAAC,SAAS;IACV,CAAC,QAAQ;IACT,GAAG,CAAA;;;iCAG0B,KAAK,CAAC,MAAM,CAAC,KAAK;KAC9C;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,WAAW,CAAC,CAA2C;IAC/F,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR,GAAG,CAAA;;;;;;KAMF;;IAED,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAA,EAAE,CAAC,CAAC,CAAC,GAAG,CAAA,EAAE,CAAC;CACjD,CAAC"}

package/lib/components/BKJPillSelect/BKJPillSelect.types.d.ts

@@ -0,0 +1,48 @@
+import { Dispatch, FocusEventHandler, InputHTMLAttributes, MouseEventHandler, RefObject, SetStateAction } from 'react';
+import { BKJTextInputValueType, ChangeFunctionType, FormValidationErrorMessageType } from '../../common.types.js';
+import { IBKJComboBoxOption, IBKJComboBoxProps } from '../BKJComboBox/BKJComboBox.types.js';
+export interface IBKJPillSelectProvider {
+    readonly value?: string[];
+    readonly onChange: IBKJPillSelectContext['onInputChange'];
+    readonly name: string;
+    readonly validations: IBKJPillSelect['validations'];
+    readonly max: IBKJPillSelect['max'];
+}
+export interface IBKJPillSelectContext extends InputHTMLAttributes<HTMLInputElement> {
+    wrapperRef: RefObject<HTMLDivElement>;
+    inputRef: RefObject<HTMLInputElement>;
+    readonly value: string[];
+    inputValue: string;
+    setInputValue: Dispatch<SetStateAction<string>>;
+    onInputFocused: MouseEventHandler<HTMLDivElement>;
+    onInputChange: ChangeFunctionType;
+    onInputBlur: FocusEventHandler<HTMLInputElement>;
+    isFocused: boolean;
+    onIsOpenChange: (args: {}) => void;
+    onChipRemove: (label: string) => MouseEventHandler<HTMLDivElement>;
+    uuid: string;
+    isMaxLimitReached: boolean;
+    options?: IBKJComboBoxProps['options'];
+}
+export interface IBKJPillSelect extends InputHTMLAttributes<any> {
+    readonly options: IBKJComboBoxProps<IBKJComboBoxOption<string>>['options'];
+    readonly label?: string;
+    readonly required?: boolean;
+    readonly disabled?: boolean;
+    readonly description?: string;
+    readonly error?: FormValidationErrorMessageType;
+    readonly value: BKJTextInputValueType[];
+    readonly onChange: ChangeFunctionType;
+    readonly name: string;
+    readonly placeholder?: string;
+    readonly validations: Array<() => string | string[] | true>;
+    readonly max: number;
+    children?: JSX.Element | JSX.Element[] | any;
+}
+export interface TextAreaWrapperProps {
+    disabled?: boolean;
+    hasValue?: boolean;
+    isFocused?: boolean;
+    error?: FormValidationErrorMessageType;
+}
+//# sourceMappingURL=BKJPillSelect.types.d.ts.map