@salt-ds/lab 1.0.0-alpha.45 → 1.0.0-alpha.47
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/css/salt-lab.css +26 -2
- package/dist-cjs/date-input/DateInput.js +17 -37
- package/dist-cjs/date-input/DateInput.js.map +1 -1
- package/dist-cjs/date-picker/DatePicker.js +9 -5
- package/dist-cjs/date-picker/DatePicker.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerContext.js +0 -2
- package/dist-cjs/date-picker/DatePickerContext.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerPanel.css.js +1 -1
- package/dist-cjs/date-picker/DatePickerPanel.js +29 -29
- package/dist-cjs/date-picker/DatePickerPanel.js.map +1 -1
- package/dist-cjs/divider/Divider.css.js +6 -0
- package/dist-cjs/divider/Divider.css.js.map +1 -0
- package/dist-cjs/divider/Divider.js +44 -0
- package/dist-cjs/divider/Divider.js.map +1 -0
- package/dist-cjs/index.js +2 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-es/date-input/DateInput.js +18 -38
- package/dist-es/date-input/DateInput.js.map +1 -1
- package/dist-es/date-picker/DatePicker.js +9 -5
- package/dist-es/date-picker/DatePicker.js.map +1 -1
- package/dist-es/date-picker/DatePickerContext.js +0 -2
- package/dist-es/date-picker/DatePickerContext.js.map +1 -1
- package/dist-es/date-picker/DatePickerPanel.css.js +1 -1
- package/dist-es/date-picker/DatePickerPanel.js +30 -30
- package/dist-es/date-picker/DatePickerPanel.js.map +1 -1
- package/dist-es/divider/Divider.css.js +4 -0
- package/dist-es/divider/Divider.css.js.map +1 -0
- package/dist-es/divider/Divider.js +40 -0
- package/dist-es/divider/Divider.js.map +1 -0
- package/dist-es/index.js +1 -0
- package/dist-es/index.js.map +1 -1
- package/dist-types/date-input/DateInput.d.ts +9 -1
- package/dist-types/date-picker/DatePicker.d.ts +18 -3
- package/dist-types/date-picker/DatePickerContext.d.ts +0 -2
- package/dist-types/date-picker/DatePickerPanel.d.ts +6 -2
- package/dist-types/divider/Divider.d.ts +12 -0
- package/dist-types/divider/index.d.ts +1 -0
- package/dist-types/index.d.ts +1 -0
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerPanel.js","sources":["../src/date-picker/DatePickerPanel.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport {\n FlexItem,\n FlexLayout,\n FormFieldHelperText,\n makePrefixer,\n StackLayout,\n useFloatingComponent,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { useDatePickerContext } from \"./DatePickerContext\";\nimport dateInputPanelCss from \"./DatePickerPanel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport {\n Calendar,\n CalendarProps,\n UseRangeSelectionCalendarProps,\n UseSingleSelectionCalendarProps,\n} from \"../calendar\";\nimport { DateValue, endOfMonth, startOfMonth } from \"@internationalized/date\";\n\nexport interface DatePickerPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n onSelect?: () => void;\n helperText?: string;\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n}\n\nconst withBaseName = makePrefixer(\"saltDatePickerPanel\");\n\nexport const DatePickerPanel = forwardRef<HTMLDivElement, DatePickerPanelProps>(\n function DatePickerPanel(props, ref) {\n const { className, onSelect, helperText, CalendarProps, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-panel\",\n css: dateInputPanelCss,\n window: targetWindow,\n });\n\n const { Component: FloatingComponent } = useFloatingComponent();\n const [hoveredDate, setHoveredDate] = useState<DateValue | null>(null);\n\n const {\n openState,\n startDate,\n setStartDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endDate,\n setEndDate,\n endVisibleMonth,\n setEndVisibleMonth,\n setOpen,\n selectionVariant,\n context,\n getPanelPosition,\n
|
|
1
|
+
{"version":3,"file":"DatePickerPanel.js","sources":["../src/date-picker/DatePickerPanel.tsx"],"sourcesContent":["import {\n ComponentPropsWithoutRef,\n forwardRef,\n SyntheticEvent,\n useEffect,\n useState,\n} from \"react\";\nimport {\n FlexItem,\n FlexLayout,\n FormFieldHelperText,\n makePrefixer,\n StackLayout,\n useFloatingComponent,\n useFormFieldProps,\n FormFieldContext,\n FormFieldContextValue,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { useDatePickerContext } from \"./DatePickerContext\";\nimport dateInputPanelCss from \"./DatePickerPanel.css\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport {\n Calendar,\n CalendarProps,\n UseRangeSelectionCalendarProps,\n UseSingleSelectionCalendarProps,\n} from \"../calendar\";\nimport { DateValue, endOfMonth, startOfMonth } from \"@internationalized/date\";\n\nexport interface DatePickerPanelProps extends ComponentPropsWithoutRef<\"div\"> {\n onSelect?: (\n event: SyntheticEvent,\n selectedDate?: DateValue | { startDate?: DateValue; endDate?: DateValue }\n ) => void;\n helperText?: string;\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n}\n\nconst withBaseName = makePrefixer(\"saltDatePickerPanel\");\n\nexport const DatePickerPanel = forwardRef<HTMLDivElement, DatePickerPanelProps>(\n function DatePickerPanel(props, ref) {\n const { className, onSelect, helperText, CalendarProps, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-picker-panel\",\n css: dateInputPanelCss,\n window: targetWindow,\n });\n\n const { Component: FloatingComponent } = useFloatingComponent();\n const [hoveredDate, setHoveredDate] = useState<DateValue | null>(null);\n\n const {\n openState,\n startDate,\n setStartDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endDate,\n setEndDate,\n endVisibleMonth,\n setEndVisibleMonth,\n setOpen,\n selectionVariant,\n context,\n getPanelPosition,\n } = useDatePickerContext();\n\n const { a11yProps } = useFormFieldProps();\n\n const setRangeDate: UseRangeSelectionCalendarProps[\"onSelectedDateChange\"] =\n (event, newDate) => {\n setStartDate(newDate.startDate);\n setEndDate(newDate.endDate);\n onSelect?.(event, newDate);\n if (newDate.startDate && newDate.endDate) {\n setOpen(false);\n }\n };\n const setSingleDate: UseSingleSelectionCalendarProps[\"onSelectedDateChange\"] =\n (event, newDate) => {\n setStartDate(newDate);\n onSelect?.(event, newDate);\n setOpen(false);\n };\n const handleHoveredDateChange: CalendarProps[\"onHoveredDateChange\"] = (\n _,\n newHoveredDate\n ) => {\n setHoveredDate(newHoveredDate);\n };\n useEffect(() => {\n if (startDate) {\n setStartVisibleMonth(startDate);\n setEndVisibleMonth(startDate.add({ months: 1 }));\n }\n }, [startDate]);\n\n const isRangePicker = selectionVariant === \"range\";\n const firstCalendarProps: CalendarProps = isRangePicker\n ? {\n selectionVariant: \"range\",\n hoveredDate:\n startDate &&\n hoveredDate &&\n hoveredDate.compare(endOfMonth(startDate)) > 0\n ? endOfMonth(startDate)\n : hoveredDate,\n onHoveredDateChange: handleHoveredDateChange,\n selectedDate: { startDate, endDate },\n onSelectedDateChange: setRangeDate,\n maxDate: startDate && endOfMonth(startDate),\n hideOutOfRangeDates: true,\n }\n : {\n selectionVariant: \"default\",\n selectedDate: startDate,\n onSelectedDateChange: setSingleDate,\n };\n return (\n <FloatingComponent\n open={openState}\n className={clsx(withBaseName(), className)}\n aria-modal=\"true\"\n ref={ref}\n focusManagerProps={\n context\n ? {\n context: context,\n initialFocus: 4,\n }\n : undefined\n }\n {...getPanelPosition()}\n {...a11yProps}\n {...rest}\n >\n <StackLayout separators gap={0} className={withBaseName(\"container\")}>\n {helperText && (\n <FlexItem className={withBaseName(\"header\")}>\n <FormFieldHelperText>{helperText}</FormFieldHelperText>\n </FlexItem>\n )}\n <FlexLayout>\n {/* Avoid Dropdowns in Calendar inheriting the FormField's state */}\n <FormFieldContext.Provider value={{} as FormFieldContextValue}>\n <Calendar\n visibleMonth={startVisibleMonth}\n onVisibleMonthChange={(_, month) => setStartVisibleMonth(month)}\n {...firstCalendarProps}\n {...CalendarProps}\n />\n {isRangePicker && (\n <Calendar\n selectionVariant=\"range\"\n hoveredDate={hoveredDate}\n onHoveredDateChange={handleHoveredDateChange}\n selectedDate={{ startDate, endDate }}\n onSelectedDateChange={setRangeDate}\n visibleMonth={endVisibleMonth}\n onVisibleMonthChange={(_, month) => setEndVisibleMonth(month)}\n hideOutOfRangeDates\n minDate={\n startDate\n ? startOfMonth(startDate)?.add({ months: 1 })\n : undefined\n }\n {...CalendarProps}\n />\n )}\n </FormFieldContext.Provider>\n </FlexLayout>\n </StackLayout>\n </FloatingComponent>\n );\n }\n);\n"],"names":["DatePickerPanel","CalendarProps","dateInputPanelCss"],"mappings":"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"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var css_248z = ".saltDivider-primary {\n --divider-background: var(--salt-separable-primary-borderColor);\n}\n\n.saltDivider-secondary {\n --divider-background: var(--salt-separable-secondary-borderColor);\n}\n\n.saltDivider-tertiary {\n --divider-background: var(--salt-separable-tertiary-borderColor);\n}\n\n.saltDivider {\n background: var(--divider-background);\n align-self: stretch;\n margin: 0;\n border: none;\n}\n\n.saltDivider-horizontal {\n height: var(--salt-size-border);\n}\n\n.saltDivider-vertical {\n width: var(--salt-size-border);\n height: auto;\n}\n";
|
|
2
|
+
|
|
3
|
+
export { css_248z as default };
|
|
4
|
+
//# sourceMappingURL=Divider.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { forwardRef } from 'react';
|
|
3
|
+
import { clsx } from 'clsx';
|
|
4
|
+
import { makePrefixer } from '@salt-ds/core';
|
|
5
|
+
import { useWindow } from '@salt-ds/window';
|
|
6
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
7
|
+
import css_248z from './Divider.css.js';
|
|
8
|
+
|
|
9
|
+
const withBaseName = makePrefixer("saltDivider");
|
|
10
|
+
const Divider = forwardRef(
|
|
11
|
+
function Divider2(props, ref) {
|
|
12
|
+
const {
|
|
13
|
+
className,
|
|
14
|
+
orientation = "horizontal",
|
|
15
|
+
variant = "primary",
|
|
16
|
+
...rest
|
|
17
|
+
} = props;
|
|
18
|
+
const targetWindow = useWindow();
|
|
19
|
+
useComponentCssInjection({
|
|
20
|
+
testId: "salt-divider",
|
|
21
|
+
css: css_248z,
|
|
22
|
+
window: targetWindow
|
|
23
|
+
});
|
|
24
|
+
return /* @__PURE__ */ jsx("div", {
|
|
25
|
+
className: clsx(
|
|
26
|
+
withBaseName(),
|
|
27
|
+
withBaseName(orientation),
|
|
28
|
+
withBaseName(variant),
|
|
29
|
+
className
|
|
30
|
+
),
|
|
31
|
+
"aria-orientation": orientation,
|
|
32
|
+
role: "separator",
|
|
33
|
+
ref,
|
|
34
|
+
...rest
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
|
|
39
|
+
export { Divider };
|
|
40
|
+
//# sourceMappingURL=Divider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.js","sources":["../src/divider/Divider.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport dividerCss from \"./Divider.css\";\n\ntype a = HTMLElementTagNameMap;\n\nexport interface DividerProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * The orientation of the divider. Defaults to `\"horizontal\"`.\n */\n orientation?: \"horizontal\" | \"vertical\";\n /**\n * The variant of the divider. Defaults to `\"primary\"`.\n */\n variant?: \"primary\" | \"secondary\" | \"tertiary\";\n}\n\nconst withBaseName = makePrefixer(\"saltDivider\");\n\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>(\n function Divider(props, ref) {\n const {\n className,\n orientation = \"horizontal\",\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-divider\",\n css: dividerCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(orientation),\n withBaseName(variant),\n className\n )}\n aria-orientation={orientation}\n role=\"separator\"\n ref={ref}\n {...rest}\n />\n );\n }\n);\n"],"names":["Divider","dividerCss"],"mappings":";;;;;;;;AAoBA,MAAM,YAAA,GAAe,aAAa,aAAa,CAAA,CAAA;AAExC,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,SAASA,QAAQ,CAAA,KAAA,EAAO,GAAK,EAAA;AAC3B,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,WAAc,GAAA,YAAA;AAAA,MACd,OAAU,GAAA,SAAA;AAAA,MACP,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,cAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,aAAa,WAAW,CAAA;AAAA,QACxB,aAAa,OAAO,CAAA;AAAA,QACpB,SAAA;AAAA,OACF;AAAA,MACA,kBAAkB,EAAA,WAAA;AAAA,MAClB,IAAK,EAAA,WAAA;AAAA,MACL,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,KACN,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
package/dist-es/index.js
CHANGED
|
@@ -58,6 +58,7 @@ export { DateInput } from './date-input/DateInput.js';
|
|
|
58
58
|
export { DatePicker } from './date-picker/DatePicker.js';
|
|
59
59
|
export { DeckItem } from './deck-item/DeckItem.js';
|
|
60
60
|
export { DeckLayout } from './deck-layout/DeckLayout.js';
|
|
61
|
+
export { Divider } from './divider/Divider.js';
|
|
61
62
|
export { DropdownBase } from './dropdown/DropdownBase.js';
|
|
62
63
|
export { DropdownButton } from './dropdown/DropdownButton.js';
|
|
63
64
|
export { Dropdown } from './dropdown/Dropdown.js';
|
package/dist-es/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentPropsWithoutRef, InputHTMLAttributes, ReactNode, RefObject } from "react";
|
|
1
|
+
import { ChangeEventHandler, ComponentPropsWithoutRef, InputHTMLAttributes, ReactNode, RefObject, SyntheticEvent } from "react";
|
|
2
2
|
import { DateValue } from "@internationalized/date";
|
|
3
3
|
export interface DateInputProps extends Omit<ComponentPropsWithoutRef<"div">, "defaultValue">, Pick<ComponentPropsWithoutRef<"input">, "disabled" | "placeholder"> {
|
|
4
4
|
ariaLabel?: string;
|
|
@@ -43,5 +43,13 @@ export interface DateInputProps extends Omit<ComponentPropsWithoutRef<"div">, "d
|
|
|
43
43
|
* Selection variant. Defaults to single select.
|
|
44
44
|
*/
|
|
45
45
|
selectionVariant?: "default" | "range";
|
|
46
|
+
/**
|
|
47
|
+
* Callback fired when the selected daate change.
|
|
48
|
+
*/
|
|
49
|
+
onSelectionChange?: (event: SyntheticEvent, selectedDate?: DateValue | {
|
|
50
|
+
startDate?: DateValue;
|
|
51
|
+
endDate?: DateValue;
|
|
52
|
+
}) => void;
|
|
53
|
+
onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
46
54
|
}
|
|
47
55
|
export declare const DateInput: import("react").ForwardRefExoticComponent<DateInputProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComponentPropsWithoutRef } from "react";
|
|
1
|
+
import { ChangeEventHandler, ComponentPropsWithoutRef, SyntheticEvent } from "react";
|
|
2
2
|
import { DateValue } from "@internationalized/date";
|
|
3
3
|
import { CalendarProps } from "../calendar";
|
|
4
4
|
export interface DatePickerProps extends Omit<ComponentPropsWithoutRef<"div">, "defaultValue">, Pick<ComponentPropsWithoutRef<"input">, "disabled" | "value" | "defaultValue" | "placeholder"> {
|
|
@@ -16,8 +16,8 @@ export interface DatePickerProps extends Omit<ComponentPropsWithoutRef<"div">, "
|
|
|
16
16
|
* Can be a single date or an object with start and end dates for range selection.
|
|
17
17
|
*/
|
|
18
18
|
selectedDate?: DateValue | {
|
|
19
|
-
startDate
|
|
20
|
-
endDate
|
|
19
|
+
startDate?: DateValue;
|
|
20
|
+
endDate?: DateValue;
|
|
21
21
|
};
|
|
22
22
|
/**
|
|
23
23
|
* The default date value. Use when the component is not controlled.
|
|
@@ -51,5 +51,20 @@ export interface DatePickerProps extends Omit<ComponentPropsWithoutRef<"div">, "
|
|
|
51
51
|
* If `true`, the component is read only.
|
|
52
52
|
*/
|
|
53
53
|
readOnly?: boolean;
|
|
54
|
+
/**
|
|
55
|
+
* Validation status.
|
|
56
|
+
*/
|
|
57
|
+
validationStatus?: "error" | "warning" | "success";
|
|
58
|
+
/**
|
|
59
|
+
* Callback fired when the selected date change.
|
|
60
|
+
*/
|
|
61
|
+
onSelectionChange?: (event: SyntheticEvent, selectedDate?: DateValue | {
|
|
62
|
+
startDate?: DateValue;
|
|
63
|
+
endDate?: DateValue;
|
|
64
|
+
}) => void;
|
|
65
|
+
/**
|
|
66
|
+
* Callback fired when the input value change.
|
|
67
|
+
*/
|
|
68
|
+
onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
54
69
|
}
|
|
55
70
|
export declare const DatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -14,8 +14,6 @@ export interface DatePickerContextValue extends Partial<Pick<UseFloatingUIReturn
|
|
|
14
14
|
setEndVisibleMonth: (newStartDate: DateValue | undefined) => void;
|
|
15
15
|
defaultEndDate: DateValue | undefined;
|
|
16
16
|
setEndDate: (newEndDate: DateValue | undefined) => void;
|
|
17
|
-
validationStatusState: "error" | undefined;
|
|
18
|
-
setValidationStatus: (newStatus: "error" | undefined) => void;
|
|
19
17
|
selectionVariant: "default" | "range";
|
|
20
18
|
getPanelPosition: () => Record<string, unknown>;
|
|
21
19
|
}
|
|
@@ -1,7 +1,11 @@
|
|
|
1
|
-
import { ComponentPropsWithoutRef } from "react";
|
|
1
|
+
import { ComponentPropsWithoutRef, SyntheticEvent } from "react";
|
|
2
2
|
import { CalendarProps } from "../calendar";
|
|
3
|
+
import { DateValue } from "@internationalized/date";
|
|
3
4
|
export interface DatePickerPanelProps extends ComponentPropsWithoutRef<"div"> {
|
|
4
|
-
onSelect?: (
|
|
5
|
+
onSelect?: (event: SyntheticEvent, selectedDate?: DateValue | {
|
|
6
|
+
startDate?: DateValue;
|
|
7
|
+
endDate?: DateValue;
|
|
8
|
+
}) => void;
|
|
5
9
|
helperText?: string;
|
|
6
10
|
CalendarProps?: Partial<Omit<CalendarProps, "selectionVariant" | "selectedDate" | "defaultSelectedDate" | "onSelectedDateChange">>;
|
|
7
11
|
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef } from "react";
|
|
2
|
+
export interface DividerProps extends ComponentPropsWithoutRef<"div"> {
|
|
3
|
+
/**
|
|
4
|
+
* The orientation of the divider. Defaults to `"horizontal"`.
|
|
5
|
+
*/
|
|
6
|
+
orientation?: "horizontal" | "vertical";
|
|
7
|
+
/**
|
|
8
|
+
* The variant of the divider. Defaults to `"primary"`.
|
|
9
|
+
*/
|
|
10
|
+
variant?: "primary" | "secondary" | "tertiary";
|
|
11
|
+
}
|
|
12
|
+
export declare const Divider: import("react").ForwardRefExoticComponent<DividerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./Divider";
|
package/dist-types/index.d.ts
CHANGED
|
@@ -16,6 +16,7 @@ export * from "./date-input";
|
|
|
16
16
|
export * from "./date-picker";
|
|
17
17
|
export * from "./deck-item";
|
|
18
18
|
export * from "./deck-layout";
|
|
19
|
+
export * from "./divider";
|
|
19
20
|
export * from "./dropdown";
|
|
20
21
|
export * from "./editable-label";
|
|
21
22
|
export { FormFieldLegacy as FormField, type FormFieldLegacyProps as FormFieldProps, FormLabel, } from "./form-field-legacy";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salt-ds/lab",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.47",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -26,10 +26,10 @@
|
|
|
26
26
|
"react-window": "^1.8.6",
|
|
27
27
|
"rifm": "^0.12.0",
|
|
28
28
|
"tinycolor2": "^1.4.2",
|
|
29
|
-
"@salt-ds/core": "^1.
|
|
29
|
+
"@salt-ds/core": "^1.29.0",
|
|
30
30
|
"@salt-ds/window": "^0.1.1",
|
|
31
31
|
"@salt-ds/styles": "^0.2.1",
|
|
32
|
-
"@salt-ds/icons": "^1.
|
|
32
|
+
"@salt-ds/icons": "^1.12.0"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"@types/react": ">=16.14.0",
|