@atom-learning/components 2.41.1 → 2.42.1
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/CHANGELOG.md +2 -3
- package/dist/components/accordion/AccordionItem.js +1 -1
- package/dist/components/action-icon/ActionIcon.js +1 -1
- package/dist/components/avatar/Avatar.js +1 -1
- package/dist/components/calendar/Calendar.js +1 -1
- package/dist/components/carousel/CarouselArrows.js +1 -1
- package/dist/components/carousel/CarouselSlide.js +1 -1
- package/dist/components/chip/Chip.js +1 -1
- package/dist/components/chip/ChipGroup.js +1 -1
- package/dist/components/chip-dismissible-group/ChipDismissibleGroupRoot.js +1 -1
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/data-table/DataTable.js.map +1 -1
- package/dist/components/data-table/DataTable.types.js.map +1 -1
- package/dist/components/data-table/DataTableBody.js +1 -1
- package/dist/components/data-table/DataTableDataCell.js +1 -1
- package/dist/components/data-table/DataTableRow.js +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTable.d.ts +6 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTable.js +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTable.js.map +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTableBody.d.ts +3 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTableBody.js +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTableBody.js.map +1 -1
- package/dist/components/data-table/drag-and-drop/{DraggableRow.d.ts → DragAndDropTableRow.d.ts} +2 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTableRow.js +2 -0
- package/dist/components/data-table/drag-and-drop/DragAndDropTableRow.js.map +1 -0
- package/dist/components/data-table/drag-and-drop/index.d.ts +0 -3
- package/dist/components/dialog/DialogContent.js +1 -1
- package/dist/components/dismissible/DismissibleRoot.js +1 -1
- package/dist/components/dismissible/DismissibleTrigger.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuLinkItem.js +1 -1
- package/dist/components/field-wrapper/FieldDescription.js +1 -1
- package/dist/components/field-wrapper/InlineFieldWrapper.js +1 -1
- package/dist/components/file-input/FileInput.js +1 -1
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/inline-message/InlineMessage.js +1 -1
- package/dist/components/label/Label.js +1 -1
- package/dist/components/link/Link.js +1 -1
- package/dist/components/list/List.js +1 -1
- package/dist/components/markdown-content/components/MarkdownEmphasis.js +1 -1
- package/dist/components/markdown-content/components/MarkdownHeading.js +1 -1
- package/dist/components/markdown-content/components/MarkdownImage.js +1 -1
- package/dist/components/markdown-content/components/MarkdownInlineCode.js +1 -1
- package/dist/components/markdown-content/components/MarkdownLink.js +1 -1
- package/dist/components/markdown-content/components/MarkdownListItem.js +1 -1
- package/dist/components/markdown-content/components/MarkdownParagraph.js +1 -1
- package/dist/components/markdown-content/components/MarkdownStrong.js +1 -1
- package/dist/components/markdown-content/components/MarkdownThematicBreak.js +1 -1
- package/dist/components/navigation/NavigationMenuDropdownContent.js +1 -1
- package/dist/components/navigation/NavigationMenuLink.js +1 -1
- package/dist/components/notification-badge/NotificationBadge.js +1 -1
- package/dist/components/number-input/NumberInput.js +1 -1
- package/dist/components/number-input-field/NumberInputField.js +1 -1
- package/dist/components/popover/PopoverContent.js +1 -1
- package/dist/components/radio-button/RadioButton.js +1 -1
- package/dist/components/radio-button-field/RadioButtonField.js +1 -1
- package/dist/components/radio-button-field/RadioField.js +1 -1
- package/dist/components/radio-card/RadioCardGroup.js +1 -1
- package/dist/components/search-input/SearchInput.js +1 -1
- package/dist/components/select-field/SelectField.js +1 -1
- package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionContent.js +1 -1
- package/dist/components/sidedrawer/SidedrawerContent.js +1 -1
- package/dist/components/{data-table/drag-and-drop → sortable}/Handle.d.ts +5 -6
- package/dist/components/sortable/Handle.js +2 -0
- package/dist/components/sortable/Handle.js.map +1 -0
- package/dist/components/sortable/SortableHandle.d.ts +8 -0
- package/dist/components/sortable/SortableHandle.js +2 -0
- package/dist/components/sortable/SortableHandle.js.map +1 -0
- package/dist/components/sortable/SortableItem.d.ts +11 -0
- package/dist/components/sortable/SortableItem.js +2 -0
- package/dist/components/sortable/SortableItem.js.map +1 -0
- package/dist/components/sortable/SortableRoot.d.ts +12 -0
- package/dist/components/sortable/SortableRoot.js +2 -0
- package/dist/components/sortable/SortableRoot.js.map +1 -0
- package/dist/components/sortable/index.d.ts +13 -0
- package/dist/components/sortable/index.js +2 -0
- package/dist/components/sortable/index.js.map +1 -0
- package/dist/components/stack-content/StackContent.js +1 -1
- package/dist/components/stepper/StepperStepBack.js +1 -1
- package/dist/components/table/TableHeader.js +1 -1
- package/dist/components/table/TableRow.js +1 -1
- package/dist/components/table/TableStickyColumnsContainer.js +1 -1
- package/dist/components/table/useStickyColumnsCss.js +1 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/tabs/TabsTrigger.js +1 -1
- package/dist/components/text/Text.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/toast/ToastProvider.js +1 -1
- package/dist/components/toggle-group/ToggleGroupButton.js +1 -1
- package/dist/components/tooltip/TooltipContent.js +1 -1
- package/dist/components/video/Video.js +1 -1
- package/dist/docgen.json +1 -1
- package/dist/experiments/color-scheme/ColorScheme.js +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/utilities/hooks/useCallbackRef.js +1 -1
- package/dist/utilities/hooks/useResizeObserver.js +1 -1
- package/package.json +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropContainer.d.ts +0 -24
- package/dist/components/data-table/drag-and-drop/DragAndDropContainer.js +0 -2
- package/dist/components/data-table/drag-and-drop/DragAndDropContainer.js.map +0 -1
- package/dist/components/data-table/drag-and-drop/DraggableRow.js +0 -2
- package/dist/components/data-table/drag-and-drop/DraggableRow.js.map +0 -1
- package/dist/components/data-table/drag-and-drop/Handle.js +0 -2
- package/dist/components/data-table/drag-and-drop/Handle.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Close as r}from"@atom-learning/icons";import{Content as l,Arrow as p,Close as h}from"@radix-ui/react-popover";import*as e from"react";import{POPOVER_Z_INDEX as c}from"../../constants/zIndices.js";import{styled as t}from"../../stitches.js";import{ActionIcon as f}from"../action-icon/ActionIcon.js";import{Icon as
|
|
1
|
+
import{Close as r}from"@atom-learning/icons";import{Content as l,Arrow as p,Close as h}from"@radix-ui/react-popover";import*as e from"react";import{POPOVER_Z_INDEX as c}from"../../constants/zIndices.js";import{styled as t}from"../../stitches.js";import{ActionIcon as f}from"../action-icon/ActionIcon.js";import{Icon as x}from"../icon/Icon.js";import{slideDownAndFade as $,slideLeftAndFade as g,slideUpAndFade as w,slideRightAndFade as z}from"../../utilities/style/keyframe-animations.js";const b=t(l,{bg:"white",borderRadius:"$1",boxShadow:"$2",maxWidth:"90vw",p:"$sizes$2",pr:"$6",position:"relative",zIndex:c,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="open"]':{'&[data-side="top"]':{animationName:$},'&[data-side="right"]':{animationName:g},'&[data-side="bottom"]':{animationName:w},'&[data-side="left"]':{animationName:z}}},variants:{size:{sm:{maxWidth:"200px"},md:{maxWidth:"400px"},lg:{maxWidth:"600px"}}}}),C=t(p,{fill:"white",zIndex:1,'[data-align="end"] &':{mr:"$sizes$2"},'[data-align="start"] &':{ml:"$sizes$2"}}),u=({children:i,side:o="top",sideOffset:a=8,closePopoverText:s="Close popover",showCloseButton:n=!0,size:m="md",...d})=>e.createElement(b,{size:m,side:o,sideOffset:a,...d},n&&e.createElement(f,{as:h,css:{position:"absolute",right:"$0",top:"$0"},label:s,size:"md",hasTooltip:!1,theme:"neutral"},e.createElement(x,{is:r})),i,e.createElement(C,{width:16,height:8}));export{u as PopoverContent};
|
|
2
2
|
//# sourceMappingURL=PopoverContent.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as o from"@radix-ui/react-radio-group";import*as r from"react";import{styled as
|
|
1
|
+
import*as o from"@radix-ui/react-radio-group";import*as r from"react";import{styled as t}from"../../stitches.js";const n=t(o.Item,{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal400",borderRadius:"$round",color:"white",cursor:"pointer",display:"flex",justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out","&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),l=t(o.Indicator,{size:"6px",borderRadius:"$round",backgroundColor:"currentcolor",position:"absolute"}),e=a=>r.createElement(n,{...a},r.createElement(l,null));e.displayName="RadioButton";export{e as RadioButton};
|
|
2
2
|
//# sourceMappingURL=RadioButton.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";import{useFormContext as B,useController as F}from"react-hook-form";import{Description as R}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as V}from"../form/useFieldError.js";import{InlineMessage as b}from"../inline-message/InlineMessage.js";import{Label as h}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as x}from"../radio-button/RadioButtonGroup.js";import{styled as y}from"../../stitches.js";import{RadioField as q}from"./RadioField.js";const I=y("fieldset",{all:"unset"}),r=({children:d,css:c,direction:f="column",defaultValue:l,value:o,description:n,label:p,name:a,validation:t,onValueChange:i,...E})=>{const{control:C}=B(),{field:{ref:g,onChange:m,value:v,name
|
|
1
|
+
import*as e from"react";import{useFormContext as B,useController as F}from"react-hook-form";import{Description as R}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as V}from"../form/useFieldError.js";import{InlineMessage as b}from"../inline-message/InlineMessage.js";import{Label as h}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as x}from"../radio-button/RadioButtonGroup.js";import{styled as y}from"../../stitches.js";import{RadioField as q}from"./RadioField.js";const I=y("fieldset",{all:"unset"}),r=({children:d,css:c,direction:f="column",defaultValue:l,value:o,description:n,label:p,name:a,validation:t,onValueChange:i,...E})=>{const{control:C}=B(),{field:{ref:g,onChange:m,value:v,name:$}}=F({name:a,control:C,rules:t,defaultValue:l}),{error:u}=V(a);return e.useEffect(()=>{typeof o<"u"&&m(o)},[o]),e.createElement(I,{css:c},e.createElement(h,{as:"legend",css:{p:0,mb:"$3"},required:Boolean(t==null?void 0:t.required)},p),n&&e.createElement(R,{css:{mb:"$3"}},n),e.createElement(x,{ref:g,direction:f,defaultValue:l,onValueChange:s=>{m(s),i==null||i(s)},value:v,...E},d),u&&e.createElement(b,{css:{mt:"$2"}},u))};r.Item=q,r.displayName="RadioButtonField";export{r as RadioButtonField};
|
|
2
2
|
//# sourceMappingURL=RadioButtonField.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as
|
|
1
|
+
import*as e from"react";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as r}from"../field-wrapper/InlineFieldWrapper.js";import{RadioButton as m}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";const o=({css:t,label:a,value:i,...l})=>e.createElement(r,{css:t,label:a},e.createElement(m,{value:i,...l}));o.displayName="RadioField";export{o as RadioField};
|
|
2
2
|
//# sourceMappingURL=RadioField.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as d from"@radix-ui/react-radio-group";import*as
|
|
1
|
+
import*as d from"@radix-ui/react-radio-group";import*as t from"react";import{Stack as p}from"../stack/Stack.js";import{RadioCard as c}from"./RadioCard.js";const f=({css:e,children:r,size:l,isFullWidth:o,align:a,gap:s="3",justify:m,...n})=>t.createElement(d.Root,{...n},t.createElement(p,{direction:"row",justify:m,gap:s,css:e},t.Children.map(r,i=>t.isValidElement(i)&&(i==null?void 0:i.type)===c?t.cloneElement(i,{size:l,isFullWidth:o,align:a}):i)));export{f as RadioCardGroup};
|
|
2
2
|
//# sourceMappingURL=RadioCardGroup.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Search as
|
|
1
|
+
import{Search as z,Close as H}from"@atom-learning/icons";import*as e from"react";import{ActionIcon as I}from"../action-icon/ActionIcon.js";import{Box as k}from"../box/Box.js";import{Icon as E}from"../icon/Icon.js";import{Input as L}from"../input/Input.js";import{styled as f}from"../../stitches.js";import{useCallbackRef as x}from"../../utilities/hooks/useCallbackRef.js";var N=(t=>(t.SEARCH="SEARCH",t.CLEAR="CLEAR",t))(N||{});const O=f(E,{color:"$tonal300",position:"absolute",pointerEvents:"none",variants:{size:{sm:{top:"$2",right:"$2",size:"$1"},md:{top:10,right:10,size:20}}}}),T=f(L,{'&::-webkit-search-decoration, &::-webkit-search-cancel-button, &::-webkit-search-results-button, & input[type="search"]::-webkit-search-results-decoration':{display:"none"}}),h=e.forwardRef(({size:t="md",css:C,value:r,defaultValue:i="",onValueChange:n,clearText:b="Clear",onChange:c,...d},v)=>{const[u,R]=x(),[A,p]=e.useState(i),[S,m]=e.useState(i?"CLEAR":"SEARCH");e.useEffect(()=>{typeof r>"u"||(p(r),m(r?"CLEAR":"SEARCH"))},[r]),e.useImperativeHandle(v,()=>u.current);const w=()=>{var s,o;const a=u.current;if(!a)return;const l=(s=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:s.set;(o=l==null?void 0:l.call)==null||o.call(l,a,"");const g=new Event("input",{bubbles:!0});a.dispatchEvent(g),a.focus(),n==null||n("")},y=s=>{c==null||c(s);const o=s.target.value;p(o),n==null||n(o),m(o?"CLEAR":"SEARCH")},$=()=>S==="SEARCH"?e.createElement(O,{is:z,size:t,css:{size:t=="sm"?"$1":20}}):e.createElement(I,{label:b,theme:"neutral",size:t,css:{position:"absolute",top:"0",right:"$1"},onClick:w},e.createElement(E,{is:H}));return e.createElement(k,{css:{position:"relative",...C}},e.createElement(T,{ref:R,size:t,type:"search",...d,value:A,onChange:y,css:{pr:t==="sm"?"$5":"$6"}}),$())});h.displayName="SearchInput";export{h as SearchInput};
|
|
2
2
|
//# sourceMappingURL=SearchInput.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as
|
|
1
|
+
import*as i from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as b}from"../form/useFieldError.js";import{Select as h}from"../select/Select.js";const l=({css:m=void 0,children:d,name:e,label:p,validation:r,prompt:a,description:n,hideLabel:s,...c})=>{const{register:o}=u(),{error:t}=b(e),f=r?o(r):o;return i.createElement(F,{css:m,description:n,error:t,fieldId:e,label:p,prompt:a,required:Boolean(r==null?void 0:r.required),hideLabel:s},i.createElement(h,{name:e,id:e,...c,ref:f,...t&&{state:"error"}},d))};l.displayName="SelectField";export{l as SelectField};
|
|
2
2
|
//# sourceMappingURL=SelectField.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Content as i}from"@radix-ui/react-accordion";import t from"react";import{keyframes as
|
|
1
|
+
import{Content as i}from"@radix-ui/react-accordion";import t from"react";import{keyframes as e,styled as n}from"../../../stitches.js";import{Box as m}from"../../box/Box.js";const c=e({from:{height:0},to:{height:"var(--radix-accordion-content-height)"}}),d=e({from:{height:"var(--radix-accordion-content-height)"},to:{height:0}}),h=n(i,{bg:"white",overflow:"hidden","@allowMotion":{'&[data-state="open"]':{animation:`${c} 300ms ease-out`},'&[data-state="closed"]':{animation:`${d} 300ms ease-out`}}}),s=({children:o,...a})=>t.createElement(h,{...a},t.Children.map(o,r=>t.createElement(m,{css:{"> a":{px:"$6"},"> button":{px:"$6"}}},r)));export{s as SidedrawerAccordionContent};
|
|
2
2
|
//# sourceMappingURL=SidedrawerAccordionContent.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Content as a,Portal as i}from"@radix-ui/react-dialog";import
|
|
1
|
+
import{Content as a,Portal as i}from"@radix-ui/react-dialog";import t from"react";import{MAX_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as n}from"../../stitches.js";import{SidedrawerOverlay as d}from"./SidedrawerOverlay.js";import{slideInLeft as l,slideOutLeft as m}from"../../utilities/style/keyframe-animations.js";const s=n(a,{bg:"white",boxShadow:"$2",display:"flex",flexDirection:"column",position:"fixed",top:0,left:0,height:"100%",maxWidth:"304px",width:"100%",zIndex:r,"@allowMotion":{'&[data-state="open"]':{animation:`${l} 250ms ease-out`},'&[data-state="closed"]':{animation:`${m} 250ms ease-out`}}}),f=({children:e,...o})=>t.createElement(i,null,t.createElement(d,{"data-testid":"sidedrawer_overlay"}),t.createElement(s,{role:"navigation",...o},e));export{f as SidedrawerContent};
|
|
2
2
|
//# sourceMappingURL=SidedrawerContent.js.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { Icon } from '
|
|
2
|
+
import { Icon } from '../icon';
|
|
3
3
|
export declare const StyledHandle: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Pick<Omit<Omit<Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & {
|
|
4
4
|
ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
|
|
5
5
|
}, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@stitches/react/types/styled-component").TransformProps<{
|
|
@@ -221,7 +221,7 @@ export declare const StyledHandle: import("@stitches/react/types/styled-componen
|
|
|
221
221
|
marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
|
|
222
222
|
};
|
|
223
223
|
}> | undefined;
|
|
224
|
-
}, "appearance" | "size" | "theme" | "label" | "children" | "as" | "isRounded" | "hasTooltip" | "tooltipSide" | keyof import("
|
|
224
|
+
}, "appearance" | "size" | "theme" | "label" | "children" | "as" | "isRounded" | "hasTooltip" | "tooltipSide" | keyof import("../../types").NavigatorActions> & import("@stitches/react/types/styled-component").TransformProps<{
|
|
225
225
|
theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
|
|
226
226
|
appearance?: "outline" | "solid" | "simple" | undefined;
|
|
227
227
|
size?: "sm" | "md" | "lg" | "xs" | undefined;
|
|
@@ -240,7 +240,7 @@ export declare const StyledHandle: import("@stitches/react/types/styled-componen
|
|
|
240
240
|
label: string;
|
|
241
241
|
hasTooltip?: boolean | undefined;
|
|
242
242
|
tooltipSide?: "bottom" | "left" | "right" | "top" | undefined;
|
|
243
|
-
} & import("
|
|
243
|
+
} & import("../../types").NavigatorActions, "appearance" | "color" | "translate" | "size" | "css" | "theme" | "onBlur" | "onChange" | "onSubmit" | "form" | "label" | "slot" | "style" | "title" | "key" | "name" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as" | "disabled" | "value" | "type" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "isRounded" | "hasTooltip" | "tooltipSide" | keyof import("../../types").NavigatorActions> & React.RefAttributes<HTMLButtonElement>>, {
|
|
244
244
|
isDragging?: boolean | "true" | "false" | undefined;
|
|
245
245
|
}, {
|
|
246
246
|
sm: string;
|
|
@@ -455,6 +455,5 @@ export declare const StyledHandle: import("@stitches/react/types/styled-componen
|
|
|
455
455
|
marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
|
|
456
456
|
};
|
|
457
457
|
}>>;
|
|
458
|
-
declare type
|
|
459
|
-
export declare const Handle: React.ForwardRefExoticComponent<
|
|
460
|
-
export {};
|
|
458
|
+
export declare type THandleProps = Omit<React.ComponentProps<typeof StyledHandle>, 'children'> & Pick<React.ComponentProps<typeof Icon>, 'size'>;
|
|
459
|
+
export declare const Handle: React.ForwardRefExoticComponent<THandleProps>;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{DragHandle as l}from"@atom-learning/icons";import*as r from"react";import{styled as s}from"../../stitches.js";import{ActionIcon as m}from"../action-icon/ActionIcon.js";import{Icon as p}from"../icon/Icon.js";const e=s(m,{color:"inherit !important",fill:"currentColor","&[disabled]":{opacity:.3,cursor:"not-allowed",["*"]:{pointerEvents:"none"}},variants:{isDragging:{true:{cursor:"grabbing"},false:{cursor:"grab"}}}}),o=r.forwardRef(({isDragging:a,size:i,...t},n)=>r.createElement(e,{ref:n,isDragging:a,appearance:"simple",hasTooltip:!1,size:i,...t},r.createElement(p,{is:l})));o.displayName="Handle";export{o as Handle,e as StyledHandle};
|
|
2
|
+
//# sourceMappingURL=Handle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Handle.js","sources":["../../../src/components/sortable/Handle.tsx"],"sourcesContent":["import { DragHandle } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '../../stitches'\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\n\nexport const StyledHandle = styled(ActionIcon, {\n color: 'inherit !important',\n fill: 'currentColor',\n '&[disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed',\n ['*']: {\n pointerEvents: 'none'\n }\n },\n variants: {\n isDragging: {\n true: {\n cursor: 'grabbing'\n },\n false: {\n cursor: 'grab'\n }\n }\n }\n})\n\nexport type THandleProps = Omit<\n React.ComponentProps<typeof StyledHandle>,\n 'children'\n> &\n Pick<React.ComponentProps<typeof Icon>, 'size'>\n\nexport const Handle: React.ForwardRefExoticComponent<THandleProps> =\n React.forwardRef(({ isDragging, size, ...rest }, ref) => {\n return (\n <StyledHandle\n ref={ref}\n isDragging={isDragging}\n appearance=\"simple\"\n hasTooltip={false}\n size={size}\n {...rest}\n >\n <Icon is={DragHandle} />\n </StyledHandle>\n )\n })\n\nHandle.displayName = 'Handle'\n"],"names":["StyledHandle","styled","ActionIcon","Handle","React","isDragging","size","rest","ref","Icon","DragHandle"],"mappings":"sNAOO,MAAMA,EAAeC,EAAOC,EAAY,CAC7C,MAAO,qBACP,KAAM,eACN,cAAe,CACb,QAAS,GACT,OAAQ,cACR,CAAC,KAAM,CACL,cAAe,MACjB,CACF,EACA,SAAU,CACR,WAAY,CACV,KAAM,CACJ,OAAQ,UACV,EACA,MAAO,CACL,OAAQ,MACV,CACF,CACF,CACF,CAAC,EAQYC,EACXC,EAAM,WAAW,CAAC,CAAE,WAAAC,EAAY,KAAAC,KAASC,CAAK,EAAGC,IAE7CJ,EAAA,cAACJ,GACC,IAAKQ,EACL,WAAYH,EACZ,WAAW,SACX,WAAY,GACZ,KAAMC,EACL,GAAGC,GAEJH,EAAA,cAACK,EAAA,CAAK,GAAIC,EAAY,CACxB,CAEH,EAEHP,EAAO,YAAc"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { THandleProps } from './Handle';
|
|
3
|
+
export declare type TSortableHandleProps = {
|
|
4
|
+
targetId: React.ReactText;
|
|
5
|
+
disabled?: boolean;
|
|
6
|
+
label?: string;
|
|
7
|
+
} & Omit<THandleProps, 'label'>;
|
|
8
|
+
export declare const SortableHandle: React.FC<TSortableHandleProps>;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{useSortable as n}from"@dnd-kit/sortable";import*as b from"react";import{Handle as g}from"./Handle.js";const t=({targetId:a,disabled:e=!1,label:r="drag handle",...l})=>{const{attributes:o,listeners:i,isDragging:s,setActivatorNodeRef:d}=n({id:a});return b.createElement(g,{ref:d,isDragging:s,label:r,disabled:e,...e?{}:i,...e?{}:o,...l})};t.displayName="SortableHandle";export{t as SortableHandle};
|
|
2
|
+
//# sourceMappingURL=SortableHandle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SortableHandle.js","sources":["../../../src/components/sortable/SortableHandle.tsx"],"sourcesContent":["import { useSortable } from '@dnd-kit/sortable'\nimport * as React from 'react'\n\nimport { Handle as DragHandle, THandleProps } from './Handle'\n\nexport type TSortableHandleProps = {\n targetId: React.ReactText\n disabled?: boolean\n label?: string\n} & Omit<THandleProps, 'label'>\n\nexport const SortableHandle: React.FC<TSortableHandleProps> = ({\n targetId,\n disabled = false,\n label = 'drag handle',\n ...rest\n}) => {\n const { attributes, listeners, isDragging, setActivatorNodeRef } =\n useSortable({ id: targetId })\n\n return (\n <DragHandle\n ref={setActivatorNodeRef}\n isDragging={isDragging}\n label={label}\n disabled={disabled}\n {...(!disabled ? listeners : {})}\n {...(!disabled ? attributes : {})}\n {...rest}\n />\n )\n}\n\nSortableHandle.displayName = 'SortableHandle'\n"],"names":["SortableHandle","targetId","disabled","label","rest","attributes","listeners","isDragging","setActivatorNodeRef","useSortable","React","DragHandle"],"mappings":"6GAWO,MAAMA,EAAiD,CAAC,CAC7D,SAAAC,EACA,SAAAC,EAAW,GACX,MAAAC,EAAQ,iBACLC,CACL,IAAM,CACJ,KAAM,CAAE,WAAAC,EAAY,UAAAC,EAAW,WAAAC,EAAY,oBAAAC,CAAoB,EAC7DC,EAAY,CAAE,GAAIR,CAAS,CAAC,EAE9B,OACES,EAAA,cAACC,EAAA,CACC,IAAKH,EACL,WAAYD,EACZ,MAAOJ,EACP,SAAUD,EACT,GAAKA,EAAuB,CAAA,EAAZI,EAChB,GAAKJ,EAAwB,CAAA,EAAbG,EAChB,GAAGD,CAAAA,CACN,CAEJ,EAEAJ,EAAe,YAAc"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { UniqueIdentifier } from '@dnd-kit/core';
|
|
2
|
+
import { CSS } from '@stitches/react';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
export declare type TSortableItemProps = {
|
|
5
|
+
id: UniqueIdentifier;
|
|
6
|
+
asChild?: boolean;
|
|
7
|
+
isDragHandle?: boolean;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
css?: CSS;
|
|
10
|
+
};
|
|
11
|
+
export declare const SortableItem: React.FC<TSortableItemProps>;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{useSortable as p}from"@dnd-kit/sortable";import{Slot as b}from"@radix-ui/react-slot";import{styled as g}from"@stitches/react";import*as f from"react";import{Box as x}from"../box/Box.js";const u=g(b),s=({id:l,asChild:o=!1,css:n,isDragHandle:r=!1,disabled:t,...i})=>{const{transform:a,setNodeRef:d,isDragging:e,listeners:c,attributes:m}=p({id:l});return f.createElement(o?u:x,{ref:d,css:{["--scale"]:1,transform:"translateX(calc(var(--translate-x) * 1px)) translateY(calc(var(--translate-y) * 1px)) scale(var(--scale))",zIndex:e?5:void 0,["--translate-x"]:(a==null?void 0:a.x)||0,["--translate-y"]:(a==null?void 0:a.y)||0,"&[disabled]":{opacity:.3,cursor:"not-allowed",["*"]:{pointerEvents:"none"}},...r?{cursor:e?"grabbing":"grab"}:{},...n},"data-dragging":e,"data-disabled":t,...r&&!t?c:{},...r&&!t?m:{},...i})};s.displayName="SortableItem";export{s as SortableItem};
|
|
2
|
+
//# sourceMappingURL=SortableItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SortableItem.js","sources":["../../../src/components/sortable/SortableItem.tsx"],"sourcesContent":["import type { UniqueIdentifier } from '@dnd-kit/core'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { Slot } from '@radix-ui/react-slot'\nimport { CSS, styled } from '@stitches/react'\nimport * as React from 'react'\n\nimport { Box } from '../box'\n\nexport type TSortableItemProps = {\n id: UniqueIdentifier\n asChild?: boolean\n isDragHandle?: boolean\n disabled?: boolean\n css?: CSS\n}\n\nconst StyledSlot = styled(Slot)\n\nexport const SortableItem: React.FC<TSortableItemProps> = ({\n id,\n asChild = false,\n css,\n isDragHandle = false,\n disabled,\n ...rest\n}) => {\n const { transform, setNodeRef, isDragging, listeners, attributes } =\n useSortable({ id })\n\n const Component = asChild ? StyledSlot : Box\n return (\n <Component\n ref={setNodeRef}\n css={{\n ['--scale']: 1,\n transform:\n 'translateX(calc(var(--translate-x) * 1px)) translateY(calc(var(--translate-y) * 1px)) scale(var(--scale))',\n zIndex: isDragging ? 5 : undefined,\n ['--translate-x']: transform?.x || 0,\n ['--translate-y']: transform?.y || 0,\n '&[disabled]': {\n opacity: 0.3,\n cursor: 'not-allowed',\n ['*']: {\n pointerEvents: 'none'\n }\n },\n ...(isDragHandle ? { cursor: isDragging ? 'grabbing' : 'grab' } : {}),\n ...css\n }}\n data-dragging={isDragging}\n data-disabled={disabled}\n {...(isDragHandle && !disabled ? listeners : {})}\n {...(isDragHandle && !disabled ? attributes : {})}\n {...rest}\n />\n )\n}\n\nSortableItem.displayName = 'SortableItem'\n"],"names":["StyledSlot","styled","Slot","SortableItem","id","asChild","css","isDragHandle","disabled","rest","transform","setNodeRef","isDragging","listeners","attributes","useSortable","React","Box"],"mappings":"iMAgBA,MAAMA,EAAaC,EAAOC,CAAI,EAEjBC,EAA6C,CAAC,CACzD,GAAAC,EACA,QAAAC,EAAU,GACV,IAAAC,EACA,aAAAC,EAAe,GACf,SAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,UAAAC,EAAW,WAAAC,EAAY,WAAAC,EAAY,UAAAC,EAAW,WAAAC,CAAW,EAC/DC,EAAY,CAAE,GAAAX,CAAG,CAAC,EAGpB,OACEY,EAAA,cAFgBX,EAAUL,EAAaiB,EAEtC,CACC,IAAKN,EACL,IAAK,CACH,CAAC,WAAY,EACb,UACE,8GACF,OAAQC,EAAa,EAAI,OACzB,CAAC,kBAAkBF,GAAA,KAAA,OAAAA,EAAW,IAAK,EACnC,CAAC,kBAAkBA,GAAA,KAAA,OAAAA,EAAW,IAAK,EACnC,cAAe,CACb,QAAS,GACT,OAAQ,cACR,CAAC,KAAM,CACL,cAAe,MACjB,CACF,EACA,GAAIH,EAAe,CAAE,OAAQK,EAAa,WAAa,MAAO,EAAI,CAAC,EACnE,GAAGN,CACL,EACA,gBAAeM,EACf,gBAAeJ,EACd,GAAID,GAAgB,CAACC,EAAWK,EAAY,CAAA,EAC5C,GAAIN,GAAgB,CAACC,EAAWM,EAAa,CAAA,EAC7C,GAAGL,CAAAA,CACN,CAEJ,EAEAN,EAAa,YAAc"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { UniqueIdentifier } from '@dnd-kit/core';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
declare type TSortableRootProps = {
|
|
4
|
+
sortableIds: React.ReactText[];
|
|
5
|
+
onSortChange: (onSortChangeData: {
|
|
6
|
+
order: UniqueIdentifier[];
|
|
7
|
+
oldIndex: number;
|
|
8
|
+
newIndex: number;
|
|
9
|
+
}) => void;
|
|
10
|
+
};
|
|
11
|
+
export declare const SortableRoot: React.FC<TSortableRootProps>;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{useSensors as x,useSensor as l,PointerSensor as p,KeyboardSensor as v,DndContext as C,closestCenter as y}from"@dnd-kit/core";import{sortableKeyboardCoordinates as E,arrayMove as D,SortableContext as I}from"@dnd-kit/sortable";import*as o from"react";const c=({sortableIds:t,onSortChange:m,children:S})=>{const[u,s]=o.useState(t);o.useEffect(()=>{s(t)},[t]);const b=x(l(p),l(v,{coordinateGetter:E}));return o.createElement(C,{sensors:b,collisionDetection:y,onDragEnd:f=>{const{active:n,over:e}=f;n.id&&(e==null?void 0:e.id)&&n.id!==(e==null?void 0:e.id)&&s(r=>{const d=r.indexOf(n.id),i=r.indexOf(e.id),a=D(r,d,i);return m({order:a,oldIndex:d,newIndex:i}),a})}},o.createElement(I,{items:u},S))};c.displayName="SortableRoot";export{c as SortableRoot};
|
|
2
|
+
//# sourceMappingURL=SortableRoot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SortableRoot.js","sources":["../../../src/components/sortable/SortableRoot.tsx"],"sourcesContent":["import type { DragEndEvent, UniqueIdentifier } from '@dnd-kit/core'\nimport {\n closestCenter,\n DndContext,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors\n} from '@dnd-kit/core'\nimport {\n arrayMove,\n SortableContext,\n sortableKeyboardCoordinates\n} from '@dnd-kit/sortable'\nimport * as React from 'react'\n\ntype TSortableRootProps = {\n sortableIds: React.ReactText[]\n onSortChange: (onSortChangeData: {\n order: UniqueIdentifier[]\n oldIndex: number\n newIndex: number\n }) => void\n}\n\nexport const SortableRoot: React.FC<TSortableRootProps> = ({\n sortableIds,\n onSortChange,\n children\n}) => {\n const [order, setOrder] = React.useState<React.ReactText[]>(sortableIds)\n React.useEffect(() => {\n setOrder(sortableIds)\n }, [sortableIds])\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates\n })\n )\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event\n if (active.id && over?.id && active.id !== over?.id) {\n setOrder((order) => {\n const oldIndex = order.indexOf(active.id)\n const newIndex = order.indexOf(over.id)\n const newOrder = arrayMove(order, oldIndex, newIndex)\n onSortChange({ order: newOrder, oldIndex, newIndex })\n return newOrder\n })\n }\n }\n\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragEnd={handleDragEnd}\n >\n <SortableContext items={order}>{children}</SortableContext>\n </DndContext>\n )\n}\n\nSortableRoot.displayName = 'SortableRoot'\n"],"names":["SortableRoot","sortableIds","onSortChange","children","order","setOrder","React","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","newOrder","arrayMove","SortableContext"],"mappings":"gQAyBa,MAAAA,EAA6C,CAAC,CACzD,YAAAC,EACA,aAAAC,EACA,SAAAC,CACF,IAAM,CACJ,KAAM,CAACC,EAAOC,CAAQ,EAAIC,EAAM,SAA4BL,CAAW,EACvEK,EAAM,UAAU,IAAM,CACpBD,EAASJ,CAAW,CACtB,EAAG,CAACA,CAAW,CAAC,EAEhB,MAAMM,EAAUC,EACdC,EAAUC,CAAa,EACvBD,EAAUE,EAAgB,CACxB,iBAAkBC,CACpB,CAAC,CACH,EAeA,OACEN,EAAA,cAACO,EAAA,CACC,QAASN,EACT,mBAAoBO,EACpB,UAjBmBC,GAAwB,CAC7C,KAAM,CAAE,OAAAC,EAAQ,KAAAC,CAAK,EAAIF,EACrBC,EAAO,KAAMC,GAAA,KAAAA,OAAAA,EAAM,KAAMD,EAAO,MAAOC,GAAA,KAAA,OAAAA,EAAM,KAC/CZ,EAAUD,GAAU,CAClB,MAAMc,EAAWd,EAAM,QAAQY,EAAO,EAAE,EAClCG,EAAWf,EAAM,QAAQa,EAAK,EAAE,EAChCG,EAAWC,EAAUjB,EAAOc,EAAUC,CAAQ,EACpD,OAAAjB,EAAa,CAAE,MAAOkB,EAAU,SAAAF,EAAU,SAAAC,CAAS,CAAC,EAC7CC,CACT,CAAC,CAEL,CAAA,EAQId,EAAA,cAACgB,EAAA,CAAgB,MAAOlB,GAAQD,CAAS,CAC3C,CAEJ,EAEAH,EAAa,YAAc"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const Sortable: {
|
|
3
|
+
Root: import("react").FC<{
|
|
4
|
+
sortableIds: import("react").ReactText[];
|
|
5
|
+
onSortChange: (onSortChangeData: {
|
|
6
|
+
order: import("@dnd-kit/core").UniqueIdentifier[];
|
|
7
|
+
oldIndex: number;
|
|
8
|
+
newIndex: number;
|
|
9
|
+
}) => void;
|
|
10
|
+
}>;
|
|
11
|
+
Item: import("react").FC<import("./SortableItem").TSortableItemProps>;
|
|
12
|
+
Handle: import("react").FC<import("./SortableHandle").TSortableHandleProps>;
|
|
13
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/sortable/index.ts"],"sourcesContent":["import { SortableHandle as Handle } from './SortableHandle'\nimport { SortableItem as Item } from './SortableItem'\nimport { SortableRoot as Root } from './SortableRoot'\n\nexport const Sortable = { Root, Item, Handle }\n"],"names":["Sortable","Root","Item","Handle"],"mappings":"uJAIO,MAAMA,EAAW,CAAE,KAAAC,EAAM,KAAAC,EAAM,OAAAC,CAAO"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as t from"react";import{styled as r}from"../../stitches.js";import{StyledDivider as e}from"../divider/Divider.js";import{StyledHeading as d}from"../heading/Heading.js";import{StyledImage as a}from"../image/Image.js";import{StyledList as l}from"../list/List.js";import{StyledText as c}from"../text/Text.js";const f=r("div",{"& > *":{"&:not(:first-child)":{mt:"$5"},"&:not(:last-child)":{mb:"$5"}},[`& > ${d}`]:{maxWidth:"65ch"},[`& > ${c}`]:{maxWidth:"75ch"},[`& > ${l}`]:{maxWidth:"75ch"},[`& > ${e}`]:{my:"$5"},[`& > ${a}`]:{display:"block","&:not(:first-child)":{mt:"$6"},"&:not(:last-child)":{mb:"$6"}}}),
|
|
1
|
+
import*as t from"react";import{styled as r}from"../../stitches.js";import{StyledDivider as e}from"../divider/Divider.js";import{StyledHeading as d}from"../heading/Heading.js";import{StyledImage as a}from"../image/Image.js";import{StyledList as l}from"../list/List.js";import{StyledText as c}from"../text/Text.js";const f=r("div",{"& > *":{"&:not(:first-child)":{mt:"$5"},"&:not(:last-child)":{mb:"$5"}},[`& > ${d}`]:{maxWidth:"65ch"},[`& > ${c}`]:{maxWidth:"75ch"},[`& > ${l}`]:{maxWidth:"75ch"},[`& > ${e}`]:{my:"$5"},[`& > ${a}`]:{display:"block","&:not(:first-child)":{mt:"$6"},"&:not(:last-child)":{mb:"$6"}}}),m=t.forwardRef((o,i)=>t.createElement(f,{ref:i,...o}));m.displayName="StackContent";export{m as StackContent};
|
|
2
2
|
//# sourceMappingURL=StackContent.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as i from"react";import{Button as n}from"../button/Button.js";import{useStepper as a}from"./stepper-context/StepperContext.js";const l=({label:e,children:
|
|
1
|
+
import*as i from"react";import{Button as n}from"../button/Button.js";import{useStepper as a}from"./stepper-context/StepperContext.js";const l=({label:e,children:o,...r})=>{const{activeStep:t,goToPreviousStep:p}=a();return i.createElement(n,{size:"sm",appearance:"outline",...r,disabled:t===0,onClick:p},o||(e==null?void 0:e(t)))};export{l as StepperStepBack};
|
|
2
2
|
//# sourceMappingURL=StepperStepBack.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import l from"react";import{styled as o}from"../../stitches.js";import{TableHeaderCell as e}from"./TableHeaderCell.js";const r={PRIMARY:"primary",PRIMARY_DARK:"primaryDark",LIGHT:"light"},i=o("thead",{variants:{theme:{[r.PRIMARY]:{[`${e}`]:{bg:"$primary"}},[r.PRIMARY_DARK]:{[`${e}`]:{bg:"$primaryDark"}},[r.LIGHT]:{[`${e}`]:{bg:"$tonal50",color:"$tonal600"}}}}}),a=({theme:t="primaryDark",...m})=>l.createElement(i,{theme:t,...m});a.displayName="TableHeader";export{r as TABLE_HEADER_THEMES,a as TableHeader};
|
|
2
2
|
//# sourceMappingURL=TableHeader.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";import{styled as l}from"../../stitches.js";const
|
|
1
|
+
import*as e from"react";import{styled as l}from"../../stitches.js";const t=l("tr",{bg:"unset"}),o=e.forwardRef((r,a)=>e.createElement(t,{...r,ref:a}));o.displayName="TableRow";export{t as StyledRow,o as TableRow};
|
|
2
2
|
//# sourceMappingURL=TableRow.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"react";import{Box as u}from"../box/Box.js";import{useStickyColumnsCss as h}from"./useStickyColumnsCss.js";const m=({children:s,numberOfStickyColumns:t=0,css:c,...i})=>{const[
|
|
1
|
+
import e from"react";import{Box as u}from"../box/Box.js";import{useStickyColumnsCss as h}from"./useStickyColumnsCss.js";const m=({children:s,numberOfStickyColumns:t=0,css:c,...i})=>{const[r,p]=e.useState(!1),o=e.useRef(null),{columnsCss:a}=h(t,o);return e.createElement(u,{onScroll:l=>{const n=l.currentTarget.scrollWidth>l.currentTarget.clientWidth;n!==r&&p(n)},role:"scrollbar",ref:o,css:{overflow:"auto",maxWidth:"100%",...a,[`& td:nth-child(${t}), th:nth-child(${t})`]:{...r&&{boxShadow:"$colors$alpha200 -2px -3px 9px 1px",clipPath:"inset(0px -10px 0px 0px)"}},"& td":{bg:"inherit"},...c},...i},s)};export{m as TableStickyColumnsContainer};
|
|
2
2
|
//# sourceMappingURL=TableStickyColumnsContainer.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as u from"react";const p=(t,n)=>{const[c,l]=u.useState({});return u.useLayoutEffect(()=>{var
|
|
1
|
+
import*as u from"react";const p=(t,n)=>{const[c,l]=u.useState({});return u.useLayoutEffect(()=>{var r;if(!t)return;let o=0;const e=(r=n.current)==null?void 0:r.querySelectorAll("th"),f=Array.from(e||[]).slice(0,t).reduce((d,m,s)=>{const i=s+1,h={...d,[`& td:nth-of-type(${i}), th:nth-of-type(${i})`]:{position:"sticky",left:`${o}px`,minWidth:`${m.offsetWidth}px`,zIndex:"2"}};return o+=(e==null?void 0:e.item(s).clientWidth)||0,h},{});l(f)},[t,n]),{columnsCss:c}};export{p as useStickyColumnsCss};
|
|
2
2
|
//# sourceMappingURL=useStickyColumnsCss.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Root as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as m}from"../../stitches.js";import{TabsContent as s}from"./TabsContent.js";import{TabsTrigger as a}from"./TabsTrigger.js";import{TabsTriggerList as g}from"./TabsTriggerList.js";const T=m(i,{width:"100%"}),r=({children:o
|
|
1
|
+
import{Root as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as m}from"../../stitches.js";import{TabsContent as s}from"./TabsContent.js";import{TabsTrigger as a}from"./TabsTrigger.js";import{TabsTriggerList as g}from"./TabsTriggerList.js";const T=m(i,{width:"100%"}),r=({children:t,...o})=>e.createElement(T,{...o},t);r.TriggerList=g,r.Trigger=a,r.Content=s,r.displayName="Tabs";export{r as Tabs};
|
|
2
2
|
//# sourceMappingURL=Tabs.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Trigger as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as a}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";const s=a(i,{background:"none",border:"none",cursor:"pointer",flexShrink:0,p:"$4",userSelect:"none",borderBottom:"2px solid transparent",'&[data-state="active"]':{color:"$interactive1",fontWeight:600,letterSpacing:"-0.005em",borderColor:"currentColor"},"&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:hover, &:focus-visible":{color:"$interactive2",bg:"$accentA1"},"&:active":{color:"$interactive3"},"&:focus-visible":{...c()}}}),
|
|
1
|
+
import{Trigger as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as a}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";const s=a(i,{background:"none",border:"none",cursor:"pointer",flexShrink:0,p:"$4",userSelect:"none",borderBottom:"2px solid transparent",'&[data-state="active"]':{color:"$interactive1",fontWeight:600,letterSpacing:"-0.005em",borderColor:"currentColor"},"&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:hover, &:focus-visible":{color:"$interactive2",bg:"$accentA1"},"&:active":{color:"$interactive3"},"&:focus-visible":{...c()}}}),r=({children:o,...t})=>e.createElement(s,{asChild:!0,...t},e.createElement(n,{size:"sm",as:"button"},o));r.displayName="TabsTrigger";export{r as TabsTrigger};
|
|
2
2
|
//# sourceMappingURL=TabsTrigger.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as o from"react";import{styled as f}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const
|
|
1
|
+
import*as o from"react";import{styled as f}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const t={size:{xs:{fontSize:"$xs",lineHeight:1.6,...e(.4364)},sm:{fontSize:"$sm",lineHeight:1.53,...e(.4056)},md:{fontSize:"$md",lineHeight:1.5,...e(.3864)},lg:{fontSize:"$lg",lineHeight:1.52,...e(.3983)},xl:{fontSize:"$xl",lineHeight:1.42,...e(.3506)}},noCapsize:{true:{"&::before, &::after":{display:"none !important"}}}},l=({size:i,noCapsize:n})=>({...t.size[i],...t.noCapsize[`${n}`]}),a=f("p",{fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:t}),r=o.forwardRef(({size:i="md",...n},s)=>o.createElement(a,{size:i,...n,ref:s}));r.displayName="Text";export{a as StyledText,r as Text,l as getTextVariant,t as textVariants};
|
|
2
2
|
//# sourceMappingURL=Text.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Error as g,Close as
|
|
1
|
+
import{Error as g,Close as h}from"@atom-learning/icons";import*as t from"react";import{toast as v}from"react-hot-toast";import{keyframes as a,styled as i}from"../../stitches.js";import{ActionIcon as y}from"../action-icon/ActionIcon.js";import{Icon as s}from"../icon/Icon.js";import{Loader as $}from"../loader/Loader.js";import{Text as w}from"../text/Text.js";const n=400,x=a({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),E=a({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),k=i("div",{position:"absolute",width:"100%",variants:{visible:{true:{"@allowMotion":{animation:`${x} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}},false:{opacity:0,"@allowMotion":{animation:`${E} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}}}}}),I=i("div",{pointerEvents:"auto",alignItems:"center",borderRadius:"$0",boxShadow:"$1",boxSizing:"border-box",color:"white",display:"flex",minHeight:"$5",pl:"$4",position:"relative",pr:"$6",py:"$4",transition:"background-color 50ms ease-out",width:"100%","@sm":{width:n},"@allowMotion":{transition:"background-color 50ms ease-out, transform 150ms ease-out"},variants:{status:{blank:{bg:"$primary"},error:{bg:"$danger"},loading:{bg:"$primary"},success:{bg:"$success"}}}}),T=t.memo(({ariaLive:l,height:m,id:e,message:c,role:p,type:o="blank",visible:d,calculateOffset:u,updateHeight:b})=>{const f=u(e,{reverseOrder:!0,margin:8});return t.createElement(k,{visible:d},t.createElement(I,{ref:r=>{r&&m===void 0&&b(e,r.getBoundingClientRect().height)},status:o,role:p,"aria-live":l,style:{transform:`translateY(${f}px)`}},o==="error"&&t.createElement(s,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),t.createElement(w,null,c),o==="loading"?t.createElement($,{css:{flex:"0 0 auto",ml:"auto"}}):t.createElement(y,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>v.dismiss(e)},t.createElement(s,{is:h}))))});export{n as TOAST_WIDTH,T as Toast};
|
|
2
2
|
//# sourceMappingURL=Toast.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as t from"react";import{useToaster as p}from"react-hot-toast";import{default as
|
|
1
|
+
import*as t from"react";import{useToaster as p}from"react-hot-toast";import{default as P}from"react-hot-toast";import{styled as c}from"../../stitches.js";import{TOAST_WIDTH as d,Toast as f}from"./Toast.js";import{MAX_Z_INDEX as u}from"../../constants/zIndices.js";const T=c("div",{left:"$2",position:"fixed",top:"$2",right:"$2",zIndex:u,"@sm":{top:"$3",right:"auto",left:`calc(50% - ${d/2}px)`}}),o=({children:a})=>{const{toasts:r,handlers:s}=p(),{startPause:i,endPause:m,calculateOffset:n,updateHeight:l}=s;return t.createElement(t.Fragment,null,t.createElement(T,{onMouseEnter:i,onMouseLeave:m},r.map(e=>t.createElement(f,{key:e.id,calculateOffset:n,updateHeight:l,...e}))),a)};o.displayName="ToastProvider";export{o as ToastProvider,P as toast};
|
|
2
2
|
//# sourceMappingURL=ToastProvider.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as n from"react";import{styled as f}from"../../stitches.js";import{StyledIcon as g,Icon as r}from"../icon/Icon.js";import{StyledItem as h}from"./ToggleGroupItem.js";const
|
|
1
|
+
import*as n from"react";import{styled as f}from"../../stitches.js";import{StyledIcon as g,Icon as r}from"../icon/Icon.js";import{StyledItem as h}from"./ToggleGroupItem.js";const s={sm:"32px",md:"40px",lg:"48px"},u={sm:"$4",md:"$5",lg:"$5"},x={sm:"$2",md:"$3",lg:"$3"},l=i=>({fontSize:`$${i}`,px:u[i],minHeight:s[i],"& > *:not(:last-child)":{mr:x[i]}}),d=f(h,{flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",fontWeight:600,lineHeight:1,py:"$1",[`& ${g}`]:{flexShrink:0},variants:{size:{sm:l("sm"),md:l("md"),lg:l("lg")},isIconOnly:{true:{}}},compoundVariants:[{isIconOnly:!0,size:"sm",css:{minWidth:s.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:s.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:s.lg,p:0}}]}),I=n.forwardRef(({size:i="md",children:p,...c},y)=>{var m;const t=n.Children.toArray(p),o=t.length<=1,a=o&&n.isValidElement(t[0])&&((m=t[0])==null?void 0:m.type)===r;return n.createElement(d,{ref:y,size:i,isIconOnly:a,...c},t.map(e=>!o&&(typeof e=="string"||typeof e=="number")?n.createElement("span",{key:e},e):n.isValidElement(e)&&(e==null?void 0:e.type)===r?n.cloneElement(e,{...e.props,size:i}):e))});export{d as StyledButton,I as ToggleGroupButton};
|
|
2
2
|
//# sourceMappingURL=ToggleGroupButton.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import*as
|
|
1
|
+
import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import*as t from"react";import{TOOLTIP_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as a}from"../../stitches.js";import{slideDownAndFade as s,slideLeftAndFade as p,slideUpAndFade as f,slideRightAndFade as c}from"../../utilities/style/keyframe-animations.js";const h=a(m,{backgroundColor:"$tonal500",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,whiteSpace:"normal",px:"$3",py:"$2",zIndex:r,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="delayed-open"]':{'&[data-side="top"]':{animationName:s},'&[data-side="right"]':{animationName:p},'&[data-side="bottom"]':{animationName:f},'&[data-side="left"]':{animationName:c}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),x=a(l,{fill:"$tonal500",'[data-align="end"] &':{mr:"$2"},'[data-align="start"] &':{ml:"$2"}}),$=({children:i,side:e="top",sideOffset:o=4,size:n="md",...d})=>t.createElement(h,{side:e,sideOffset:o,size:n,...d},i,t.createElement(x,null));export{$ as TooltipContent};
|
|
2
2
|
//# sourceMappingURL=TooltipContent.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=a(m,{}),o=e.forwardRef(({id:
|
|
1
|
+
import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=a(m,{}),o=e.forwardRef(({id:t,ratio:r=9/16,css:i,...s},d)=>e.createElement(l,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${r*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${t}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};
|
|
2
2
|
//# sourceMappingURL=Video.js.map
|