@bitrise/bitkit-v2 0.3.187 → 0.3.189
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/atoms/DatePicker/DatePicker.d.ts +1 -0
- package/dist/atoms/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/BitkitCalendar/BitkitCalendar.js +1 -0
- package/dist/components/BitkitCalendar/BitkitCalendar.js.map +1 -1
- package/dist/components/BitkitDraggableCard/BitkitDraggableCard.d.ts +37 -0
- package/dist/components/BitkitDraggableCard/BitkitDraggableCard.js +62 -0
- package/dist/components/BitkitDraggableCard/BitkitDraggableCard.js.map +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/icons/IconDragHandle.d.ts +8 -0
- package/dist/icons/IconDragHandle.js +97 -0
- package/dist/icons/IconDragHandle.js.map +1 -0
- package/dist/icons/index.d.ts +1 -0
- package/dist/main.js +3 -1
- package/dist/theme/slot-recipes/DraggableCard.recipe.d.ts +83 -0
- package/dist/theme/slot-recipes/DraggableCard.recipe.js +133 -0
- package/dist/theme/slot-recipes/DraggableCard.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/ImageCropper.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/index.d.ts +83 -1
- package/dist/theme/slot-recipes/index.js +2 -0
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -46,6 +46,7 @@ export declare const DatePickerTableCellTrigger: import('react').ForwardRefExoti
|
|
|
46
46
|
export declare const DatePickerContext: (props: ArkDatePicker.ContextProps) => import('react').ReactNode;
|
|
47
47
|
export interface DatePickerProps extends DatePickerRootProps {
|
|
48
48
|
device: 'desktop' | 'mobile';
|
|
49
|
+
layout?: '1-month' | '2-month';
|
|
49
50
|
showOutsideDays?: boolean;
|
|
50
51
|
}
|
|
51
52
|
export declare const DatePicker: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","names":[],"sources":["../../../lib/atoms/DatePicker/DatePicker.tsx"],"sourcesContent":["import { DatePicker as ArkDatePicker } from '@ark-ui/react/date-picker';\nimport { createSlotRecipeContext, type HTMLChakraProps, type UnstyledProp } from '@chakra-ui/react/styled-system';\n\nconst { withProvider, withContext, useStyles } = createSlotRecipeContext({ key: 'datePicker' });\n\nexport interface DatePickerRootProps extends HTMLChakraProps<'div', ArkDatePicker.RootProps>, UnstyledProp {}\n\nexport const DatePickerRoot = withProvider<HTMLDivElement, DatePickerProps>(\n withContext<HTMLDivElement, DatePickerRootProps>(ArkDatePicker.Root, 'root', {\n forwardAsChild: true,\n }),\n 'root',\n);\n\nexport interface DatePickerControlProps extends HTMLChakraProps<'div', ArkDatePicker.ControlProps>, UnstyledProp {}\n\nexport const DatePickerControl = withContext<HTMLDivElement, DatePickerControlProps>(ArkDatePicker.Control, 'control', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerPositionerProps\n extends HTMLChakraProps<'div', ArkDatePicker.PositionerProps>, UnstyledProp {}\n\nexport const DatePickerPositioner = withContext<HTMLDivElement, DatePickerPositionerProps>(\n ArkDatePicker.Positioner,\n 'positioner',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerContentProps extends HTMLChakraProps<'div', ArkDatePicker.ContentProps>, UnstyledProp {}\n\nexport const DatePickerContent = withContext<HTMLDivElement, DatePickerContentProps>(ArkDatePicker.Content, 'content', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerMonthsProps extends HTMLChakraProps<'div'>, UnstyledProp {}\n\nexport const DatePickerMonths = withContext<HTMLDivElement, DatePickerMonthsProps>('div', 'months', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerViewProps extends HTMLChakraProps<'div', ArkDatePicker.ViewProps>, UnstyledProp {}\n\nexport const DatePickerView = withContext<HTMLDivElement, DatePickerViewProps>(ArkDatePicker.View, 'view', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerViewControlProps\n extends HTMLChakraProps<'div', ArkDatePicker.ViewControlProps>, UnstyledProp {}\n\nexport const DatePickerViewControl = withContext<HTMLDivElement, DatePickerViewControlProps>(\n ArkDatePicker.ViewControl,\n 'viewControl',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableProps extends HTMLChakraProps<'table', ArkDatePicker.TableProps>, UnstyledProp {}\n\nexport const DatePickerTable = withContext<HTMLTableElement, DatePickerTableProps>(ArkDatePicker.Table, 'table', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerTableHeadProps\n extends HTMLChakraProps<'thead', ArkDatePicker.TableHeadProps>, UnstyledProp {}\n\nexport const DatePickerTableHead = withContext<HTMLTableSectionElement, DatePickerTableHeadProps>(\n ArkDatePicker.TableHead,\n 'tableHead',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableBodyProps\n extends HTMLChakraProps<'tbody', ArkDatePicker.TableBodyProps>, UnstyledProp {}\n\nexport const DatePickerTableBody = withContext<HTMLTableSectionElement, DatePickerTableBodyProps>(\n ArkDatePicker.TableBody,\n 'tableBody',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableRowProps extends HTMLChakraProps<'tr', ArkDatePicker.TableRowProps>, UnstyledProp {}\n\nexport const DatePickerTableRow = withContext<HTMLTableRowElement, DatePickerTableRowProps>(\n ArkDatePicker.TableRow,\n 'tableRow',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableHeaderProps\n extends HTMLChakraProps<'th', ArkDatePicker.TableHeaderProps>, UnstyledProp {}\n\nexport const DatePickerTableHeader = withContext<HTMLTableCellElement, DatePickerTableHeaderProps>(\n ArkDatePicker.TableHeader,\n 'tableHeader',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableCellProps extends HTMLChakraProps<'td', ArkDatePicker.TableCellProps>, UnstyledProp {}\n\nexport const DatePickerTableCell = withContext<HTMLTableCellElement, DatePickerTableCellProps>(\n ArkDatePicker.TableCell,\n 'tableCell',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableCellTriggerProps\n extends HTMLChakraProps<'span', ArkDatePicker.TableCellTriggerProps>, UnstyledProp {}\n\nexport const DatePickerTableCellTrigger = withContext<HTMLButtonElement, DatePickerTableCellTriggerProps>(\n ArkDatePicker.TableCellTrigger,\n 'tableCellTrigger',\n {\n forwardAsChild: true,\n },\n);\n\nexport const DatePickerContext = ArkDatePicker.Context;\n\nexport interface DatePickerProps extends DatePickerRootProps {\n // these do not come from ArkUI, so maybe find a better place\n device: 'desktop' | 'mobile';\n showOutsideDays?: boolean;\n}\n\nexport const DatePicker = {\n Root: DatePickerRoot,\n Control: DatePickerControl,\n Positioner: DatePickerPositioner,\n Content: DatePickerContent,\n Months: DatePickerMonths,\n View: DatePickerView,\n ViewControl: DatePickerViewControl,\n Table: DatePickerTable,\n TableHead: DatePickerTableHead,\n TableBody: DatePickerTableBody,\n TableRow: DatePickerTableRow,\n TableHeader: DatePickerTableHeader,\n TableCell: DatePickerTableCell,\n TableCellTrigger: DatePickerTableCellTrigger,\n};\n\nexport { useStyles as useCalendarStyles };\n\nexport type { DatePickerOpenChangeDetails, DatePickerValueChangeDetails } from '@ark-ui/react/date-picker';\nexport { useDatePickerContext } from '@ark-ui/react/date-picker';\n"],"mappings":";;;AAGA,IAAM,EAAE,cAAc,aAAa,cAAc,wBAAwB,EAAE,KAAK,cAAc,CAAC;AAI/F,IAAa,iBAAiB,aAC5B,YAAiD,WAAc,MAAM,QAAQ,EAC3E,gBAAgB,MACjB,CAAC,EACF,OACD;AAID,IAAa,oBAAoB,YAAoD,WAAc,SAAS,WAAW,EACrH,gBAAgB,MACjB,CAAC;AAKF,IAAa,uBAAuB,YAClC,WAAc,YACd,cACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,oBAAoB,YAAoD,WAAc,SAAS,WAAW,EACrH,gBAAgB,MACjB,CAAC;AAIF,IAAa,mBAAmB,YAAmD,OAAO,UAAU,EAClG,gBAAgB,MACjB,CAAC;AAIF,IAAa,iBAAiB,YAAiD,WAAc,MAAM,QAAQ,EACzG,gBAAgB,MACjB,CAAC;AAKF,IAAa,wBAAwB,YACnC,WAAc,aACd,eACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,kBAAkB,YAAoD,WAAc,OAAO,SAAS,EAC/G,gBAAgB,MACjB,CAAC;AAKF,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,qBAAqB,YAChC,WAAc,UACd,YACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,wBAAwB,YACnC,WAAc,aACd,eACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,6BAA6B,YACxC,WAAc,kBACd,oBACA,EACE,gBAAgB,MACjB,CACF;AAED,IAAa,oBAAoB,WAAc;
|
|
1
|
+
{"version":3,"file":"DatePicker.js","names":[],"sources":["../../../lib/atoms/DatePicker/DatePicker.tsx"],"sourcesContent":["import { DatePicker as ArkDatePicker } from '@ark-ui/react/date-picker';\nimport { createSlotRecipeContext, type HTMLChakraProps, type UnstyledProp } from '@chakra-ui/react/styled-system';\n\nconst { withProvider, withContext, useStyles } = createSlotRecipeContext({ key: 'datePicker' });\n\nexport interface DatePickerRootProps extends HTMLChakraProps<'div', ArkDatePicker.RootProps>, UnstyledProp {}\n\nexport const DatePickerRoot = withProvider<HTMLDivElement, DatePickerProps>(\n withContext<HTMLDivElement, DatePickerRootProps>(ArkDatePicker.Root, 'root', {\n forwardAsChild: true,\n }),\n 'root',\n);\n\nexport interface DatePickerControlProps extends HTMLChakraProps<'div', ArkDatePicker.ControlProps>, UnstyledProp {}\n\nexport const DatePickerControl = withContext<HTMLDivElement, DatePickerControlProps>(ArkDatePicker.Control, 'control', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerPositionerProps\n extends HTMLChakraProps<'div', ArkDatePicker.PositionerProps>, UnstyledProp {}\n\nexport const DatePickerPositioner = withContext<HTMLDivElement, DatePickerPositionerProps>(\n ArkDatePicker.Positioner,\n 'positioner',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerContentProps extends HTMLChakraProps<'div', ArkDatePicker.ContentProps>, UnstyledProp {}\n\nexport const DatePickerContent = withContext<HTMLDivElement, DatePickerContentProps>(ArkDatePicker.Content, 'content', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerMonthsProps extends HTMLChakraProps<'div'>, UnstyledProp {}\n\nexport const DatePickerMonths = withContext<HTMLDivElement, DatePickerMonthsProps>('div', 'months', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerViewProps extends HTMLChakraProps<'div', ArkDatePicker.ViewProps>, UnstyledProp {}\n\nexport const DatePickerView = withContext<HTMLDivElement, DatePickerViewProps>(ArkDatePicker.View, 'view', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerViewControlProps\n extends HTMLChakraProps<'div', ArkDatePicker.ViewControlProps>, UnstyledProp {}\n\nexport const DatePickerViewControl = withContext<HTMLDivElement, DatePickerViewControlProps>(\n ArkDatePicker.ViewControl,\n 'viewControl',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableProps extends HTMLChakraProps<'table', ArkDatePicker.TableProps>, UnstyledProp {}\n\nexport const DatePickerTable = withContext<HTMLTableElement, DatePickerTableProps>(ArkDatePicker.Table, 'table', {\n forwardAsChild: true,\n});\n\nexport interface DatePickerTableHeadProps\n extends HTMLChakraProps<'thead', ArkDatePicker.TableHeadProps>, UnstyledProp {}\n\nexport const DatePickerTableHead = withContext<HTMLTableSectionElement, DatePickerTableHeadProps>(\n ArkDatePicker.TableHead,\n 'tableHead',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableBodyProps\n extends HTMLChakraProps<'tbody', ArkDatePicker.TableBodyProps>, UnstyledProp {}\n\nexport const DatePickerTableBody = withContext<HTMLTableSectionElement, DatePickerTableBodyProps>(\n ArkDatePicker.TableBody,\n 'tableBody',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableRowProps extends HTMLChakraProps<'tr', ArkDatePicker.TableRowProps>, UnstyledProp {}\n\nexport const DatePickerTableRow = withContext<HTMLTableRowElement, DatePickerTableRowProps>(\n ArkDatePicker.TableRow,\n 'tableRow',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableHeaderProps\n extends HTMLChakraProps<'th', ArkDatePicker.TableHeaderProps>, UnstyledProp {}\n\nexport const DatePickerTableHeader = withContext<HTMLTableCellElement, DatePickerTableHeaderProps>(\n ArkDatePicker.TableHeader,\n 'tableHeader',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableCellProps extends HTMLChakraProps<'td', ArkDatePicker.TableCellProps>, UnstyledProp {}\n\nexport const DatePickerTableCell = withContext<HTMLTableCellElement, DatePickerTableCellProps>(\n ArkDatePicker.TableCell,\n 'tableCell',\n {\n forwardAsChild: true,\n },\n);\n\nexport interface DatePickerTableCellTriggerProps\n extends HTMLChakraProps<'span', ArkDatePicker.TableCellTriggerProps>, UnstyledProp {}\n\nexport const DatePickerTableCellTrigger = withContext<HTMLButtonElement, DatePickerTableCellTriggerProps>(\n ArkDatePicker.TableCellTrigger,\n 'tableCellTrigger',\n {\n forwardAsChild: true,\n },\n);\n\nexport const DatePickerContext = ArkDatePicker.Context;\n\nexport interface DatePickerProps extends DatePickerRootProps {\n // these do not come from ArkUI, so maybe find a better place\n device: 'desktop' | 'mobile';\n layout?: '1-month' | '2-month';\n showOutsideDays?: boolean;\n}\n\nexport const DatePicker = {\n Root: DatePickerRoot,\n Control: DatePickerControl,\n Positioner: DatePickerPositioner,\n Content: DatePickerContent,\n Months: DatePickerMonths,\n View: DatePickerView,\n ViewControl: DatePickerViewControl,\n Table: DatePickerTable,\n TableHead: DatePickerTableHead,\n TableBody: DatePickerTableBody,\n TableRow: DatePickerTableRow,\n TableHeader: DatePickerTableHeader,\n TableCell: DatePickerTableCell,\n TableCellTrigger: DatePickerTableCellTrigger,\n};\n\nexport { useStyles as useCalendarStyles };\n\nexport type { DatePickerOpenChangeDetails, DatePickerValueChangeDetails } from '@ark-ui/react/date-picker';\nexport { useDatePickerContext } from '@ark-ui/react/date-picker';\n"],"mappings":";;;AAGA,IAAM,EAAE,cAAc,aAAa,cAAc,wBAAwB,EAAE,KAAK,cAAc,CAAC;AAI/F,IAAa,iBAAiB,aAC5B,YAAiD,WAAc,MAAM,QAAQ,EAC3E,gBAAgB,MACjB,CAAC,EACF,OACD;AAID,IAAa,oBAAoB,YAAoD,WAAc,SAAS,WAAW,EACrH,gBAAgB,MACjB,CAAC;AAKF,IAAa,uBAAuB,YAClC,WAAc,YACd,cACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,oBAAoB,YAAoD,WAAc,SAAS,WAAW,EACrH,gBAAgB,MACjB,CAAC;AAIF,IAAa,mBAAmB,YAAmD,OAAO,UAAU,EAClG,gBAAgB,MACjB,CAAC;AAIF,IAAa,iBAAiB,YAAiD,WAAc,MAAM,QAAQ,EACzG,gBAAgB,MACjB,CAAC;AAKF,IAAa,wBAAwB,YACnC,WAAc,aACd,eACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,kBAAkB,YAAoD,WAAc,OAAO,SAAS,EAC/G,gBAAgB,MACjB,CAAC;AAKF,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,qBAAqB,YAChC,WAAc,UACd,YACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,wBAAwB,YACnC,WAAc,aACd,eACA,EACE,gBAAgB,MACjB,CACF;AAID,IAAa,sBAAsB,YACjC,WAAc,WACd,aACA,EACE,gBAAgB,MACjB,CACF;AAKD,IAAa,6BAA6B,YACxC,WAAc,kBACd,oBACA,EACE,gBAAgB,MACjB,CACF;AAED,IAAa,oBAAoB,WAAc;AAS/C,IAAa,eAAa;CACxB,MAAM;CACN,SAAS;CACT,YAAY;CACZ,SAAS;CACT,QAAQ;CACR,MAAM;CACN,aAAa;CACb,OAAO;CACP,WAAW;CACX,WAAW;CACX,UAAU;CACV,aAAa;CACb,WAAW;CACX,kBAAkB;CACnB"}
|
|
@@ -86,6 +86,7 @@ var BitkitCalendar = forwardRef((props, ref) => {
|
|
|
86
86
|
return /* @__PURE__ */ jsxs(DatePicker.Root, {
|
|
87
87
|
defaultValue: defaultValue instanceof Array ? defaultValue.map(dateToCalendarDate) : defaultValue ? [dateToCalendarDate(defaultValue)] : void 0,
|
|
88
88
|
device,
|
|
89
|
+
layout,
|
|
89
90
|
numOfMonths: layout === "2-month" ? 2 : 1,
|
|
90
91
|
ref,
|
|
91
92
|
inline,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitCalendar.js","names":[],"sources":["../../../lib/components/BitkitCalendar/BitkitCalendar.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type CalendarDate } from '@internationalized/date';\nimport { forwardRef, type ReactNode, useEffect, useMemo, useRef } from 'react';\n\nimport { DatePicker, useDatePickerContext } from '../../atoms/DatePicker/DatePicker';\nimport { calendarDateToDate, dateToCalendarDate } from './Calendar.utils';\nimport CalendarFooter from './components/CalendarFooter';\nimport CalendarMonth from './components/CalendarMonth';\nimport CalendarMonthSelect from './components/CalendarMonthSelect';\nimport CalendarNextTrigger from './components/CalendarNextTrigger';\nimport CalendarPrevTrigger from './components/CalendarPrevTrigger';\nimport CalendarTrigger from './components/CalendarTrigger';\nimport CalendarYearSelect from './components/CalendarYearSelect';\n\nexport interface BitkitCalendarProps {\n children?: ReactNode;\n defaultValue?: Date | Date[] | null;\n device?: 'desktop' | 'mobile';\n layout?: '1-month' | '2-month';\n max?: Date;\n min?: Date;\n onValueChange?: (value: Date[] | null) => void;\n selectionMode?: 'day' | 'range';\n showOutsideDays?: boolean;\n showSelectedDate?: boolean;\n value?: Date[] | null;\n}\n\nconst BitkitCalendarContent = ({\n layout,\n max,\n min,\n selectionMode,\n showSelectedDate,\n}: Pick<BitkitCalendarProps, 'layout' | 'selectionMode'> & {\n min?: CalendarDate;\n max?: CalendarDate;\n showSelectedDate?: boolean;\n}) => {\n const context = useDatePickerContext();\n const prevModeRef = useRef(selectionMode);\n\n useEffect(() => {\n if (prevModeRef.current !== selectionMode) {\n context.clearValue();\n prevModeRef.current = selectionMode;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectionMode]);\n\n return (\n <DatePicker.Content>\n <DatePicker.View view=\"day\">\n <DatePicker.ViewControl>\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\">\n <CalendarPrevTrigger />\n\n <Box display=\"flex\" alignItems=\"center\">\n <CalendarMonthSelect offset={0} layout={layout} max={max} min={min} />\n <CalendarYearSelect monthOffset={0} max={max} min={min} />\n </Box>\n {layout === '1-month' && <CalendarNextTrigger />}\n </Box>\n {layout === '2-month' && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\">\n <CalendarMonthSelect offset={1} layout={layout} max={max} min={min} />\n <CalendarYearSelect monthOffset={1} max={max} min={min} />\n <CalendarNextTrigger />\n </Box>\n )}\n </DatePicker.ViewControl>\n <DatePicker.Months>\n <CalendarMonth monthsIndex={0} />\n {layout === '2-month' && <CalendarMonth monthsIndex={1} />}\n </DatePicker.Months>\n </DatePicker.View>\n <CalendarFooter selectionMode={selectionMode} showSelectedDate={showSelectedDate} />\n </DatePicker.Content>\n );\n};\n\nconst BitkitCalendar = forwardRef<HTMLDivElement, BitkitCalendarProps>((props, ref) => {\n const {\n children,\n defaultValue,\n device = 'desktop',\n layout,\n selectionMode = 'range',\n min,\n max,\n onValueChange,\n showOutsideDays: showOutsideDaysProp = false,\n showSelectedDate = false,\n value: inputValue,\n ...rest\n } = props;\n\n const minCalendarDate = useMemo(() => (min ? dateToCalendarDate(min) : undefined), [min]);\n const maxCalendarDate = useMemo(() => (max ? dateToCalendarDate(max) : undefined), [max]);\n\n const value = inputValue?.map(dateToCalendarDate);\n\n const inline = !children;\n\n const content = (\n <BitkitCalendarContent\n layout={layout}\n max={maxCalendarDate}\n min={minCalendarDate}\n selectionMode={selectionMode}\n showSelectedDate={showSelectedDate}\n />\n );\n\n const showOutsideDays = showOutsideDaysProp ?? layout === '1-month';\n\n return (\n <DatePicker.Root\n defaultValue={\n defaultValue instanceof Array\n ? defaultValue.map(dateToCalendarDate)\n : defaultValue\n ? [dateToCalendarDate(defaultValue)]\n : undefined\n }\n device={device}\n numOfMonths={layout === '2-month' ? 2 : 1}\n ref={ref}\n inline={inline}\n min={minCalendarDate}\n max={maxCalendarDate}\n onValueChange={\n onValueChange\n ? (details) => {\n const dates = details.value?.map(calendarDateToDate) || null;\n onValueChange(dates);\n }\n : undefined\n }\n selectionMode={selectionMode === 'day' ? 'single' : 'range'}\n showOutsideDays={showOutsideDays}\n startOfWeek={1}\n value={value}\n {...rest}\n >\n {!inline && (\n <DatePicker.Control>\n <CalendarTrigger>{children}</CalendarTrigger>\n </DatePicker.Control>\n )}\n {inline ? (\n content\n ) : (\n <Portal>\n <DatePicker.Positioner>{content}</DatePicker.Positioner>\n </Portal>\n )}\n </DatePicker.Root>\n );\n});\n\nBitkitCalendar.displayName = 'BitkitCalendar';\n\nexport default BitkitCalendar;\n"],"mappings":";;;;;;;;;;;;;;AA6BA,IAAM,yBAAyB,EAC7B,QACA,KACA,KACA,eACA,uBAKI;CACJ,MAAM,UAAU,sBAAsB;CACtC,MAAM,cAAc,OAAO,cAAc;AAEzC,iBAAgB;AACd,MAAI,YAAY,YAAY,eAAe;AACzC,WAAQ,YAAY;AACpB,eAAY,UAAU;;IAGvB,CAAC,cAAc,CAAC;AAEnB,QACE,qBAAC,WAAW,SAAZ,EAAA,UAAA,CACE,qBAAC,WAAW,MAAZ;EAAiB,MAAK;YAAtB,CACE,qBAAC,WAAW,aAAZ,EAAA,UAAA,CACE,qBAAC,KAAD;GAAK,SAAQ;GAAO,YAAW;GAAS,KAAI;aAA5C;IACE,oBAAC,qBAAD,EAAuB,CAAA;IAEvB,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;eAA/B,CACE,oBAAC,qBAAD;MAAqB,QAAQ;MAAW;MAAa;MAAU;MAAO,CAAA,EACtE,oBAAC,oBAAD;MAAoB,aAAa;MAAQ;MAAU;MAAO,CAAA,CACtD;;IACL,WAAW,aAAa,oBAAC,qBAAD,EAAuB,CAAA;IAC5C;MACL,WAAW,aACV,qBAAC,KAAD;GAAK,SAAQ;GAAO,YAAW;GAAS,KAAI;aAA5C;IACE,oBAAC,qBAAD;KAAqB,QAAQ;KAAW;KAAa;KAAU;KAAO,CAAA;IACtE,oBAAC,oBAAD;KAAoB,aAAa;KAAQ;KAAU;KAAO,CAAA;IAC1D,oBAAC,qBAAD,EAAuB,CAAA;IACnB;KAEe,EAAA,CAAA,EACzB,qBAAC,WAAW,QAAZ,EAAA,UAAA,CACE,oBAAC,eAAD,EAAe,aAAa,GAAK,CAAA,EAChC,WAAW,aAAa,oBAAC,eAAD,EAAe,aAAa,GAAK,CAAA,CACxC,EAAA,CAAA,CACJ;KAClB,oBAAC,gBAAD;EAA+B;EAAiC;EAAoB,CAAA,CACjE,EAAA,CAAA;;AAIzB,IAAM,iBAAiB,YAAiD,OAAO,QAAQ;CACrF,MAAM,EACJ,UACA,cACA,SAAS,WACT,QACA,gBAAgB,SAChB,KACA,KACA,eACA,iBAAiB,sBAAsB,OACvC,mBAAmB,OACnB,OAAO,YACP,GAAG,SACD;CAEJ,MAAM,kBAAkB,cAAe,MAAM,mBAAmB,IAAI,GAAG,KAAA,GAAY,CAAC,IAAI,CAAC;CACzF,MAAM,kBAAkB,cAAe,MAAM,mBAAmB,IAAI,GAAG,KAAA,GAAY,CAAC,IAAI,CAAC;CAEzF,MAAM,QAAQ,YAAY,IAAI,mBAAmB;CAEjD,MAAM,SAAS,CAAC;CAEhB,MAAM,UACJ,oBAAC,uBAAD;EACU;EACR,KAAK;EACL,KAAK;EACU;EACG;EAClB,CAAA;CAGJ,MAAM,kBAAkB,uBAAuB,WAAW;AAE1D,QACE,qBAAC,WAAW,MAAZ;EACE,cACE,wBAAwB,QACpB,aAAa,IAAI,mBAAmB,GACpC,eACE,CAAC,mBAAmB,aAAa,CAAC,GAClC,KAAA;EAEA;EACR,aAAa,WAAW,YAAY,IAAI;EACnC;EACG;EACR,KAAK;EACL,KAAK;EACL,eACE,iBACK,YAAY;AAEX,iBADc,QAAQ,OAAO,IAAI,mBAAmB,IAAI,KACpC;MAEtB,KAAA;EAEN,eAAe,kBAAkB,QAAQ,WAAW;EACnC;EACjB,aAAa;EACN;EACP,GAAI;
|
|
1
|
+
{"version":3,"file":"BitkitCalendar.js","names":[],"sources":["../../../lib/components/BitkitCalendar/BitkitCalendar.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type CalendarDate } from '@internationalized/date';\nimport { forwardRef, type ReactNode, useEffect, useMemo, useRef } from 'react';\n\nimport { DatePicker, useDatePickerContext } from '../../atoms/DatePicker/DatePicker';\nimport { calendarDateToDate, dateToCalendarDate } from './Calendar.utils';\nimport CalendarFooter from './components/CalendarFooter';\nimport CalendarMonth from './components/CalendarMonth';\nimport CalendarMonthSelect from './components/CalendarMonthSelect';\nimport CalendarNextTrigger from './components/CalendarNextTrigger';\nimport CalendarPrevTrigger from './components/CalendarPrevTrigger';\nimport CalendarTrigger from './components/CalendarTrigger';\nimport CalendarYearSelect from './components/CalendarYearSelect';\n\nexport interface BitkitCalendarProps {\n children?: ReactNode;\n defaultValue?: Date | Date[] | null;\n device?: 'desktop' | 'mobile';\n layout?: '1-month' | '2-month';\n max?: Date;\n min?: Date;\n onValueChange?: (value: Date[] | null) => void;\n selectionMode?: 'day' | 'range';\n showOutsideDays?: boolean;\n showSelectedDate?: boolean;\n value?: Date[] | null;\n}\n\nconst BitkitCalendarContent = ({\n layout,\n max,\n min,\n selectionMode,\n showSelectedDate,\n}: Pick<BitkitCalendarProps, 'layout' | 'selectionMode'> & {\n min?: CalendarDate;\n max?: CalendarDate;\n showSelectedDate?: boolean;\n}) => {\n const context = useDatePickerContext();\n const prevModeRef = useRef(selectionMode);\n\n useEffect(() => {\n if (prevModeRef.current !== selectionMode) {\n context.clearValue();\n prevModeRef.current = selectionMode;\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectionMode]);\n\n return (\n <DatePicker.Content>\n <DatePicker.View view=\"day\">\n <DatePicker.ViewControl>\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\">\n <CalendarPrevTrigger />\n\n <Box display=\"flex\" alignItems=\"center\">\n <CalendarMonthSelect offset={0} layout={layout} max={max} min={min} />\n <CalendarYearSelect monthOffset={0} max={max} min={min} />\n </Box>\n {layout === '1-month' && <CalendarNextTrigger />}\n </Box>\n {layout === '2-month' && (\n <Box display=\"flex\" alignItems=\"center\" gap=\"12\">\n <CalendarMonthSelect offset={1} layout={layout} max={max} min={min} />\n <CalendarYearSelect monthOffset={1} max={max} min={min} />\n <CalendarNextTrigger />\n </Box>\n )}\n </DatePicker.ViewControl>\n <DatePicker.Months>\n <CalendarMonth monthsIndex={0} />\n {layout === '2-month' && <CalendarMonth monthsIndex={1} />}\n </DatePicker.Months>\n </DatePicker.View>\n <CalendarFooter selectionMode={selectionMode} showSelectedDate={showSelectedDate} />\n </DatePicker.Content>\n );\n};\n\nconst BitkitCalendar = forwardRef<HTMLDivElement, BitkitCalendarProps>((props, ref) => {\n const {\n children,\n defaultValue,\n device = 'desktop',\n layout,\n selectionMode = 'range',\n min,\n max,\n onValueChange,\n showOutsideDays: showOutsideDaysProp = false,\n showSelectedDate = false,\n value: inputValue,\n ...rest\n } = props;\n\n const minCalendarDate = useMemo(() => (min ? dateToCalendarDate(min) : undefined), [min]);\n const maxCalendarDate = useMemo(() => (max ? dateToCalendarDate(max) : undefined), [max]);\n\n const value = inputValue?.map(dateToCalendarDate);\n\n const inline = !children;\n\n const content = (\n <BitkitCalendarContent\n layout={layout}\n max={maxCalendarDate}\n min={minCalendarDate}\n selectionMode={selectionMode}\n showSelectedDate={showSelectedDate}\n />\n );\n\n const showOutsideDays = showOutsideDaysProp ?? layout === '1-month';\n\n return (\n <DatePicker.Root\n defaultValue={\n defaultValue instanceof Array\n ? defaultValue.map(dateToCalendarDate)\n : defaultValue\n ? [dateToCalendarDate(defaultValue)]\n : undefined\n }\n device={device}\n layout={layout}\n numOfMonths={layout === '2-month' ? 2 : 1}\n ref={ref}\n inline={inline}\n min={minCalendarDate}\n max={maxCalendarDate}\n onValueChange={\n onValueChange\n ? (details) => {\n const dates = details.value?.map(calendarDateToDate) || null;\n onValueChange(dates);\n }\n : undefined\n }\n selectionMode={selectionMode === 'day' ? 'single' : 'range'}\n showOutsideDays={showOutsideDays}\n startOfWeek={1}\n value={value}\n {...rest}\n >\n {!inline && (\n <DatePicker.Control>\n <CalendarTrigger>{children}</CalendarTrigger>\n </DatePicker.Control>\n )}\n {inline ? (\n content\n ) : (\n <Portal>\n <DatePicker.Positioner>{content}</DatePicker.Positioner>\n </Portal>\n )}\n </DatePicker.Root>\n );\n});\n\nBitkitCalendar.displayName = 'BitkitCalendar';\n\nexport default BitkitCalendar;\n"],"mappings":";;;;;;;;;;;;;;AA6BA,IAAM,yBAAyB,EAC7B,QACA,KACA,KACA,eACA,uBAKI;CACJ,MAAM,UAAU,sBAAsB;CACtC,MAAM,cAAc,OAAO,cAAc;AAEzC,iBAAgB;AACd,MAAI,YAAY,YAAY,eAAe;AACzC,WAAQ,YAAY;AACpB,eAAY,UAAU;;IAGvB,CAAC,cAAc,CAAC;AAEnB,QACE,qBAAC,WAAW,SAAZ,EAAA,UAAA,CACE,qBAAC,WAAW,MAAZ;EAAiB,MAAK;YAAtB,CACE,qBAAC,WAAW,aAAZ,EAAA,UAAA,CACE,qBAAC,KAAD;GAAK,SAAQ;GAAO,YAAW;GAAS,KAAI;aAA5C;IACE,oBAAC,qBAAD,EAAuB,CAAA;IAEvB,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;eAA/B,CACE,oBAAC,qBAAD;MAAqB,QAAQ;MAAW;MAAa;MAAU;MAAO,CAAA,EACtE,oBAAC,oBAAD;MAAoB,aAAa;MAAQ;MAAU;MAAO,CAAA,CACtD;;IACL,WAAW,aAAa,oBAAC,qBAAD,EAAuB,CAAA;IAC5C;MACL,WAAW,aACV,qBAAC,KAAD;GAAK,SAAQ;GAAO,YAAW;GAAS,KAAI;aAA5C;IACE,oBAAC,qBAAD;KAAqB,QAAQ;KAAW;KAAa;KAAU;KAAO,CAAA;IACtE,oBAAC,oBAAD;KAAoB,aAAa;KAAQ;KAAU;KAAO,CAAA;IAC1D,oBAAC,qBAAD,EAAuB,CAAA;IACnB;KAEe,EAAA,CAAA,EACzB,qBAAC,WAAW,QAAZ,EAAA,UAAA,CACE,oBAAC,eAAD,EAAe,aAAa,GAAK,CAAA,EAChC,WAAW,aAAa,oBAAC,eAAD,EAAe,aAAa,GAAK,CAAA,CACxC,EAAA,CAAA,CACJ;KAClB,oBAAC,gBAAD;EAA+B;EAAiC;EAAoB,CAAA,CACjE,EAAA,CAAA;;AAIzB,IAAM,iBAAiB,YAAiD,OAAO,QAAQ;CACrF,MAAM,EACJ,UACA,cACA,SAAS,WACT,QACA,gBAAgB,SAChB,KACA,KACA,eACA,iBAAiB,sBAAsB,OACvC,mBAAmB,OACnB,OAAO,YACP,GAAG,SACD;CAEJ,MAAM,kBAAkB,cAAe,MAAM,mBAAmB,IAAI,GAAG,KAAA,GAAY,CAAC,IAAI,CAAC;CACzF,MAAM,kBAAkB,cAAe,MAAM,mBAAmB,IAAI,GAAG,KAAA,GAAY,CAAC,IAAI,CAAC;CAEzF,MAAM,QAAQ,YAAY,IAAI,mBAAmB;CAEjD,MAAM,SAAS,CAAC;CAEhB,MAAM,UACJ,oBAAC,uBAAD;EACU;EACR,KAAK;EACL,KAAK;EACU;EACG;EAClB,CAAA;CAGJ,MAAM,kBAAkB,uBAAuB,WAAW;AAE1D,QACE,qBAAC,WAAW,MAAZ;EACE,cACE,wBAAwB,QACpB,aAAa,IAAI,mBAAmB,GACpC,eACE,CAAC,mBAAmB,aAAa,CAAC,GAClC,KAAA;EAEA;EACA;EACR,aAAa,WAAW,YAAY,IAAI;EACnC;EACG;EACR,KAAK;EACL,KAAK;EACL,eACE,iBACK,YAAY;AAEX,iBADc,QAAQ,OAAO,IAAI,mBAAmB,IAAI,KACpC;MAEtB,KAAA;EAEN,eAAe,kBAAkB,QAAQ,WAAW;EACnC;EACjB,aAAa;EACN;EACP,GAAI;YA3BN,CA6BG,CAAC,UACA,oBAAC,WAAW,SAAZ,EAAA,UACE,oBAAC,iBAAD,EAAkB,UAA2B,CAAA,EAC1B,CAAA,EAEtB,SACC,UAEA,oBAAC,QAAD,EAAA,UACE,oBAAC,WAAW,YAAZ,EAAA,UAAwB,SAAgC,CAAA,EACjD,CAAA,CAEK;;EAEpB;AAEF,eAAe,cAAc"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { BoxProps } from '@chakra-ui/react/box';
|
|
2
|
+
import { ReactNode, Ref } from 'react';
|
|
3
|
+
export interface BitkitDraggableCardProps extends Omit<BoxProps, 'children'> {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
/** Ref for the drag handle element — pass useSortable().handleRef here. When provided, only the handle initiates drag. */
|
|
6
|
+
handleRef?: Ref<HTMLButtonElement>;
|
|
7
|
+
/** Whether this card is currently being dragged */
|
|
8
|
+
isDragging?: boolean;
|
|
9
|
+
/** Whether this card is a drop target placeholder */
|
|
10
|
+
isDropTarget?: boolean;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* A card with a drag handle, designed for use with `@dnd-kit/react`.
|
|
14
|
+
*
|
|
15
|
+
* The component is purely presentational — it does not depend on `@dnd-kit`.
|
|
16
|
+
* Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.
|
|
17
|
+
*
|
|
18
|
+
* @example Full-card drag (default — the entire card is draggable)
|
|
19
|
+
* ```tsx
|
|
20
|
+
* const { ref, isDragSource, isDropTarget } = useSortable({ id, index });
|
|
21
|
+
*
|
|
22
|
+
* <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>
|
|
23
|
+
* {children}
|
|
24
|
+
* </BitkitDraggableCard>
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* @example Handle-only drag (pass handleRef to restrict drag to the handle)
|
|
28
|
+
* ```tsx
|
|
29
|
+
* const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });
|
|
30
|
+
*
|
|
31
|
+
* <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>
|
|
32
|
+
* {children}
|
|
33
|
+
* </BitkitDraggableCard>
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
declare const BitkitDraggableCard: import('react').ForwardRefExoticComponent<BitkitDraggableCardProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
37
|
+
export default BitkitDraggableCard;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import IconDragHandle from "../../icons/IconDragHandle.js";
|
|
2
|
+
import { Box } from "@chakra-ui/react/box";
|
|
3
|
+
import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
4
|
+
import { forwardRef } from "react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
//#region lib/components/BitkitDraggableCard/BitkitDraggableCard.tsx
|
|
7
|
+
/**
|
|
8
|
+
* A card with a drag handle, designed for use with `@dnd-kit/react`.
|
|
9
|
+
*
|
|
10
|
+
* The component is purely presentational — it does not depend on `@dnd-kit`.
|
|
11
|
+
* Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.
|
|
12
|
+
*
|
|
13
|
+
* @example Full-card drag (default — the entire card is draggable)
|
|
14
|
+
* ```tsx
|
|
15
|
+
* const { ref, isDragSource, isDropTarget } = useSortable({ id, index });
|
|
16
|
+
*
|
|
17
|
+
* <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>
|
|
18
|
+
* {children}
|
|
19
|
+
* </BitkitDraggableCard>
|
|
20
|
+
* ```
|
|
21
|
+
*
|
|
22
|
+
* @example Handle-only drag (pass handleRef to restrict drag to the handle)
|
|
23
|
+
* ```tsx
|
|
24
|
+
* const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });
|
|
25
|
+
*
|
|
26
|
+
* <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>
|
|
27
|
+
* {children}
|
|
28
|
+
* </BitkitDraggableCard>
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
var BitkitDraggableCard = forwardRef((props, ref) => {
|
|
32
|
+
const { children, handleRef, isDragging = false, isDropTarget = false, ...rest } = props;
|
|
33
|
+
const isFullCardDrag = !handleRef;
|
|
34
|
+
const styles = useSlotRecipe({ key: "draggableCard" })({
|
|
35
|
+
isDragging,
|
|
36
|
+
isDropTarget,
|
|
37
|
+
isFullCardDrag
|
|
38
|
+
});
|
|
39
|
+
return /* @__PURE__ */ jsxs(Box, {
|
|
40
|
+
ref,
|
|
41
|
+
css: styles.root,
|
|
42
|
+
...rest,
|
|
43
|
+
children: [isFullCardDrag ? /* @__PURE__ */ jsx(chakra.div, {
|
|
44
|
+
css: styles.handle,
|
|
45
|
+
children: /* @__PURE__ */ jsx(IconDragHandle, { size: "16" })
|
|
46
|
+
}) : /* @__PURE__ */ jsx(chakra.button, {
|
|
47
|
+
ref: handleRef,
|
|
48
|
+
type: "button",
|
|
49
|
+
"aria-label": "Drag handle",
|
|
50
|
+
css: styles.handle,
|
|
51
|
+
children: /* @__PURE__ */ jsx(IconDragHandle, { size: "16" })
|
|
52
|
+
}), /* @__PURE__ */ jsx(Box, {
|
|
53
|
+
css: styles.content,
|
|
54
|
+
children
|
|
55
|
+
})]
|
|
56
|
+
});
|
|
57
|
+
});
|
|
58
|
+
BitkitDraggableCard.displayName = "BitkitDraggableCard";
|
|
59
|
+
//#endregion
|
|
60
|
+
export { BitkitDraggableCard as default };
|
|
61
|
+
|
|
62
|
+
//# sourceMappingURL=BitkitDraggableCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BitkitDraggableCard.js","names":[],"sources":["../../../lib/components/BitkitDraggableCard/BitkitDraggableCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode, type Ref } from 'react';\n\nimport IconDragHandle from '../../icons/IconDragHandle';\n\n// ----- Props -----\n\nexport interface BitkitDraggableCardProps extends Omit<BoxProps, 'children'> {\n children: ReactNode;\n /** Ref for the drag handle element — pass useSortable().handleRef here. When provided, only the handle initiates drag. */\n handleRef?: Ref<HTMLButtonElement>;\n /** Whether this card is currently being dragged */\n isDragging?: boolean;\n /** Whether this card is a drop target placeholder */\n isDropTarget?: boolean;\n}\n\n// ----- Component -----\n\n/**\n * A card with a drag handle, designed for use with `@dnd-kit/react`.\n *\n * The component is purely presentational — it does not depend on `@dnd-kit`.\n * Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.\n *\n * @example Full-card drag (default — the entire card is draggable)\n * ```tsx\n * const { ref, isDragSource, isDropTarget } = useSortable({ id, index });\n *\n * <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>\n * {children}\n * </BitkitDraggableCard>\n * ```\n *\n * @example Handle-only drag (pass handleRef to restrict drag to the handle)\n * ```tsx\n * const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });\n *\n * <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>\n * {children}\n * </BitkitDraggableCard>\n * ```\n */\nconst BitkitDraggableCard = forwardRef<HTMLDivElement, BitkitDraggableCardProps>((props, ref) => {\n const { children, handleRef, isDragging = false, isDropTarget = false, ...rest } = props;\n\n const isFullCardDrag = !handleRef;\n const recipe = useSlotRecipe({ key: 'draggableCard' });\n const styles = recipe({ isDragging, isDropTarget, isFullCardDrag });\n\n return (\n <Box ref={ref} css={styles.root} {...rest}>\n {isFullCardDrag ? (\n <chakra.div css={styles.handle}>\n <IconDragHandle size=\"16\" />\n </chakra.div>\n ) : (\n <chakra.button ref={handleRef} type=\"button\" aria-label=\"Drag handle\" css={styles.handle}>\n <IconDragHandle size=\"16\" />\n </chakra.button>\n )}\n <Box css={styles.content}>{children}</Box>\n </Box>\n );\n});\n\nBitkitDraggableCard.displayName = 'BitkitDraggableCard';\n\nexport default BitkitDraggableCard;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,WAAW,aAAa,OAAO,eAAe,OAAO,GAAG,SAAS;CAEnF,MAAM,iBAAiB,CAAC;CAExB,MAAM,SADS,cAAc,EAAE,KAAK,iBAAiB,CAAC,CAChC;EAAE;EAAY;EAAc;EAAgB,CAAC;AAEnE,QACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;YAArC,CACG,iBACC,oBAAC,OAAO,KAAR;GAAY,KAAK,OAAO;aACtB,oBAAC,gBAAD,EAAgB,MAAK,MAAO,CAAA;GACjB,CAAA,GAEb,oBAAC,OAAO,QAAR;GAAe,KAAK;GAAW,MAAK;GAAS,cAAW;GAAc,KAAK,OAAO;aAChF,oBAAC,gBAAD,EAAgB,MAAK,MAAO,CAAA;GACd,CAAA,EAElB,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAU;GAAe,CAAA,CACtC;;EAER;AAEF,oBAAoB,cAAc"}
|
|
@@ -19,6 +19,7 @@ export { default as BitkitDialog, type BitkitDialogProps } from './BitkitDialog/
|
|
|
19
19
|
export { default as BitkitDialogBody, type BitkitDialogBodyProps } from './BitkitDialog/BitkitDialogBody';
|
|
20
20
|
export { default as BitkitDialogContent, type BitkitDialogContentProps } from './BitkitDialog/BitkitDialogContent';
|
|
21
21
|
export { default as BitkitDialogRoot, type BitkitDialogRootProps } from './BitkitDialog/BitkitDialogRoot';
|
|
22
|
+
export { default as BitkitDraggableCard, type BitkitDraggableCardProps, } from './BitkitDraggableCard/BitkitDraggableCard';
|
|
22
23
|
export { default as BitkitEmptyState, type BitkitEmptyStateProps } from './BitkitEmptyState/BitkitEmptyState';
|
|
23
24
|
export { default as BitkitExpandableCard, type BitkitExpandableCardProps, } from './BitkitExpandableCard/BitkitExpandableCard';
|
|
24
25
|
export { default as BitkitExplainerList, type BitkitExplainerListItemProps, type BitkitExplainerListProps, } from './BitkitExplainerList/BitkitExplainerList';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { IconProps } from '@chakra-ui/react/icon';
|
|
2
|
+
export interface IconDragHandleProps extends IconProps {
|
|
3
|
+
size?: '16' | '24';
|
|
4
|
+
}
|
|
5
|
+
declare const IconDragHandle: import('react').ForwardRefExoticComponent<IconDragHandleProps> & {
|
|
6
|
+
__bitkitIcon: true;
|
|
7
|
+
};
|
|
8
|
+
export default IconDragHandle;
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { bitkitIcon } from "./bitkitIcon.js";
|
|
2
|
+
import { Icon } from "@chakra-ui/react/icon";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
//#region lib/icons/IconDragHandle.tsx
|
|
5
|
+
var IconDragHandle = bitkitIcon(function IconDragHandle({ size = "24", ...props }, ref) {
|
|
6
|
+
if (size === "16") return /* @__PURE__ */ jsx(Icon, {
|
|
7
|
+
asChild: true,
|
|
8
|
+
ref,
|
|
9
|
+
...props,
|
|
10
|
+
children: /* @__PURE__ */ jsxs("svg", {
|
|
11
|
+
width: "16",
|
|
12
|
+
height: "16",
|
|
13
|
+
viewBox: "0 0 16 16",
|
|
14
|
+
fill: "currentColor",
|
|
15
|
+
children: [
|
|
16
|
+
/* @__PURE__ */ jsx("circle", {
|
|
17
|
+
cx: "6",
|
|
18
|
+
cy: "4",
|
|
19
|
+
r: "1"
|
|
20
|
+
}),
|
|
21
|
+
/* @__PURE__ */ jsx("circle", {
|
|
22
|
+
cx: "10",
|
|
23
|
+
cy: "4",
|
|
24
|
+
r: "1"
|
|
25
|
+
}),
|
|
26
|
+
/* @__PURE__ */ jsx("circle", {
|
|
27
|
+
cx: "6",
|
|
28
|
+
cy: "8",
|
|
29
|
+
r: "1"
|
|
30
|
+
}),
|
|
31
|
+
/* @__PURE__ */ jsx("circle", {
|
|
32
|
+
cx: "10",
|
|
33
|
+
cy: "8",
|
|
34
|
+
r: "1"
|
|
35
|
+
}),
|
|
36
|
+
/* @__PURE__ */ jsx("circle", {
|
|
37
|
+
cx: "6",
|
|
38
|
+
cy: "12",
|
|
39
|
+
r: "1"
|
|
40
|
+
}),
|
|
41
|
+
/* @__PURE__ */ jsx("circle", {
|
|
42
|
+
cx: "10",
|
|
43
|
+
cy: "12",
|
|
44
|
+
r: "1"
|
|
45
|
+
})
|
|
46
|
+
]
|
|
47
|
+
})
|
|
48
|
+
});
|
|
49
|
+
return /* @__PURE__ */ jsx(Icon, {
|
|
50
|
+
asChild: true,
|
|
51
|
+
ref,
|
|
52
|
+
...props,
|
|
53
|
+
children: /* @__PURE__ */ jsxs("svg", {
|
|
54
|
+
width: "24",
|
|
55
|
+
height: "24",
|
|
56
|
+
viewBox: "0 0 24 24",
|
|
57
|
+
fill: "currentColor",
|
|
58
|
+
children: [
|
|
59
|
+
/* @__PURE__ */ jsx("circle", {
|
|
60
|
+
cx: "9",
|
|
61
|
+
cy: "6",
|
|
62
|
+
r: "1.5"
|
|
63
|
+
}),
|
|
64
|
+
/* @__PURE__ */ jsx("circle", {
|
|
65
|
+
cx: "15",
|
|
66
|
+
cy: "6",
|
|
67
|
+
r: "1.5"
|
|
68
|
+
}),
|
|
69
|
+
/* @__PURE__ */ jsx("circle", {
|
|
70
|
+
cx: "9",
|
|
71
|
+
cy: "12",
|
|
72
|
+
r: "1.5"
|
|
73
|
+
}),
|
|
74
|
+
/* @__PURE__ */ jsx("circle", {
|
|
75
|
+
cx: "15",
|
|
76
|
+
cy: "12",
|
|
77
|
+
r: "1.5"
|
|
78
|
+
}),
|
|
79
|
+
/* @__PURE__ */ jsx("circle", {
|
|
80
|
+
cx: "9",
|
|
81
|
+
cy: "18",
|
|
82
|
+
r: "1.5"
|
|
83
|
+
}),
|
|
84
|
+
/* @__PURE__ */ jsx("circle", {
|
|
85
|
+
cx: "15",
|
|
86
|
+
cy: "18",
|
|
87
|
+
r: "1.5"
|
|
88
|
+
})
|
|
89
|
+
]
|
|
90
|
+
})
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
|
+
IconDragHandle.displayName = "IconDragHandle";
|
|
94
|
+
//#endregion
|
|
95
|
+
export { IconDragHandle as default };
|
|
96
|
+
|
|
97
|
+
//# sourceMappingURL=IconDragHandle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IconDragHandle.js","names":[],"sources":["../../lib/icons/IconDragHandle.tsx"],"sourcesContent":["// @generate:skip\n// This file is manually maintained — the drag handle icon has no Figma source.\n\nimport { Icon, type IconProps } from '@chakra-ui/react/icon';\nimport { type Ref } from 'react';\n\nimport { bitkitIcon } from './bitkitIcon';\n\nexport interface IconDragHandleProps extends IconProps {\n size?: '16' | '24';\n}\n\nconst IconDragHandle = bitkitIcon(function IconDragHandle(\n { size = '24', ...props }: IconDragHandleProps,\n ref: Ref<SVGSVGElement>,\n) {\n if (size === '16') {\n return (\n <Icon asChild ref={ref} {...props}>\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\">\n <circle cx=\"6\" cy=\"4\" r=\"1\" />\n <circle cx=\"10\" cy=\"4\" r=\"1\" />\n <circle cx=\"6\" cy=\"8\" r=\"1\" />\n <circle cx=\"10\" cy=\"8\" r=\"1\" />\n <circle cx=\"6\" cy=\"12\" r=\"1\" />\n <circle cx=\"10\" cy=\"12\" r=\"1\" />\n </svg>\n </Icon>\n );\n }\n\n return (\n <Icon asChild ref={ref} {...props}>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <circle cx=\"9\" cy=\"6\" r=\"1.5\" />\n <circle cx=\"15\" cy=\"6\" r=\"1.5\" />\n <circle cx=\"9\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"15\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"9\" cy=\"18\" r=\"1.5\" />\n <circle cx=\"15\" cy=\"18\" r=\"1.5\" />\n </svg>\n </Icon>\n );\n});\n\nIconDragHandle.displayName = 'IconDragHandle';\n\nexport default IconDragHandle;\n"],"mappings":";;;;AAYA,IAAM,iBAAiB,WAAW,SAAS,eACzC,EAAE,OAAO,MAAM,GAAG,SAClB,KACA;AACA,KAAI,SAAS,KACX,QACE,oBAAC,MAAD;EAAM,SAAA;EAAa;EAAK,GAAI;YAC1B,qBAAC,OAAD;GAAK,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,MAAK;aAArD;IACE,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAM,CAAA;IAC9B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAM,CAAA;IAC9B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAM,CAAA;IAC5B;;EACD,CAAA;AAIX,QACE,oBAAC,MAAD;EAAM,SAAA;EAAa;EAAK,GAAI;YAC1B,qBAAC,OAAD;GAAK,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,MAAK;aAArD;IACE,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAQ,CAAA;IAChC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAQ,CAAA;IAClC,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAQ,CAAA;IAC9B;;EACD,CAAA;EAET;AAEF,eAAe,cAAc"}
|
package/dist/icons/index.d.ts
CHANGED
|
@@ -118,6 +118,7 @@ export { default as IconDotnetText, type IconDotnetTextProps } from './IconDotne
|
|
|
118
118
|
export { default as IconDotnetTextColor, type IconDotnetTextColorProps } from './IconDotnetTextColor';
|
|
119
119
|
export { default as IconDoubleCircle, type IconDoubleCircleProps } from './IconDoubleCircle';
|
|
120
120
|
export { default as IconDownload, type IconDownloadProps } from './IconDownload';
|
|
121
|
+
export { default as IconDragHandle, type IconDragHandleProps } from './IconDragHandle';
|
|
121
122
|
export { default as IconEc2Ami, type IconEc2AmiProps } from './IconEc2Ami';
|
|
122
123
|
export { default as IconEnterprise, type IconEnterpriseProps } from './IconEnterprise';
|
|
123
124
|
export { default as IconErrorCircle, type IconErrorCircleProps } from './IconErrorCircle';
|
package/dist/main.js
CHANGED
|
@@ -103,6 +103,7 @@ import IconDotnetText from "./icons/IconDotnetText.js";
|
|
|
103
103
|
import IconDotnetTextColor from "./icons/IconDotnetTextColor.js";
|
|
104
104
|
import IconDoubleCircle from "./icons/IconDoubleCircle.js";
|
|
105
105
|
import IconDownload from "./icons/IconDownload.js";
|
|
106
|
+
import IconDragHandle from "./icons/IconDragHandle.js";
|
|
106
107
|
import IconEc2Ami from "./icons/IconEc2Ami.js";
|
|
107
108
|
import IconEnterprise from "./icons/IconEnterprise.js";
|
|
108
109
|
import IconErrorCircle from "./icons/IconErrorCircle.js";
|
|
@@ -303,6 +304,7 @@ import BitkitDialogBody from "./components/BitkitDialog/BitkitDialogBody.js";
|
|
|
303
304
|
import BitkitDialogContent from "./components/BitkitDialog/BitkitDialogContent.js";
|
|
304
305
|
import BitkitDialogRoot from "./components/BitkitDialog/BitkitDialogRoot.js";
|
|
305
306
|
import BitkitDialog from "./components/BitkitDialog/BitkitDialog.js";
|
|
307
|
+
import BitkitDraggableCard from "./components/BitkitDraggableCard/BitkitDraggableCard.js";
|
|
306
308
|
import BitkitEmptyState from "./components/BitkitEmptyState/BitkitEmptyState.js";
|
|
307
309
|
import BitkitExpandableCard from "./components/BitkitExpandableCard/BitkitExpandableCard.js";
|
|
308
310
|
import BitkitExplainerList_default from "./components/BitkitExplainerList/BitkitExplainerList.js";
|
|
@@ -341,4 +343,4 @@ import BitkitToggle from "./components/BitkitToggle/BitkitToggle.js";
|
|
|
341
343
|
import BitkitToggleButton from "./components/BitkitToggleButton/BitkitToggleButton.js";
|
|
342
344
|
import bitkitTheme from "./theme/index.js";
|
|
343
345
|
import Provider from "./providers/BitkitProvider.js";
|
|
344
|
-
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitMarkdown, BitkitMarkdownCard, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOrderedList_default as BitkitOrderedList, BitkitOverflowTooltip, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextInput, BitkitToggle, BitkitToggleButton, BitkitTooltip, BitkitUnorderedList_default as BitkitUnorderedList, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast };
|
|
346
|
+
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitDraggableCard, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitMarkdown, BitkitMarkdownCard, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOrderedList_default as BitkitOrderedList, BitkitOverflowTooltip, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextInput, BitkitToggle, BitkitToggleButton, BitkitTooltip, BitkitUnorderedList_default as BitkitUnorderedList, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast };
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
declare const draggableCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
|
|
2
|
+
isDragging: {
|
|
3
|
+
true: {
|
|
4
|
+
root: {
|
|
5
|
+
borderColor: "border/strong";
|
|
6
|
+
boxShadow: "elevation/lg";
|
|
7
|
+
cursor: "grabbing";
|
|
8
|
+
};
|
|
9
|
+
handle: {
|
|
10
|
+
color: "icon/secondary";
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
isDropTarget: {
|
|
15
|
+
true: {
|
|
16
|
+
root: {
|
|
17
|
+
background: "background/secondary";
|
|
18
|
+
borderColor: "border/strong";
|
|
19
|
+
borderStyle: "dashed";
|
|
20
|
+
boxShadow: "none";
|
|
21
|
+
};
|
|
22
|
+
handle: {
|
|
23
|
+
visibility: "hidden";
|
|
24
|
+
};
|
|
25
|
+
content: {
|
|
26
|
+
visibility: "hidden";
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
isFullCardDrag: {
|
|
31
|
+
true: {
|
|
32
|
+
root: {
|
|
33
|
+
cursor: "grab";
|
|
34
|
+
_hover: {
|
|
35
|
+
borderColor: "border/regular";
|
|
36
|
+
_active: {
|
|
37
|
+
borderColor: "border/strong";
|
|
38
|
+
};
|
|
39
|
+
};
|
|
40
|
+
_active: {
|
|
41
|
+
borderColor: "border/strong";
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
handle: {
|
|
45
|
+
pointerEvents: "none";
|
|
46
|
+
};
|
|
47
|
+
content: {
|
|
48
|
+
paddingInlineStart: number;
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
false: {
|
|
52
|
+
root: {
|
|
53
|
+
_hover: {
|
|
54
|
+
borderColor: "border/regular";
|
|
55
|
+
};
|
|
56
|
+
};
|
|
57
|
+
handle: {
|
|
58
|
+
appearance: "none";
|
|
59
|
+
background: "transparent";
|
|
60
|
+
border: "none";
|
|
61
|
+
cursor: "grab";
|
|
62
|
+
focusVisibleRing: "none";
|
|
63
|
+
_focusVisible: {
|
|
64
|
+
boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
|
|
65
|
+
};
|
|
66
|
+
_hover: {
|
|
67
|
+
background: "background/hover";
|
|
68
|
+
color: "icon/secondary";
|
|
69
|
+
_active: {
|
|
70
|
+
background: "background/active";
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
_active: {
|
|
74
|
+
background: "background/active";
|
|
75
|
+
};
|
|
76
|
+
};
|
|
77
|
+
content: {
|
|
78
|
+
paddingInlineStart: "8";
|
|
79
|
+
};
|
|
80
|
+
};
|
|
81
|
+
};
|
|
82
|
+
}>;
|
|
83
|
+
export default draggableCardSlotRecipe;
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
2
|
+
//#region lib/theme/slot-recipes/DraggableCard.recipe.ts
|
|
3
|
+
var draggableCardSlotRecipe = defineSlotRecipe({
|
|
4
|
+
className: "draggable-card",
|
|
5
|
+
slots: [
|
|
6
|
+
"root",
|
|
7
|
+
"handle",
|
|
8
|
+
"content"
|
|
9
|
+
],
|
|
10
|
+
base: {
|
|
11
|
+
root: {
|
|
12
|
+
alignItems: "stretch",
|
|
13
|
+
backgroundColor: "background/primary",
|
|
14
|
+
border: "1px solid",
|
|
15
|
+
borderColor: "border/minimal",
|
|
16
|
+
borderRadius: "8",
|
|
17
|
+
boxShadow: "elevation/sm",
|
|
18
|
+
display: "flex",
|
|
19
|
+
overflow: "hidden"
|
|
20
|
+
},
|
|
21
|
+
handle: {
|
|
22
|
+
alignItems: "center",
|
|
23
|
+
color: "icon/tertiary",
|
|
24
|
+
display: "flex",
|
|
25
|
+
flexShrink: 0,
|
|
26
|
+
justifyContent: "center",
|
|
27
|
+
width: "24"
|
|
28
|
+
},
|
|
29
|
+
content: {
|
|
30
|
+
flex: 1,
|
|
31
|
+
minWidth: 0,
|
|
32
|
+
overflow: "hidden",
|
|
33
|
+
paddingBlock: "16",
|
|
34
|
+
paddingInlineEnd: "16"
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
variants: {
|
|
38
|
+
isDragging: { true: {
|
|
39
|
+
root: {
|
|
40
|
+
borderColor: "border/strong",
|
|
41
|
+
boxShadow: "elevation/lg",
|
|
42
|
+
cursor: "grabbing"
|
|
43
|
+
},
|
|
44
|
+
handle: { color: "icon/secondary" }
|
|
45
|
+
} },
|
|
46
|
+
isDropTarget: { true: {
|
|
47
|
+
root: {
|
|
48
|
+
background: "background/secondary",
|
|
49
|
+
borderColor: "border/strong",
|
|
50
|
+
borderStyle: "dashed",
|
|
51
|
+
boxShadow: "none"
|
|
52
|
+
},
|
|
53
|
+
handle: { visibility: "hidden" },
|
|
54
|
+
content: { visibility: "hidden" }
|
|
55
|
+
} },
|
|
56
|
+
isFullCardDrag: {
|
|
57
|
+
true: {
|
|
58
|
+
root: {
|
|
59
|
+
cursor: "grab",
|
|
60
|
+
_hover: {
|
|
61
|
+
borderColor: "border/regular",
|
|
62
|
+
_active: { borderColor: "border/strong" }
|
|
63
|
+
},
|
|
64
|
+
_active: { borderColor: "border/strong" }
|
|
65
|
+
},
|
|
66
|
+
handle: { pointerEvents: "none" },
|
|
67
|
+
content: { paddingInlineStart: 0 }
|
|
68
|
+
},
|
|
69
|
+
false: {
|
|
70
|
+
root: { _hover: { borderColor: "border/regular" } },
|
|
71
|
+
handle: {
|
|
72
|
+
appearance: "none",
|
|
73
|
+
background: "transparent",
|
|
74
|
+
border: "none",
|
|
75
|
+
cursor: "grab",
|
|
76
|
+
focusVisibleRing: "none",
|
|
77
|
+
_focusVisible: { boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)" },
|
|
78
|
+
_hover: {
|
|
79
|
+
background: "background/hover",
|
|
80
|
+
color: "icon/secondary",
|
|
81
|
+
_active: { background: "background/active" }
|
|
82
|
+
},
|
|
83
|
+
_active: { background: "background/active" }
|
|
84
|
+
},
|
|
85
|
+
content: { paddingInlineStart: "8" }
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
},
|
|
89
|
+
compoundVariants: [
|
|
90
|
+
{
|
|
91
|
+
isDragging: true,
|
|
92
|
+
isFullCardDrag: true,
|
|
93
|
+
css: { root: {
|
|
94
|
+
cursor: "grabbing",
|
|
95
|
+
_hover: { borderColor: "border/strong" }
|
|
96
|
+
} }
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
isDragging: true,
|
|
100
|
+
isFullCardDrag: false,
|
|
101
|
+
css: {
|
|
102
|
+
root: { _hover: { borderColor: "border/strong" } },
|
|
103
|
+
handle: {
|
|
104
|
+
background: "background/active",
|
|
105
|
+
cursor: "grabbing",
|
|
106
|
+
_hover: { background: "background/active" }
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
},
|
|
110
|
+
{
|
|
111
|
+
isDropTarget: true,
|
|
112
|
+
isFullCardDrag: true,
|
|
113
|
+
css: { root: {
|
|
114
|
+
cursor: "default",
|
|
115
|
+
_hover: { borderColor: "border/strong" }
|
|
116
|
+
} }
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
isDropTarget: true,
|
|
120
|
+
isFullCardDrag: false,
|
|
121
|
+
css: { root: { _hover: { borderColor: "border/strong" } } }
|
|
122
|
+
}
|
|
123
|
+
],
|
|
124
|
+
defaultVariants: {
|
|
125
|
+
isDragging: false,
|
|
126
|
+
isDropTarget: false,
|
|
127
|
+
isFullCardDrag: true
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
//#endregion
|
|
131
|
+
export { draggableCardSlotRecipe as default };
|
|
132
|
+
|
|
133
|
+
//# sourceMappingURL=DraggableCard.recipe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DraggableCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/DraggableCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst draggableCardSlotRecipe = defineSlotRecipe({\n className: 'draggable-card',\n slots: ['root', 'handle', 'content'],\n base: {\n root: {\n alignItems: 'stretch',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/minimal',\n borderRadius: '8',\n boxShadow: 'elevation/sm',\n display: 'flex',\n overflow: 'hidden',\n },\n handle: {\n alignItems: 'center',\n color: 'icon/tertiary',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n width: '24',\n },\n content: {\n flex: 1,\n minWidth: 0,\n overflow: 'hidden',\n paddingBlock: '16',\n paddingInlineEnd: '16',\n },\n },\n variants: {\n isDragging: {\n true: {\n root: {\n borderColor: 'border/strong',\n boxShadow: 'elevation/lg',\n cursor: 'grabbing',\n },\n handle: {\n color: 'icon/secondary',\n },\n },\n },\n isDropTarget: {\n true: {\n root: {\n background: 'background/secondary',\n borderColor: 'border/strong',\n borderStyle: 'dashed',\n boxShadow: 'none',\n },\n handle: {\n visibility: 'hidden',\n },\n content: {\n visibility: 'hidden',\n },\n },\n },\n isFullCardDrag: {\n true: {\n root: {\n cursor: 'grab',\n _hover: {\n borderColor: 'border/regular',\n _active: {\n borderColor: 'border/strong',\n },\n },\n _active: {\n borderColor: 'border/strong',\n },\n },\n handle: {\n pointerEvents: 'none',\n },\n content: {\n paddingInlineStart: 0,\n },\n },\n false: {\n root: {\n _hover: {\n borderColor: 'border/regular',\n },\n },\n handle: {\n appearance: 'none',\n background: 'transparent',\n border: 'none',\n cursor: 'grab',\n focusVisibleRing: 'none',\n _focusVisible: {\n boxShadow: 'inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)',\n },\n _hover: {\n background: 'background/hover',\n color: 'icon/secondary',\n _active: {\n background: 'background/active',\n },\n },\n _active: {\n background: 'background/active',\n },\n },\n content: {\n paddingInlineStart: '8',\n },\n },\n },\n },\n compoundVariants: [\n {\n isDragging: true,\n isFullCardDrag: true,\n css: {\n root: {\n cursor: 'grabbing',\n _hover: {\n borderColor: 'border/strong',\n },\n },\n },\n },\n {\n isDragging: true,\n isFullCardDrag: false,\n css: {\n root: {\n _hover: {\n borderColor: 'border/strong',\n },\n },\n handle: {\n background: 'background/active',\n cursor: 'grabbing',\n _hover: {\n background: 'background/active',\n },\n },\n },\n },\n {\n isDropTarget: true,\n isFullCardDrag: true,\n css: {\n root: {\n cursor: 'default',\n _hover: {\n borderColor: 'border/strong',\n },\n },\n },\n },\n {\n isDropTarget: true,\n isFullCardDrag: false,\n css: {\n root: {\n _hover: {\n borderColor: 'border/strong',\n },\n },\n },\n },\n ],\n defaultVariants: {\n isDragging: false,\n isDropTarget: false,\n isFullCardDrag: true,\n },\n});\n\nexport default draggableCardSlotRecipe;\n"],"mappings":";;AAEA,IAAM,0BAA0B,iBAAiB;CAC/C,WAAW;CACX,OAAO;EAAC;EAAQ;EAAU;EAAU;CACpC,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,cAAc;GACd,WAAW;GACX,SAAS;GACT,UAAU;GACX;EACD,QAAQ;GACN,YAAY;GACZ,OAAO;GACP,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACR;EACD,SAAS;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,cAAc;GACd,kBAAkB;GACnB;EACF;CACD,UAAU;EACR,YAAY,EACV,MAAM;GACJ,MAAM;IACJ,aAAa;IACb,WAAW;IACX,QAAQ;IACT;GACD,QAAQ,EACN,OAAO,kBACR;GACF,EACF;EACD,cAAc,EACZ,MAAM;GACJ,MAAM;IACJ,YAAY;IACZ,aAAa;IACb,aAAa;IACb,WAAW;IACZ;GACD,QAAQ,EACN,YAAY,UACb;GACD,SAAS,EACP,YAAY,UACb;GACF,EACF;EACD,gBAAgB;GACd,MAAM;IACJ,MAAM;KACJ,QAAQ;KACR,QAAQ;MACN,aAAa;MACb,SAAS,EACP,aAAa,iBACd;MACF;KACD,SAAS,EACP,aAAa,iBACd;KACF;IACD,QAAQ,EACN,eAAe,QAChB;IACD,SAAS,EACP,oBAAoB,GACrB;IACF;GACD,OAAO;IACL,MAAM,EACJ,QAAQ,EACN,aAAa,kBACd,EACF;IACD,QAAQ;KACN,YAAY;KACZ,YAAY;KACZ,QAAQ;KACR,QAAQ;KACR,kBAAkB;KAClB,eAAe,EACb,WAAW,+DACZ;KACD,QAAQ;MACN,YAAY;MACZ,OAAO;MACP,SAAS,EACP,YAAY,qBACb;MACF;KACD,SAAS,EACP,YAAY,qBACb;KACF;IACD,SAAS,EACP,oBAAoB,KACrB;IACF;GACF;EACF;CACD,kBAAkB;EAChB;GACE,YAAY;GACZ,gBAAgB;GAChB,KAAK,EACH,MAAM;IACJ,QAAQ;IACR,QAAQ,EACN,aAAa,iBACd;IACF,EACF;GACF;EACD;GACE,YAAY;GACZ,gBAAgB;GAChB,KAAK;IACH,MAAM,EACJ,QAAQ,EACN,aAAa,iBACd,EACF;IACD,QAAQ;KACN,YAAY;KACZ,QAAQ;KACR,QAAQ,EACN,YAAY,qBACb;KACF;IACF;GACF;EACD;GACE,cAAc;GACd,gBAAgB;GAChB,KAAK,EACH,MAAM;IACJ,QAAQ;IACR,QAAQ,EACN,aAAa,iBACd;IACF,EACF;GACF;EACD;GACE,cAAc;GACd,gBAAgB;GAChB,KAAK,EACH,MAAM,EACJ,QAAQ,EACN,aAAa,iBACd,EACF,EACF;GACF;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,cAAc;EACd,gBAAgB;EACjB;CACF,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const imageCropperSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "
|
|
1
|
+
declare const imageCropperSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
|
|
2
2
|
export default imageCropperSlotRecipe;
|
|
@@ -541,6 +541,88 @@ declare const slotRecipes: {
|
|
|
541
541
|
};
|
|
542
542
|
};
|
|
543
543
|
}>;
|
|
544
|
+
draggableCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
|
|
545
|
+
isDragging: {
|
|
546
|
+
true: {
|
|
547
|
+
root: {
|
|
548
|
+
borderColor: "border/strong";
|
|
549
|
+
boxShadow: "elevation/lg";
|
|
550
|
+
cursor: "grabbing";
|
|
551
|
+
};
|
|
552
|
+
handle: {
|
|
553
|
+
color: "icon/secondary";
|
|
554
|
+
};
|
|
555
|
+
};
|
|
556
|
+
};
|
|
557
|
+
isDropTarget: {
|
|
558
|
+
true: {
|
|
559
|
+
root: {
|
|
560
|
+
background: "background/secondary";
|
|
561
|
+
borderColor: "border/strong";
|
|
562
|
+
borderStyle: "dashed";
|
|
563
|
+
boxShadow: "none";
|
|
564
|
+
};
|
|
565
|
+
handle: {
|
|
566
|
+
visibility: "hidden";
|
|
567
|
+
};
|
|
568
|
+
content: {
|
|
569
|
+
visibility: "hidden";
|
|
570
|
+
};
|
|
571
|
+
};
|
|
572
|
+
};
|
|
573
|
+
isFullCardDrag: {
|
|
574
|
+
true: {
|
|
575
|
+
root: {
|
|
576
|
+
cursor: "grab";
|
|
577
|
+
_hover: {
|
|
578
|
+
borderColor: "border/regular";
|
|
579
|
+
_active: {
|
|
580
|
+
borderColor: "border/strong";
|
|
581
|
+
};
|
|
582
|
+
};
|
|
583
|
+
_active: {
|
|
584
|
+
borderColor: "border/strong";
|
|
585
|
+
};
|
|
586
|
+
};
|
|
587
|
+
handle: {
|
|
588
|
+
pointerEvents: "none";
|
|
589
|
+
};
|
|
590
|
+
content: {
|
|
591
|
+
paddingInlineStart: number;
|
|
592
|
+
};
|
|
593
|
+
};
|
|
594
|
+
false: {
|
|
595
|
+
root: {
|
|
596
|
+
_hover: {
|
|
597
|
+
borderColor: "border/regular";
|
|
598
|
+
};
|
|
599
|
+
};
|
|
600
|
+
handle: {
|
|
601
|
+
appearance: "none";
|
|
602
|
+
background: "transparent";
|
|
603
|
+
border: "none";
|
|
604
|
+
cursor: "grab";
|
|
605
|
+
focusVisibleRing: "none";
|
|
606
|
+
_focusVisible: {
|
|
607
|
+
boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
|
|
608
|
+
};
|
|
609
|
+
_hover: {
|
|
610
|
+
background: "background/hover";
|
|
611
|
+
color: "icon/secondary";
|
|
612
|
+
_active: {
|
|
613
|
+
background: "background/active";
|
|
614
|
+
};
|
|
615
|
+
};
|
|
616
|
+
_active: {
|
|
617
|
+
background: "background/active";
|
|
618
|
+
};
|
|
619
|
+
};
|
|
620
|
+
content: {
|
|
621
|
+
paddingInlineStart: "8";
|
|
622
|
+
};
|
|
623
|
+
};
|
|
624
|
+
};
|
|
625
|
+
}>;
|
|
544
626
|
emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
|
|
545
627
|
colorScheme: {
|
|
546
628
|
white: {
|
|
@@ -590,7 +672,7 @@ declare const slotRecipes: {
|
|
|
590
672
|
};
|
|
591
673
|
};
|
|
592
674
|
}>;
|
|
593
|
-
imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "
|
|
675
|
+
imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
|
|
594
676
|
inlineLoading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root", {
|
|
595
677
|
size: {
|
|
596
678
|
sm: {
|
|
@@ -13,6 +13,7 @@ import datePickerSlotRecipe from "./DatePicker.recipe.js";
|
|
|
13
13
|
import { selectSlotRecipe } from "./Select.recipe.js";
|
|
14
14
|
import datePickerSelectSlotRecipe from "./DatePickerSelect.recipe.js";
|
|
15
15
|
import dialogSlotRecipe from "./Dialog.recipe.js";
|
|
16
|
+
import draggableCardSlotRecipe from "./DraggableCard.recipe.js";
|
|
16
17
|
import emptyStateSlotRecipe from "./EmptyState.recipe.js";
|
|
17
18
|
import expandableCardSlotRecipe from "./ExpandableCard.recipe.js";
|
|
18
19
|
import fieldSlotRecipe from "./Field.recipe.js";
|
|
@@ -57,6 +58,7 @@ var slotRecipes = {
|
|
|
57
58
|
datePicker: datePickerSlotRecipe,
|
|
58
59
|
datePickerSelect: datePickerSelectSlotRecipe,
|
|
59
60
|
dialog: dialogSlotRecipe,
|
|
61
|
+
draggableCard: draggableCardSlotRecipe,
|
|
60
62
|
emptyState: emptyStateSlotRecipe,
|
|
61
63
|
expandableCard: expandableCardSlotRecipe,
|
|
62
64
|
field: fieldSlotRecipe,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n draggableCard: draggableCardSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,UAAU;CACV,cAAc;CACd,aAAa;CACb,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,aAAa;CACb,MAAM;CACN,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,OAAO;CACP,SAAS;CACV"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bitrise/bitkit-v2",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.3.
|
|
4
|
+
"version": "0.3.189",
|
|
5
5
|
"description": "Bitrise Design System Components built with Chakra UI V3",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"react",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@figma-export/transform-svg-with-svgo": "^6.4.0",
|
|
62
62
|
"@google-cloud/storage": "^7.19.0",
|
|
63
63
|
"@storybook/addon-docs": "10.3.5",
|
|
64
|
-
"@storybook/addon-mcp": "^0.
|
|
64
|
+
"@storybook/addon-mcp": "^0.6.0",
|
|
65
65
|
"@storybook/react-vite": "10.3.5",
|
|
66
66
|
"@svgr/plugin-jsx": "^8.1.0",
|
|
67
67
|
"@types/node": "^25.6.0",
|