@a-type/ui 1.3.1 → 1.3.2
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/cjs/components/actions/ActionButton.d.ts +1 -1
- package/dist/cjs/components/actions/ActionButton.js +4 -4
- package/dist/cjs/components/actions/ActionButton.js.map +1 -1
- package/dist/cjs/components/box/Box.d.ts +3 -1
- package/dist/cjs/components/box/Box.js +4 -4
- package/dist/cjs/components/box/Box.js.map +1 -1
- package/dist/cjs/components/box/Box.stories.d.ts +1 -1
- package/dist/cjs/components/button/Button.d.ts +3 -2
- package/dist/cjs/components/button/Button.js +4 -4
- package/dist/cjs/components/button/Button.js.map +1 -1
- package/dist/cjs/components/button/Button.stories.d.ts +1 -1
- package/dist/cjs/components/camera/Camera.d.ts +7 -5
- package/dist/cjs/components/camera/Camera.js +12 -10
- package/dist/cjs/components/camera/Camera.js.map +1 -1
- package/dist/cjs/components/camera/Camera.stories.d.ts +2 -2
- package/dist/cjs/components/card/Card.d.ts +10 -18
- package/dist/cjs/components/card/Card.js +11 -10
- package/dist/cjs/components/card/Card.js.map +1 -1
- package/dist/cjs/components/checkbox/Checkbox.d.ts +2 -1
- package/dist/cjs/components/checkbox/Checkbox.js +3 -3
- package/dist/cjs/components/checkbox/Checkbox.js.map +1 -1
- package/dist/cjs/components/chip/Chip.d.ts +3 -2
- package/dist/cjs/components/chip/Chip.js +4 -5
- package/dist/cjs/components/chip/Chip.js.map +1 -1
- package/dist/cjs/components/collapsible/Collapsible.d.ts +7 -4
- package/dist/cjs/components/collapsible/Collapsible.js +5 -5
- package/dist/cjs/components/collapsible/Collapsible.js.map +1 -1
- package/dist/cjs/components/contextMenu/contextMenu.d.ts +7 -2
- package/dist/cjs/components/contextMenu/contextMenu.js +5 -5
- package/dist/cjs/components/contextMenu/contextMenu.js.map +1 -1
- package/dist/cjs/components/dialog/Dialog.d.ts +37 -19
- package/dist/cjs/components/dialog/Dialog.js +20 -15
- package/dist/cjs/components/dialog/Dialog.js.map +1 -1
- package/dist/cjs/components/dialog/Dialog.stories.d.ts +14 -7
- package/dist/cjs/components/divider/Divider.d.ts +3 -1
- package/dist/cjs/components/divider/Divider.js +5 -5
- package/dist/cjs/components/divider/Divider.js.map +1 -1
- package/dist/cjs/components/dropdownMenu/DropdownMenu.d.ts +6 -2
- package/dist/cjs/components/dropdownMenu/DropdownMenu.js +3 -4
- package/dist/cjs/components/dropdownMenu/DropdownMenu.js.map +1 -1
- package/dist/cjs/components/dropdownMenu/DropdownMenu.stories.d.ts +3 -1
- package/dist/cjs/components/forms/TextField.d.ts +3 -1
- package/dist/cjs/components/forms/TextField.js +6 -5
- package/dist/cjs/components/forms/TextField.js.map +1 -1
- package/dist/cjs/components/icon/Icon.d.ts +3 -1
- package/dist/cjs/components/icon/Icon.js +4 -4
- package/dist/cjs/components/icon/Icon.js.map +1 -1
- package/dist/cjs/components/infiniteLoadTrigger/InfiniteLoadTrigger.d.ts +3 -1
- package/dist/cjs/components/infiniteLoadTrigger/InfiniteLoadTrigger.js +6 -5
- package/dist/cjs/components/infiniteLoadTrigger/InfiniteLoadTrigger.js.map +1 -1
- package/dist/cjs/components/input/Input.d.ts +3 -1
- package/dist/cjs/components/input/Input.js +4 -3
- package/dist/cjs/components/input/Input.js.map +1 -1
- package/dist/cjs/components/input/Input.stories.d.ts +3 -1
- package/dist/cjs/components/liveUpdateTextField/LiveUpdateTextField.d.ts +3 -2
- package/dist/cjs/components/liveUpdateTextField/LiveUpdateTextField.js +5 -4
- package/dist/cjs/components/liveUpdateTextField/LiveUpdateTextField.js.map +1 -1
- package/dist/cjs/components/marquee/marquee.d.ts +1 -1
- package/dist/cjs/components/navBar/NavBar.d.ts +10 -5
- package/dist/cjs/components/navBar/NavBar.js +8 -7
- package/dist/cjs/components/navBar/NavBar.js.map +1 -1
- package/dist/cjs/components/popover/Popover.d.ts +13 -8
- package/dist/cjs/components/popover/Popover.js +5 -5
- package/dist/cjs/components/popover/Popover.js.map +1 -1
- package/dist/cjs/components/progress/Progress.d.ts +4 -3
- package/dist/cjs/components/progress/Progress.js +3 -4
- package/dist/cjs/components/progress/Progress.js.map +1 -1
- package/dist/cjs/components/progress/Progress.stories.d.ts +4 -3
- package/dist/cjs/components/scrollArea/ScrollArea.d.ts +12 -5
- package/dist/cjs/components/scrollArea/ScrollArea.js +12 -9
- package/dist/cjs/components/scrollArea/ScrollArea.js.map +1 -1
- package/dist/cjs/components/select/Select.d.ts +23 -13
- package/dist/cjs/components/select/Select.js +18 -15
- package/dist/cjs/components/select/Select.js.map +1 -1
- package/dist/cjs/components/select/Select.stories.d.ts +10 -6
- package/dist/cjs/components/slider/Slider.d.ts +3 -1
- package/dist/cjs/components/slider/Slider.js +3 -4
- package/dist/cjs/components/slider/Slider.js.map +1 -1
- package/dist/cjs/components/slider/Slider.stories.d.ts +3 -1
- package/dist/cjs/components/spinner/Spinner.d.ts +6 -2
- package/dist/cjs/components/spinner/Spinner.js +8 -6
- package/dist/cjs/components/spinner/Spinner.js.map +1 -1
- package/dist/cjs/components/switch/Switch.d.ts +3 -1
- package/dist/cjs/components/switch/Switch.js +15 -4
- package/dist/cjs/components/switch/Switch.js.map +1 -1
- package/dist/cjs/components/textArea/TextArea.d.ts +3 -1
- package/dist/cjs/components/textArea/TextArea.js +4 -3
- package/dist/cjs/components/textArea/TextArea.js.map +1 -1
- package/dist/cjs/components/textArea/TextArea.stories.d.ts +3 -1
- package/dist/cjs/components/tooltip/Tooltip.d.ts +3 -1
- package/dist/cjs/components/tooltip/Tooltip.js +3 -4
- package/dist/cjs/components/tooltip/Tooltip.js.map +1 -1
- package/dist/cjs/components/tooltip/Tooltip.stories.d.ts +3 -1
- package/dist/cjs/components/utility/HideWhileKeyboardOpen.d.ts +3 -1
- package/dist/cjs/components/utility/HideWhileKeyboardOpen.js +5 -5
- package/dist/cjs/components/utility/HideWhileKeyboardOpen.js.map +1 -1
- package/dist/cjs/components/utility/SlotDiv.d.ts +1 -1
- package/dist/cjs/components/utility/SlotDiv.js +4 -4
- package/dist/cjs/components/utility/SlotDiv.js.map +1 -1
- package/dist/cjs/hooks/useMergedRef.d.ts +1 -1
- package/dist/cjs/hooks/useMergedRef.js.map +1 -1
- package/dist/esm/components/actions/ActionButton.d.ts +1 -1
- package/dist/esm/components/actions/ActionButton.js +4 -4
- package/dist/esm/components/actions/ActionButton.js.map +1 -1
- package/dist/esm/components/box/Box.d.ts +3 -1
- package/dist/esm/components/box/Box.js +4 -4
- package/dist/esm/components/box/Box.js.map +1 -1
- package/dist/esm/components/box/Box.stories.d.ts +1 -1
- package/dist/esm/components/button/Button.d.ts +3 -2
- package/dist/esm/components/button/Button.js +4 -4
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/button/Button.stories.d.ts +1 -1
- package/dist/esm/components/camera/Camera.d.ts +7 -5
- package/dist/esm/components/camera/Camera.js +7 -7
- package/dist/esm/components/camera/Camera.js.map +1 -1
- package/dist/esm/components/camera/Camera.stories.d.ts +2 -2
- package/dist/esm/components/card/Card.d.ts +10 -18
- package/dist/esm/components/card/Card.js +6 -7
- package/dist/esm/components/card/Card.js.map +1 -1
- package/dist/esm/components/checkbox/Checkbox.d.ts +2 -1
- package/dist/esm/components/checkbox/Checkbox.js +3 -3
- package/dist/esm/components/checkbox/Checkbox.js.map +1 -1
- package/dist/esm/components/chip/Chip.d.ts +3 -2
- package/dist/esm/components/chip/Chip.js +3 -4
- package/dist/esm/components/chip/Chip.js.map +1 -1
- package/dist/esm/components/collapsible/Collapsible.d.ts +7 -4
- package/dist/esm/components/collapsible/Collapsible.js +4 -5
- package/dist/esm/components/collapsible/Collapsible.js.map +1 -1
- package/dist/esm/components/contextMenu/contextMenu.d.ts +7 -2
- package/dist/esm/components/contextMenu/contextMenu.js +4 -5
- package/dist/esm/components/contextMenu/contextMenu.js.map +1 -1
- package/dist/esm/components/dialog/Dialog.d.ts +37 -19
- package/dist/esm/components/dialog/Dialog.js +16 -16
- package/dist/esm/components/dialog/Dialog.js.map +1 -1
- package/dist/esm/components/dialog/Dialog.stories.d.ts +14 -7
- package/dist/esm/components/divider/Divider.d.ts +3 -1
- package/dist/esm/components/divider/Divider.js +4 -5
- package/dist/esm/components/divider/Divider.js.map +1 -1
- package/dist/esm/components/dropdownMenu/DropdownMenu.d.ts +6 -2
- package/dist/esm/components/dropdownMenu/DropdownMenu.js +3 -4
- package/dist/esm/components/dropdownMenu/DropdownMenu.js.map +1 -1
- package/dist/esm/components/dropdownMenu/DropdownMenu.stories.d.ts +3 -1
- package/dist/esm/components/forms/TextField.d.ts +3 -1
- package/dist/esm/components/forms/TextField.js +6 -6
- package/dist/esm/components/forms/TextField.js.map +1 -1
- package/dist/esm/components/icon/Icon.d.ts +3 -1
- package/dist/esm/components/icon/Icon.js +3 -4
- package/dist/esm/components/icon/Icon.js.map +1 -1
- package/dist/esm/components/infiniteLoadTrigger/InfiniteLoadTrigger.d.ts +3 -1
- package/dist/esm/components/infiniteLoadTrigger/InfiniteLoadTrigger.js +5 -5
- package/dist/esm/components/infiniteLoadTrigger/InfiniteLoadTrigger.js.map +1 -1
- package/dist/esm/components/input/Input.d.ts +3 -1
- package/dist/esm/components/input/Input.js +4 -4
- package/dist/esm/components/input/Input.js.map +1 -1
- package/dist/esm/components/input/Input.stories.d.ts +3 -1
- package/dist/esm/components/liveUpdateTextField/LiveUpdateTextField.d.ts +3 -2
- package/dist/esm/components/liveUpdateTextField/LiveUpdateTextField.js +4 -4
- package/dist/esm/components/liveUpdateTextField/LiveUpdateTextField.js.map +1 -1
- package/dist/esm/components/marquee/marquee.d.ts +1 -1
- package/dist/esm/components/navBar/NavBar.d.ts +10 -5
- package/dist/esm/components/navBar/NavBar.js +6 -7
- package/dist/esm/components/navBar/NavBar.js.map +1 -1
- package/dist/esm/components/popover/Popover.d.ts +13 -8
- package/dist/esm/components/popover/Popover.js +4 -5
- package/dist/esm/components/popover/Popover.js.map +1 -1
- package/dist/esm/components/progress/Progress.d.ts +4 -3
- package/dist/esm/components/progress/Progress.js +3 -4
- package/dist/esm/components/progress/Progress.js.map +1 -1
- package/dist/esm/components/progress/Progress.stories.d.ts +4 -3
- package/dist/esm/components/scrollArea/ScrollArea.d.ts +12 -5
- package/dist/esm/components/scrollArea/ScrollArea.js +10 -9
- package/dist/esm/components/scrollArea/ScrollArea.js.map +1 -1
- package/dist/esm/components/select/Select.d.ts +23 -13
- package/dist/esm/components/select/Select.js +16 -16
- package/dist/esm/components/select/Select.js.map +1 -1
- package/dist/esm/components/select/Select.stories.d.ts +10 -6
- package/dist/esm/components/slider/Slider.d.ts +3 -1
- package/dist/esm/components/slider/Slider.js +3 -4
- package/dist/esm/components/slider/Slider.js.map +1 -1
- package/dist/esm/components/slider/Slider.stories.d.ts +3 -1
- package/dist/esm/components/spinner/Spinner.d.ts +6 -2
- package/dist/esm/components/spinner/Spinner.js +6 -6
- package/dist/esm/components/spinner/Spinner.js.map +1 -1
- package/dist/esm/components/switch/Switch.d.ts +3 -1
- package/dist/esm/components/switch/Switch.js +15 -4
- package/dist/esm/components/switch/Switch.js.map +1 -1
- package/dist/esm/components/textArea/TextArea.d.ts +3 -1
- package/dist/esm/components/textArea/TextArea.js +4 -4
- package/dist/esm/components/textArea/TextArea.js.map +1 -1
- package/dist/esm/components/textArea/TextArea.stories.d.ts +3 -1
- package/dist/esm/components/tooltip/Tooltip.d.ts +3 -1
- package/dist/esm/components/tooltip/Tooltip.js +3 -4
- package/dist/esm/components/tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/tooltip/Tooltip.stories.d.ts +3 -1
- package/dist/esm/components/utility/HideWhileKeyboardOpen.d.ts +3 -1
- package/dist/esm/components/utility/HideWhileKeyboardOpen.js +4 -5
- package/dist/esm/components/utility/HideWhileKeyboardOpen.js.map +1 -1
- package/dist/esm/components/utility/SlotDiv.d.ts +1 -1
- package/dist/esm/components/utility/SlotDiv.js +3 -4
- package/dist/esm/components/utility/SlotDiv.js.map +1 -1
- package/dist/esm/hooks/useMergedRef.d.ts +1 -1
- package/dist/esm/hooks/useMergedRef.js.map +1 -1
- package/package.json +1 -1
- package/src/components/actions/ActionButton.tsx +45 -45
- package/src/components/box/Box.tsx +19 -20
- package/src/components/button/Button.tsx +54 -57
- package/src/components/camera/Camera.tsx +133 -133
- package/src/components/card/Card.tsx +24 -23
- package/src/components/checkbox/Checkbox.tsx +9 -10
- package/src/components/chip/Chip.tsx +9 -5
- package/src/components/collapsible/Collapsible.tsx +56 -54
- package/src/components/contextMenu/contextMenu.tsx +60 -56
- package/src/components/dialog/Dialog.tsx +328 -312
- package/src/components/divider/Divider.tsx +32 -26
- package/src/components/dropdownMenu/DropdownMenu.tsx +126 -123
- package/src/components/forms/TextField.tsx +137 -140
- package/src/components/icon/Icon.tsx +33 -28
- package/src/components/infiniteLoadTrigger/InfiniteLoadTrigger.tsx +42 -38
- package/src/components/input/Input.tsx +75 -81
- package/src/components/liveUpdateTextField/LiveUpdateTextField.tsx +134 -138
- package/src/components/navBar/NavBar.tsx +105 -96
- package/src/components/popover/Popover.tsx +84 -87
- package/src/components/progress/Progress.tsx +40 -34
- package/src/components/scrollArea/ScrollArea.tsx +102 -94
- package/src/components/select/Select.tsx +294 -283
- package/src/components/slider/Slider.tsx +58 -55
- package/src/components/spinner/Spinner.tsx +66 -59
- package/src/components/switch/Switch.tsx +31 -27
- package/src/components/textArea/TextArea.tsx +114 -117
- package/src/components/tooltip/Tooltip.tsx +68 -63
- package/src/components/utility/HideWhileKeyboardOpen.tsx +30 -26
- package/src/components/utility/SlotDiv.tsx +16 -15
- package/src/hooks/useMergedRef.ts +3 -1
|
@@ -22,8 +22,8 @@ const clsx_1 = __importDefault(require("clsx"));
|
|
|
22
22
|
const react_1 = require("react");
|
|
23
23
|
const useRotatingShuffledValue_js_1 = require("../../hooks/useRotatingShuffledValue.js");
|
|
24
24
|
exports.inputClassName = (0, clsx_1.default)('layer-components:px-5 layer-components:py-[5px] layer-components:text-md layer-components:font-sans layer-components:rounded-20px layer-components:bg-white layer-components:select-auto layer-components:min-w-60px layer-components:color-black layer-components:border-solid layer-components:border-1 layer-components:border-gray-5 layer-components:shadow-sm-inset', 'layer-components:focus:outline-none layer-components:focus:bg-gray-1 layer-components:focus:ring-4 layer-components:focus:ring-white', 'layer-components:focus-visible:outline-none layer-components:focus-visible:ring-gray-dark-blend', 'layer-components:md:min-w-120px');
|
|
25
|
-
|
|
26
|
-
var { className, autoSelect, onFocus, onChange, onValueChange, variant: _, asChild, placeholders, placeholder, placeholdersIntervalMs = 5000 } = _a, props = __rest(_a, ["className", "autoSelect", "onFocus", "onChange", "onValueChange", "variant", "asChild", "placeholders", "placeholder", "placeholdersIntervalMs"]);
|
|
25
|
+
const Input = function Input(_a) {
|
|
26
|
+
var { ref, className, autoSelect, onFocus, onChange, onValueChange, variant: _, asChild, placeholders, placeholder, placeholdersIntervalMs = 5000 } = _a, props = __rest(_a, ["ref", "className", "autoSelect", "onFocus", "onChange", "onValueChange", "variant", "asChild", "placeholders", "placeholder", "placeholdersIntervalMs"]);
|
|
27
27
|
const handleFocus = (0, react_1.useCallback)((ev) => {
|
|
28
28
|
if (autoSelect) {
|
|
29
29
|
ev.target.select();
|
|
@@ -37,5 +37,6 @@ exports.Input = (0, react_1.forwardRef)(function Input(_a, ref) {
|
|
|
37
37
|
const randomPlaceholder = (0, useRotatingShuffledValue_js_1.useRotatingShuffledValue)(placeholders !== null && placeholders !== void 0 ? placeholders : [], placeholdersIntervalMs);
|
|
38
38
|
const Component = asChild ? react_slot_1.Slot : 'input';
|
|
39
39
|
return ((0, jsx_runtime_1.jsx)(Component, Object.assign({}, props, { onFocus: handleFocus, onChange: handleChange, className: (0, clsx_1.default)(exports.inputClassName, className), ref: ref, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : randomPlaceholder })));
|
|
40
|
-
}
|
|
40
|
+
};
|
|
41
|
+
exports.Input = Input;
|
|
41
42
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/components/input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,gDAA8B;AAC9B,
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/components/input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,gDAA8B;AAC9B,iCAA6E;AAC7E,yFAAmF;AAEtE,QAAA,cAAc,GAAG,IAAA,cAAU,EACvC,iKAAiK,EACjK,mEAAmE,EACnE,oEAAoE,EACpE,mCAAmC,CACnC,CAAC;AAaK,MAAM,KAAK,GAAG,SAAS,KAAK,CAAC,EAenC;QAfmC,EACnC,GAAG,EACH,SAAS,EACT,UAAU,EACV,OAAO,EACP,QAAQ,EACR,aAAa,EACb,OAAO,EAAE,CAAC,EACV,OAAO,EACP,YAAY,EACZ,WAAW,EACX,sBAAsB,GAAG,IAAI,OAI7B,EAHG,KAAK,cAZ2B,yJAanC,CADQ;IAIR,MAAM,WAAW,GAAG,IAAA,mBAAW,EAC9B,CAAC,EAAgC,EAAE,EAAE;QACpC,IAAI,UAAU,EAAE,CAAC;YAChB,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;QACpB,CAAC;QACD,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,EAAE,CAAC,CAAC;IACf,CAAC,EACD,CAAC,OAAO,EAAE,UAAU,CAAC,CACrB,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC/B,CAAC,EAAiC,EAAE,EAAE;QACrC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,CAAC,CAAC;IAChB,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,CAAC,CACzB,CAAC;IAEF,MAAM,iBAAiB,GAAG,IAAA,sDAAwB,EACjD,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,EAAE,EAClB,sBAAsB,CACtB,CAAC;IAEF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,OAAO,CAAC;IAE3C,OAAO,CACN,uBAAC,SAAS,oBACL,KAAK,IACT,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,YAAY,EACtB,SAAS,EAAE,IAAA,cAAU,EAAC,sBAAc,EAAE,SAAS,CAAC,EAChD,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,iBAAiB,IAC5C,CACF,CAAC;AACH,CAAC,CAAC;AAnDW,QAAA,KAAK,SAmDhB"}
|
|
@@ -2,7 +2,9 @@ import type { StoryObj } from '@storybook/react';
|
|
|
2
2
|
import { Input } from './Input.js';
|
|
3
3
|
declare const meta: {
|
|
4
4
|
title: string;
|
|
5
|
-
component:
|
|
5
|
+
component: ({ ref, className, autoSelect, onFocus, onChange, onValueChange, variant: _, asChild, placeholders, placeholder, placeholdersIntervalMs, ...props }: import("./Input.js").InputProps & {
|
|
6
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
7
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
6
8
|
argTypes: {};
|
|
7
9
|
parameters: {
|
|
8
10
|
controls: {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FocusEvent, KeyboardEventHandler, MouseEventHandler } from 'react';
|
|
1
|
+
import { FocusEvent, KeyboardEventHandler, MouseEventHandler, Ref } from 'react';
|
|
2
2
|
import { InputProps } from '../input/Input.js';
|
|
3
3
|
export type LiveUpdateTextFieldProps = {
|
|
4
4
|
value: string;
|
|
@@ -18,6 +18,7 @@ export type LiveUpdateTextFieldProps = {
|
|
|
18
18
|
onKeyDown?: KeyboardEventHandler;
|
|
19
19
|
onKeyUp?: KeyboardEventHandler;
|
|
20
20
|
onClick?: MouseEventHandler;
|
|
21
|
+
ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;
|
|
21
22
|
};
|
|
22
23
|
/**
|
|
23
24
|
* An extension of TextField which keeps a local realtime value in state and
|
|
@@ -26,4 +27,4 @@ export type LiveUpdateTextFieldProps = {
|
|
|
26
27
|
*
|
|
27
28
|
* This component is optimistic and will not respond to external changes while focused.
|
|
28
29
|
*/
|
|
29
|
-
export declare const LiveUpdateTextField:
|
|
30
|
+
export declare const LiveUpdateTextField: ({ ref, value, onChange, debounceMs, onFocus, onBlur, textArea, type, ...rest }: LiveUpdateTextFieldProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
@@ -15,8 +15,8 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
15
15
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
16
16
|
exports.LiveUpdateTextField = void 0;
|
|
17
17
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
18
|
-
const react_1 = require("react");
|
|
19
18
|
const utils_1 = require("@a-type/utils");
|
|
19
|
+
const react_1 = require("react");
|
|
20
20
|
const Input_js_1 = require("../input/Input.js");
|
|
21
21
|
const TextArea_js_1 = require("../textArea/TextArea.js");
|
|
22
22
|
/**
|
|
@@ -26,8 +26,8 @@ const TextArea_js_1 = require("../textArea/TextArea.js");
|
|
|
26
26
|
*
|
|
27
27
|
* This component is optimistic and will not respond to external changes while focused.
|
|
28
28
|
*/
|
|
29
|
-
|
|
30
|
-
var { value, onChange, debounceMs = 500, onFocus, onBlur, textArea, type } = _a, rest = __rest(_a, ["value", "onChange", "debounceMs", "onFocus", "onBlur", "textArea", "type"]);
|
|
29
|
+
const LiveUpdateTextField = function LiveUpdateTextField(_a) {
|
|
30
|
+
var { ref, value, onChange, debounceMs = 500, onFocus, onBlur, textArea, type } = _a, rest = __rest(_a, ["ref", "value", "onChange", "debounceMs", "onFocus", "onBlur", "textArea", "type"]);
|
|
31
31
|
const [displayValue, setDisplayValue] = (0, react_1.useState)(value || '');
|
|
32
32
|
const ignoreUpdates = (0, react_1.useRef)(false);
|
|
33
33
|
const didChange = (0, react_1.useRef)(false);
|
|
@@ -68,5 +68,6 @@ exports.LiveUpdateTextField = (0, react_1.forwardRef)(function LiveUpdateTextFie
|
|
|
68
68
|
else {
|
|
69
69
|
return ((0, jsx_runtime_1.jsx)(Input_js_1.Input, Object.assign({ ref: ref, onFocus: handleFocus, onBlur: handleBlur, value: displayValue, onChange: handleChange, type: type }, rest)));
|
|
70
70
|
}
|
|
71
|
-
}
|
|
71
|
+
};
|
|
72
|
+
exports.LiveUpdateTextField = LiveUpdateTextField;
|
|
72
73
|
//# sourceMappingURL=LiveUpdateTextField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LiveUpdateTextField.js","sourceRoot":"","sources":["../../../../src/components/liveUpdateTextField/LiveUpdateTextField.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;AAEb,iCAWe;AACf,
|
|
1
|
+
{"version":3,"file":"LiveUpdateTextField.js","sourceRoot":"","sources":["../../../../src/components/liveUpdateTextField/LiveUpdateTextField.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;AAEb,yCAAyC;AACzC,iCAWe;AACf,gDAAsD;AACtD,yDAAmD;AAuBnD;;;;;;GAMG;AACI,MAAM,mBAAmB,GAAG,SAAS,mBAAmB,CAAC,EAUrC;QAVqC,EAC/D,GAAG,EACH,KAAK,EACL,QAAQ,EACR,UAAU,GAAG,GAAG,EAChB,OAAO,EACP,MAAM,EACN,QAAQ,EACR,IAAI,OAEsB,EADvB,IAAI,cATwD,mFAU/D,CADO;IAEP,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAC9D,MAAM,aAAa,GAAG,IAAA,cAAM,EAAC,KAAK,CAAC,CAAC;IACpC,MAAM,SAAS,GAAG,IAAA,cAAM,EAAC,KAAK,CAAC,CAAC;IAEhC,MAAM,WAAW,GAAG,IAAA,mBAAW,EAC9B,CAAC,EAAsD,EAAE,EAAE;QAC1D,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,EAAE,CAAC,CAAC;QACd,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;IAC9B,CAAC,EACD,CAAC,OAAO,CAAC,CACT,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,mBAAW,EAC7B,CAAC,EAAsD,EAAE,EAAE;QAC1D,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,EAAE,CAAC,CAAC;QACb,aAAa,CAAC,OAAO,GAAG,KAAK,CAAC;QAC9B,sDAAsD;QACtD,yCAAyC;QACzC,IAAI,SAAS,CAAC,OAAO,EAAE,CAAC;YACvB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,YAAY,CAAC,CAAC;QAC1B,CAAC;aAAM,CAAC;YACP,eAAe,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;QAC9B,CAAC;QACD,SAAS,CAAC,OAAO,GAAG,KAAK,CAAC;IAC3B,CAAC,EACD,CAAC,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,KAAK,CAAC,CACvC,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACd,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;YAC3B,OAAO;QACR,CAAC;QACD,eAAe,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,kDAAkD;IAClD,MAAM,iBAAiB,GAAG,IAAA,eAAO,EAChC,GAAG,EAAE,CAAC,IAAA,gBAAQ,EAAC,QAAQ,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,EAAE,UAAU,CAAC,EAClD,CAAC,QAAQ,EAAE,UAAU,CAAC,CACtB,CAAC;IAEF,qDAAqD;IACrD,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC/B,CAAC,EAAoB,EAAE,EAAE;QACxB,eAAe,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,iBAAiB,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACnC,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC;IAC1B,CAAC,EACD,CAAC,iBAAiB,CAAC,CACnB,CAAC;IAEF,IAAI,QAAQ,EAAE,CAAC;QACd,OAAO,CACN,uBAAC,sBAAQ,kBACR,GAAG,EAAE,GAAU,EACf,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,QAAQ,UACJ,IAAI,EACP,CACF,CAAC;IACH,CAAC;SAAM,CAAC;QACP,OAAO,CACN,uBAAC,gBAAK,kBACL,GAAG,EAAE,GAAU,EACf,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,IAAI,IACN,IAAI,EACP,CACF,CAAC;IACH,CAAC;AACF,CAAC,CAAC;AAvFW,QAAA,mBAAmB,uBAuF9B"}
|
|
@@ -6,5 +6,5 @@ export interface MarqueeProps {
|
|
|
6
6
|
}
|
|
7
7
|
export declare function Marquee({ className, children, timeout }: MarqueeProps): import("react/jsx-runtime.js").JSX.Element;
|
|
8
8
|
export declare namespace Marquee {
|
|
9
|
-
var Item: import("react").FunctionComponent<
|
|
9
|
+
var Item: import("react").FunctionComponent<import("../utility/SlotDiv.js").SlotDivProps>;
|
|
10
10
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
1
|
+
import { ReactNode, Ref } from 'react';
|
|
2
2
|
import { IconProps } from '../icon/index.js';
|
|
3
3
|
export declare const navBarItemClass: string;
|
|
4
4
|
export interface NavBarItemProps {
|
|
@@ -7,7 +7,9 @@ export interface NavBarItemProps {
|
|
|
7
7
|
children?: ReactNode;
|
|
8
8
|
active?: boolean;
|
|
9
9
|
}
|
|
10
|
-
export declare const NavBarItem:
|
|
10
|
+
export declare const NavBarItem: ({ ref, asChild, className, active, ...rest }: NavBarItemProps & {
|
|
11
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
12
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
11
13
|
export declare const NavBarItemIconWrapper: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
12
14
|
export declare const NavBarItemText: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
|
|
13
15
|
interface NavBarItemIconProps {
|
|
@@ -15,13 +17,16 @@ interface NavBarItemIconProps {
|
|
|
15
17
|
name?: IconProps['name'];
|
|
16
18
|
className?: string;
|
|
17
19
|
children?: ReactNode;
|
|
20
|
+
ref?: Ref<any>;
|
|
18
21
|
}
|
|
19
|
-
export declare const NavBarItemIcon:
|
|
22
|
+
export declare const NavBarItemIcon: ({ ref, children, asChild, className, name, ...rest }: NavBarItemIconProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
20
23
|
export declare const NavBarItemPip: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
21
24
|
export declare const NavBarRoot: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
22
25
|
export declare const NavBar: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>> & {
|
|
23
|
-
Item:
|
|
24
|
-
|
|
26
|
+
Item: ({ ref, asChild, className, active, ...rest }: NavBarItemProps & {
|
|
27
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
28
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
29
|
+
ItemIcon: ({ ref, children, asChild, className, name, ...rest }: NavBarItemIconProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
25
30
|
ItemText: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
|
|
26
31
|
ItemIconWrapper: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
27
32
|
ItemPip: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
|
|
@@ -49,22 +49,23 @@ exports.NavBar = exports.NavBarRoot = exports.NavBarItemPip = exports.NavBarItem
|
|
|
49
49
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
50
50
|
const react_slot_1 = require("@radix-ui/react-slot");
|
|
51
51
|
const clsx_1 = __importStar(require("clsx"));
|
|
52
|
-
const react_1 = require("react");
|
|
53
52
|
const hooks_js_1 = require("../../hooks.js");
|
|
54
53
|
const index_js_1 = require("../icon/index.js");
|
|
55
54
|
exports.navBarItemClass = (0, clsx_1.default)('layer-components:flex layer-components:flex-col layer-components:items-center layer-components:justify-center layer-components:whitespace-nowrap layer-components:py-1 layer-components:px-3 layer-components:bg-transparent layer-components:rounded-md layer-components:border-none layer-components:cursor-pointer layer-components:text-sm layer-components:transition-colors layer-components:h-full layer-components:gap-6px layer-components:relative layer-components:text-gray-7 layer-components:select-none', 'layer-components:sm:flex-row-reverse layer-components:sm:h-auto layer-components:sm:justify-start layer-components:sm:gap-2 layer-components:sm:overflow-visible', 'layer-components:hover:bg-primary-wash', 'layer-components:focus-visible:outline-none layer-components:focus-visible:bg-primary-wash', 'layer-components:active:bg-primary-wash layer-components:sm:active:bg-gray-dark-blend', 'layer-components:[&[data-active=true]]:bg-primary-wash layer-components:[&[data-active=true]]:text-black');
|
|
56
|
-
|
|
57
|
-
var { asChild, className, active } = _a, rest = __rest(_a, ["asChild", "className", "active"]);
|
|
55
|
+
const NavBarItem = function NavBarItem(_a) {
|
|
56
|
+
var { ref, asChild, className, active } = _a, rest = __rest(_a, ["ref", "asChild", "className", "active"]);
|
|
58
57
|
const Comp = asChild ? react_slot_1.Slot : 'div';
|
|
59
58
|
return ((0, jsx_runtime_1.jsx)(Comp, Object.assign({ ref: ref, className: (0, clsx_1.default)(exports.navBarItemClass, className), "data-active": active }, rest)));
|
|
60
|
-
}
|
|
59
|
+
};
|
|
60
|
+
exports.NavBarItem = NavBarItem;
|
|
61
61
|
exports.NavBarItemIconWrapper = (0, hooks_js_1.withClassName)('div', 'layer-components:relative layer-components:flex layer-components:sm:p-6px layer-components:sm:rounded-full layer-components:sm:bg-gray-blend', 'layer-variants:sm:[*[data-active=true]_&]:bg-primary-light');
|
|
62
62
|
exports.NavBarItemText = (0, hooks_js_1.withClassName)('span', 'layer-components:overflow-hidden layer-components:pl-1 layer-components:inline-block layer-components:text-xxs layer-components:whitespace-nowrap layer-components:text-ellipsis layer-components:sm:text-md layer-components:sm:leading-normal');
|
|
63
|
-
|
|
64
|
-
var { children, asChild, className, name = 'placeholder' } = _a, rest = __rest(_a, ["children", "asChild", "className", "name"]);
|
|
63
|
+
const NavBarItemIcon = function NavBarItemIcon(_a) {
|
|
64
|
+
var { ref, children, asChild, className, name = 'placeholder' } = _a, rest = __rest(_a, ["ref", "children", "asChild", "className", "name"]);
|
|
65
65
|
const Comp = asChild ? react_slot_1.Slot : index_js_1.Icon;
|
|
66
66
|
return ((0, jsx_runtime_1.jsx)(Comp, Object.assign({ name: name, className: (0, clsx_1.clsx)('layer-components:relative layer-components:z-1 layer-components:flex layer-components:fill-none layer-components:text-inherit', 'layer-variants:[*[data-active=true]_&]:fill-primary-light', className) }, rest, { ref: ref, children: children })));
|
|
67
|
-
}
|
|
67
|
+
};
|
|
68
|
+
exports.NavBarItemIcon = NavBarItemIcon;
|
|
68
69
|
exports.NavBarItemPip = (0, hooks_js_1.withClassName)('div', 'layer-components:absolute layer-components:top-6px layer-components:right-6px layer-components:w-6px layer-components:h-6px layer-components:rounded-full layer-components:bg-attention layer-components:shadow-sm');
|
|
69
70
|
exports.NavBarRoot = (0, hooks_js_1.withClassName)('div', 'layer-components:grid layer-components:[grid-auto-columns:1fr] layer-components:[grid-auto-flow:column] layer-components:justify-items-center layer-components:w-full layer-components:rounded-0 layer-components:overflow-hidden layer-components:z-50 layer-components:p-1 layer-components:h-auto', 'pb-[calc(0.25rem+env(safe-area-inset-bottom,0px))]', 'layer-components:sm:bg-transparent layer-components:sm:flex layer-components:sm:flex-col layer-components:sm:rounded-0 layer-components:sm:border-none layer-components:sm:border-transparent layer-components:sm:shadow-none layer-components:sm:h-min-content layer-components:sm:overflow-y-auto layer-components:sm:overflow-x-hidden layer-components:sm:justify-start layer-components:sm:items-stretch layer-components:sm:gap-2 layer-components:sm:pb-10');
|
|
70
71
|
exports.NavBar = Object.assign(exports.NavBarRoot, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavBar.js","sourceRoot":"","sources":["../../../../src/components/navBar/NavBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,6CAAwC;
|
|
1
|
+
{"version":3,"file":"NavBar.js","sourceRoot":"","sources":["../../../../src/components/navBar/NavBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qDAA4C;AAC5C,6CAAwC;AAExC,6CAA+C;AAC/C,+CAAmD;AAEtC,QAAA,eAAe,GAAG,IAAA,cAAU,EACxC,yNAAyN,EACzN,oFAAoF,EACpF,wCAAwC,EACxC,+DAA+D,EAC/D,uFAAuF,EACvF,qEAAqE,CACrE,CAAC;AASK,MAAM,UAAU,GAAG,SAAS,UAAU,CAAC,EAQ7C;QAR6C,EAC7C,GAAG,EACH,OAAO,EACP,SAAS,EACT,MAAM,OAIN,EAHG,IAAI,cALsC,yCAM7C,CADO;IAIP,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpC,OAAO,CACN,uBAAC,IAAI,kBACJ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAU,EAAC,uBAAe,EAAE,SAAS,CAAC,iBACpC,MAAM,IACf,IAAI,EACP,CACF,CAAC;AACH,CAAC,CAAC;AAnBW,QAAA,UAAU,cAmBrB;AAEW,QAAA,qBAAqB,GAAG,IAAA,wBAAa,EACjD,KAAK,EACL,yFAAyF,EACzF,4DAA4D,CAC5D,CAAC;AAEW,QAAA,cAAc,GAAG,IAAA,wBAAa,EAC1C,MAAM,EACN,4IAA4I,CAC5I,CAAC;AASK,MAAM,cAAc,GAAG,SAAS,cAAc,CAAC,EAOhC;QAPgC,EACrD,GAAG,EACH,QAAQ,EACR,OAAO,EACP,SAAS,EACT,IAAI,GAAG,aAAa,OAEC,EADlB,IAAI,cAN8C,mDAOrD,CADO;IAEP,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,eAAI,CAAC;IACnC,OAAO,CACN,uBAAC,IAAI,kBACJ,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,IAAA,WAAI,EACd,6DAA6D,EAC7D,2DAA2D,EAC3D,SAAS,CACT,IACG,IAAI,IACR,GAAG,EAAE,GAAG,YAEP,QAAQ,IACH,CACP,CAAC;AACH,CAAC,CAAC;AAvBW,QAAA,cAAc,kBAuBzB;AAEW,QAAA,aAAa,GAAG,IAAA,wBAAa,EACzC,KAAK,EACL,+FAA+F,CAC/F,CAAC;AAEW,QAAA,UAAU,GAAG,IAAA,wBAAa,EACtC,KAAK,EACL,+IAA+I,EAC/I,oDAAoD,EACpD,iMAAiM,CACjM,CAAC;AAEW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,kBAAU,EAAE;IAC/C,IAAI,EAAE,kBAAU;IAChB,QAAQ,EAAE,sBAAc;IACxB,QAAQ,EAAE,sBAAc;IACxB,eAAe,EAAE,6BAAqB;IACtC,OAAO,EAAE,qBAAa;CACtB,CAAC,CAAC"}
|
|
@@ -1,20 +1,25 @@
|
|
|
1
1
|
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
2
|
+
import { Ref } from 'react';
|
|
2
3
|
export declare const PopoverRoot: import("react").FC<PopoverPrimitive.PopoverProps>;
|
|
3
4
|
export declare const PopoverTrigger: import("react").ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
4
5
|
export declare const PopoverArrow: import("react").FunctionComponent<PopoverPrimitive.PopoverArrowProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
5
6
|
export declare const PopoverClose: import("react").FunctionComponent<PopoverPrimitive.PopoverCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
6
7
|
export declare const PopoverAnchor: import("react").ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
|
-
export declare const PopoverContent:
|
|
8
|
-
disableBlur?: boolean;
|
|
9
|
-
padding?: "none" | "default";
|
|
8
|
+
export declare const PopoverContent: ({ ref, children, forceMount, disableBlur, className, radius, padding, ...props }: PopoverPrimitive.PopoverContentProps & {
|
|
10
9
|
radius?: "none" | "default" | "md";
|
|
11
|
-
|
|
10
|
+
padding?: "none" | "default";
|
|
11
|
+
forceMount?: boolean;
|
|
12
|
+
disableBlur?: boolean;
|
|
13
|
+
ref?: Ref<HTMLDivElement>;
|
|
14
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
12
15
|
export declare const Popover: import("react").FC<PopoverPrimitive.PopoverProps> & {
|
|
13
|
-
Content:
|
|
14
|
-
disableBlur?: boolean;
|
|
15
|
-
padding?: "none" | "default";
|
|
16
|
+
Content: ({ ref, children, forceMount, disableBlur, className, radius, padding, ...props }: PopoverPrimitive.PopoverContentProps & {
|
|
16
17
|
radius?: "none" | "default" | "md";
|
|
17
|
-
|
|
18
|
+
padding?: "none" | "default";
|
|
19
|
+
forceMount?: boolean;
|
|
20
|
+
disableBlur?: boolean;
|
|
21
|
+
ref?: Ref<HTMLDivElement>;
|
|
22
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
18
23
|
Arrow: import("react").FunctionComponent<PopoverPrimitive.PopoverArrowProps & import("react").RefAttributes<SVGSVGElement>>;
|
|
19
24
|
Close: import("react").FunctionComponent<PopoverPrimitive.PopoverCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
20
25
|
Trigger: import("react").ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -52,9 +52,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
52
52
|
exports.Popover = exports.PopoverContent = exports.PopoverAnchor = exports.PopoverClose = exports.PopoverArrow = exports.PopoverTrigger = exports.PopoverRoot = void 0;
|
|
53
53
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
54
54
|
const PopoverPrimitive = __importStar(require("@radix-ui/react-popover"));
|
|
55
|
-
const react_1 = require("react");
|
|
56
|
-
const withClassName_js_1 = require("../../hooks/withClassName.js");
|
|
57
55
|
const clsx_1 = __importDefault(require("clsx"));
|
|
56
|
+
const withClassName_js_1 = require("../../hooks/withClassName.js");
|
|
58
57
|
const StyledContent = (0, withClassName_js_1.withClassName)(PopoverPrimitive.Content, 'layer-components:rounded-xl layer-components:min-w-120px layer-components:bg-white layer-components:z-menu layer-components:shadow-lg layer-components:border-default layer-components:op-0 layer-components:hidden layer-components:max-w-90vw', 'will-change-transform', 'layer-components:transform-origin-[var(--radix-popover-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'important:motion-reduce:animate-none', 'layer-components:max-h-[var(--radix-popover-content-available-height)]', 'layer-components:[&[data-state=open]]:opacity-100 layer-components:[&[data-state=open]]:flex layer-components:[&[data-state=open]]:flex-col', 'layer-components:[&[data-state=closed]]:pointer-events-none');
|
|
59
58
|
const StyledArrow = (0, withClassName_js_1.withClassName)(PopoverPrimitive.Arrow, 'layer-components:fill-white layer-components:stroke-black');
|
|
60
59
|
const StyledClose = (0, withClassName_js_1.withClassName)(PopoverPrimitive.Close, 'layer-components:[all:unset] layer-components:[font-family:inherit] layer-components:rounded-full layer-components:h-25px layer-components:w-25px layer-components:inline-flex layer-components:items-center layer-components:justify-center layer-components:color-dark-blend layer-components:absolute layer-components:top-5px layer-components:right-5px layer-components:hover:bg-light-blend layer-components:focus:shadow-focus');
|
|
@@ -64,8 +63,8 @@ exports.PopoverTrigger = PopoverPrimitive.Trigger;
|
|
|
64
63
|
exports.PopoverArrow = StyledArrow;
|
|
65
64
|
exports.PopoverClose = StyledClose;
|
|
66
65
|
exports.PopoverAnchor = PopoverPrimitive.Anchor;
|
|
67
|
-
|
|
68
|
-
var { children, forceMount, disableBlur, className, radius = 'default', padding = 'default' } = _a, props = __rest(_a, ["children", "forceMount", "disableBlur", "className", "radius", "padding"]);
|
|
66
|
+
const PopoverContent = function PopoverContent(_a) {
|
|
67
|
+
var { ref, children, forceMount, disableBlur, className, radius = 'default', padding = 'default' } = _a, props = __rest(_a, ["ref", "children", "forceMount", "disableBlur", "className", "radius", "padding"]);
|
|
69
68
|
return ((0, jsx_runtime_1.jsx)(PopoverPrimitive.Portal, { forceMount: forceMount, children: (0, jsx_runtime_1.jsx)(StyledContent, Object.assign({}, props, { forceMount: forceMount, ref: ref, className: (0, clsx_1.default)({
|
|
70
69
|
'layer-variants:important:p-0': padding === 'none',
|
|
71
70
|
'layer-variants:p-5': padding === 'default',
|
|
@@ -73,7 +72,8 @@ exports.PopoverContent = (0, react_1.forwardRef)(function PopoverContent(_a, ref
|
|
|
73
72
|
'layer-variants:rounded-lg': radius === 'default',
|
|
74
73
|
'layer-variants:rounded-md': radius === 'md',
|
|
75
74
|
}, className), children: children })) }));
|
|
76
|
-
}
|
|
75
|
+
};
|
|
76
|
+
exports.PopoverContent = PopoverContent;
|
|
77
77
|
exports.Popover = Object.assign(exports.PopoverRoot, {
|
|
78
78
|
Content: exports.PopoverContent,
|
|
79
79
|
Arrow: exports.PopoverArrow,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../../src/components/popover/Popover.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEb,0EAA4D;
|
|
1
|
+
{"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../../src/components/popover/Popover.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEb,0EAA4D;AAE5D,gDAA8B;AAE9B,mEAA6D;AAE7D,MAAM,aAAa,GAAG,IAAA,gCAAa,EAClC,gBAAgB,CAAC,OAAO,EACxB,2GAA2G,EAC3G,uBAAuB,EACvB,2EAA2E,EAC3E,0DAA0D,EAC1D,6DAA6D,EAC7D,sCAAsC,EACtC,0EAA0E,EAC1E,mEAAmE,EACnE,6DAA6D,CAC7D,CAAC;AAEF,MAAM,WAAW,GAAG,IAAA,gCAAa,EAChC,gBAAgB,CAAC,KAAK,EACtB,4CAA4C,CAC5C,CAAC;AAEF,MAAM,WAAW,GAAG,IAAA,gCAAa,EAChC,gBAAgB,CAAC,KAAK,EACtB,6MAA6M,CAC7M,CAAC;AAEF,UAAU;AACG,QAAA,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC;AACpC,QAAA,cAAc,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAC1C,QAAA,YAAY,GAAG,WAAW,CAAC;AAC3B,QAAA,YAAY,GAAG,WAAW,CAAC;AAC3B,QAAA,aAAa,GAAG,gBAAgB,CAAC,MAAM,CAAC;AAE9C,MAAM,cAAc,GAAG,SAAS,cAAc,CAAC,EAerD;QAfqD,EACrD,GAAG,EACH,QAAQ,EACR,UAAU,EACV,WAAW,EACX,SAAS,EACT,MAAM,GAAG,SAAS,EAClB,OAAO,GAAG,SAAS,OAQnB,EAPG,KAAK,cAR6C,kFASrD,CADQ;IAQR,OAAO,CACN,uBAAC,gBAAgB,CAAC,MAAM,IAAC,UAAU,EAAE,UAAU,YAC9C,uBAAC,aAAa,oBACT,KAAK,IACT,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAU,EACpB;gBACC,8BAA8B,EAAE,OAAO,KAAK,MAAM;gBAClD,oBAAoB,EAAE,OAAO,KAAK,SAAS;gBAC3C,6BAA6B,EAAE,MAAM,KAAK,MAAM;gBAChD,2BAA2B,EAAE,MAAM,KAAK,SAAS;gBACjD,2BAA2B,EAAE,MAAM,KAAK,IAAI;aAC5C,EACD,SAAS,CACT,YAEA,QAAQ,IACM,GACS,CAC1B,CAAC;AACH,CAAC,CAAC;AArCW,QAAA,cAAc,kBAqCzB;AAEW,QAAA,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,mBAAW,EAAE;IACjD,OAAO,EAAE,sBAAc;IACvB,KAAK,EAAE,oBAAY;IACnB,KAAK,EAAE,oBAAY;IACnB,OAAO,EAAE,sBAAc;IACvB,MAAM,EAAE,qBAAa;CACrB,CAAC,CAAC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import * as ProgressPrimitive from '@radix-ui/react-progress';
|
|
2
2
|
export declare const ProgressRoot: import("react").FunctionComponent<ProgressPrimitive.ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3
3
|
export declare const ProgressIndicator: import("react").FunctionComponent<ProgressPrimitive.ProgressIndicatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
4
|
-
export declare const Progress:
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
export declare const Progress: (({ ref, children, color, max, value, ...props }: ProgressPrimitive.ProgressProps & {
|
|
5
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
6
|
+
color?: "accent";
|
|
7
|
+
}) => import("react/jsx-runtime.js").JSX.Element) & {
|
|
7
8
|
Root: import("react").FunctionComponent<ProgressPrimitive.ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
9
|
Indicator: import("react").FunctionComponent<ProgressPrimitive.ProgressIndicatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
9
10
|
};
|
|
@@ -49,15 +49,14 @@ exports.Progress = exports.ProgressIndicator = exports.ProgressRoot = void 0;
|
|
|
49
49
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
50
50
|
const ProgressPrimitive = __importStar(require("@radix-ui/react-progress"));
|
|
51
51
|
const hooks_js_1 = require("../../hooks.js");
|
|
52
|
-
const react_1 = require("react");
|
|
53
52
|
exports.ProgressRoot = (0, hooks_js_1.withClassName)(ProgressPrimitive.Root, 'layer-components:w-full layer-components:relative layer-components:overflow-hidden layer-components:border layer-components:border-default layer-components:rounded-full');
|
|
54
53
|
exports.ProgressIndicator = (0, hooks_js_1.withClassName)(ProgressPrimitive.Indicator, 'layer-components:bg-primary layer-components:w-full layer-components:h-6px layer-components:translate-x-[calc(-100%*(1-var(--value)))] layer-components:rounded-full layer-components:transition-transform', 'layer-components:[&[data-state=complete]]:bg-accent', 'layer-variants:[&[data-color=accent]]:bg-accent');
|
|
55
|
-
const ProgressBase =
|
|
56
|
-
var { children, color, max = 100, value } = _a, props = __rest(_a, ["children", "color", "max", "value"]);
|
|
54
|
+
const ProgressBase = function ProgressBase(_a) {
|
|
55
|
+
var { ref, children, color, max = 100, value } = _a, props = __rest(_a, ["ref", "children", "color", "max", "value"]);
|
|
57
56
|
return ((0, jsx_runtime_1.jsx)(exports.ProgressRoot, Object.assign({}, props, { value: value, max: max, ref: ref, children: (0, jsx_runtime_1.jsx)(exports.ProgressIndicator, { "data-color": color,
|
|
58
57
|
// @ts-ignore
|
|
59
58
|
style: { '--value': (value || 0) / max } }) })));
|
|
60
|
-
}
|
|
59
|
+
};
|
|
61
60
|
exports.Progress = Object.assign(ProgressBase, {
|
|
62
61
|
Root: exports.ProgressRoot,
|
|
63
62
|
Indicator: exports.ProgressIndicator,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/progress/Progress.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4EAA8D;AAC9D,6CAA+C;
|
|
1
|
+
{"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/progress/Progress.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4EAA8D;AAC9D,6CAA+C;AAElC,QAAA,YAAY,GAAG,IAAA,wBAAa,EACxC,iBAAiB,CAAC,IAAI,EACtB,uFAAuF,CACvF,CAAC;AACW,QAAA,iBAAiB,GAAG,IAAA,wBAAa,EAC7C,iBAAiB,CAAC,SAAS,EAC3B,yHAAyH,EACzH,uDAAuD,EACvD,mDAAmD,CACnD,CAAC;AAEF,MAAM,YAAY,GAAG,SAAS,YAAY,CAAC,EAU1C;QAV0C,EAC1C,GAAG,EACH,QAAQ,EACR,KAAK,EACL,GAAG,GAAG,GAAG,EACT,KAAK,OAKL,EAJG,KAAK,cANkC,4CAO1C,CADQ;IAKR,OAAO,CACN,uBAAC,oBAAY,oBAAK,KAAK,IAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,YACxD,uBAAC,yBAAiB,kBACL,KAAK;YACjB,aAAa;YACb,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,GACvC,IACY,CACf,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IACnD,IAAI,EAAE,oBAAY;IAClB,SAAS,EAAE,yBAAiB;CAC5B,CAAC,CAAC"}
|
|
@@ -2,9 +2,10 @@ import type { StoryObj } from '@storybook/react';
|
|
|
2
2
|
import { Progress } from './Progress.js';
|
|
3
3
|
declare const meta: {
|
|
4
4
|
title: string;
|
|
5
|
-
component:
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
component: (({ ref, children, color, max, value, ...props }: import("@radix-ui/react-progress").ProgressProps & {
|
|
6
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
7
|
+
color?: "accent";
|
|
8
|
+
}) => import("react/jsx-runtime.js").JSX.Element) & {
|
|
8
9
|
Root: import("react").FunctionComponent<import("@radix-ui/react-progress").ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
9
10
|
Indicator: import("react").FunctionComponent<import("@radix-ui/react-progress").ProgressIndicatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
10
11
|
};
|
|
@@ -1,18 +1,25 @@
|
|
|
1
1
|
import * as Primitive from '@radix-ui/react-scroll-area';
|
|
2
|
+
import { Ref } from 'react';
|
|
2
3
|
export interface ScrollAreaRootProps extends Primitive.ScrollAreaProps {
|
|
3
4
|
background?: 'white' | 'wash' | 'primary-wash' | 'primary' | 'black';
|
|
5
|
+
ref?: Ref<HTMLDivElement>;
|
|
4
6
|
}
|
|
5
|
-
export declare const ScrollAreaRoot:
|
|
7
|
+
export declare const ScrollAreaRoot: ({ ref, background, ...props }: ScrollAreaRootProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
6
8
|
export declare const ScrollAreaViewport: import("react").FunctionComponent<Primitive.ScrollAreaViewportProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
9
|
export declare const ScrollAreaScrollbarRoot: import("react").FunctionComponent<Primitive.ScrollAreaScrollbarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
10
|
export declare const ScrollAreaThumb: import("react").FunctionComponent<Primitive.ScrollAreaThumbProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
9
|
-
export declare const ScrollAreaScrollbar:
|
|
11
|
+
export declare const ScrollAreaScrollbar: ({ ref, ...props }: Primitive.ScrollAreaScrollbarProps & {
|
|
12
|
+
ref?: Ref<HTMLDivElement>;
|
|
13
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
10
14
|
export interface ScrollAreaProps extends Primitive.ScrollAreaProps {
|
|
11
15
|
background?: ScrollAreaRootProps['background'];
|
|
12
16
|
orientation?: 'vertical' | 'both';
|
|
17
|
+
ref?: Ref<HTMLDivElement>;
|
|
13
18
|
}
|
|
14
|
-
export declare const ScrollArea:
|
|
15
|
-
Root:
|
|
19
|
+
export declare const ScrollArea: (({ ref, children, orientation, ...props }: ScrollAreaProps) => import("react/jsx-runtime.js").JSX.Element) & {
|
|
20
|
+
Root: ({ ref, background, ...props }: ScrollAreaRootProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
16
21
|
Viewport: import("react").FunctionComponent<Primitive.ScrollAreaViewportProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
17
|
-
Scrollbar:
|
|
22
|
+
Scrollbar: ({ ref, ...props }: Primitive.ScrollAreaScrollbarProps & {
|
|
23
|
+
ref?: Ref<HTMLDivElement>;
|
|
24
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
18
25
|
};
|
|
@@ -48,27 +48,30 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
48
48
|
exports.ScrollArea = exports.ScrollAreaScrollbar = exports.ScrollAreaThumb = exports.ScrollAreaScrollbarRoot = exports.ScrollAreaViewport = exports.ScrollAreaRoot = void 0;
|
|
49
49
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
50
50
|
const Primitive = __importStar(require("@radix-ui/react-scroll-area"));
|
|
51
|
-
const hooks_js_1 = require("../../hooks.js");
|
|
52
51
|
const react_1 = require("react");
|
|
52
|
+
const hooks_js_1 = require("../../hooks.js");
|
|
53
53
|
const ScrollAreaRootImpl = (0, hooks_js_1.withClassName)(Primitive.Root, 'overflow-hidden bg-[var(--scroll-bg)] rounded-lg', 'layer-components:[--scroll-bg:var(--color-wash)] layer-components:[--scroll-shadow:var(--color-shadow-1))]');
|
|
54
|
-
|
|
55
|
-
var { background = 'wash' } = _a, props = __rest(_a, ["background"]);
|
|
54
|
+
const ScrollAreaRoot = function ScrollAreaRoot(_a) {
|
|
55
|
+
var { ref, background = 'wash' } = _a, props = __rest(_a, ["ref", "background"]);
|
|
56
56
|
const bgStyle = (0, react_1.useMemo)(() => ({
|
|
57
57
|
'--scroll-bg': `var(--color-${background})`,
|
|
58
58
|
'--scroll-shadow': `var(--color-${shadowMap[background]})`,
|
|
59
59
|
}), [background]);
|
|
60
60
|
return (0, jsx_runtime_1.jsx)(ScrollAreaRootImpl, Object.assign({ ref: ref, style: bgStyle }, props));
|
|
61
|
-
}
|
|
61
|
+
};
|
|
62
|
+
exports.ScrollAreaRoot = ScrollAreaRoot;
|
|
62
63
|
exports.ScrollAreaViewport = (0, hooks_js_1.withClassName)(Primitive.Viewport, 'h-full w-full', '[background:linear-gradient(var(--scroll-bg)_30%,rgba(255,255,255,0))_center_top,linear-gradient(rgba(255,255,255,0),var(--scroll-bg)_70%)_center_bottom,radial-gradient(farthest-side_at_50%_0,var(--scroll-shadow),rgba(0,0,0,0))_center_top,radial-gradient(farthest-side_at_50%_100%,var(--scroll-shadow),rgba(0,0,0,0))_center_bottom]', '![background-repeat:no-repeat] ![background-size:100%_40px,100%_40px,100%_14px,100%_14px]', '![background-attachment:local,local,scroll,scroll]');
|
|
63
64
|
exports.ScrollAreaScrollbarRoot = (0, hooks_js_1.withClassName)(Primitive.Scrollbar, 'layer-components:flex layer-components:select-none layer-components:touch-none layer-components:p-0.5 layer-components:bg-gray-2 layer-components:transition-colors layer-components:duration-160ms layer-components:ease-out', 'layer-components:hover:bg-gray-3', 'layer-components:[&[data-orientation=vertical]]:w-2.5', 'layer-components:[&[data-orientation=horizontal]]:flex-col layer-components:[&[data-orientation=horizontal]]:h-2.5');
|
|
64
65
|
exports.ScrollAreaThumb = (0, hooks_js_1.withClassName)(Primitive.Thumb, 'layer-components:flex-1 layer-components:rounded-lg layer-components:relative layer-components:bg-gray-5', 'before:content-[""] before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2 before:w-full before:min-w-44px before:min-h-44px');
|
|
65
|
-
|
|
66
|
+
const ScrollAreaScrollbar = function ScrollAreaScrollbar(_a) {
|
|
67
|
+
var { ref } = _a, props = __rest(_a, ["ref"]);
|
|
66
68
|
return ((0, jsx_runtime_1.jsx)(exports.ScrollAreaScrollbarRoot, Object.assign({}, props, { ref: ref, children: (0, jsx_runtime_1.jsx)(exports.ScrollAreaThumb, {}) })));
|
|
67
|
-
}
|
|
68
|
-
exports.
|
|
69
|
-
|
|
69
|
+
};
|
|
70
|
+
exports.ScrollAreaScrollbar = ScrollAreaScrollbar;
|
|
71
|
+
exports.ScrollArea = Object.assign(function ScrollArea(_a) {
|
|
72
|
+
var { ref, children, orientation } = _a, props = __rest(_a, ["ref", "children", "orientation"]);
|
|
70
73
|
return ((0, jsx_runtime_1.jsxs)(exports.ScrollAreaRoot, Object.assign({ ref: ref }, props, { children: [(0, jsx_runtime_1.jsx)(exports.ScrollAreaViewport, { children: children }), (0, jsx_runtime_1.jsx)(exports.ScrollAreaScrollbar, {}), orientation === 'both' && ((0, jsx_runtime_1.jsx)(exports.ScrollAreaScrollbar, { orientation: "horizontal" }))] })));
|
|
71
|
-
}
|
|
74
|
+
}, {
|
|
72
75
|
Root: exports.ScrollAreaRoot,
|
|
73
76
|
Viewport: exports.ScrollAreaViewport,
|
|
74
77
|
Scrollbar: exports.ScrollAreaScrollbar,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollArea.js","sourceRoot":"","sources":["../../../../src/components/scrollArea/ScrollArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uEAAyD;AACzD,6CAA+C;
|
|
1
|
+
{"version":3,"file":"ScrollArea.js","sourceRoot":"","sources":["../../../../src/components/scrollArea/ScrollArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uEAAyD;AACzD,iCAAqC;AACrC,6CAA+C;AAE/C,MAAM,kBAAkB,GAAG,IAAA,wBAAa,EACvC,SAAS,CAAC,IAAI,EACd,kDAAkD,EAClD,6FAA6F,CAC7F,CAAC;AAOK,MAAM,cAAc,GAAG,SAAS,cAAc,CAAC,EAIhC;QAJgC,EACrD,GAAG,EACH,UAAU,GAAG,MAAM,OAEE,EADlB,KAAK,cAH6C,qBAIrD,CADQ;IAER,MAAM,OAAO,GAAQ,IAAA,eAAO,EAC3B,GAAG,EAAE,CAAC,CAAC;QACN,aAAa,EAAE,eAAe,UAAU,GAAG;QAC3C,iBAAiB,EAAE,eAAe,SAAS,CAAC,UAAU,CAAC,GAAG;KAC1D,CAAC,EACF,CAAC,UAAU,CAAC,CACZ,CAAC;IACF,OAAO,uBAAC,kBAAkB,kBAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,IAAM,KAAK,EAAI,CAAC;AACpE,CAAC,CAAC;AAbW,QAAA,cAAc,kBAazB;AAEW,QAAA,kBAAkB,GAAG,IAAA,wBAAa,EAC9C,SAAS,CAAC,QAAQ,EAClB,eAAe,EACf,6UAA6U,EAC7U,2FAA2F,EAC3F,oDAAoD,CACpD,CAAC;AAEW,QAAA,uBAAuB,GAAG,IAAA,wBAAa,EACnD,SAAS,CAAC,SAAS,EACnB,0GAA0G,EAC1G,kCAAkC,EAClC,uDAAuD,EACvD,oEAAoE,CACpE,CAAC;AAEW,QAAA,eAAe,GAAG,IAAA,wBAAa,EAC3C,SAAS,CAAC,KAAK,EACf,yDAAyD,EACzD,gHAAgH,CAChH,CAAC;AAEK,MAAM,mBAAmB,GAAG,SAAS,mBAAmB,CAAC,EAK/D;QAL+D,EAC/D,GAAG,OAIH,EAHG,KAAK,cAFuD,OAG/D,CADQ;IAIR,OAAO,CACN,uBAAC,+BAAuB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,YAC3C,uBAAC,uBAAe,KAAG,IACM,CAC1B,CAAC;AACH,CAAC,CAAC;AAXW,QAAA,mBAAmB,uBAW9B;AAQW,QAAA,UAAU,GAAG,MAAM,CAAC,MAAM,CACtC,SAAS,UAAU,CAAC,EAKF;QALE,EACnB,GAAG,EACH,QAAQ,EACR,WAAW,OAEM,EADd,KAAK,cAJW,kCAKnB,CADQ;IAER,OAAO,CACN,wBAAC,sBAAc,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,eAClC,uBAAC,0BAAkB,cAAE,QAAQ,GAAsB,EACnD,uBAAC,2BAAmB,KAAG,EACtB,WAAW,KAAK,MAAM,IAAI,CAC1B,uBAAC,2BAAmB,IAAC,WAAW,EAAC,YAAY,GAAG,CAChD,KACe,CACjB,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,sBAAc;IACpB,QAAQ,EAAE,0BAAkB;IAC5B,SAAS,EAAE,2BAAmB;CAC9B,CACD,CAAC;AAEF,MAAM,SAAS,GAAG;IACjB,KAAK,EAAE,UAAU;IACjB,IAAI,EAAE,UAAU;IAChB,cAAc,EAAE,UAAU;IAC1B,OAAO,EAAE,UAAU;IACnB,KAAK,EAAE,SAAS;CAChB,CAAC"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import * as SelectPrimitive from '@radix-ui/react-select';
|
|
2
2
|
import { FunctionComponent, ReactNode } from 'react';
|
|
3
3
|
import { ButtonProps } from '../button/index.js';
|
|
4
|
-
export declare const SelectItem:
|
|
4
|
+
export declare const SelectItem: ({ ref: forwardedRef, children, className, ...props }: SelectPrimitive.SelectItemProps & {
|
|
5
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
6
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
5
7
|
export declare const SelectItemRoot: FunctionComponent<SelectPrimitive.SelectItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
6
8
|
export declare const SelectItemIndicatorRoot: FunctionComponent<SelectPrimitive.SelectItemIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
7
9
|
export declare const SelectItemIndicator: FunctionComponent<SelectPrimitive.SelectItemIndicatorProps>;
|
|
@@ -13,15 +15,19 @@ export declare const SelectTriggerBase: FunctionComponent<SelectPrimitive.Select
|
|
|
13
15
|
export declare const UnstyledSelectTrigger: FunctionComponent<SelectPrimitive.SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
14
16
|
export interface SelectTriggerProps extends ButtonProps {
|
|
15
17
|
}
|
|
16
|
-
export declare const SelectTrigger:
|
|
18
|
+
export declare const SelectTrigger: ({ ref, children, ...props }: SelectTriggerProps & {
|
|
19
|
+
ref?: React.Ref<HTMLButtonElement>;
|
|
20
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
17
21
|
export declare const SelectValue: FunctionComponent<SelectPrimitive.SelectValueProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
18
22
|
export declare const SelectLabel: FunctionComponent<SelectPrimitive.SelectLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
19
23
|
export declare const SelectSeparator: FunctionComponent<SelectPrimitive.SelectSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
20
|
-
export declare const SelectIcon: FunctionComponent<SelectPrimitive.SelectIconProps &
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
export declare const NativeSelect:
|
|
24
|
+
export declare const SelectIcon: FunctionComponent<SelectPrimitive.SelectIconProps & {
|
|
25
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
26
|
+
}>;
|
|
27
|
+
export declare const SelectContent: FunctionComponent<any>;
|
|
28
|
+
export declare const NativeSelect: ({ ref: forwardedRef, className, ...props }: React.SelectHTMLAttributes<HTMLSelectElement> & {
|
|
29
|
+
ref?: React.Ref<HTMLSelectElement>;
|
|
30
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
25
31
|
export type SelectProps<T extends string = string> = {
|
|
26
32
|
children?: ReactNode;
|
|
27
33
|
value: T;
|
|
@@ -37,14 +43,18 @@ export type SelectProps<T extends string = string> = {
|
|
|
37
43
|
};
|
|
38
44
|
export declare const Select: (<T extends string = string>({ children, value, onValueChange, mobileNative, ...rest }: SelectProps<T>) => import("react/jsx-runtime.js").JSX.Element) & {
|
|
39
45
|
Root: import("react").FC<SelectPrimitive.SelectProps>;
|
|
40
|
-
Item:
|
|
46
|
+
Item: ({ ref: forwardedRef, children, className, ...props }: SelectPrimitive.SelectItemProps & {
|
|
47
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
48
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
41
49
|
Group: (props: SelectPrimitive.SelectGroupProps) => import("react/jsx-runtime.js").JSX.Element;
|
|
42
|
-
Trigger:
|
|
50
|
+
Trigger: ({ ref, children, ...props }: SelectTriggerProps & {
|
|
51
|
+
ref?: React.Ref<HTMLButtonElement>;
|
|
52
|
+
}) => import("react/jsx-runtime.js").JSX.Element;
|
|
43
53
|
Value: FunctionComponent<SelectPrimitive.SelectValueProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
44
54
|
Label: FunctionComponent<SelectPrimitive.SelectLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
45
55
|
Separator: FunctionComponent<SelectPrimitive.SelectSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
46
|
-
Icon: FunctionComponent<SelectPrimitive.SelectIconProps &
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
56
|
+
Icon: FunctionComponent<SelectPrimitive.SelectIconProps & {
|
|
57
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
58
|
+
}>;
|
|
59
|
+
Content: FunctionComponent<any>;
|
|
50
60
|
};
|
|
@@ -58,14 +58,15 @@ const react_1 = require("react");
|
|
|
58
58
|
const withClassName_js_1 = require("../../hooks/withClassName.js");
|
|
59
59
|
const index_js_1 = require("../button/index.js");
|
|
60
60
|
const index_js_2 = require("../icon/index.js");
|
|
61
|
-
|
|
62
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
61
|
+
const SelectItem = (_a) => {
|
|
62
|
+
var { ref: forwardedRef, children, className } = _a, props = __rest(_a, ["ref", "children", "className"]);
|
|
63
63
|
const isNative = (0, react_1.useContext)(IsNativeContext);
|
|
64
64
|
if (isNative) {
|
|
65
65
|
return (0, jsx_runtime_1.jsx)("option", { value: props.value, children: children });
|
|
66
66
|
}
|
|
67
67
|
return ((0, jsx_runtime_1.jsxs)(exports.SelectItemRoot, Object.assign({ className: className }, props, { ref: forwardedRef, children: [(0, jsx_runtime_1.jsx)(SelectPrimitive.ItemText, { children: children }), (0, jsx_runtime_1.jsx)(exports.SelectItemIndicator, {})] })));
|
|
68
|
-
}
|
|
68
|
+
};
|
|
69
|
+
exports.SelectItem = SelectItem;
|
|
69
70
|
exports.SelectItemRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.Item, 'text-md leading-4 color-black rounded-sm flex items-center flex-row h-36px pr-4 pl-35px relative select-none', '[&[data-disabled]]:color-gray5 [&[data-disabled]]:pointer-events-none [&[data-highlighted]]:outline-none [&[data-highlighted]]:bg-primary-wash [&[data-highlighted]]:color-black');
|
|
70
71
|
exports.SelectItemIndicatorRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.ItemIndicator, 'absolute left-0 w-25px inline-flex items-center justify-center');
|
|
71
72
|
exports.SelectItemIndicator = withNoNativeRender((props) => ((0, jsx_runtime_1.jsx)(exports.SelectItemIndicatorRoot, Object.assign({}, props, { children: (0, jsx_runtime_1.jsx)(react_icons_1.CheckIcon, {}) }))));
|
|
@@ -82,26 +83,28 @@ exports.SelectRoot = SelectPrimitive.Root;
|
|
|
82
83
|
exports.selectTriggerClassName = (0, clsx_1.default)((0, index_js_1.getButtonClassName)({ color: 'default' }), 'layer-components:[all:unset] layer-components:inline-flex layer-components:[&[data-placeholder]]:color-gray8');
|
|
83
84
|
exports.SelectTriggerBase = withNoNativeRender((0, withClassName_js_1.withClassName)(SelectPrimitive.Trigger, exports.selectTriggerClassName));
|
|
84
85
|
exports.UnstyledSelectTrigger = withNoNativeRender(SelectPrimitive.Trigger);
|
|
85
|
-
|
|
86
|
-
var { children } = _a, props = __rest(_a, ["children"]);
|
|
86
|
+
const SelectTrigger = function SelectTrigger(_a) {
|
|
87
|
+
var { ref, children } = _a, props = __rest(_a, ["ref", "children"]);
|
|
87
88
|
return ((0, jsx_runtime_1.jsx)(exports.UnstyledSelectTrigger, Object.assign({ asChild: true }, props, { ref: ref, children: (0, jsx_runtime_1.jsx)(index_js_1.Button, { className: "gap-2 font-normal", children: children || ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(exports.SelectValue, {}), (0, jsx_runtime_1.jsx)(exports.SelectIcon, {})] })) }) })));
|
|
88
|
-
}
|
|
89
|
+
};
|
|
90
|
+
exports.SelectTrigger = SelectTrigger;
|
|
89
91
|
exports.SelectValue = withNoNativeRender((0, withClassName_js_1.withClassName)(SelectPrimitive.Value, 'flex flex-row'));
|
|
90
92
|
exports.SelectLabel = withNoNativeRender((0, withClassName_js_1.withClassName)(SelectPrimitive.Label, 'px-25px text-xs leading-6 color-black select-none'));
|
|
91
93
|
exports.SelectSeparator = withNoNativeRender((0, withClassName_js_1.withClassName)(SelectPrimitive.Separator, 'h-1px bg-gray50 m-1'));
|
|
92
|
-
exports.SelectIcon = withNoNativeRender((
|
|
93
|
-
var { className } = _a, props = __rest(_a, ["className"]);
|
|
94
|
+
exports.SelectIcon = withNoNativeRender((_a) => {
|
|
95
|
+
var { ref: forwardedRef, className } = _a, props = __rest(_a, ["ref", "className"]);
|
|
94
96
|
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Icon, Object.assign({ className: (0, clsx_1.default)('color-inherit', className) }, props, { ref: forwardedRef, children: (0, jsx_runtime_1.jsx)(index_js_2.Icon, { name: "chevron", className: "w-[12px] h-[12px] relative top-1px" }) })));
|
|
95
|
-
})
|
|
97
|
+
});
|
|
96
98
|
const zIndex = { zIndex: 1001 };
|
|
97
|
-
exports.SelectContent = withPassthroughNativeRender((
|
|
98
|
-
var { children, inDialog, className } = _a, props = __rest(_a, ["children", "inDialog", "className"]);
|
|
99
|
+
exports.SelectContent = withPassthroughNativeRender((_a) => {
|
|
100
|
+
var { ref: forwardedRef, children, inDialog, className } = _a, props = __rest(_a, ["ref", "children", "inDialog", "className"]);
|
|
99
101
|
return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, Object.assign({ className: (0, clsx_1.default)('layer-components:overflow-hidden layer-components:bg-white layer-components:rounded-lg layer-components:border layer-components:border-solid layer-components:border-1 layer-components:border-black layer-components:z-menu layer-components:shadow-lg', 'layer-components:transform-origin-[var(--radix-select-content-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'layer-components:min-w-[var(--radix-select-trigger-width)] layer-components:max-h-[var(--radix-select-content-available-height)]', inDialog && 'z-[calc(var(--z-dialog)+1)]', className), style: zIndex }, props, { ref: forwardedRef, children: [(0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: (0, jsx_runtime_1.jsx)(react_icons_1.ChevronUpIcon, {}) }), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { className: "p-1", children: children }), (0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: (0, jsx_runtime_1.jsx)(react_icons_1.ChevronDownIcon, {}) })] })) }));
|
|
100
|
-
}));
|
|
101
|
-
exports.NativeSelect = (0, react_1.forwardRef)((_a, forwardedRef) => {
|
|
102
|
-
var { className } = _a, props = __rest(_a, ["className"]);
|
|
103
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, clsx_1.default)('relative', className), children: [(0, jsx_runtime_1.jsx)("select", Object.assign({ className: (0, clsx_1.default)('appearance-none font-inherit bg-white inline-flex items-center justify-center rounded-full px-3 py-1 pr-8 text-sm gap-2 color-black border-solid border border-gray5 hover:border-gray7 focus:outline-none focus-visible:shadow-focus [&[data-placeholder]]:color-gray8') }, props, { ref: forwardedRef })), (0, jsx_runtime_1.jsx)("div", { className: "absolute right-1 top-50% translate-y-[-50%] pointer-events-none", children: (0, jsx_runtime_1.jsx)(react_icons_1.ChevronDownIcon, { className: "w-4 h-4 m-2" }) })] }));
|
|
104
102
|
});
|
|
103
|
+
const NativeSelect = (_a) => {
|
|
104
|
+
var { ref: forwardedRef, className } = _a, props = __rest(_a, ["ref", "className"]);
|
|
105
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, clsx_1.default)('relative', className), children: [(0, jsx_runtime_1.jsx)("select", Object.assign({ className: (0, clsx_1.default)('appearance-none font-inherit bg-white inline-flex items-center justify-center rounded-full px-3 py-1 pr-8 text-sm gap-2 color-black border-solid border border-gray5 hover:border-gray7 focus:outline-none focus-visible:shadow-focus [&[data-placeholder]]:color-gray8') }, props, { ref: forwardedRef })), (0, jsx_runtime_1.jsx)("div", { className: "absolute right-1 top-50% translate-y-[-50%] pointer-events-none", children: (0, jsx_runtime_1.jsx)(react_icons_1.ChevronDownIcon, { className: "w-4 h-4 m-2" }) })] }));
|
|
106
|
+
};
|
|
107
|
+
exports.NativeSelect = NativeSelect;
|
|
105
108
|
/**
|
|
106
109
|
* A high-level Select which converts to native on mobile. Use with SelectItem.
|
|
107
110
|
*/
|