@atom-learning/components 6.14.0 → 6.14.4
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/components/banner/banner-regular/BannerRegularDismiss.d.ts +2 -2
- package/dist/components/banner/banner-slim/BannerSlimDismiss.d.ts +2 -2
- package/dist/components/date-input/DateInput.js +1 -1
- package/dist/components/date-input/DateInput.js.map +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/number-input/NumberInputStepper.d.ts +2 -2
- package/dist/components/pagination/PaginationNextButton.d.ts +2 -2
- package/dist/components/pagination/PaginationPreviousButton.d.ts +2 -2
- package/dist/components/sortable/Handle.d.ts +2 -2
- package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts +1 -1
- package/dist/components/top-bar/TopBar.d.ts +2 -2
- package/dist/components/tree/TreeCollapsibleTrigger.js.map +1 -1
- package/dist/components/video/Video.d.ts +1 -1
- package/dist/components/video/Video.js +1 -1
- package/dist/components/video/Video.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +12 -7
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/types/navigatorActions.types.d.ts +2 -1
- package/dist/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js +6 -1
- package/dist/utilities/optional-tooltip-wrapper/OptionalTooltipWrapper.js.map +1 -1
- package/package.json +4 -2
|
@@ -8,10 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
|
|
|
8
8
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
9
9
|
} & {
|
|
10
10
|
as?: React.ElementType;
|
|
11
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
11
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
|
|
12
12
|
children: React.ReactNode;
|
|
13
13
|
label: string;
|
|
14
|
-
} & Omit<import("
|
|
14
|
+
} & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
|
|
15
15
|
as?: React.ElementType;
|
|
16
16
|
}>;
|
|
17
17
|
type BannerRegularDismissProps = Omit<React.ComponentProps<typeof StyledDismiss>, 'children' | 'onClick' | 'href'>;
|
|
@@ -8,10 +8,10 @@ declare const StyledDismiss: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
|
|
|
8
8
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
9
9
|
} & {
|
|
10
10
|
as?: React.ElementType;
|
|
11
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
11
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../../..").NavigatorActions> & {
|
|
12
12
|
children: React.ReactNode;
|
|
13
13
|
label: string;
|
|
14
|
-
} & Omit<import("
|
|
14
|
+
} & Omit<import("../../..").TOptionalTooltipWrapperProps, "label"> & import("../../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "containerSize"> & {
|
|
15
15
|
emphasis?: ("bold" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold">>) | undefined;
|
|
16
16
|
containerSize?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
|
|
17
17
|
} & {
|
|
@@ -10,7 +10,7 @@ import { DEFAULT_DATE_FORMAT } from "./constants.js";
|
|
|
10
10
|
import * as React$1 from "react";
|
|
11
11
|
import { CalendarEvent } from "@atom-learning/icons";
|
|
12
12
|
import dayjs from "dayjs";
|
|
13
|
-
import customParseFormat from "dayjs/plugin/customParseFormat";
|
|
13
|
+
import customParseFormat from "dayjs/plugin/customParseFormat.js";
|
|
14
14
|
//#region src/components/date-input/DateInput.tsx
|
|
15
15
|
dayjs.extend(customParseFormat);
|
|
16
16
|
var formatDateToString = (date, dateFormat = DEFAULT_DATE_FORMAT) => date ? dayjs(date).format(dateFormat) : "";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.js","names":[],"sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { getFieldIconSize } from '~/utilities/style/get-icon-size'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\n\ndayjs.extend(customParseFormat)\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n CalendarTranslationProps & {\n initialDate?: Date\n dateFormat?: string\n disabled?: boolean\n size?: 'sm' | 'md' | 'lg'\n appearance?: 'standard' | 'modern'\n theme?: 'white' | 'grey'\n revalidate?: () => Promise<boolean>\n onChange?: (value?: Date) => void\n }\n\nconst formatDateToString = (date?: Date, dateFormat = DEFAULT_DATE_FORMAT) =>\n date ? dayjs(date).format(dateFormat) : ''\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n (\n {\n initialDate,\n dateFormat = DEFAULT_DATE_FORMAT,\n firstDayOfWeek = 1,\n disabled,\n monthNames,\n weekdayNames,\n size = 'md',\n appearance,\n theme,\n labels,\n revalidate,\n onChange,\n minDate,\n maxDate,\n ...remainingProps\n },\n ref\n ) => {\n const [date, setDate] = React.useState(\n initialDate ? dayjs(initialDate).toDate() : undefined\n )\n\n const [inputElRef, setInputElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => inputElRef as HTMLInputElement)\n\n const dateString = formatDateToString(date, dateFormat)\n\n const handleInputChange = React.useCallback(\n (event) => {\n const newDateString = event.target.value\n const parsedInputDate = dayjs(newDateString, dateFormat)\n const newDate = parsedInputDate.isValid()\n ? parsedInputDate.toDate()\n : undefined\n setDate(newDate)\n onChange?.(newDate)\n },\n [dateFormat, onChange]\n )\n\n const handleCalendarChange = React.useCallback(\n (newDate) => {\n setDate(newDate)\n\n const mirrorChangeToInputElement = () => {\n if (!inputElRef) return\n\n // Call the `set` function on the input value directly to mirror the change.\n // Props to: https://stackoverflow.com/a/46012210\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n 'value'\n )?.set\n nativeInputValueSetter?.call(\n inputElRef,\n formatDateToString(newDate, dateFormat)\n )\n const event = new Event('input', { bubbles: true })\n inputElRef.dispatchEvent(event)\n }\n mirrorChangeToInputElement()\n },\n [dateFormat, inputElRef]\n )\n\n const updatedLabels = {\n ...DEFAULT_LABELS,\n ...labels\n }\n\n const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n const refDateToday = React.useRef<HTMLButtonElement>(null)\n const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n return (\n <div className=\"relative h-max\">\n <Input\n name=\"date\"\n disabled={disabled}\n size={size}\n appearance={appearance}\n theme={theme}\n {...remainingProps}\n onChange={handleInputChange}\n ref={setInputElRef}\n defaultValue={dateString}\n />\n <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n <Popover.Trigger asChild>\n <ActionIcon\n disabled={disabled}\n label={updatedLabels.open}\n size={iconSize}\n theme=\"neutral\"\n hasTooltip={false}\n className=\"absolute top-1/2 right-0 -translate-y-1/2\"\n >\n <Icon is={CalendarEvent} />\n </ActionIcon>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n side=\"bottom\"\n align=\"end\"\n showCloseButton={false}\n onOpenAutoFocus={(e) => {\n e.preventDefault()\n if (date) {\n refDateSelected.current?.focus()\n } else {\n refDateToday.current?.focus()\n }\n }}\n className=\"z-1147483646 pr-6\"\n >\n <Calendar\n date={date || new Date()}\n selected={date}\n onDateSelected={async (date) => {\n setCalendarOpen(false)\n await handleCalendarChange(date.date)\n if (revalidate) revalidate()\n }}\n setYear={async (date) => {\n await handleCalendarChange(date)\n if (revalidate) revalidate()\n }}\n minDate={minDate}\n maxDate={maxDate}\n refDateToday={refDateToday}\n refDateSelected={refDateSelected}\n firstDayOfWeek={firstDayOfWeek}\n monthNames={monthNames}\n weekdayNames={weekdayNames}\n labels={updatedLabels}\n />\n </Popover.Content>\n </Popover.Portal>\n </Popover>\n </div>\n )\n }\n)\n\nDateInput.displayName = 'DateInput'\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DateInput.js","names":[],"sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport dayjs from 'dayjs'\nimport customParseFormat from 'dayjs/plugin/customParseFormat.js'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { getFieldIconSize } from '~/utilities/style/get-icon-size'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\n\ndayjs.extend(customParseFormat)\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n CalendarTranslationProps & {\n initialDate?: Date\n dateFormat?: string\n disabled?: boolean\n size?: 'sm' | 'md' | 'lg'\n appearance?: 'standard' | 'modern'\n theme?: 'white' | 'grey'\n revalidate?: () => Promise<boolean>\n onChange?: (value?: Date) => void\n }\n\nconst formatDateToString = (date?: Date, dateFormat = DEFAULT_DATE_FORMAT) =>\n date ? dayjs(date).format(dateFormat) : ''\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n (\n {\n initialDate,\n dateFormat = DEFAULT_DATE_FORMAT,\n firstDayOfWeek = 1,\n disabled,\n monthNames,\n weekdayNames,\n size = 'md',\n appearance,\n theme,\n labels,\n revalidate,\n onChange,\n minDate,\n maxDate,\n ...remainingProps\n },\n ref\n ) => {\n const [date, setDate] = React.useState(\n initialDate ? dayjs(initialDate).toDate() : undefined\n )\n\n const [inputElRef, setInputElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => inputElRef as HTMLInputElement)\n\n const dateString = formatDateToString(date, dateFormat)\n\n const handleInputChange = React.useCallback(\n (event) => {\n const newDateString = event.target.value\n const parsedInputDate = dayjs(newDateString, dateFormat)\n const newDate = parsedInputDate.isValid()\n ? parsedInputDate.toDate()\n : undefined\n setDate(newDate)\n onChange?.(newDate)\n },\n [dateFormat, onChange]\n )\n\n const handleCalendarChange = React.useCallback(\n (newDate) => {\n setDate(newDate)\n\n const mirrorChangeToInputElement = () => {\n if (!inputElRef) return\n\n // Call the `set` function on the input value directly to mirror the change.\n // Props to: https://stackoverflow.com/a/46012210\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n 'value'\n )?.set\n nativeInputValueSetter?.call(\n inputElRef,\n formatDateToString(newDate, dateFormat)\n )\n const event = new Event('input', { bubbles: true })\n inputElRef.dispatchEvent(event)\n }\n mirrorChangeToInputElement()\n },\n [dateFormat, inputElRef]\n )\n\n const updatedLabels = {\n ...DEFAULT_LABELS,\n ...labels\n }\n\n const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n const refDateToday = React.useRef<HTMLButtonElement>(null)\n const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n return (\n <div className=\"relative h-max\">\n <Input\n name=\"date\"\n disabled={disabled}\n size={size}\n appearance={appearance}\n theme={theme}\n {...remainingProps}\n onChange={handleInputChange}\n ref={setInputElRef}\n defaultValue={dateString}\n />\n <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n <Popover.Trigger asChild>\n <ActionIcon\n disabled={disabled}\n label={updatedLabels.open}\n size={iconSize}\n theme=\"neutral\"\n hasTooltip={false}\n className=\"absolute top-1/2 right-0 -translate-y-1/2\"\n >\n <Icon is={CalendarEvent} />\n </ActionIcon>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n side=\"bottom\"\n align=\"end\"\n showCloseButton={false}\n onOpenAutoFocus={(e) => {\n e.preventDefault()\n if (date) {\n refDateSelected.current?.focus()\n } else {\n refDateToday.current?.focus()\n }\n }}\n className=\"z-1147483646 pr-6\"\n >\n <Calendar\n date={date || new Date()}\n selected={date}\n onDateSelected={async (date) => {\n setCalendarOpen(false)\n await handleCalendarChange(date.date)\n if (revalidate) revalidate()\n }}\n setYear={async (date) => {\n await handleCalendarChange(date)\n if (revalidate) revalidate()\n }}\n minDate={minDate}\n maxDate={maxDate}\n refDateToday={refDateToday}\n refDateSelected={refDateSelected}\n firstDayOfWeek={firstDayOfWeek}\n monthNames={monthNames}\n weekdayNames={weekdayNames}\n labels={updatedLabels}\n />\n </Popover.Content>\n </Popover.Portal>\n </Popover>\n </div>\n )\n }\n)\n\nDateInput.displayName = 'DateInput'\n"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ export { ActionIcon } from './action-icon/ActionIcon';
|
|
|
4
4
|
export { AlertDialog } from './alert-dialog/AlertDialog';
|
|
5
5
|
export { useAlert, AlertProvider } from './alert-dialog/alert-context/AlertContext';
|
|
6
6
|
export { Avatar } from './avatar/Avatar';
|
|
7
|
-
export { Badge } from './badge/Badge';
|
|
7
|
+
export { Badge, type TBadgeProps } from './badge/Badge';
|
|
8
8
|
export { BannerRegular } from './banner/banner-regular/BannerRegular';
|
|
9
9
|
export { BannerSlim } from './banner/banner-slim/BannerSlim';
|
|
10
10
|
export { Box } from './box/Box';
|
|
@@ -37,7 +37,7 @@ export { FileInput } from './file-input/FileInput';
|
|
|
37
37
|
export { Flex } from './flex/Flex';
|
|
38
38
|
export { Form } from './form/Form';
|
|
39
39
|
export { Grid } from './grid/Grid';
|
|
40
|
-
export { Heading } from './heading/Heading';
|
|
40
|
+
export { Heading, type HeadingProps } from './heading/Heading';
|
|
41
41
|
export { Icon } from './icon/Icon';
|
|
42
42
|
export { Image } from './image/Image';
|
|
43
43
|
export { InlineMessage } from './inline-message/InlineMessage';
|
|
@@ -9,10 +9,10 @@ declare const StyledStepperButton: React.ForwardRefExoticComponent<Omit<Omit<Omi
|
|
|
9
9
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
10
10
|
} & {
|
|
11
11
|
as?: React.ElementType;
|
|
12
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
12
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
label: string;
|
|
15
|
-
} & Omit<import("
|
|
15
|
+
} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "fieldAppearance" | "fieldTheme"> & {
|
|
16
16
|
fieldAppearance?: "standard" | "modern" | undefined;
|
|
17
17
|
fieldTheme?: "grey" | "white" | undefined;
|
|
18
18
|
emphasis?: "bold" | undefined;
|
|
@@ -8,10 +8,10 @@ declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<O
|
|
|
8
8
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
9
9
|
} & {
|
|
10
10
|
as?: React.ElementType;
|
|
11
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
11
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
|
|
12
12
|
children: React.ReactNode;
|
|
13
13
|
label: string;
|
|
14
|
-
} & Omit<import("
|
|
14
|
+
} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
|
|
15
15
|
as?: React.ElementType;
|
|
16
16
|
}>;
|
|
17
17
|
export declare const PaginationNextButton: (props: Partial<React.ComponentProps<typeof StyledActionIcon>>) => React.JSX.Element;
|
|
@@ -8,10 +8,10 @@ declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<O
|
|
|
8
8
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
9
9
|
} & {
|
|
10
10
|
as?: React.ElementType;
|
|
11
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
11
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
|
|
12
12
|
children: React.ReactNode;
|
|
13
13
|
label: string;
|
|
14
|
-
} & Omit<import("
|
|
14
|
+
} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
|
|
15
15
|
as?: React.ElementType;
|
|
16
16
|
}>;
|
|
17
17
|
export declare const PaginationPreviousButton: (props: Partial<React.ComponentProps<typeof StyledActionIcon>>) => React.JSX.Element;
|
|
@@ -9,10 +9,10 @@ export declare const StyledHandle: React.ForwardRefExoticComponent<Omit<Omit<Omi
|
|
|
9
9
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
10
10
|
} & {
|
|
11
11
|
as?: React.ElementType;
|
|
12
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
12
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
label: string;
|
|
15
|
-
} & Omit<import("
|
|
15
|
+
} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "isDragging"> & {
|
|
16
16
|
isDragging?: boolean | undefined;
|
|
17
17
|
} & {
|
|
18
18
|
as?: React.ElementType;
|
|
@@ -12,7 +12,7 @@ declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Om
|
|
|
12
12
|
colorScheme?: import("../..").TcolorScheme;
|
|
13
13
|
}, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
|
|
14
14
|
as?: React.ElementType;
|
|
15
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement> & import("
|
|
15
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
|
|
16
16
|
as?: React.ElementType;
|
|
17
17
|
}>;
|
|
18
18
|
type TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> & React.ComponentProps<typeof StyledTileToggleGroupItem>;
|
|
@@ -51,10 +51,10 @@ export declare const TopBar: {
|
|
|
51
51
|
isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
|
|
52
52
|
} & {
|
|
53
53
|
as?: React.ElementType;
|
|
54
|
-
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
54
|
+
}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
|
|
55
55
|
children: React.ReactNode;
|
|
56
56
|
label: string;
|
|
57
|
-
} & Omit<import("
|
|
57
|
+
} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "size" | "children"> & {
|
|
58
58
|
icon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
59
59
|
label: string;
|
|
60
60
|
}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeCollapsibleTrigger.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon/ActionIcon'\nimport { Icon } from '~/components/icon/Icon'\nimport { styled } from '~/styled'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledActionIcon = styled(ActionIcon, {\n base: [\n 'absolute',\n 'left-0',\n 'top-0',\n 'pointer-events-none',\n '[&_svg]:duration-300',\n '[&_svg]:transition-transform',\n '[&[data-state=closed]>svg]:-rotate-90',\n '[&[data-state=open]>svg]:rotate-0'\n ]\n})\n\ntype TNavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n typeof TreeItemContent\n> & {\n label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n children,\n label,\n className,\n ...rest\n}: TNavigationMenuCollapsibleTriggerProps) => {\n const { setTriggerRef, triggerRef } = React.useContext(TreeCollapsibleContext)\n\n return (\n <TreeItemContent\n {...rest}\n className={clsx('cursor-pointer', className)}\n onClick={(event) => {\n rest.onClick?.(event)\n triggerRef?.current?.click()\n }}\n >\n <Trigger asChild>\n <StyledActionIcon\n size=\"sm\"\n ref={setTriggerRef}\n label={label}\n theme=\"neutral\"\n hasTooltip={false}\n onClick={(e
|
|
1
|
+
{"version":3,"file":"TreeCollapsibleTrigger.js","names":[],"sources":["../../../src/components/tree/TreeCollapsibleTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport clsx from 'clsx'\nimport React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon/ActionIcon'\nimport { Icon } from '~/components/icon/Icon'\nimport { styled } from '~/styled'\n\nimport { TreeCollapsibleContext } from './TreeCollapsible'\nimport { TreeItemContent } from './TreeItemContent'\n\nconst StyledActionIcon = styled(ActionIcon, {\n base: [\n 'absolute',\n 'left-0',\n 'top-0',\n 'pointer-events-none',\n '[&_svg]:duration-300',\n '[&_svg]:transition-transform',\n '[&[data-state=closed]>svg]:-rotate-90',\n '[&[data-state=open]>svg]:rotate-0'\n ]\n})\n\ntype TNavigationMenuCollapsibleTriggerProps = React.ComponentProps<\n typeof TreeItemContent\n> & {\n label: string\n}\n\nexport const TreeCollapsibleTrigger = ({\n children,\n label,\n className,\n ...rest\n}: TNavigationMenuCollapsibleTriggerProps) => {\n const { setTriggerRef, triggerRef } = React.useContext(TreeCollapsibleContext)\n\n return (\n <TreeItemContent\n {...rest}\n className={clsx('cursor-pointer', className)}\n onClick={(event) => {\n rest.onClick?.(event)\n triggerRef?.current?.click()\n }}\n >\n <Trigger asChild>\n <StyledActionIcon\n size=\"sm\"\n ref={setTriggerRef}\n label={label}\n theme=\"neutral\"\n hasTooltip={false}\n onClick={(e) => e.stopPropagation()}\n >\n <Icon is={ChevronDown} />\n </StyledActionIcon>\n </Trigger>\n {children}\n </TreeItemContent>\n )\n}\n"],"mappings":";;;;;;;;;;AAYA,IAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAQF,IAAa,0BAA0B,EACrC,UACA,OACA,WACA,GAAG,WACyC;CAC5C,MAAM,EAAE,eAAe,eAAe,MAAM,WAAW,uBAAuB;AAE9E,QACE,sBAAA,cAAC,iBAAD;EACE,GAAI;EACJ,WAAW,KAAK,kBAAkB,UAAU;EAC5C,UAAU,UAAU;AAClB,QAAK,UAAU,MAAM;AACrB,eAAY,SAAS,OAAO;;EAgBd,EAbhB,sBAAA,cAAC,SAAD,EAAS,SAAA,MAWC,EAVR,sBAAA,cAAC,kBAAD;EACE,MAAK;EACL,KAAK;EACE;EACP,OAAM;EACN,YAAY;EACZ,UAAU,MAAM,EAAE,iBAAiB;EAGlB,EADjB,sBAAA,cAAC,MAAD,EAAM,IAAI,aAAe,CAAA,CACR,CACX,EACT,SACe"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { CSSWrapper } from "../../utilities/css-wrapper/CSSWrapper.js";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
import ReactPlayer from "react-player/vimeo";
|
|
3
|
+
import ReactPlayer from "react-player/vimeo.js";
|
|
4
4
|
//#region src/components/video/Video.tsx
|
|
5
5
|
var Video = React$1.forwardRef(({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => /* @__PURE__ */ React$1.createElement(CSSWrapper, { className }, /* @__PURE__ */ React$1.createElement("div", {
|
|
6
6
|
style: { "--ratio": `${ratio * 100}%` },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Video.js","names":[],"sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { CSSWrapper } from '~/utilities/css-wrapper/CSSWrapper'\nimport { Override } from '~/utilities/types'\n\ntype VideoProps = Override<\n React.ComponentProps<typeof ReactPlayer>,\n {\n id: string\n ratio?: number\n className?: string\n }\n>\n\nexport const Video = React.forwardRef<any, VideoProps>(\n ({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => (\n <CSSWrapper className={className}>\n <div\n style={{ '--ratio': `${ratio * 100}%` }}\n className=\"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)\"\n >\n <ReactPlayer\n {...remainingProps}\n role=\"figure\"\n url={`https://player.vimeo.com/video/${id}`}\n height=\"100%\"\n width=\"100%\"\n ref={ref}\n className=\"absolute top-0 left-0\"\n />\n </div>\n </CSSWrapper>\n )\n)\n\nVideo.displayName = 'Video'\n"],"mappings":";;;;AAgBA,IAAa,QAAQ,QAAM,YACxB,EAAE,IAAI,QAAQ,IAAI,IAAI,WAAW,GAAG,kBAAkB,QACrD,wBAAA,cAAC,YAAD,EAAuB,WAeV,EAdX,wBAAA,cAAC,OAAD;CACE,OAAO,EAAE,WAAW,GAAG,QAAQ,IAAI,IAAI;CACvC,WAAU;CAWN,EATJ,wBAAA,cAAC,aAAD;CACE,GAAI;CACJ,MAAK;CACL,KAAK,kCAAkC;CACvC,QAAO;CACP,OAAM;CACD;CACL,WAAU;CACV,CAAA,CACE,CACK,CAEhB;AAED,MAAM,cAAc"}
|
|
1
|
+
{"version":3,"file":"Video.js","names":[],"sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo.js'\n\nimport { CSSWrapper } from '~/utilities/css-wrapper/CSSWrapper'\nimport { Override } from '~/utilities/types'\n\ntype VideoProps = Override<\n React.ComponentProps<typeof ReactPlayer>,\n {\n id: string\n ratio?: number\n className?: string\n }\n>\n\nexport const Video = React.forwardRef<any, VideoProps>(\n ({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => (\n <CSSWrapper className={className}>\n <div\n style={{ '--ratio': `${ratio * 100}%` }}\n className=\"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)\"\n >\n <ReactPlayer\n {...remainingProps}\n role=\"figure\"\n url={`https://player.vimeo.com/video/${id}`}\n height=\"100%\"\n width=\"100%\"\n ref={ref}\n className=\"absolute top-0 left-0\"\n />\n </div>\n </CSSWrapper>\n )\n)\n\nVideo.displayName = 'Video'\n"],"mappings":";;;;AAgBA,IAAa,QAAQ,QAAM,YACxB,EAAE,IAAI,QAAQ,IAAI,IAAI,WAAW,GAAG,kBAAkB,QACrD,wBAAA,cAAC,YAAD,EAAuB,WAeV,EAdX,wBAAA,cAAC,OAAD;CACE,OAAO,EAAE,WAAW,GAAG,QAAQ,IAAI,IAAI;CACvC,WAAU;CAWN,EATJ,wBAAA,cAAC,aAAD;CACE,GAAI;CACJ,MAAK;CACL,KAAK,kCAAkC;CACvC,QAAO;CACP,OAAM;CACD;CACL,WAAU;CACV,CAAA,CACE,CACK,CAEhB;AAED,MAAM,cAAc"}
|