@cuemath/leap 3.2.22-m → 3.2.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/features/notification/notification.js +129 -0
- package/dist/features/notification/notification.js.map +1 -0
- package/dist/features/ui/carousal/carousal-styles.js +45 -0
- package/dist/features/ui/carousal/carousal-styles.js.map +1 -0
- package/dist/features/ui/carousal/carousal.js +76 -0
- package/dist/features/ui/carousal/carousal.js.map +1 -0
- package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js +44 -29
- package/dist/features/ui/dot-lottie-animations/dot-lottie-animation.js.map +1 -1
- package/dist/features/ui/inputs/base-select-input/base-select-input.js +77 -67
- package/dist/features/ui/inputs/base-select-input/base-select-input.js.map +1 -1
- package/dist/index.d.ts +56 -0
- package/dist/index.js +428 -424
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n
|
|
1
|
+
{"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n inputLabelOverrides,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n let foundSection, foundOption;\n\n for (const section of sectionOptions) {\n const option = section.data.find(({ id }) => id === value);\n\n if (option) {\n foundSection = section;\n foundOption = option;\n\n break;\n }\n }\n\n if (foundSection && inputLabelOverrides)\n return inputLabelOverrides(foundSection, foundOption);\n\n return foundOption?.label || '';\n }\n\n if (selectOptions) return selectOptions.find(option => option.id === value)?.label;\n }, [searchable, searchText, sectionOptions, selectOptions, inputLabelOverrides, value]);\n\n const containerRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const inputRef = useRef<HTMLInputElement>(null) as React.RefObject<HTMLInputElement>;\n const { menuVisible, onMenuClick, hideMenu } = useContextMenuClickHandler(\n containerRef,\n undefined,\n !searchable,\n onCloseWithoutSelection,\n disabled,\n );\n\n const handleTextChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n if (searchable && onSearchTextChange) {\n onSearchTextChange(e.target.value);\n }\n },\n [onSearchTextChange, searchable],\n );\n\n const handleChange = useCallback<IBaseSelectInputProps<IDType>['onChange']>(\n (id, option) => {\n hideMenu();\n onChange(id, option);\n },\n [hideMenu, onChange],\n );\n\n const handleFocus = useCallback((e: FocusEvent<HTMLInputElement>) => {\n e.target.select();\n setTimeout(() => {\n e.target.scrollIntoView({\n behavior: 'smooth',\n });\n }, 300);\n }, []);\n\n const handleClear = useCallback(() => {\n if (onSearchTextChange) {\n onSearchTextChange('');\n inputRef.current?.focus();\n }\n }, [onSearchTextChange]);\n\n const downIcon =\n shape === 'curved' || shape === 'borderLess' ? (\n <Styled.StyledChevronDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n ) : (\n <Styled.StyledDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n );\n\n return (\n <Styled.Container ref={containerRef} $width={width} $widthX={widthX} onClick={onMenuClick}>\n <BaseInput\n renderAs={renderAs}\n label={label}\n stickyLabel={true}\n disabled={disabled}\n willShowMessage={willShowMessage}\n size={size}\n mandatory={mandatory}\n shape={shape}\n isTransparent={isTransparent}\n inputElement={\n <Input\n ref={inputRef}\n $renderAs={renderAs}\n $size={size}\n placeholder={inputValue ? '' : label}\n disabled={disabled}\n readOnly={!searchable}\n value={inputValue ?? ''}\n onFocus={searchable ? handleFocus : undefined}\n onChange={searchable ? handleTextChange : undefined}\n $isTransparent={isTransparent}\n />\n }\n siblingElement={searchable && menuVisible ? <CrossIcon onClick={handleClear} /> : downIcon}\n errorMessage={errorMessage}\n />\n\n {options.length > 0 && (\n <Styled.OptionsContainer $visible={menuVisible}>\n <Styled.OptionsWrapper $renderAs={renderAs} $theme={theme}>\n {sectionOptions && (\n <SelectSection<IDType>\n sectionOptions={sectionOptions}\n theme={theme}\n value={value}\n onChange={handleChange}\n />\n )}\n\n {selectOptions &&\n selectOptions.map(option => (\n <SelectOption<IDType>\n key={option.id}\n option={option}\n selected={option.id === value}\n onChange={handleChange}\n theme={theme}\n />\n ))}\n </Styled.OptionsWrapper>\n </Styled.OptionsContainer>\n )}\n </Styled.Container>\n );\n};\n\nexport default BaseSelectInput;\n"],"names":["BaseSelectInput","props","label","value","options","searchable","searchText","onCloseWithoutSelection","onSearchTextChange","onChange","renderAs","width","widthX","disabled","willShowMessage","mandatory","size","shape","theme","isTransparent","renderOptionsAs","errorMessage","inputLabelOverrides","sectionOptions","selectOptions","inputValue","useMemo","foundSection","foundOption","section","option","id","_a","containerRef","useRef","inputRef","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleTextChange","useCallback","handleChange","handleFocus","handleClear","jsxs","Styled.Container","jsx","BaseInput","Input","CrossIcon","Styled.StyledChevronDownIcon","Styled.StyledDownIcon","Styled.OptionsContainer","Styled.OptionsWrapper","SelectSection","SelectOption"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -192,6 +192,36 @@ export declare const CalendarIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
|
192
192
|
|
|
193
193
|
export declare const Callout: React.FC<ICalloutProps>;
|
|
194
194
|
|
|
195
|
+
export declare const Carousel: React_2.FC<CarouselProps>;
|
|
196
|
+
|
|
197
|
+
declare interface CarouselProps {
|
|
198
|
+
children: React_2.ReactNode[] | React_2.ReactNode;
|
|
199
|
+
initialPosition?: number;
|
|
200
|
+
infinite?: boolean;
|
|
201
|
+
slideDuration?: number;
|
|
202
|
+
dotColor?: string;
|
|
203
|
+
changeColor?: (position: number) => void;
|
|
204
|
+
slideAlign?: string | null;
|
|
205
|
+
inactiveDotColor?: string;
|
|
206
|
+
activeIndicatorSize?: string;
|
|
207
|
+
flexCenterIndicators?: boolean;
|
|
208
|
+
isTestimonial?: boolean;
|
|
209
|
+
setColor?: (position: number) => void;
|
|
210
|
+
setPosition?: (position: number) => void;
|
|
211
|
+
carouselSlotPadding?: string;
|
|
212
|
+
wrapperMargin?: string;
|
|
213
|
+
hideIndicators?: boolean;
|
|
214
|
+
autoScroll?: boolean;
|
|
215
|
+
nodeRef?: {
|
|
216
|
+
current?: {
|
|
217
|
+
next?: () => void;
|
|
218
|
+
prev?: () => void;
|
|
219
|
+
position?: number;
|
|
220
|
+
};
|
|
221
|
+
} | null;
|
|
222
|
+
onChange?: () => void;
|
|
223
|
+
}
|
|
224
|
+
|
|
195
225
|
export declare const CascadingSelectInput: React_2.FC<ICascadingSelectInputProps>;
|
|
196
226
|
|
|
197
227
|
export declare const Chapter: FC<IChapterProps>;
|
|
@@ -845,6 +875,7 @@ declare interface IBaseSelectInputProps<IDType extends string | number> extends
|
|
|
845
875
|
controlled?: boolean;
|
|
846
876
|
size?: TInputSizes;
|
|
847
877
|
theme?: 'light' | 'dark';
|
|
878
|
+
inputLabelOverrides?: (section: ISectionOption<ISelectOption<IDType>>, option: ISelectOption<IDType> | undefined) => string;
|
|
848
879
|
}
|
|
849
880
|
|
|
850
881
|
declare interface IBaseWebGameProps {
|
|
@@ -2233,6 +2264,7 @@ declare interface ILottieAnimationProps {
|
|
|
2233
2264
|
callback: EventListener_2<EventType>;
|
|
2234
2265
|
}[];
|
|
2235
2266
|
onRender?: () => void;
|
|
2267
|
+
onError?: () => void;
|
|
2236
2268
|
}
|
|
2237
2269
|
|
|
2238
2270
|
declare interface ILottieAnimationRef {
|
|
@@ -4703,6 +4735,28 @@ export declare enum NODE_TYPES {
|
|
|
4703
4735
|
'PUZZLE_CARD' = "PUZZLE_CARD"
|
|
4704
4736
|
}
|
|
4705
4737
|
|
|
4738
|
+
declare const Notification_2: React.FC<NotificationProps>;
|
|
4739
|
+
export { Notification_2 as Notification }
|
|
4740
|
+
|
|
4741
|
+
declare interface NotificationProps {
|
|
4742
|
+
avatarUrl?: string | null;
|
|
4743
|
+
Component?: React.ComponentType<Record<string, unknown>> | null;
|
|
4744
|
+
componentProps?: Record<string, unknown>;
|
|
4745
|
+
duration?: number | null;
|
|
4746
|
+
gap?: number;
|
|
4747
|
+
gutter?: number;
|
|
4748
|
+
hideNotification?: () => void;
|
|
4749
|
+
horizontalDist?: number;
|
|
4750
|
+
notificationTheme?: NotificationTheme;
|
|
4751
|
+
position?: Position;
|
|
4752
|
+
showCloseIcon?: boolean;
|
|
4753
|
+
text?: string | null;
|
|
4754
|
+
verticalDist?: number;
|
|
4755
|
+
visible?: boolean;
|
|
4756
|
+
}
|
|
4757
|
+
|
|
4758
|
+
declare type NotificationTheme = 'white' | 'black';
|
|
4759
|
+
|
|
4706
4760
|
export declare const Nudge: React_2.NamedExoticComponent<INudgeProps>;
|
|
4707
4761
|
|
|
4708
4762
|
export declare const NumRangeInput: React.FC<NumRangeInputProps>;
|
|
@@ -4787,6 +4841,8 @@ export declare const PlusIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
|
4787
4841
|
|
|
4788
4842
|
export declare const PointerIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
4789
4843
|
|
|
4844
|
+
declare type Position = 'top-right' | 'top-left' | 'bottom-left' | 'bottom-right';
|
|
4845
|
+
|
|
4790
4846
|
export declare const PostGameStats: NamedExoticComponent<IPostGameStatsProps & RefAttributes<IPostGameStatsRef>>;
|
|
4791
4847
|
|
|
4792
4848
|
export declare const PracticeIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|