Skip to content

Commit c70e065

Browse files
inchoateinchoate
committed
[WIP] - PR comments; added toggle and ratings widgets
1 parent 43ecf0f commit c70e065

File tree

42 files changed

+383
-222
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+383
-222
lines changed

‎package-lock.json‎

Lines changed: 51 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/daisyui/package.json‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@rjsf/daisyui",
3-
"version": "0.1.0",
3+
"version": "6.0.0-alpha.1",
44
"description": "Daisy UI components for react-jsonschema-form",
55
"main": "src/index.ts",
66
"types": "src/index.ts",
@@ -15,15 +15,17 @@
1515
"@fortawesome/fontawesome-svg-core": "^6.7.2",
1616
"@fortawesome/free-solid-svg-icons": "^6.7.2",
1717
"@fortawesome/react-fontawesome": "^0.2.2",
18-
"@rjsf/core": "^5.24.2",
19-
"@rjsf/utils": "^5.24.2",
2018
"@tailwindcss/vite": "^4.0.6",
2119
"react": "^18.2.0",
2220
"react-day-picker": "^9.5.1",
2321
"tailwindcss": "^4.0.6"
2422
},
2523
"peerDependencies": {
26-
"react": "^18.2.0"
24+
"react": "^18.2.0",
25+
"@rjsf/core": "^6.x",
26+
"@rjsf/utils": "^6.x",
27+
"primeicons": ">=6.0.0",
28+
"primereact": ">=8.0.0"
2729
},
2830
"devDependencies": {
2931
"daisyui": "^5.0.0-beta.7",

‎packages/daisyui/src/daisyForm/DaisyForm.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ export function generateForm<
99
F extends FormContextType = any
1010
>(): ComponentType<FormProps<T, S, F>> {
1111
const theme = generateTheme<T, S, F>();
12-
console.log('Generated theme:', theme); // Debug what templates are available
1312
return withTheme<T, S, F>(theme);
1413
}
1514

@@ -18,3 +17,10 @@ const Form = generateForm();
1817
export { Form, generateTheme };
1918

2019
export default Form;
20+
21+
function selectWidget(schema: RJSFSchema, widget?: string) {
22+
if (schema.type === 'array' && schema.uniqueItems && schema.items && (schema.items as RJSFSchema).enum) {
23+
return 'checkboxes';
24+
}
25+
return widget;
26+
}

‎packages/daisyui/src/index.ts‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,29 @@
11
import Form from '@rjsf/core';
22

3+
export { default as Form, generateForm } from './daisyForm/DaisyForm';
4+
export { __createDaisyUIFrameProvider } from './DaisyUIFrameProvider';
5+
export { default as ArrayFieldItemButtonsTemplate } from './templates/ArrayFieldItemButtonsTemplate';
6+
export { default as ArrayFieldItemTemplate } from './templates/ArrayFieldItemTemplate';
37
export { default as BaseInputTemplate } from './templates/BaseInputTemplate/BaseInputTemplate';
4-
export { default as CheckboxWidget } from './widgets/CheckboxWidget/CheckboxWidget';
5-
export { default as CheckboxesWidget } from './widgets/CheckboxesWidget/CheckboxesWidget';
8+
export * from './templates/ButtonTemplates';
9+
export { default as buttonTemplates } from './templates/ButtonTemplates';
610
export { default as DescriptionField } from './templates/DescriptionField';
711
export { default as ErrorList } from './templates/ErrorList';
812
export { default as FieldErrorTemplate } from './templates/FieldErrorTemplate';
913
export { default as FieldHelpTemplate } from './templates/FieldHelpTemplate';
1014
export { default as FieldTemplate } from './templates/FieldTemplate';
1115
export { default as ObjectFieldTemplate } from './templates/ObjectFieldTemplate';
12-
export { default as buttonTemplates } from './templates/ButtonTemplates';
13-
export * from './templates/ButtonTemplates';
16+
export { generateTemplates } from './templates/Templates';
17+
export { default as TitleField } from './templates/TitleField';
18+
export { default as WrapIfAdditionalTemplate } from './templates/WrapIfAdditionalTemplate';
19+
export { generateTheme, default as Theme } from './theme/Theme';
20+
export { default as CheckboxesWidget } from './widgets/CheckboxesWidget/CheckboxesWidget';
21+
export { default as CheckboxWidget } from './widgets/CheckboxWidget/CheckboxWidget';
1422
export { default as RadioWidget } from './widgets/RadioWidget/RadioWidget';
1523
export { default as RangeWidget } from './widgets/RangeWidget/RangeWidget';
1624
export { default as SelectWidget } from './widgets/SelectWidget/SelectWidget';
17-
export { default as TextAreaWidget } from './widgets/TextareaWidget/TextAreaWidget';
18-
export { default as TitleField } from './templates/TitleField';
19-
export { default as WrapIfAdditionalTemplate } from './templates/WrapIfAdditionalTemplate';
20-
export { default as Form, generateForm } from './daisyForm/DaisyForm';
21-
export { default as Theme, generateTheme } from './theme/Theme';
22-
export { generateTemplates } from './templates/Templates';
23-
export { default as Widgets, generateWidgets } from './widgets/Widgets';
24-
export { __createDaisyUIFrameProvider } from './DaisyUIFrameProvider';
25+
export { default as TextAreaWidget } from './widgets/TextareaWidget/TextareaWidget';
26+
export { generateWidgets, default as Widgets } from './widgets/Widgets';
2527

2628
export type { DaisyUiSchema as UiSchema } from './utils';
2729

‎packages/daisyui/src/templates/ArrayFieldDescriptionTemplate/ArrayFieldDescriptionTemplate.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ const ArrayFieldDescriptionTemplate = <
77
>(
88
props: ArrayFieldDescriptionProps<T, S, F>
99
) => {
10-
console.log('DaisyUI ArrayFieldDescriptionTemplate');
11-
props;
10+
const { description } = props;
1211
return (
1312
<div>
14-
<h1>ArrayFieldDescriptionTemplate</h1>
13+
<p className='text-sm text-accent'>{description}</p>
1514
</div>
1615
);
1716
};

‎packages/daisyui/src/templates/ArrayFieldItemButtonsTemplate/ArrayFieldItemButtonsTemplate.tsx‎

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import { useMemo } from 'react';
2+
import {
3+
FormContextType,
4+
RJSFSchema,
5+
StrictRJSFSchema,
6+
ArrayFieldItemButtonsTemplateType,
7+
buttonId,
8+
} from '@rjsf/utils';
9+
10+
export default function ArrayFieldItemButtonsTemplate<
11+
T = any,
12+
S extends StrictRJSFSchema = RJSFSchema,
13+
F extends FormContextType = any
14+
>(props: ArrayFieldItemButtonsTemplateType<T, S, F>) {
15+
const {
16+
disabled,
17+
hasCopy,
18+
hasMoveDown,
19+
hasMoveUp,
20+
hasRemove,
21+
idSchema,
22+
index,
23+
onCopyIndexClick,
24+
onDropIndexClick,
25+
onReorderClick,
26+
readonly,
27+
registry,
28+
uiSchema,
29+
} = props;
30+
const { CopyButton, MoveDownButton, MoveUpButton, RemoveButton } = registry.templates.ButtonTemplates;
31+
const onCopyClick = useMemo(() => onCopyIndexClick(index), [index, onCopyIndexClick]);
32+
const onRemoveClick = useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
33+
const onArrowUpClick = useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
34+
const onArrowDownClick = useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
35+
36+
return (
37+
<>
38+
{(hasMoveUp || hasMoveDown) && (
39+
<MoveUpButton
40+
id={buttonId<T>(idSchema, 'moveUp')}
41+
className='btn btn-sm btn-ghost'
42+
disabled={disabled || readonly || !hasMoveUp}
43+
onClick={onArrowUpClick}
44+
uiSchema={uiSchema}
45+
registry={registry}
46+
/>
47+
)}
48+
{(hasMoveUp || hasMoveDown) && (
49+
<MoveDownButton
50+
id={buttonId<T>(idSchema, 'moveDown')}
51+
className='btn btn-sm btn-ghost'
52+
disabled={disabled || readonly || !hasMoveDown}
53+
onClick={onArrowDownClick}
54+
uiSchema={uiSchema}
55+
registry={registry}
56+
/>
57+
)}
58+
{hasCopy && (
59+
<CopyButton
60+
id={buttonId<T>(idSchema, 'copy')}
61+
className='btn btn-sm btn-ghost'
62+
disabled={disabled || readonly}
63+
onClick={onCopyClick}
64+
uiSchema={uiSchema}
65+
registry={registry}
66+
/>
67+
)}
68+
{hasRemove && (
69+
<RemoveButton
70+
id={buttonId<T>(idSchema, 'remove')}
71+
className='btn btn-sm btn-ghost btn-error'
72+
disabled={disabled || readonly}
73+
onClick={onRemoveClick}
74+
uiSchema={uiSchema}
75+
registry={registry}
76+
/>
77+
)}
78+
</>
79+
);
80+
}

‎packages/daisyui/src/templates/ArrayFieldItemButtonsTemplate/index.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export { default } from './ArrayFieldItemButtonsTemplate';
2+
export * from './ArrayFieldItemButtonsTemplate';

‎packages/daisyui/src/templates/ArrayFieldItemTemplate/ArrayFieldItemTemplate.tsx‎

Lines changed: 34 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,77 +1,40 @@
1-
import { ArrayFieldTemplateItemType, StrictRJSFSchema, RJSFSchema, FormContextType } from '@rjsf/utils';
1+
import { CSSProperties } from 'react';
2+
import {
3+
ArrayFieldItemTemplateType,
4+
FormContextType,
5+
getTemplate,
6+
getUiOptions,
7+
RJSFSchema,
8+
StrictRJSFSchema,
9+
} from '@rjsf/utils';
210

3-
import { MoveUpButton, MoveDownButton, RemoveButton } from '../ButtonTemplates/IconButton';
4-
5-
const ArrayFieldItemTemplate = <T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
6-
props: ArrayFieldTemplateItemType<T, S, F>
7-
) => {
8-
const { children, hasMoveUp, hasMoveDown, onDropIndexClick, onReorderClick, index, registry } = props;
9-
console.log('ArrayFieldItemTemplate full props:', props);
10-
console.log('DaisyUI ArrayFieldItemTemplate props:', {
11-
hasMoveUp,
12-
hasMoveDown,
13-
onDropIndexClick,
14-
onReorderClick,
15-
index,
16-
});
17-
console.log('onReorderClick type:', typeof onReorderClick);
18-
console.log('onReorderClick value:', onReorderClick);
19-
20-
// Test if the function is actually callable
21-
if (typeof onReorderClick === 'function') {
22-
console.log('onReorderClick is a function');
23-
} else {
24-
console.error('onReorderClick is not a function:', onReorderClick);
25-
}
26-
27-
const handleReorder = (fromIndex: number, toIndex: number) => {
28-
console.log('handleReorder:', { fromIndex, toIndex });
29-
try {
30-
console.log('About to call onReorderClick');
31-
const handler = onReorderClick(fromIndex, toIndex);
32-
handler(); // Call the returned function without an event
33-
console.log('Called onReorderClick');
34-
} catch (error) {
35-
console.error('Reorder error:', error);
36-
}
37-
};
11+
/** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
12+
*
13+
* @param props - The `ArrayFieldItemTemplateType` props for the component
14+
*/
15+
export default function ArrayFieldItemTemplate<
16+
T = any,
17+
S extends StrictRJSFSchema = RJSFSchema,
18+
F extends FormContextType = any
19+
>(props: ArrayFieldItemTemplateType<T, S, F>) {
20+
const { children, className, buttonsProps, hasToolbar, registry, uiSchema } = props;
21+
const uiOptions = getUiOptions<T, S, F>(uiSchema);
22+
const ArrayFieldItemButtonsTemplate = getTemplate<'ArrayFieldItemButtonsTemplate', T, S, F>(
23+
'ArrayFieldItemButtonsTemplate',
24+
registry,
25+
uiOptions
26+
);
3827

3928
return (
40-
<div className='card bg-base-100 shadow-sm mb-4'>
41-
<div className='card-body p-4'>
42-
<div className='array-field-item-content mb-2'>{children}</div>
43-
<div className='card-actions justify-end'>
44-
{hasMoveUp && (
45-
<MoveUpButton
46-
className='btn btn-sm btn-ghost'
47-
onClick={() => {
48-
console.log('MoveUp clicked', index);
49-
handleReorder(index, index - 1);
50-
}}
51-
registry={registry}
52-
/>
53-
)}
54-
{hasMoveDown && (
55-
<MoveDownButton
56-
className='btn btn-sm btn-ghost'
57-
onClick={() => handleReorder(index, index + 1)}
58-
registry={registry}
59-
/>
60-
)}
61-
<RemoveButton
62-
className='btn btn-sm btn-ghost btn-error'
63-
onClick={(e) => {
64-
e.preventDefault();
65-
e.stopPropagation();
66-
const handler = onDropIndexClick(index);
67-
handler();
68-
}}
69-
registry={registry}
70-
/>
29+
<div className='flex items-center gap-4 p-2 mb-2 bg-base-100 rounded-lg hover:bg-base-200'>
30+
<div className='flex-1'>{children}</div>
31+
{hasToolbar && (
32+
<div className='flex-none'>
33+
<div className='join'>
34+
<ArrayFieldItemButtonsTemplate {...buttonsProps} />
35+
</div>
7136
</div>
72-
</div>
37+
)}
7338
</div>
7439
);
75-
};
76-
77-
export default ArrayFieldItemTemplate;
40+
}

0 commit comments

Comments
 (0)