@douglasneuroinformatics/libui 6.1.2 → 6.2.0

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.
Files changed (39) hide show
  1. package/dist/components/DataTable/DataTable.d.ts +1 -1
  2. package/dist/components/DataTable/DataTable.d.ts.map +1 -1
  3. package/dist/components/DataTable/DataTable.js +2 -2
  4. package/dist/components/DataTable/DataTable.js.map +1 -1
  5. package/dist/components/DataTable/DataTableBody.d.ts +1 -1
  6. package/dist/components/DataTable/DataTableBody.d.ts.map +1 -1
  7. package/dist/components/DataTable/DataTableBody.js +2 -2
  8. package/dist/components/DataTable/DataTableBody.js.map +1 -1
  9. package/dist/components/DataTable/DataTableContent.d.ts +1 -1
  10. package/dist/components/DataTable/DataTableContent.d.ts.map +1 -1
  11. package/dist/components/DataTable/DataTableContent.js +2 -2
  12. package/dist/components/DataTable/DataTableContent.js.map +1 -1
  13. package/dist/components/DataTable/types.d.ts +1 -0
  14. package/dist/components/DataTable/types.d.ts.map +1 -1
  15. package/dist/components/Form/BaseRadioField.d.ts +1 -2
  16. package/dist/components/Form/BaseRadioField.d.ts.map +1 -1
  17. package/dist/components/Form/BaseRadioField.js +2 -15
  18. package/dist/components/Form/BaseRadioField.js.map +1 -1
  19. package/dist/components/Form/NumberField/NumberFieldRadio.d.ts.map +1 -1
  20. package/dist/components/Form/NumberField/NumberFieldRadio.js +20 -4
  21. package/dist/components/Form/NumberField/NumberFieldRadio.js.map +1 -1
  22. package/dist/components/RadioGroup/RadioGroup.d.ts +4 -4
  23. package/dist/components/RadioGroup/RadioGroup.d.ts.map +1 -1
  24. package/dist/components/RadioGroup/RadioGroup.js +4 -4
  25. package/dist/components/RadioGroup/RadioGroup.js.map +1 -1
  26. package/dist/components/RadioGroup/RadioGroupItem.d.ts +2 -2
  27. package/dist/components/RadioGroup/RadioGroupItem.d.ts.map +1 -1
  28. package/dist/components/RadioGroup/RadioGroupItem.js +4 -5
  29. package/dist/components/RadioGroup/RadioGroupItem.js.map +1 -1
  30. package/package.json +1 -1
  31. package/src/components/DataTable/DataTable.stories.tsx +10 -1
  32. package/src/components/DataTable/DataTable.tsx +2 -0
  33. package/src/components/DataTable/DataTableBody.tsx +4 -4
  34. package/src/components/DataTable/DataTableContent.tsx +6 -1
  35. package/src/components/DataTable/types.ts +1 -0
  36. package/src/components/Form/BaseRadioField.tsx +1 -22
  37. package/src/components/Form/NumberField/NumberFieldRadio.tsx +29 -10
  38. package/src/components/RadioGroup/RadioGroup.tsx +5 -10
  39. package/src/components/RadioGroup/RadioGroupItem.tsx +7 -13
@@ -1,5 +1,5 @@
1
1
  import type { RowData } from '@tanstack/table-core';
2
2
  import type { DataTableProps } from './types.ts';
3
- export declare const DataTable: <T extends RowData>({ emptyStateProps, onRowClick, onSearchChange, togglesComponent, ...props }: DataTableProps<T>) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const DataTable: <T extends RowData>({ emptyStateProps, onRowClick, onRowDoubleClick, onSearchChange, togglesComponent, ...props }: DataTableProps<T>) => import("react/jsx-runtime").JSX.Element;
4
4
  export * as TanstackTable from '@tanstack/table-core';
5
5
  //# sourceMappingURL=DataTable.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAMpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEjD,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,OAAO,EAAE,6EAM1C,cAAc,CAAC,CAAC,CAAC,4CAkBnB,CAAC;AAEF,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC"}
1
+ {"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAMpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEjD,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,OAAO,EAAE,+FAO1C,cAAc,CAAC,CAAC,CAAC,4CAmBnB,CAAC;AAEF,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC"}
@@ -3,13 +3,13 @@ import { useEffect, useRef } from 'react';
3
3
  import { DataTableContext } from "./context.js";
4
4
  import { DataTableContent } from "./DataTableContent.js";
5
5
  import { createDataTableStore } from "./store.js";
6
- export const DataTable = ({ emptyStateProps, onRowClick, onSearchChange, togglesComponent, ...props }) => {
6
+ export const DataTable = ({ emptyStateProps, onRowClick, onRowDoubleClick, onSearchChange, togglesComponent, ...props }) => {
7
7
  const storeRef = useRef(createDataTableStore(props));
8
8
  useEffect(() => {
9
9
  const { reset } = storeRef.current.getState();
10
10
  reset(props);
11
11
  }, [props]);
12
- return (_jsx(DataTableContext.Provider, { value: { store: storeRef.current }, children: _jsx(DataTableContent, { emptyStateProps: emptyStateProps, togglesComponent: togglesComponent, onRowClick: onRowClick, onSearchChange: onSearchChange }) }));
12
+ return (_jsx(DataTableContext.Provider, { value: { store: storeRef.current }, children: _jsx(DataTableContent, { emptyStateProps: emptyStateProps, togglesComponent: togglesComponent, onRowClick: onRowClick, onRowDoubleClick: onRowDoubleClick, onSearchChange: onSearchChange }) }));
13
13
  };
14
14
  export * as TanstackTable from '@tanstack/table-core';
15
15
  //# sourceMappingURL=DataTable.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAwB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAIlD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAoB,EAC3C,eAAe,EACf,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,GAAG,KAAK,EACU,EAAE,EAAE;IACtB,MAAM,QAAQ,GAAG,MAAM,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;QAC9C,KAAK,CAAC,KAAK,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,OAAO,EAAE,YAC3D,KAAC,gBAAgB,IACf,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,GAC9B,GACwB,CAC7B,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC"}
1
+ {"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAwB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAIlD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAoB,EAC3C,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,GAAG,KAAK,EACU,EAAE,EAAE;IACtB,MAAM,QAAQ,GAAG,MAAM,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAC;IAErD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;QAC9C,KAAK,CAAC,KAAK,CAAC,CAAC;IACf,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,OAAO,EAAE,YAC3D,KAAC,gBAAgB,IACf,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,GAC9B,GACwB,CAC7B,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC"}
@@ -1,4 +1,4 @@
1
1
  import type React from 'react';
2
2
  import type { DataTableContentProps } from './types.ts';
3
- export declare const DataTableBody: React.FC<Pick<DataTableContentProps<any>, 'emptyStateProps' | 'onRowClick'>>;
3
+ export declare const DataTableBody: React.FC<Pick<DataTableContentProps<any>, 'emptyStateProps' | 'onRowClick' | 'onRowDoubleClick'>>;
4
4
  //# sourceMappingURL=DataTableBody.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DataTableBody.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAExD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG,CAAC,EAAE,iBAAiB,GAAG,YAAY,CAAC,CAgEtG,CAAC"}
1
+ {"version":3,"file":"DataTableBody.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAExD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAClC,IAAI,CAAC,qBAAqB,CAAC,GAAG,CAAC,EAAE,iBAAiB,GAAG,YAAY,GAAG,kBAAkB,CAAC,CA+DxF,CAAC"}
@@ -4,7 +4,7 @@ import { cn } from '#utils';
4
4
  import { DataTableEmptyState } from "./DataTableEmptyState.js";
5
5
  import { useDataTableHandle } from "./hooks.js";
6
6
  import { flexRender } from "./utils.js";
7
- export const DataTableBody = ({ emptyStateProps, onRowClick }) => {
7
+ export const DataTableBody = ({ emptyStateProps, onRowClick, onRowDoubleClick }) => {
8
8
  const rows = useDataTableHandle('rows');
9
9
  const { t } = useTranslation();
10
10
  return (_jsx("div", { className: "flex flex-col", "data-testid": "data-table-body", children: rows.length === 0 ? (_jsx("div", { className: "sticky left-0 flex h-72 items-center justify-center px-6 py-3", style: {
@@ -14,7 +14,7 @@ export const DataTableBody = ({ emptyStateProps, onRowClick }) => {
14
14
  fr: 'Aucun résultat'
15
15
  }), ...emptyStateProps }) })) : (rows.map((row) => (
16
16
  // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
17
- _jsx("div", { className: cn('bg-background flex border-b last:border-b-0', onRowClick && 'hover:bg-accent'), "data-testid": "data-table-row", id: row.id, onClick: onRowClick ? () => void onRowClick(row.original) : undefined, children: row.getVisibleCells().map((cell) => {
17
+ _jsx("div", { className: cn('bg-background flex border-b last:border-b-0', onRowClick && 'hover:bg-accent'), "data-testid": "data-table-row", id: row.id, onClick: onRowClick ? () => void onRowClick(row.original) : undefined, onDoubleClick: onRowDoubleClick ? () => void onRowDoubleClick(row.original) : undefined, children: row.getVisibleCells().map((cell) => {
18
18
  const style = {
19
19
  width: `calc(var(--col-${cell.column.id}-size) * 1px)`
20
20
  };
@@ -1 +1 @@
1
- {"version":3,"file":"DataTableBody.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableBody.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DataTableBody.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableBody.tsx"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
1
  import type { RowData } from '@tanstack/table-core';
2
2
  import type { DataTableContentProps } from './types.ts';
3
- export declare const DataTableContent: <T extends RowData>({ emptyStateProps, onRowClick, onSearchChange, togglesComponent }: DataTableContentProps<T>) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const DataTableContent: <T extends RowData>({ emptyStateProps, onRowClick, onRowDoubleClick, onSearchChange, togglesComponent }: DataTableContentProps<T>) => import("react/jsx-runtime").JSX.Element;
4
4
  //# sourceMappingURL=DataTableContent.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DataTableContent.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AASpD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAExD,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,OAAO,EAAE,mEAKjD,qBAAqB,CAAC,CAAC,CAAC,4CAoB1B,CAAC"}
1
+ {"version":3,"file":"DataTableContent.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AASpD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAExD,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,OAAO,EAAE,qFAMjD,qBAAqB,CAAC,CAAC,CAAC,4CAwB1B,CAAC"}
@@ -5,10 +5,10 @@ import { DataTableControls } from "./DataTableControls.js";
5
5
  import { DataTableHead } from "./DataTableHead.js";
6
6
  import { DataTablePagination } from "./DataTablePagination.js";
7
7
  import { useContainerRef, useDataTableHandle, useDataTableStore } from "./hooks.js";
8
- export const DataTableContent = ({ emptyStateProps, onRowClick, onSearchChange, togglesComponent }) => {
8
+ export const DataTableContent = ({ emptyStateProps, onRowClick, onRowDoubleClick, onSearchChange, togglesComponent }) => {
9
9
  const containerRef = useContainerRef();
10
10
  const meta = useDataTableHandle('tableMeta');
11
11
  const style = useDataTableStore((state) => state.style);
12
- return (_jsxs("div", { className: "bg-background flex w-full flex-col", "data-name": meta[TABLE_NAME_METADATA_KEY], "data-testid": "data-table", children: [_jsx(DataTableControls, { togglesComponent: togglesComponent, onSearchChange: onSearchChange }), _jsx("div", { className: "relative w-full overflow-auto rounded-md border", ref: containerRef, children: _jsxs("div", { className: "flex min-w-full flex-col text-sm tracking-tight", style: style, children: [_jsx(DataTableHead, {}), _jsx(DataTableBody, { emptyStateProps: emptyStateProps, onRowClick: onRowClick })] }) }), _jsx(DataTablePagination, {})] }));
12
+ return (_jsxs("div", { className: "bg-background flex w-full flex-col", "data-name": meta[TABLE_NAME_METADATA_KEY], "data-testid": "data-table", children: [_jsx(DataTableControls, { togglesComponent: togglesComponent, onSearchChange: onSearchChange }), _jsx("div", { className: "relative w-full overflow-auto rounded-md border", ref: containerRef, children: _jsxs("div", { className: "flex min-w-full flex-col text-sm tracking-tight", style: style, children: [_jsx(DataTableHead, {}), _jsx(DataTableBody, { emptyStateProps: emptyStateProps, onRowClick: onRowClick, onRowDoubleClick: onRowDoubleClick })] }) }), _jsx(DataTablePagination, {})] }));
13
13
  };
14
14
  //# sourceMappingURL=DataTableContent.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DataTableContent.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableContent.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAqB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAyB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAqB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA2B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAIpF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAoB,EAClD,eAAe,EACf,UAAU,EACV,cAAc,EACd,gBAAgB,EACS,EAAE,EAAE;IAC7B,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,IAAI,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC7C,MAAM,KAAK,GAAG,iBAAiB,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxD,OAAO,CACL,eACE,SAAS,EAAC,oCAAoC,eACnC,IAAI,CAAC,uBAAuB,CAAC,iBAC5B,YAAY,aAExB,KAAC,iBAAiB,IAAC,gBAAgB,EAAE,gBAAgB,EAAE,cAAc,EAAE,cAAc,GAAI,EACzF,cAAK,SAAS,EAAC,iDAAiD,EAAC,GAAG,EAAE,YAAY,YAChF,eAAK,SAAS,EAAC,iDAAiD,EAAC,KAAK,EAAE,KAAK,aAC3E,KAAC,aAAa,KAAG,EACjB,KAAC,aAAa,IAAC,eAAe,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,GAAI,IACvE,GACF,EACN,KAAC,mBAAmB,KAAG,IACnB,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"DataTableContent.js","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableContent.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAqB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAyB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAqB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA2B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAIpF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAoB,EAClD,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EACS,EAAE,EAAE;IAC7B,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,IAAI,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC7C,MAAM,KAAK,GAAG,iBAAiB,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxD,OAAO,CACL,eACE,SAAS,EAAC,oCAAoC,eACnC,IAAI,CAAC,uBAAuB,CAAC,iBAC5B,YAAY,aAExB,KAAC,iBAAiB,IAAC,gBAAgB,EAAE,gBAAgB,EAAE,cAAc,EAAE,cAAc,GAAI,EACzF,cAAK,SAAS,EAAC,iDAAiD,EAAC,GAAG,EAAE,YAAY,YAChF,eAAK,SAAS,EAAC,iDAAiD,EAAC,KAAK,EAAE,KAAK,aAC3E,KAAC,aAAa,KAAG,EACjB,KAAC,aAAa,IACZ,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,GAClC,IACE,GACF,EACN,KAAC,mBAAmB,KAAG,IACnB,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -33,6 +33,7 @@ export type DataTableProps<T extends RowData> = DataTableContentProps<T> & DataT
33
33
  export type DataTableContentProps<T extends RowData> = {
34
34
  emptyStateProps?: Partial<DataTableEmptyStateProps>;
35
35
  onRowClick?: (row: T) => Promisable<void>;
36
+ onRowDoubleClick?: (row: T) => Promisable<void>;
36
37
  onSearchChange?: SearchChangeHandler<NoInfer<T>>;
37
38
  togglesComponent?: React.FC<{
38
39
  table: Table<T>;
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/types.ts"],"names":[],"mappings":"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"}
@@ -7,7 +7,6 @@ export type BaseRadioFieldProps<T extends string> = Simplify<BaseFieldComponentP
7
7
  options: {
8
8
  [K in T]: string;
9
9
  };
10
- orientation?: 'horizontal' | 'vertical';
11
10
  }>;
12
- export declare const BaseRadioField: <T extends string>({ description, disabled, error, label, name, options, orientation, readOnly, setValue, value }: BaseRadioFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
11
+ export declare const BaseRadioField: <T extends string>({ description, disabled, error, label, name, options, readOnly, setValue, value }: BaseRadioFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
13
12
  //# sourceMappingURL=BaseRadioField.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BaseRadioField.d.ts","sourceRoot":"","sources":["../../../src/components/Form/BaseRadioField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAM1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAc1D,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI,QAAQ,CAC1D,uBAAuB,CAAC,CAAC,CAAC,GAAG;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE;SAAG,CAAC,IAAI,CAAC,GAAG,MAAM;KAAE,CAAC;IAC9B,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACzC,CACF,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,EAAE,gGAW9C,mBAAmB,CAAC,CAAC,CAAC,4CA8BxB,CAAC"}
1
+ {"version":3,"file":"BaseRadioField.d.ts","sourceRoot":"","sources":["../../../src/components/Form/BaseRadioField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAM1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAE1D,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI,QAAQ,CAC1D,uBAAuB,CAAC,CAAC,CAAC,GAAG;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE;SAAG,CAAC,IAAI,CAAC,GAAG,MAAM;KAAE,CAAC;CAC/B,CACF,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,MAAM,EAAE,mFAU9C,mBAAmB,CAAC,CAAC,CAAC,4CAwBxB,CAAC"}
@@ -1,21 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { cva } from 'class-variance-authority';
3
2
  import { Label } from "../Label/Label.js";
4
3
  import { RadioGroup } from "../RadioGroup/RadioGroup.js";
5
4
  import { FieldGroup } from "./FieldGroup/FieldGroup.js";
6
- const baseRadioFieldVariants = cva('flex', {
7
- defaultVariants: {
8
- orientation: 'vertical'
9
- },
10
- variants: {
11
- orientation: {
12
- horizontal: 'flex-col @3xl:flex-row @3xl:items-center @3xl:justify-between',
13
- vertical: 'flex-col'
14
- }
15
- }
16
- });
17
- export const BaseRadioField = ({ description, disabled, error, label, name, options, orientation = 'vertical', readOnly, setValue, value }) => {
18
- const optionsCount = Object.keys(options).length;
19
- return (_jsxs(FieldGroup, { name: name, children: [_jsxs(FieldGroup.Row, { children: [_jsx(Label, { children: label }), _jsx(FieldGroup.Description, { description: description })] }), _jsx(RadioGroup, { className: baseRadioFieldVariants({ orientation: optionsCount > 5 ? 'vertical' : orientation }), name: name, value: value ?? '', onValueChange: (value) => setValue(value), children: Object.keys(options).map((option) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(RadioGroup.Item, { disabled: disabled || readOnly, id: `${name}-${option}`, value: option }), _jsx(Label, { "aria-disabled": disabled || readOnly, className: "text-muted-foreground font-normal", htmlFor: `${name}-${option}`, children: options[option] })] }, option))) }), _jsx(FieldGroup.Error, { error: error })] }));
5
+ export const BaseRadioField = ({ description, disabled, error, label, name, options, readOnly, setValue, value }) => {
6
+ return (_jsxs(FieldGroup, { name: name, children: [_jsxs(FieldGroup.Row, { children: [_jsx(Label, { children: label }), _jsx(FieldGroup.Description, { description: description })] }), _jsx(RadioGroup, { name: name, value: value ?? '', onValueChange: (value) => setValue(value), children: Object.keys(options).map((option) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(RadioGroup.Item, { disabled: disabled || readOnly, id: `${name}-${option}`, value: option }), _jsx(Label, { "aria-disabled": disabled || readOnly, className: "text-muted-foreground font-normal", htmlFor: `${name}-${option}`, children: options[option] })] }, option))) }), _jsx(FieldGroup.Error, { error: error })] }));
20
7
  };
21
8
  //# sourceMappingURL=BaseRadioField.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"BaseRadioField.js","sourceRoot":"","sources":["../../../src/components/Form/BaseRadioField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAG/C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAoB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA8B,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA6B,CAAC;AAIzD,MAAM,sBAAsB,GAAG,GAAG,CAAC,MAAM,EAAE;IACzC,eAAe,EAAE;QACf,WAAW,EAAE,UAAU;KACxB;IACD,QAAQ,EAAE;QACR,WAAW,EAAE;YACX,UAAU,EAAE,+DAA+D;YAC3E,QAAQ,EAAE,UAAU;SACrB;KACF;CACF,CAAC,CAAC;AAYH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAmB,EAC/C,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,WAAW,GAAG,UAAU,EACxB,QAAQ,EACR,QAAQ,EACR,KAAK,EACkB,EAAE,EAAE;IAC3B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC;IACjD,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,IAAI,aACpB,MAAC,UAAU,CAAC,GAAG,eACb,KAAC,KAAK,cAAE,KAAK,GAAS,EACtB,KAAC,UAAU,CAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI,IACrC,EACjB,KAAC,UAAU,IACT,SAAS,EAAE,sBAAsB,CAAC,EAAE,WAAW,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,EAC/F,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,IAAI,EAAE,EAClB,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAU,CAAC,YAE7C,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACpC,eAAK,SAAS,EAAC,yBAAyB,aACtC,KAAC,UAAU,CAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,IAAI,QAAQ,EAAE,EAAE,EAAE,GAAG,IAAI,IAAI,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,GAAI,EAC3F,KAAC,KAAK,qBACW,QAAQ,IAAI,QAAQ,EACnC,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,GAAG,IAAI,IAAI,MAAM,EAAE,YAE3B,OAAO,CAAC,MAAW,CAAC,GACf,KARoC,MAAM,CAS9C,CACP,CAAC,GACS,EACb,KAAC,UAAU,CAAC,KAAK,IAAC,KAAK,EAAE,KAAK,GAAI,IACvB,CACd,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"BaseRadioField.js","sourceRoot":"","sources":["../../../src/components/Form/BaseRadioField.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAoB,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA8B,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA6B,CAAC;AAazD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAmB,EAC/C,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,KAAK,EACkB,EAAE,EAAE;IAC3B,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,IAAI,aACpB,MAAC,UAAU,CAAC,GAAG,eACb,KAAC,KAAK,cAAE,KAAK,GAAS,EACtB,KAAC,UAAU,CAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI,IACrC,EACjB,KAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,EAAE,EAAE,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAU,CAAC,YACvF,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACpC,eAAK,SAAS,EAAC,yBAAyB,aACtC,KAAC,UAAU,CAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,IAAI,QAAQ,EAAE,EAAE,EAAE,GAAG,IAAI,IAAI,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,GAAI,EAC3F,KAAC,KAAK,qBACW,QAAQ,IAAI,QAAQ,EACnC,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,GAAG,IAAI,IAAI,MAAM,EAAE,YAE3B,OAAO,CAAC,MAAW,CAAC,GACf,KARoC,MAAM,CAS9C,CACP,CAAC,GACS,EACb,KAAC,UAAU,CAAC,KAAK,IAAC,KAAK,EAAE,KAAK,GAAI,IACvB,CACd,CAAC;AACJ,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"NumberFieldRadio.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/NumberField/NumberFieldRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAO1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,QAAQ,CAC1C,uBAAuB,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC,eAAe,EAAE;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAChF,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,sGAW9B,qBAAqB,4CAwCvB,CAAC"}
1
+ {"version":3,"file":"NumberFieldRadio.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/NumberField/NumberFieldRadio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAM1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAE3D,MAAM,MAAM,qBAAqB,GAAG,QAAQ,CAC1C,uBAAuB,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC,eAAe,EAAE;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAChF,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,sGAW9B,qBAAqB,4CA0DvB,CAAC"}
@@ -1,15 +1,31 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useEffect, useRef, useState } from 'react';
2
3
  import { Label, RadioGroup } from '#components';
3
- import { cn } from '#utils';
4
4
  import { FieldGroup } from "../FieldGroup/FieldGroup.js";
5
5
  export const NumberFieldRadio = ({ description, disableAutoPrefix, disabled, error, label, name, options, readOnly, setValue, value }) => {
6
+ const radioGroupRef = useRef(null);
7
+ const [isColumnLayout, setIsColumnLayout] = useState(false);
6
8
  const optionsCount = Object.keys(options).length;
7
- return (_jsxs(FieldGroup, { name: name, children: [_jsxs(FieldGroup.Row, { children: [_jsx(Label, { children: label }), _jsx(FieldGroup.Description, { description: description })] }), _jsx(RadioGroup, { className: cn('flex', optionsCount > 5 ? 'flex-col' : 'flex-col @3xl:flex-row @3xl:items-center @3xl:justify-between'), name: name, value: value?.toString() ?? '', onValueChange: (value) => setValue(parseInt(value)), children: Object.keys(options)
9
+ useEffect(() => {
10
+ const observer = new ResizeObserver(([entry]) => {
11
+ const { width: rootWidth } = entry.target.getBoundingClientRect();
12
+ const children = Array.from(entry.target.children);
13
+ const totalChildWidth = children.reduce((sum, child) => sum + child.scrollWidth, 0);
14
+ const isOverflowing = totalChildWidth > rootWidth - children.length * 24; // to additional provide spacing between items
15
+ setIsColumnLayout(isOverflowing);
16
+ });
17
+ if (radioGroupRef.current) {
18
+ observer.observe(radioGroupRef.current);
19
+ }
20
+ return () => observer.disconnect();
21
+ }, []);
22
+ return (_jsxs(FieldGroup, { name: name, children: [_jsxs(FieldGroup.Row, { children: [_jsx(Label, { children: label }), _jsx(FieldGroup.Description, { description: description })] }), _jsx(RadioGroup, { className: "grid justify-between", name: name, ref: radioGroupRef, style: {
23
+ gridTemplateColumns: isColumnLayout ? 'repeat(1, 1fr)' : `repeat(${optionsCount}, auto)`
24
+ }, value: value?.toString() ?? '', onValueChange: (value) => setValue(parseInt(value, 10)), children: Object.keys(options)
8
25
  .map((val) => parseInt(val))
9
26
  .toSorted((a, b) => a - b)
10
27
  .map((val) => {
11
- const text = (disableAutoPrefix ? '' : `${val} - `) + options[val];
12
- return (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(RadioGroup.Item, { disabled: disabled || readOnly, id: `${name}-${val}`, value: val.toString() }), _jsx(Label, { "aria-disabled": disabled || readOnly, className: "text-muted-foreground font-normal", htmlFor: `${name}-${val}`, children: text })] }, val));
28
+ return (_jsxs("div", { className: "flex w-fit items-center gap-2", children: [_jsx(RadioGroup.Item, { disabled: disabled || readOnly, id: `${name}-${val}`, value: val.toString() }), _jsxs(Label, { "aria-disabled": disabled || readOnly, className: "text-muted-foreground flex items-center font-normal", htmlFor: `${name}-${val}`, children: [!disableAutoPrefix && _jsxs("span", { className: "whitespace-nowrap", children: [val, "\u00A0-\u00A0"] }), _jsx("span", { children: options[val] })] })] }, val));
13
29
  }) }), _jsx(FieldGroup.Error, { error: error })] }));
14
30
  };
15
31
  //# sourceMappingURL=NumberFieldRadio.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"NumberFieldRadio.js","sourceRoot":"","sources":["../../../../src/components/Form/NumberField/NumberFieldRadio.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA8B,CAAC;AAQ1D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,KAAK,EACiB,EAAE,EAAE;IAC1B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC;IAEjD,OAAO,CACL,MAAC,UAAU,IAAC,IAAI,EAAE,IAAI,aACpB,MAAC,UAAU,CAAC,GAAG,eACb,KAAC,KAAK,cAAE,KAAK,GAAS,EACtB,KAAC,UAAU,CAAC,WAAW,IAAC,WAAW,EAAE,WAAW,GAAI,IACrC,EACjB,KAAC,UAAU,IACT,SAAS,EAAE,EAAE,CACX,MAAM,EACN,YAAY,GAAG,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,+DAA+D,CAChG,EACD,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,EAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,YAElD,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC;qBAClB,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;qBAC3B,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;qBACzB,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;oBACX,MAAM,IAAI,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,GAAG,KAAK,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;oBACnE,OAAO,CACL,eAAK,SAAS,EAAC,yBAAyB,aACtC,KAAC,UAAU,CAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,IAAI,QAAQ,EAAE,EAAE,EAAE,GAAG,IAAI,IAAI,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,QAAQ,EAAE,GAAI,EAChG,KAAC,KAAK,qBACW,QAAQ,IAAI,QAAQ,EACnC,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,GAAG,IAAI,IAAI,GAAG,EAAE,YAExB,IAAI,GACC,KARoC,GAAG,CAS3C,CACP,CAAC;gBACJ,CAAC,CAAC,GACO,EACb,KAAC,UAAU,CAAC,KAAK,IAAC,KAAK,EAAE,KAAK,GAAI,IACvB,CACd,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"NumberFieldRadio.js","sourceRoot":"","sources":["../../../../src/components/Form/NumberField/NumberFieldRadio.tsx"],"names":[],"mappings":"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"}
@@ -1,8 +1,8 @@
1
1
  import * as React from 'react';
2
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
3
- type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>;
4
- export declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>> & {
5
- Item: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
2
+ import { Root } from '@radix-ui/react-radio-group';
3
+ type RadioGroupProps = React.ComponentProps<typeof Root>;
4
+ export declare const RadioGroup: React.FC<import("@radix-ui/react-radio-group").RadioGroupProps & React.RefAttributes<HTMLDivElement>> & {
5
+ Item: React.FC<import("@radix-ui/react-radio-group").RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
6
6
  };
7
7
  export type { RadioGroupProps };
8
8
  //# sourceMappingURL=RadioGroup.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAMnE,KAAK,eAAe,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAC;AAWvF,eAAO,MAAM,UAAU;;CAErB,CAAC;AAEH,YAAY,EAAE,eAAe,EAAE,CAAC"}
1
+ {"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAMnD,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAMzD,eAAO,MAAM,UAAU;;CAErB,CAAC;AAEH,YAAY,EAAE,eAAe,EAAE,CAAC"}
@@ -1,11 +1,11 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import * as React from 'react';
3
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
3
+ import { Root } from '@radix-ui/react-radio-group';
4
4
  import { cn } from '#utils';
5
5
  import { RadioGroupItem } from "./RadioGroupItem.js";
6
- const RadioGroupRoot = React.forwardRef(function RadioGroup({ className, ...props }, ref) {
7
- return (_jsx(RadioGroupPrimitive.Root, { className: cn('grid gap-2', className), "data-testid": "radio-group", ...props, ref: ref }));
8
- });
6
+ const RadioGroupRoot = ({ className, ...props }) => {
7
+ return _jsx(Root, { className: cn('grid gap-2', className), "data-testid": "radio-group", ...props });
8
+ };
9
9
  export const RadioGroup = Object.assign(RadioGroupRoot, {
10
10
  Item: RadioGroupItem
11
11
  });
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAEnE,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAsB,CAAC;AAItD,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAGrC,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IAChD,OAAO,CACL,KAAC,mBAAmB,CAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,iBAAc,aAAa,KAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,CACpH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE;IACtD,IAAI,EAAE,cAAc;CACrB,CAAC,CAAC"}
1
+ {"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAEnD,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAsB,CAAC;AAItD,MAAM,cAAc,GAA8B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC5E,OAAO,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,iBAAc,aAAa,KAAK,KAAK,GAAI,CAAC;AAC/F,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE;IACtD,IAAI,EAAE,cAAc;CACrB,CAAC,CAAC"}
@@ -1,3 +1,3 @@
1
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
2
- export declare const RadioGroupItem: import("react").ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
1
+ import { Item } from '@radix-ui/react-radio-group';
2
+ export declare const RadioGroupItem: React.FC<React.ComponentProps<typeof Item>>;
3
3
  //# sourceMappingURL=RadioGroupItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroupItem.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupItem.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAKnE,eAAO,MAAM,cAAc,uMAqBzB,CAAC"}
1
+ {"version":3,"file":"RadioGroupItem.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAK9D,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAiBtE,CAAC"}
@@ -1,9 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { forwardRef } from 'react';
3
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
2
+ import { Indicator, Item } from '@radix-ui/react-radio-group';
4
3
  import { CircleIcon } from 'lucide-react';
5
4
  import { cn } from '#utils';
6
- export const RadioGroupItem = forwardRef(function RadioGroupItem({ className, ...props }, ref) {
7
- return (_jsx(RadioGroupPrimitive.Item, { className: cn('border-primary text-primary focus-visible:ring-ring flex aspect-square h-4 w-4 items-center justify-center rounded-full border shadow-sm focus:outline-hidden focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50', className), ref: ref, ...props, children: _jsx(RadioGroupPrimitive.Indicator, { asChild: true, children: _jsx(CircleIcon, { className: "fill-current text-current", style: { height: '0.625rem', strokeWidth: '2px', width: '0.625rem' } }) }) }));
8
- });
5
+ export const RadioGroupItem = ({ className, ...props }) => {
6
+ return (_jsx(Item, { className: cn('border-primary text-primary focus-visible:ring-ring flex aspect-square h-4 w-4 items-center justify-center rounded-full border shadow-sm focus:outline-hidden focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: _jsx(Indicator, { asChild: true, children: _jsx(CircleIcon, { className: "fill-current text-current", style: { height: '0.625rem', strokeWidth: '2px', width: '0.625rem' } }) }) }));
7
+ };
9
8
  //# sourceMappingURL=RadioGroupItem.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroupItem.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,MAAM,CAAC,MAAM,cAAc,GAAG,UAAU,CAGtC,SAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IACpD,OAAO,CACL,KAAC,mBAAmB,CAAC,IAAI,IACvB,SAAS,EAAE,EAAE,CACX,oOAAoO,EACpO,SAAS,CACV,EACD,GAAG,EAAE,GAAG,KACJ,KAAK,YAET,KAAC,mBAAmB,CAAC,SAAS,IAAC,OAAO,kBACpC,KAAC,UAAU,IACT,SAAS,EAAC,2BAA2B,EACrC,KAAK,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,GACpE,GAC4B,GACP,CAC5B,CAAC;AACJ,CAAC,CAAC,CAAC"}
1
+ {"version":3,"file":"RadioGroupItem.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE5B,MAAM,CAAC,MAAM,cAAc,GAAgD,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACrG,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CACX,oOAAoO,EACpO,SAAS,CACV,KACG,KAAK,YAET,KAAC,SAAS,IAAC,OAAO,kBAChB,KAAC,UAAU,IACT,SAAS,EAAC,2BAA2B,EACrC,KAAK,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,GACpE,GACQ,GACP,CACR,CAAC;AACJ,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@douglasneuroinformatics/libui",
3
3
  "type": "module",
4
- "version": "6.1.2",
4
+ "version": "6.2.0",
5
5
  "packageManager": "pnpm@10.7.1",
6
6
  "description": "Generic UI components for DNP projects, built using React and Tailwind CSS",
7
7
  "author": "Joshua Unrau",
@@ -129,7 +129,10 @@ export const Default: Story = {
129
129
  <Story
130
130
  args={{
131
131
  columns,
132
- data: tableData
132
+ data: tableData,
133
+ onRowDoubleClick(row) {
134
+ alert(`row with email ${row.email} double clicked`);
135
+ }
133
136
  }}
134
137
  />
135
138
  <div className="fixed bottom-0 py-2">
@@ -157,6 +160,9 @@ export const WithActions: Story = {
157
160
  }
158
161
  ],
159
162
  data: createData(100).map((payment) => ({ ...payment, notes: faker.lorem.paragraph() })),
163
+ onRowDoubleClick(row) {
164
+ alert(`row with email ${row.email} double clicked`);
165
+ },
160
166
  onSearchChange: () => {
161
167
  return;
162
168
  },
@@ -239,6 +245,9 @@ export const Grouped: Story = {
239
245
  }
240
246
  ],
241
247
  data: createData(100),
248
+ onRowDoubleClick(row) {
249
+ alert(`row with ID ${row.id} double clicked`);
250
+ },
242
251
  onSearchChange: () => {
243
252
  return;
244
253
  }
@@ -11,6 +11,7 @@ import type { DataTableProps } from './types.ts';
11
11
  export const DataTable = <T extends RowData>({
12
12
  emptyStateProps,
13
13
  onRowClick,
14
+ onRowDoubleClick,
14
15
  onSearchChange,
15
16
  togglesComponent,
16
17
  ...props
@@ -28,6 +29,7 @@ export const DataTable = <T extends RowData>({
28
29
  emptyStateProps={emptyStateProps}
29
30
  togglesComponent={togglesComponent}
30
31
  onRowClick={onRowClick}
32
+ onRowDoubleClick={onRowDoubleClick}
31
33
  onSearchChange={onSearchChange}
32
34
  />
33
35
  </DataTableContext.Provider>
@@ -9,10 +9,9 @@ import { flexRender } from './utils.tsx';
9
9
 
10
10
  import type { DataTableContentProps } from './types.ts';
11
11
 
12
- export const DataTableBody: React.FC<Pick<DataTableContentProps<any>, 'emptyStateProps' | 'onRowClick'>> = ({
13
- emptyStateProps,
14
- onRowClick
15
- }) => {
12
+ export const DataTableBody: React.FC<
13
+ Pick<DataTableContentProps<any>, 'emptyStateProps' | 'onRowClick' | 'onRowDoubleClick'>
14
+ > = ({ emptyStateProps, onRowClick, onRowDoubleClick }) => {
16
15
  const rows = useDataTableHandle('rows');
17
16
  const { t } = useTranslation();
18
17
 
@@ -42,6 +41,7 @@ export const DataTableBody: React.FC<Pick<DataTableContentProps<any>, 'emptyStat
42
41
  id={row.id}
43
42
  key={row.id}
44
43
  onClick={onRowClick ? () => void onRowClick(row.original) : undefined}
44
+ onDoubleClick={onRowDoubleClick ? () => void onRowDoubleClick(row.original) : undefined}
45
45
  >
46
46
  {row.getVisibleCells().map((cell) => {
47
47
  const style: React.CSSProperties = {
@@ -12,6 +12,7 @@ import type { DataTableContentProps } from './types.ts';
12
12
  export const DataTableContent = <T extends RowData>({
13
13
  emptyStateProps,
14
14
  onRowClick,
15
+ onRowDoubleClick,
15
16
  onSearchChange,
16
17
  togglesComponent
17
18
  }: DataTableContentProps<T>) => {
@@ -28,7 +29,11 @@ export const DataTableContent = <T extends RowData>({
28
29
  <div className="relative w-full overflow-auto rounded-md border" ref={containerRef}>
29
30
  <div className="flex min-w-full flex-col text-sm tracking-tight" style={style}>
30
31
  <DataTableHead />
31
- <DataTableBody emptyStateProps={emptyStateProps} onRowClick={onRowClick} />
32
+ <DataTableBody
33
+ emptyStateProps={emptyStateProps}
34
+ onRowClick={onRowClick}
35
+ onRowDoubleClick={onRowDoubleClick}
36
+ />
32
37
  </div>
33
38
  </div>
34
39
  <DataTablePagination />
@@ -57,6 +57,7 @@ export type DataTableProps<T extends RowData> = DataTableContentProps<T> & DataT
57
57
  export type DataTableContentProps<T extends RowData> = {
58
58
  emptyStateProps?: Partial<DataTableEmptyStateProps>;
59
59
  onRowClick?: (row: T) => Promisable<void>;
60
+ onRowDoubleClick?: (row: T) => Promisable<void>;
60
61
  onSearchChange?: SearchChangeHandler<NoInfer<T>>;
61
62
  togglesComponent?: React.FC<{ table: Table<T> }>;
62
63
  };
@@ -1,4 +1,3 @@
1
- import { cva } from 'class-variance-authority';
2
1
  import type { Simplify } from 'type-fest';
3
2
 
4
3
  import { Label } from '../Label/Label.tsx';
@@ -7,25 +6,12 @@ import { FieldGroup } from './FieldGroup/FieldGroup.tsx';
7
6
 
8
7
  import type { BaseFieldComponentProps } from './types.ts';
9
8
 
10
- const baseRadioFieldVariants = cva('flex', {
11
- defaultVariants: {
12
- orientation: 'vertical'
13
- },
14
- variants: {
15
- orientation: {
16
- horizontal: 'flex-col @3xl:flex-row @3xl:items-center @3xl:justify-between',
17
- vertical: 'flex-col'
18
- }
19
- }
20
- });
21
-
22
9
  export type BaseRadioFieldProps<T extends string> = Simplify<
23
10
  BaseFieldComponentProps<T> & {
24
11
  description?: string;
25
12
  disabled?: boolean;
26
13
  label: string;
27
14
  options: { [K in T]: string };
28
- orientation?: 'horizontal' | 'vertical';
29
15
  }
30
16
  >;
31
17
 
@@ -36,24 +22,17 @@ export const BaseRadioField = <T extends string>({
36
22
  label,
37
23
  name,
38
24
  options,
39
- orientation = 'vertical',
40
25
  readOnly,
41
26
  setValue,
42
27
  value
43
28
  }: BaseRadioFieldProps<T>) => {
44
- const optionsCount = Object.keys(options).length;
45
29
  return (
46
30
  <FieldGroup name={name}>
47
31
  <FieldGroup.Row>
48
32
  <Label>{label}</Label>
49
33
  <FieldGroup.Description description={description} />
50
34
  </FieldGroup.Row>
51
- <RadioGroup
52
- className={baseRadioFieldVariants({ orientation: optionsCount > 5 ? 'vertical' : orientation })}
53
- name={name}
54
- value={value ?? ''}
55
- onValueChange={(value) => setValue(value as T)}
56
- >
35
+ <RadioGroup name={name} value={value ?? ''} onValueChange={(value) => setValue(value as T)}>
57
36
  {Object.keys(options).map((option) => (
58
37
  <div className="flex items-center gap-2" key={option}>
59
38
  <RadioGroup.Item disabled={disabled || readOnly} id={`${name}-${option}`} value={option} />
@@ -1,8 +1,9 @@
1
+ import { useEffect, useRef, useState } from 'react';
2
+
1
3
  import type { NumberFormField } from '@douglasneuroinformatics/libui-form-types';
2
4
  import type { Simplify } from 'type-fest';
3
5
 
4
6
  import { Label, RadioGroup } from '#components';
5
- import { cn } from '#utils';
6
7
 
7
8
  import { FieldGroup } from '../FieldGroup/FieldGroup.tsx';
8
9
 
@@ -24,8 +25,25 @@ export const NumberFieldRadio = ({
24
25
  setValue,
25
26
  value
26
27
  }: NumberFieldRadioProps) => {
28
+ const radioGroupRef = useRef<HTMLDivElement>(null);
29
+ const [isColumnLayout, setIsColumnLayout] = useState<boolean>(false);
30
+
27
31
  const optionsCount = Object.keys(options).length;
28
32
 
33
+ useEffect(() => {
34
+ const observer = new ResizeObserver(([entry]) => {
35
+ const { width: rootWidth } = entry!.target.getBoundingClientRect();
36
+ const children = Array.from(entry!.target.children);
37
+ const totalChildWidth = children.reduce((sum, child) => sum + child.scrollWidth, 0);
38
+ const isOverflowing = totalChildWidth > rootWidth - children.length * 24; // to additional provide spacing between items
39
+ setIsColumnLayout(isOverflowing);
40
+ });
41
+ if (radioGroupRef.current) {
42
+ observer.observe(radioGroupRef.current);
43
+ }
44
+ return () => observer.disconnect();
45
+ }, []);
46
+
29
47
  return (
30
48
  <FieldGroup name={name}>
31
49
  <FieldGroup.Row>
@@ -33,28 +51,29 @@ export const NumberFieldRadio = ({
33
51
  <FieldGroup.Description description={description} />
34
52
  </FieldGroup.Row>
35
53
  <RadioGroup
36
- className={cn(
37
- 'flex',
38
- optionsCount > 5 ? 'flex-col' : 'flex-col @3xl:flex-row @3xl:items-center @3xl:justify-between'
39
- )}
54
+ className="grid justify-between"
40
55
  name={name}
56
+ ref={radioGroupRef}
57
+ style={{
58
+ gridTemplateColumns: isColumnLayout ? 'repeat(1, 1fr)' : `repeat(${optionsCount}, auto)`
59
+ }}
41
60
  value={value?.toString() ?? ''}
42
- onValueChange={(value) => setValue(parseInt(value))}
61
+ onValueChange={(value) => setValue(parseInt(value, 10))}
43
62
  >
44
63
  {Object.keys(options)
45
64
  .map((val) => parseInt(val))
46
65
  .toSorted((a, b) => a - b)
47
66
  .map((val) => {
48
- const text = (disableAutoPrefix ? '' : `${val} - `) + options[val];
49
67
  return (
50
- <div className="flex items-center gap-2" key={val}>
68
+ <div className="flex w-fit items-center gap-2" key={val}>
51
69
  <RadioGroup.Item disabled={disabled || readOnly} id={`${name}-${val}`} value={val.toString()} />
52
70
  <Label
53
71
  aria-disabled={disabled || readOnly}
54
- className="text-muted-foreground font-normal"
72
+ className="text-muted-foreground flex items-center font-normal"
55
73
  htmlFor={`${name}-${val}`}
56
74
  >
57
- {text}
75
+ {!disableAutoPrefix && <span className="whitespace-nowrap">{val}&nbsp;-&nbsp;</span>}
76
+ <span>{options[val]}</span>
58
77
  </Label>
59
78
  </div>
60
79
  );
@@ -1,21 +1,16 @@
1
1
  import * as React from 'react';
2
2
 
3
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
3
+ import { Root } from '@radix-ui/react-radio-group';
4
4
 
5
5
  import { cn } from '#utils';
6
6
 
7
7
  import { RadioGroupItem } from './RadioGroupItem.tsx';
8
8
 
9
- type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>;
9
+ type RadioGroupProps = React.ComponentProps<typeof Root>;
10
10
 
11
- const RadioGroupRoot = React.forwardRef<
12
- React.ElementRef<typeof RadioGroupPrimitive.Root>,
13
- React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>
14
- >(function RadioGroup({ className, ...props }, ref) {
15
- return (
16
- <RadioGroupPrimitive.Root className={cn('grid gap-2', className)} data-testid="radio-group" {...props} ref={ref} />
17
- );
18
- });
11
+ const RadioGroupRoot: React.FC<RadioGroupProps> = ({ className, ...props }) => {
12
+ return <Root className={cn('grid gap-2', className)} data-testid="radio-group" {...props} />;
13
+ };
19
14
 
20
15
  export const RadioGroup = Object.assign(RadioGroupRoot, {
21
16
  Item: RadioGroupItem
@@ -1,29 +1,23 @@
1
- import { forwardRef } from 'react';
2
-
3
- import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
1
+ import { Indicator, Item } from '@radix-ui/react-radio-group';
4
2
  import { CircleIcon } from 'lucide-react';
5
3
 
6
4
  import { cn } from '#utils';
7
5
 
8
- export const RadioGroupItem = forwardRef<
9
- React.ElementRef<typeof RadioGroupPrimitive.Item>,
10
- React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>
11
- >(function RadioGroupItem({ className, ...props }, ref) {
6
+ export const RadioGroupItem: React.FC<React.ComponentProps<typeof Item>> = ({ className, ...props }) => {
12
7
  return (
13
- <RadioGroupPrimitive.Item
8
+ <Item
14
9
  className={cn(
15
10
  'border-primary text-primary focus-visible:ring-ring flex aspect-square h-4 w-4 items-center justify-center rounded-full border shadow-sm focus:outline-hidden focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50',
16
11
  className
17
12
  )}
18
- ref={ref}
19
13
  {...props}
20
14
  >
21
- <RadioGroupPrimitive.Indicator asChild>
15
+ <Indicator asChild>
22
16
  <CircleIcon
23
17
  className="fill-current text-current"
24
18
  style={{ height: '0.625rem', strokeWidth: '2px', width: '0.625rem' }}
25
19
  />
26
- </RadioGroupPrimitive.Indicator>
27
- </RadioGroupPrimitive.Item>
20
+ </Indicator>
21
+ </Item>
28
22
  );
29
- });
23
+ };