@accelint/design-system 0.1.0 → 0.2.0

package/dist/components/query-builder/rule.d.ts

@@ -0,0 +1,3 @@
+import { type RuleProps, useRule } from 'react-querybuilder';
+export declare function Rule(props: RuleProps): import("react/jsx-runtime").JSX.Element;
+export declare function RuleComponents({ classNames: classNamesProp, cloneRule, context, disabled, dragRef, fieldData, generateOnChangeHandler, hideValueControls, inputType, operators, parentDisabled, path, removeRule, rule, schema, shiftDownDisabled, shiftUpDisabled, shiftRuleDown, shiftRuleUp, toggleLockRule, translations, validationResult, valueEditorSeparator, valueEditorType, valueSourceOptions, valueSources, values, }: RuleProps & ReturnType<typeof useRule>): import("react/jsx-runtime").JSX.Element;

package/dist/components/query-builder/rule.js

@@ -0,0 +1,112 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useContext, useMemo } from 'react';
+import { useRule, useStopEventPropagation, TestID } from 'react-querybuilder';
+import { inlineVars } from '../../utils/css.js';
+import { AriaText } from '../aria/aria.js';
+import { QueryBuilderContext } from './constants.js';
+import { queryBuilderRuleStateVars } from './query-builder.vanilla.js';
+import { getValidationResult } from './utils.js';
+
+function Rule(props) {
+  const { classNames } = useContext(QueryBuilderContext);
+  const rule = useRule(props);
+  const cloneRule = useStopEventPropagation(rule.cloneRule);
+  const toggleLockRule = useStopEventPropagation(rule.toggleLockRule);
+  const removeRule = useStopEventPropagation(rule.removeRule);
+  const shiftRuleUp = useStopEventPropagation(rule.shiftRuleUp);
+  const shiftRuleDown = useStopEventPropagation(rule.shiftRuleDown);
+  const { valid: isValid, reasons } = getValidationResult(props.rule, rule.fieldData?.validator);
+  const style = useMemo(() => inlineVars(queryBuilderRuleStateVars, {
+    isDisabled: rule.disabled,
+    isDragging: rule.isDragging,
+    isDropTarget: rule.isOver
+  }), [rule.disabled, rule.isDragging, rule.isOver]);
+  return jsxs("div", { className: classNames?.rule?.container, style, children: [jsx("div", { ref: rule.dndRef, className: rule.outerClassName, "data-dragmonitorid": rule.dragMonitorId, "data-dropmonitorid": rule.dropMonitorId, "data-level": rule.path.length, "data-path": JSON.stringify(rule.path), "data-rule-id": rule.id, "data-testid": TestID.rule, children: jsx(RuleComponents, { ...rule, cloneRule, removeRule, shiftRuleDown, shiftRuleUp, toggleLockRule }) }), !isValid && reasons?.map((reason) => jsx(AriaText, { className: classNames?.rule?.error, children: reason }, reason))] });
+}
+function RuleComponents({ classNames: classNamesProp, cloneRule, context, disabled, dragRef, fieldData, generateOnChangeHandler, hideValueControls, inputType, operators, parentDisabled, path, removeRule, rule, schema, shiftDownDisabled, shiftUpDisabled, shiftRuleDown, shiftRuleUp, toggleLockRule, translations, validationResult, valueEditorSeparator, valueEditorType, valueSourceOptions, valueSources, values }) {
+  const { classNames, consistentColumns } = useContext(QueryBuilderContext);
+  const { controls: { shiftActions: ShiftActionsControlElement, dragHandle: DragHandleControlElement, fieldSelector: FieldSelectorControlElement, operatorSelector: OperatorSelectorControlElement, valueSourceSelector: ValueSourceSelectorControlElement, valueEditor: ValueEditorControlElement, cloneRuleAction: CloneRuleActionControlElement, lockRuleAction: LockRuleActionControlElement, removeRuleAction: RemoveRuleActionControlElement }, enableDragAndDrop, showCloneButtons, showLockButtons, showShiftActions } = schema;
+  const titles = useMemo(() => ({
+    shiftUp: translations.shiftActionUp.title,
+    shiftDown: translations.shiftActionDown.title
+  }), [translations.shiftActionDown.title, translations.shiftActionUp.title]);
+  const labels = useMemo(() => ({
+    shiftUp: translations.shiftActionUp.label,
+    shiftDown: translations.shiftActionDown.label
+  }), [translations.shiftActionDown.label, translations.shiftActionUp.label]);
+  const renderOperator = schema.autoSelectField || rule.field !== translations.fields.placeholderName;
+  const operator = useMemo(() => {
+    if (renderOperator) {
+      return jsx("div", { className: classNames?.rule?.operator, children: jsx(OperatorSelectorControlElement, { testID: TestID.operators, field: rule.field, fieldData, title: translations.operators.title, options: operators, value: rule.operator, className: classNamesProp.operators, handleOnChange: generateOnChangeHandler("operator"), level: path.length, path, disabled, context, validation: validationResult, schema, rule }) });
+    }
+    return !renderOperator && consistentColumns ? jsx("div", { className: classNames?.rule?.operator }) : null;
+  }, [
+    OperatorSelectorControlElement,
+    classNames?.rule?.operator,
+    classNamesProp.operators,
+    consistentColumns,
+    context,
+    disabled,
+    fieldData,
+    generateOnChangeHandler,
+    operators,
+    path,
+    renderOperator,
+    rule,
+    schema,
+    translations.operators.title,
+    validationResult
+  ]);
+  const renderValue = renderOperator && (schema.autoSelectOperator || rule.operator !== translations.operators.placeholderName) && !hideValueControls;
+  const value = useMemo(() => {
+    if (renderValue) {
+      return jsx("div", { className: classNames?.rule?.values, children: jsx(ValueEditorControlElement, { testID: TestID.valueEditor, field: rule.field, fieldData, title: translations.value.title, operator: rule.operator, value: rule.value, valueSource: rule.valueSource ?? "value", type: valueEditorType, inputType, values, listsAsArrays: schema.listsAsArrays, parseNumbers: schema.parseNumbers, separator: valueEditorSeparator, className: classNamesProp.value, handleOnChange: generateOnChangeHandler("value"), level: path.length, path, disabled, context, validation: validationResult, schema, rule }) });
+    }
+    return !renderValue && consistentColumns ? jsx("div", { className: classNames?.rule?.values }) : null;
+  }, [
+    ValueEditorControlElement,
+    classNames?.rule?.values,
+    classNamesProp.value,
+    consistentColumns,
+    context,
+    disabled,
+    fieldData,
+    generateOnChangeHandler,
+    inputType,
+    path,
+    renderValue,
+    rule,
+    schema,
+    translations.value.title,
+    validationResult,
+    valueEditorSeparator,
+    valueEditorType,
+    values
+  ]);
+  const renderValueSources = renderValue && !["null", "notNull"].includes(rule.operator) && valueSources.length > 1;
+  const sources = useMemo(() => {
+    if (renderValueSources) {
+      return jsx("div", { className: classNames?.rule?.source, children: jsx(ValueSourceSelectorControlElement, { testID: TestID.valueSourceSelector, field: rule.field, fieldData, title: translations.valueSourceSelector.title, options: valueSourceOptions, value: rule.valueSource ?? "value", className: classNamesProp.valueSource, handleOnChange: generateOnChangeHandler("valueSource"), level: path.length, path, disabled, context, validation: validationResult, schema, rule }) });
+    }
+    return !renderValueSources && consistentColumns ? jsx("div", { className: classNames?.rule?.source }) : null;
+  }, [
+    ValueSourceSelectorControlElement,
+    classNames?.rule?.source,
+    classNamesProp.valueSource,
+    consistentColumns,
+    context,
+    disabled,
+    fieldData,
+    generateOnChangeHandler,
+    path,
+    renderValueSources,
+    rule,
+    schema,
+    translations.valueSourceSelector.title,
+    validationResult,
+    valueSourceOptions
+  ]);
+  return jsxs(Fragment, { children: [showShiftActions && jsx("div", { className: classNames?.rule?.shift, children: jsx(ShiftActionsControlElement, { testID: TestID.shiftActions, level: path.length, path, titles, labels, className: classNamesProp.shiftActions, disabled, shiftUp: shiftRuleUp, shiftDown: shiftRuleDown, shiftUpDisabled, shiftDownDisabled, context, validation: validationResult, schema, ruleOrGroup: rule }) }), enableDragAndDrop && jsx("div", { className: classNames?.rule?.drag, children: jsx(DragHandleControlElement, { testID: TestID.dragHandle, ref: dragRef, level: path.length, path, title: translations.dragHandle.title, label: translations.dragHandle.label, className: classNamesProp.dragHandle, disabled, context, validation: validationResult, schema, ruleOrGroup: rule }) }), jsx("div", { className: classNames?.rule?.field, children: jsx(FieldSelectorControlElement, { testID: TestID.fields, options: schema.fields, title: translations.fields.title, value: rule.field, operator: rule.operator, className: classNamesProp.fields, handleOnChange: generateOnChangeHandler("field"), level: path.length, path, disabled, context, validation: validationResult, schema, rule }) }), operator, sources, value, showCloneButtons && jsx("div", { className: classNames?.rule?.clone, children: jsx(CloneRuleActionControlElement, { testID: TestID.cloneRule, label: translations.cloneRule.label, title: translations.cloneRule.title, className: classNamesProp.cloneRule, handleOnClick: cloneRule, level: path.length, path, disabled, context, validation: validationResult, ruleOrGroup: rule, schema }) }), showLockButtons && jsx("div", { className: classNames?.rule?.lock, children: jsx(LockRuleActionControlElement, { testID: TestID.lockRule, label: translations.lockRule.label, title: translations.lockRule.title, className: classNamesProp.lockRule, handleOnClick: toggleLockRule, level: path.length, path, disabled, disabledTranslation: parentDisabled ? void 0 : translations.lockRuleDisabled, context, validation: validationResult, ruleOrGroup: rule, schema }) }), jsx("div", { className: classNames?.rule?.remove, children: jsx(RemoveRuleActionControlElement, { testID: TestID.removeRule, label: translations.removeRule.label, title: translations.removeRule.title, className: classNamesProp.removeRule, handleOnClick: removeRule, level: path.length, path, disabled, context, validation: validationResult, ruleOrGroup: rule, schema }) })] });
+}
+
+export { Rule, RuleComponents };

package/dist/components/query-builder/rule.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rule.js","sources":["../../../src/components/query-builder/rule.tsx"],"sourcesContent":["import { useContext, useMemo } from 'react';\nimport {\n  type RuleProps,\n  TestID,\n  useRule,\n  useStopEventPropagation,\n} from 'react-querybuilder';\nimport { inlineVars } from '../../utils';\nimport { AriaText } from '../aria';\nimport { QueryBuilderContext } from './constants';\nimport { queryBuilderRuleStateVars } from './query-builder.css';\nimport { getValidationResult } from './utils';\n\nexport function Rule(props: RuleProps) {\n  const { classNames } = useContext(QueryBuilderContext);\n  const rule = useRule(props);\n  const cloneRule = useStopEventPropagation(rule.cloneRule);\n  const toggleLockRule = useStopEventPropagation(rule.toggleLockRule);\n  const removeRule = useStopEventPropagation(rule.removeRule);\n  const shiftRuleUp = useStopEventPropagation(rule.shiftRuleUp);\n  const shiftRuleDown = useStopEventPropagation(rule.shiftRuleDown);\n\n  const { valid: isValid, reasons } = getValidationResult(\n    props.rule,\n    rule.fieldData?.validator,\n  );\n\n  const style = useMemo(\n    () =>\n      inlineVars(queryBuilderRuleStateVars, {\n        isDisabled: rule.disabled,\n        isDragging: rule.isDragging,\n        isDropTarget: rule.isOver,\n      }),\n    [rule.disabled, rule.isDragging, rule.isOver],\n  );\n\n  return (\n    <div className={classNames?.rule?.container} style={style}>\n      <div\n        ref={rule.dndRef}\n        className={rule.outerClassName}\n        data-dragmonitorid={rule.dragMonitorId}\n        data-dropmonitorid={rule.dropMonitorId}\n        data-level={rule.path.length}\n        data-path={JSON.stringify(rule.path)}\n        data-rule-id={rule.id}\n        data-testid={TestID.rule}\n      >\n        <RuleComponents\n          {...rule}\n          cloneRule={cloneRule}\n          removeRule={removeRule}\n          shiftRuleDown={shiftRuleDown}\n          shiftRuleUp={shiftRuleUp}\n          toggleLockRule={toggleLockRule}\n        />\n      </div>\n      {!isValid &&\n        reasons?.map((reason) => (\n          <AriaText key={reason} className={classNames?.rule?.error}>\n            {reason}\n          </AriaText>\n        ))}\n    </div>\n  );\n}\n\nexport function RuleComponents({\n  classNames: classNamesProp,\n  cloneRule,\n  context,\n  disabled,\n  dragRef,\n  fieldData,\n  generateOnChangeHandler,\n  hideValueControls,\n  inputType,\n  operators,\n  parentDisabled,\n  path,\n  removeRule,\n  rule,\n  schema,\n  shiftDownDisabled,\n  shiftUpDisabled,\n  shiftRuleDown,\n  shiftRuleUp,\n  toggleLockRule,\n  translations,\n  validationResult,\n  valueEditorSeparator,\n  valueEditorType,\n  valueSourceOptions,\n  valueSources,\n  values,\n}: RuleProps & ReturnType<typeof useRule>) {\n  const { classNames, consistentColumns } = useContext(QueryBuilderContext);\n\n  const {\n    controls: {\n      shiftActions: ShiftActionsControlElement,\n      dragHandle: DragHandleControlElement,\n      fieldSelector: FieldSelectorControlElement,\n      operatorSelector: OperatorSelectorControlElement,\n      valueSourceSelector: ValueSourceSelectorControlElement,\n      valueEditor: ValueEditorControlElement,\n      cloneRuleAction: CloneRuleActionControlElement,\n      lockRuleAction: LockRuleActionControlElement,\n      removeRuleAction: RemoveRuleActionControlElement,\n    },\n    enableDragAndDrop,\n    showCloneButtons,\n    showLockButtons,\n    showShiftActions,\n  } = schema;\n\n  const titles = useMemo(\n    () => ({\n      shiftUp: translations.shiftActionUp.title,\n      shiftDown: translations.shiftActionDown.title,\n    }),\n    [translations.shiftActionDown.title, translations.shiftActionUp.title],\n  );\n\n  const labels = useMemo(\n    () => ({\n      shiftUp: translations.shiftActionUp.label,\n      shiftDown: translations.shiftActionDown.label,\n    }),\n    [translations.shiftActionDown.label, translations.shiftActionUp.label],\n  );\n\n  const renderOperator =\n    schema.autoSelectField ||\n    rule.field !== translations.fields.placeholderName;\n\n  const operator = useMemo(() => {\n    if (renderOperator) {\n      return (\n        <div className={classNames?.rule?.operator}>\n          <OperatorSelectorControlElement\n            testID={TestID.operators}\n            field={rule.field}\n            fieldData={fieldData}\n            title={translations.operators.title}\n            options={operators}\n            value={rule.operator}\n            className={classNamesProp.operators}\n            handleOnChange={generateOnChangeHandler('operator')}\n            level={path.length}\n            path={path}\n            disabled={disabled}\n            context={context}\n            validation={validationResult}\n            schema={schema}\n            rule={rule}\n          />\n        </div>\n      );\n    }\n\n    return !renderOperator && consistentColumns ? (\n      <div className={classNames?.rule?.operator} />\n    ) : null;\n  }, [\n    OperatorSelectorControlElement,\n    classNames?.rule?.operator,\n    classNamesProp.operators,\n    consistentColumns,\n    context,\n    disabled,\n    fieldData,\n    generateOnChangeHandler,\n    operators,\n    path,\n    renderOperator,\n    rule,\n    schema,\n    translations.operators.title,\n    validationResult,\n  ]);\n\n  const renderValue =\n    renderOperator &&\n    (schema.autoSelectOperator ||\n      rule.operator !== translations.operators.placeholderName) &&\n    !hideValueControls;\n\n  const value = useMemo(() => {\n    if (renderValue) {\n      return (\n        <div className={classNames?.rule?.values}>\n          <ValueEditorControlElement\n            testID={TestID.valueEditor}\n            field={rule.field}\n            fieldData={fieldData}\n            title={translations.value.title}\n            operator={rule.operator}\n            value={rule.value}\n            valueSource={rule.valueSource ?? 'value'}\n            type={valueEditorType}\n            inputType={inputType}\n            values={values}\n            listsAsArrays={schema.listsAsArrays}\n            parseNumbers={schema.parseNumbers}\n            separator={valueEditorSeparator}\n            className={classNamesProp.value}\n            handleOnChange={generateOnChangeHandler('value')}\n            level={path.length}\n            path={path}\n            disabled={disabled}\n            context={context}\n            validation={validationResult}\n            schema={schema}\n            rule={rule}\n          />\n        </div>\n      );\n    }\n\n    return !renderValue && consistentColumns ? (\n      <div className={classNames?.rule?.values} />\n    ) : null;\n  }, [\n    ValueEditorControlElement,\n    classNames?.rule?.values,\n    classNamesProp.value,\n    consistentColumns,\n    context,\n    disabled,\n    fieldData,\n    generateOnChangeHandler,\n    inputType,\n    path,\n    renderValue,\n    rule,\n    schema,\n    translations.value.title,\n    validationResult,\n    valueEditorSeparator,\n    valueEditorType,\n    values,\n  ]);\n\n  const renderValueSources =\n    renderValue &&\n    !['null', 'notNull'].includes(rule.operator) &&\n    valueSources.length > 1;\n\n  const sources = useMemo(() => {\n    if (renderValueSources) {\n      return (\n        <div className={classNames?.rule?.source}>\n          <ValueSourceSelectorControlElement\n            testID={TestID.valueSourceSelector}\n            field={rule.field}\n            fieldData={fieldData}\n            title={translations.valueSourceSelector.title}\n            options={valueSourceOptions}\n            value={rule.valueSource ?? 'value'}\n            className={classNamesProp.valueSource}\n            handleOnChange={generateOnChangeHandler('valueSource')}\n            level={path.length}\n            path={path}\n            disabled={disabled}\n            context={context}\n            validation={validationResult}\n            schema={schema}\n            rule={rule}\n          />\n        </div>\n      );\n    }\n\n    return !renderValueSources && consistentColumns ? (\n      <div className={classNames?.rule?.source} />\n    ) : null;\n  }, [\n    ValueSourceSelectorControlElement,\n    classNames?.rule?.source,\n    classNamesProp.valueSource,\n    consistentColumns,\n    context,\n    disabled,\n    fieldData,\n    generateOnChangeHandler,\n    path,\n    renderValueSources,\n    rule,\n    schema,\n    translations.valueSourceSelector.title,\n    validationResult,\n    valueSourceOptions,\n  ]);\n\n  return (\n    <>\n      {showShiftActions && (\n        <div className={classNames?.rule?.shift}>\n          <ShiftActionsControlElement\n            testID={TestID.shiftActions}\n            level={path.length}\n            path={path}\n            titles={titles}\n            labels={labels}\n            className={classNamesProp.shiftActions}\n            disabled={disabled}\n            shiftUp={shiftRuleUp}\n            shiftDown={shiftRuleDown}\n            shiftUpDisabled={shiftUpDisabled}\n            shiftDownDisabled={shiftDownDisabled}\n            context={context}\n            validation={validationResult}\n            schema={schema}\n            ruleOrGroup={rule}\n          />\n        </div>\n      )}\n      {enableDragAndDrop && (\n        <div className={classNames?.rule?.drag}>\n          <DragHandleControlElement\n            testID={TestID.dragHandle}\n            ref={dragRef}\n            level={path.length}\n            path={path}\n            title={translations.dragHandle.title}\n            label={translations.dragHandle.label}\n            className={classNamesProp.dragHandle}\n            disabled={disabled}\n            context={context}\n            validation={validationResult}\n            schema={schema}\n            ruleOrGroup={rule}\n          />\n        </div>\n      )}\n      <div className={classNames?.rule?.field}>\n        <FieldSelectorControlElement\n          testID={TestID.fields}\n          options={schema.fields}\n          title={translations.fields.title}\n          value={rule.field}\n          operator={rule.operator}\n          className={classNamesProp.fields}\n          handleOnChange={generateOnChangeHandler('field')}\n          level={path.length}\n          path={path}\n          disabled={disabled}\n          context={context}\n          validation={validationResult}\n          schema={schema}\n          rule={rule}\n        />\n      </div>\n      {operator}\n      {sources}\n      {value}\n      {showCloneButtons && (\n        <div className={classNames?.rule?.clone}>\n          <CloneRuleActionControlElement\n            testID={TestID.cloneRule}\n            label={translations.cloneRule.label}\n            title={translations.cloneRule.title}\n            className={classNamesProp.cloneRule}\n            handleOnClick={cloneRule}\n            level={path.length}\n            path={path}\n            disabled={disabled}\n            context={context}\n            validation={validationResult}\n            ruleOrGroup={rule}\n            schema={schema}\n          />\n        </div>\n      )}\n      {showLockButtons && (\n        <div className={classNames?.rule?.lock}>\n          <LockRuleActionControlElement\n            testID={TestID.lockRule}\n            label={translations.lockRule.label}\n            title={translations.lockRule.title}\n            className={classNamesProp.lockRule}\n            handleOnClick={toggleLockRule}\n            level={path.length}\n            path={path}\n            disabled={disabled}\n            disabledTranslation={\n              parentDisabled ? undefined : translations.lockRuleDisabled\n            }\n            context={context}\n            validation={validationResult}\n            ruleOrGroup={rule}\n            schema={schema}\n          />\n        </div>\n      )}\n      <div className={classNames?.rule?.remove}>\n        <RemoveRuleActionControlElement\n          testID={TestID.removeRule}\n          label={translations.removeRule.label}\n          title={translations.removeRule.title}\n          className={classNamesProp.removeRule}\n          handleOnClick={removeRule}\n          level={path.length}\n          path={path}\n          disabled={disabled}\n          context={context}\n          validation={validationResult}\n          ruleOrGroup={rule}\n          schema={schema}\n        />\n      </div>\n    </>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/query-builder/types.d.ts

@@ -0,0 +1,128 @@
+import type { ComponentType, ReactElement } from 'react';
+import type { QueryBuilderProps as RQBProps, FullField, FullOperator, FullCombinator, ActionProps as RQBActionProps, RuleGroupProps, RuleGroupType, ValueEditorProps, useRuleGroup } from 'react-querybuilder';
+import type { LiteralUnion, PartialDeep } from 'type-fest';
+import type { AsType, RenderPropsChildren, OmitProtectedProps } from '../../types';
+import type { ButtonClassNames, ButtonProps } from '../button/types';
+import type { CheckboxClassNames, CheckboxRenderProps } from '../checkbox/types';
+import type { InputClassNames, InputProps } from '../input/types';
+import type { RadioClassNames } from '../radio/types';
+import type { SelectClassNames, SelectProps, SelectRenderProps } from '../select/types';
+import type { SwitchClassNames } from '../switch/types';
+import type { TextAreaProps, TextAreaClassNames } from '../textarea/types';
+type DefaultRQBProps = RQBProps<RuleGroupType, FullField, FullOperator, FullCombinator>;
+type SupportedClassNames = Pick<Exclude<DefaultRQBProps['controlClassnames'], undefined>, 'addGroup' | 'addRule' | 'cloneGroup' | 'cloneRule' | 'dragHandle' | 'lockGroup' | 'lockRule' | 'removeGroup' | 'removeRule'>;
+export type QueryBuilderClassNames = PartialDeep<{
+    [K in keyof SupportedClassNames]: string;
+} & {
+    queryBuilder: {
+        container: string;
+        queryBuilder: string;
+    };
+    group: {
+        container: string;
+        group: string;
+        header: string;
+        body: string;
+        footer: string;
+        add: string;
+        clone: string;
+        combinator: string;
+        drag: string;
+        lock: string;
+        shift: string;
+        remove: string;
+        toggle: string;
+    };
+    rule: {
+        container: string;
+        rule: string;
+        field: string;
+        operator: string;
+        source: string;
+        values: string;
+        value: string;
+        add: string;
+        clone: string;
+        drag: string;
+        lock: string;
+        shift: string;
+        remove: string;
+        error: string;
+    };
+    button: ButtonClassNames;
+    checkbox: CheckboxClassNames;
+    input: InputClassNames;
+    radio: RadioClassNames;
+    select: SelectClassNames;
+    switch: SwitchClassNames;
+    textarea: TextAreaClassNames;
+}>;
+export type QueryBuilderSizes = 'sm' | 'lg';
+export type QueryBuilderMapping = Partial<{
+    button: Record<QueryBuilderSizes, OmitProtectedProps<ButtonProps>>;
+    error: Record<QueryBuilderSizes, string>;
+    input: Record<QueryBuilderSizes, OmitProtectedProps<InputProps>>;
+    select: Record<QueryBuilderSizes, OmitProtectedProps<SelectProps<object>>>;
+    textarea: Record<QueryBuilderSizes, OmitProtectedProps<TextAreaProps>>;
+}>;
+export type QueryBuilderValueEditors = Record<LiteralUnion<Exclude<ValueEditorProps['type'], null | undefined>, string>, (props: ValueEditorProps) => ReactElement>;
+export type RuleGroupElementsProps = RuleGroupProps & ReturnType<typeof useRuleGroup>;
+export type RuleGroupElements = {
+    ruleGroupBodyElements: ComponentType<RuleGroupElementsProps>;
+    ruleGroupFooterElements: ComponentType<RuleGroupElementsProps>;
+    ruleGroupHeaderElements: ComponentType<RuleGroupElementsProps>;
+};
+type BaseQueryBuilderProps = {
+    classNames?: QueryBuilderClassNames;
+    consistentColumns?: boolean;
+    controlElements?: DefaultRQBProps['controlElements'] & Partial<RuleGroupElements>;
+    icons?: {
+        checkbox?: RenderPropsChildren<CheckboxRenderProps>;
+        select?: RenderPropsChildren<SelectRenderProps>;
+    };
+    mapping?: QueryBuilderMapping;
+    size?: QueryBuilderSizes;
+    valueEditors?: QueryBuilderValueEditors;
+};
+/**
+ * Omitted props are currently unsupported functionality
+ */
+export type QueryBuilderProps = Partial<Omit<DefaultRQBProps, 'showCombinatorsBetweenRules' | 'listsAsArrays'> & BaseQueryBuilderProps>;
+export type ActionProps = AsType<RQBActionProps>;
+export type QueryBuilderContextValue = BaseQueryBuilderProps & Required<Pick<BaseQueryBuilderProps, 'size'>> & {
+    controlElements: RuleGroupElements;
+};
+export type QueryBuilderState = {
+    isDisabled: boolean;
+};
+export type QueryBuilderGroupState = {
+    /**
+     * Columns after the core 4 columns and before the remove rule column
+     */
+    after: number;
+    /**
+     * Columns before the core 4 columns
+     */
+    before: number;
+    /**
+     * Calculated based on enabled features
+     */
+    columns: number;
+    /**
+     * Represents whether the rule or any of its parents are disabled
+     *
+     * RQB also uses this property when a rule is locked
+     */
+    isDisabled: boolean;
+};
+export type QueryBuilderRuleState = {
+    /**
+     * Represents whether the rule or any of its parents are disabled
+     *
+     * RQB also uses this property when a rule is locked
+     */
+    isDisabled: boolean;
+    isDragging: boolean;
+    isDropTarget: boolean;
+};
+export {};

package/dist/components/query-builder/utils.d.ts

@@ -0,0 +1,29 @@
+import type { MouseEvent } from 'react';
+import type { PressEvent } from 'react-aria';
+import type { RuleType, RuleValidator, ValidationResult } from 'react-querybuilder';
+/**
+ * This is required because the C2DS Button supports an onPress event but
+ * QueryBuilder provides a callback that expects a MouseEvent and will error
+ * out if preventDefault is not available as a method.
+ * @param event
+ */
+export declare const pressToMouseEvent: (event: PressEvent) => MouseEvent;
+/**
+ * Validates according to the validator function
+ *
+ * For single-value rules (e.g. 5 is a number), validator function should provide a single conditional
+ * const singleValidator = z.string().min(1);
+ *
+ * For multi-value rules (e.g. using operators such as "between" or "during), validator func can optionally
+ * be a union conditional https://zod.dev/?id=unions to allow validation against either a single value or multiple.
+ * Right and left validators in the tuple do not need to be the same.
+ *
+ * const multiValidator = z.union([
+ *    singleValidator,
+ *    z.tuple([singleValidator, singleValidator])
+ * ])
+ *
+ * @param rule
+ * @param validator
+ */
+export declare const getValidationResult: (rule: RuleType, validator?: RuleValidator) => ValidationResult;

package/dist/components/query-builder/utils.js

@@ -0,0 +1,22 @@
+import { noop } from 'lodash';
+
+const pressToMouseEvent = (event) => ({
+  ...event,
+  preventDefault: noop,
+  stopPropagation: noop
+});
+const getValidationResult = (rule, validator) => {
+  if (!validator) {
+    return { valid: true };
+  }
+  const result = validator(rule);
+  if (typeof result === "boolean") {
+    return { valid: result };
+  }
+  return {
+    valid: result.valid,
+    reasons: result.valid ? [] : result.reasons
+  };
+};
+
+export { getValidationResult, pressToMouseEvent };

package/dist/components/query-builder/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../src/components/query-builder/utils.ts"],"sourcesContent":["import { noop } from 'lodash';\nimport type { MouseEvent } from 'react';\nimport type { PressEvent } from 'react-aria';\nimport type {\n  RuleType,\n  RuleValidator,\n  ValidationResult,\n} from 'react-querybuilder';\n\n/**\n * This is required because the C2DS Button supports an onPress event but\n * QueryBuilder provides a callback that expects a MouseEvent and will error\n * out if preventDefault is not available as a method.\n * @param event\n */\nexport const pressToMouseEvent = (event: PressEvent) =>\n  ({\n    ...event,\n    preventDefault: noop,\n    stopPropagation: noop,\n  }) as unknown as MouseEvent;\n\n/**\n * Validates according to the validator function\n *\n * For single-value rules (e.g. 5 is a number), validator function should provide a single conditional\n * const singleValidator = z.string().min(1);\n *\n * For multi-value rules (e.g. using operators such as \"between\" or \"during), validator func can optionally\n * be a union conditional https://zod.dev/?id=unions to allow validation against either a single value or multiple.\n * Right and left validators in the tuple do not need to be the same.\n *\n * const multiValidator = z.union([\n *    singleValidator,\n *    z.tuple([singleValidator, singleValidator])\n * ])\n *\n * @param rule\n * @param validator\n */\nexport const getValidationResult = (\n  rule: RuleType,\n  validator?: RuleValidator,\n): ValidationResult => {\n  if (!validator) {\n    return { valid: true };\n  }\n\n  const result = validator(rule);\n\n  if (typeof result === 'boolean') {\n    return { valid: result };\n  }\n\n  return {\n    valid: result.valid,\n    reasons: result.valid ? [] : result.reasons,\n  };\n};\n"],"names":[],"mappings":";;;AAea,MAAA,iBAAA,GAAoB,CAAC,KAC/B,MAAA;AAAA,EACC,GAAG,KAAA;AAAA,EACH,cAAgB,EAAA,IAAA;AAAA,EAChB,eAAiB,EAAA,IAAA;AACnB,CAAA,EAAA;AAoBW,MAAA,mBAAA,GAAsB,CACjC,IAAA,EACA,SACqB,KAAA;AACrB,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAO,OAAA,EAAE,OAAO,IAAK,EAAA,CAAA;AAAA,GACvB;AAEA,EAAM,MAAA,MAAA,GAAS,UAAU,IAAI,CAAA,CAAA;AAE7B,EAAI,IAAA,OAAO,WAAW,SAAW,EAAA;AAC/B,IAAO,OAAA,EAAE,OAAO,MAAO,EAAA,CAAA;AAAA,GACzB;AAEA,EAAO,OAAA;AAAA,IACL,OAAO,MAAO,CAAA,KAAA;AAAA,IACd,OAAS,EAAA,MAAA,CAAO,KAAQ,GAAA,KAAK,MAAO,CAAA,OAAA;AAAA,GACtC,CAAA;AACF;;;;"}

package/dist/components/query-builder/value-editor.d.ts

@@ -0,0 +1,4 @@
+import { type ValueEditorProps } from 'react-querybuilder';
+import type { QueryBuilderValueEditors } from './types';
+export declare const defaultValueEditors: QueryBuilderValueEditors;
+export declare function ValueEditor(props: ValueEditorProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/query-builder/value-editor.js

@@ -0,0 +1,74 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { useContext, useCallback } from 'react';
+import { useValueEditor } from 'react-querybuilder';
+import { Checkbox } from '../checkbox/checkbox.js';
+import { Input } from '../input/input.js';
+import { RadioGroup, Radio } from '../radio/radio.js';
+import { Switch } from '../switch/switch.js';
+import { TextArea } from '../textarea/textarea.js';
+import { QueryBuilderContext, multiValueOperators } from './constants.js';
+import { getValidationResult } from './utils.js';
+import { ValueSelector } from './value-selector.js';
+
+function CheckboxValueEditor({ disabled, fieldData: { name, validator }, handleOnChange, rule, value }) {
+  const { icons } = useContext(QueryBuilderContext);
+  const { valid } = getValidationResult(rule, validator);
+  return jsx(Checkbox, { isDisabled: disabled, isSelected: value, onChange: handleOnChange, "aria-invalid": !valid, "aria-label": name, children: icons?.checkbox });
+}
+function RadioGroupValueEditor({ disabled, fieldData: { name, validator }, handleOnChange, rule, value, values }) {
+  const { valid } = getValidationResult(rule, validator);
+  return jsx(RadioGroup, { value, isDisabled: disabled, onChange: handleOnChange, "aria-invalid": !valid, "aria-label": name, children: values?.map((option) => jsx(Radio, { value: option.value, children: option.label }, option.name)) });
+}
+const defaultOptions = [];
+function SelectValueEditor({ disabled, fieldData: { name, validator }, handleOnChange, rule, type, value, values = defaultOptions, ...rest }) {
+  const { valid } = getValidationResult(rule, validator);
+  return jsx(ValueSelector, { ...rest, disabled, multiple: type === "multiselect", options: values, title: name, validation: !valid, value, handleOnChange });
+}
+function SwitchValueEditor({ disabled, fieldData: { name, validator }, handleOnChange, rule, value }) {
+  const { valid } = getValidationResult(rule, validator);
+  return jsx(Switch, { isDisabled: disabled, isSelected: Boolean(value), onChange: handleOnChange, "aria-invalid": !valid, "aria-label": name });
+}
+function TextValueEditor({ disabled, fieldData: { name, placeholder, validator }, handleOnChange, inputType, rule, value }) {
+  const { valid } = getValidationResult(rule, validator);
+  const handleChange = useCallback((event) => handleOnChange(event.target.value), [handleOnChange]);
+  return jsx(Input, { disabled, placeholder, type: inputType ?? "text", value, onChange: handleChange, "aria-invalid": !valid, "aria-label": name });
+}
+function TextareaValueEditor({ disabled, fieldData: { name, placeholder, validator }, handleOnChange, rule, value }) {
+  const { valid } = getValidationResult(rule, validator);
+  const handleChange = useCallback((event) => handleOnChange(event.currentTarget.textContent), [handleOnChange]);
+  return jsx(TextArea, { disabled, placeholder, value, onChange: handleChange, "aria-label": name, "aria-invalid": !valid });
+}
+const defaultValueEditors = {
+  checkbox: CheckboxValueEditor,
+  multiselect: SelectValueEditor,
+  radio: RadioGroupValueEditor,
+  select: SelectValueEditor,
+  switch: SwitchValueEditor,
+  text: TextValueEditor,
+  textarea: TextareaValueEditor
+};
+function ValueEditor(props) {
+  const { fieldData: { id, valueEditorType }, operator, rule: ruleProp } = props;
+  const { classNames, valueEditors } = useContext(QueryBuilderContext);
+  const { valueAsArray, multiValueHandler } = useValueEditor({
+    ...props,
+    skipHook: true
+  });
+  const rule = useCallback((index) => ({
+    ...ruleProp,
+    value: valueAsArray[index]
+  }), [ruleProp, valueAsArray]);
+  const handleRangeStartChange = useCallback((value) => multiValueHandler(value, 0), [multiValueHandler]);
+  const handleRangeEndChange = useCallback((value) => multiValueHandler(value, 1), [multiValueHandler]);
+  const type = (typeof valueEditorType === "function" ? valueEditorType(operator) : valueEditorType) ?? "text";
+  const Editor = valueEditors?.[type];
+  if (operator === "null" || operator === "notNull" || !Editor) {
+    return null;
+  }
+  if (multiValueOperators.includes(operator)) {
+    return jsx(Fragment, { children: ["start", "end"].map((term, index) => jsx("div", { className: classNames?.rule?.value, children: jsx(Editor, { ...props, rule: rule(index), value: valueAsArray[index], handleOnChange: !index ? handleRangeStartChange : handleRangeEndChange }) }, `${id}-${term}`)) });
+  }
+  return jsx("div", { className: classNames?.rule?.value, children: jsx(Editor, { ...props }) });
+}
+
+export { ValueEditor, defaultValueEditors };

package/dist/components/query-builder/value-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"value-editor.js","sources":["../../../src/components/query-builder/value-editor.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type FormEvent,\n  useCallback,\n  useContext,\n} from 'react';\nimport { useValueEditor, type ValueEditorProps } from 'react-querybuilder';\nimport { Checkbox } from '../checkbox';\nimport { Input, type InputType } from '../input';\nimport { Radio, RadioGroup } from '../radio';\nimport { Switch } from '../switch';\nimport { TextArea } from '../textarea';\nimport { multiValueOperators, QueryBuilderContext } from './constants';\nimport type { QueryBuilderValueEditors } from './types';\nimport { getValidationResult } from './utils';\nimport { ValueSelector } from './value-selector';\n\nfunction CheckboxValueEditor({\n  disabled,\n  fieldData: { name, validator },\n  handleOnChange,\n  rule,\n  value,\n}: ValueEditorProps) {\n  const { icons } = useContext(QueryBuilderContext);\n  const { valid } = getValidationResult(rule, validator);\n\n  return (\n    <Checkbox\n      isDisabled={disabled}\n      isSelected={value}\n      onChange={handleOnChange}\n      aria-invalid={!valid}\n      aria-label={name}\n    >\n      {icons?.checkbox}\n    </Checkbox>\n  );\n}\n\nfunction RadioGroupValueEditor({\n  disabled,\n  fieldData: { name, validator },\n  handleOnChange,\n  rule,\n  value,\n  values,\n}: ValueEditorProps) {\n  const { valid } = getValidationResult(rule, validator);\n\n  return (\n    <RadioGroup\n      value={value}\n      isDisabled={disabled}\n      onChange={handleOnChange}\n      aria-invalid={!valid}\n      aria-label={name}\n    >\n      {values?.map((option) => (\n        <Radio key={option.name} value={option.value}>\n          {option.label}\n        </Radio>\n      ))}\n    </RadioGroup>\n  );\n}\n\nconst defaultOptions: unknown[] = [];\n\nfunction SelectValueEditor({\n  disabled,\n  fieldData: { name, validator },\n  handleOnChange,\n  rule,\n  type,\n  value,\n  values = defaultOptions,\n  ...rest\n}: ValueEditorProps) {\n  const { valid } = getValidationResult(rule, validator);\n\n  return (\n    <ValueSelector\n      {...rest}\n      disabled={disabled}\n      multiple={type === 'multiselect'}\n      options={values}\n      title={name}\n      validation={!valid}\n      value={value}\n      handleOnChange={handleOnChange}\n    />\n  );\n}\n\nfunction SwitchValueEditor({\n  disabled,\n  fieldData: { name, validator },\n  handleOnChange,\n  rule,\n  value,\n}: ValueEditorProps) {\n  const { valid } = getValidationResult(rule, validator);\n\n  return (\n    <Switch\n      isDisabled={disabled}\n      isSelected={Boolean(value)}\n      onChange={handleOnChange}\n      aria-invalid={!valid}\n      aria-label={name}\n    />\n  );\n}\n\nfunction TextValueEditor({\n  disabled,\n  fieldData: { name, placeholder, validator },\n  handleOnChange,\n  inputType,\n  rule,\n  value,\n}: ValueEditorProps) {\n  const { valid } = getValidationResult(rule, validator);\n\n  const handleChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) =>\n      handleOnChange(event.target.value),\n    [handleOnChange],\n  );\n\n  return (\n    <Input\n      disabled={disabled}\n      placeholder={placeholder}\n      type={(inputType as InputType) ?? 'text'}\n      value={value}\n      onChange={handleChange}\n      aria-invalid={!valid}\n      aria-label={name}\n    />\n  );\n}\n\nfunction TextareaValueEditor({\n  disabled,\n  fieldData: { name, placeholder, validator },\n  handleOnChange,\n  rule,\n  value,\n}: ValueEditorProps) {\n  const { valid } = getValidationResult(rule, validator);\n\n  const handleChange = useCallback(\n    (event: FormEvent<HTMLSpanElement>) =>\n      handleOnChange(event.currentTarget.textContent),\n    [handleOnChange],\n  );\n\n  return (\n    <TextArea\n      disabled={disabled}\n      placeholder={placeholder}\n      value={value}\n      onChange={handleChange}\n      aria-label={name}\n      aria-invalid={!valid}\n    />\n  );\n}\n\nexport const defaultValueEditors: QueryBuilderValueEditors = {\n  checkbox: CheckboxValueEditor,\n  multiselect: SelectValueEditor,\n  radio: RadioGroupValueEditor,\n  select: SelectValueEditor,\n  switch: SwitchValueEditor,\n  text: TextValueEditor,\n  textarea: TextareaValueEditor,\n};\n\nexport function ValueEditor(props: ValueEditorProps) {\n  const {\n    fieldData: { id, valueEditorType },\n    operator,\n    rule: ruleProp,\n  } = props;\n\n  const { classNames, valueEditors } = useContext(QueryBuilderContext);\n\n  const { valueAsArray, multiValueHandler } = useValueEditor({\n    ...props,\n    skipHook: true,\n  });\n\n  const rule = useCallback(\n    (index: number) => ({\n      ...ruleProp,\n      value: valueAsArray[index],\n    }),\n    [ruleProp, valueAsArray],\n  );\n\n  const handleRangeStartChange = useCallback(\n    (value: string) => multiValueHandler(value, 0),\n    [multiValueHandler],\n  );\n\n  const handleRangeEndChange = useCallback(\n    (value: string) => multiValueHandler(value, 1),\n    [multiValueHandler],\n  );\n\n  const type =\n    (typeof valueEditorType === 'function'\n      ? valueEditorType(operator)\n      : valueEditorType) ?? 'text';\n\n  const Editor = valueEditors?.[type];\n\n  if (operator === 'null' || operator === 'notNull' || !Editor) {\n    return null;\n  }\n\n  if (multiValueOperators.includes(operator)) {\n    return (\n      <>\n        {['start', 'end'].map((term, index) => (\n          <div key={`${id}-${term}`} className={classNames?.rule?.value}>\n            <Editor\n              {...props}\n              rule={rule(index)}\n              value={valueAsArray[index]}\n              handleOnChange={\n                !index ? handleRangeStartChange : handleRangeEndChange\n              }\n            />\n          </div>\n        ))}\n      </>\n    );\n  }\n\n  return (\n    <div className={classNames?.rule?.value}>\n      <Editor {...props} />\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/query-builder/value-selector.d.ts

@@ -0,0 +1,2 @@
+import { type FullOption, type ValueSelectorProps } from 'react-querybuilder';
+export declare function ValueSelector<T extends FullOption = FullOption>({ handleOnChange, listsAsArrays, options: optionsProp, multiple, title, validation, value, ...rest }: ValueSelectorProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/query-builder/value-selector.js

@@ -0,0 +1,28 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useContext, useCallback, useMemo } from 'react';
+import { useValueSelector, isOptionGroupArray } from 'react-querybuilder';
+import { callRenderProps } from '../../utils/props.js';
+import { AriaSection, AriaHeader, AriaSelectValue } from '../aria/aria.js';
+import { Button } from '../button/button.js';
+import { OptionsItem, OptionsList, Options } from '../options/options.js';
+import { Select } from '../select/select.js';
+import { QueryBuilderContext } from './constants.js';
+
+function ValueSelector({ handleOnChange, listsAsArrays, options: optionsProp, multiple, title, validation, value, ...rest }) {
+  const { icons, size } = useContext(QueryBuilderContext);
+  const { onChange, val } = useValueSelector({
+    handleOnChange,
+    listsAsArrays,
+    multiple,
+    value
+  });
+  const handleSelectionChange = useCallback((selection) => onChange(`${selection}`), [onChange]);
+  const handleMultiSelectChange = useCallback((keys) => onChange([...keys].join(", ")), [onChange]);
+  const options = useMemo(() => isOptionGroupArray(optionsProp) ? optionsProp.map((section) => jsxs(AriaSection, { children: [jsx(AriaHeader, { children: section.label }), section.options.map((option) => jsx(OptionsItem, { id: option.name, children: option.label }, option.name))] }, section.label)) : optionsProp.map((option) => jsx(OptionsItem, { id: option.name, children: option.label }, option.name)), [optionsProp]);
+  return multiple ? jsx(
+    OptionsList,
+    { ...rest, selectedKeys: val, selectionMode: "multiple", size, onSelectionChange: handleMultiSelectChange, "aria-label": title, children: options }
+  ) : jsx(Select, { ...rest, selectedKey: Array.isArray(val) ? val[0] : val, size, isInvalid: title === "Value" && !validation, onSelectionChange: handleSelectionChange, "aria-label": title, children: (renderProps) => jsxs(Fragment, { children: [jsxs(Button, { children: [jsx(AriaSelectValue, { children: ({ selectedText }) => selectedText }), callRenderProps(icons?.select, renderProps)] }), jsx(Options, { children: jsx(OptionsList, { children: options }) })] }) });
+}
+
+export { ValueSelector };

package/dist/components/query-builder/value-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"value-selector.js","sources":["../../../src/components/query-builder/value-selector.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo } from 'react';\nimport type { Key } from 'react-aria';\nimport type { Selection } from 'react-aria-components';\nimport {\n  type FullOption,\n  isOptionGroupArray,\n  useValueSelector,\n  type ValueSelectorProps,\n} from 'react-querybuilder';\nimport { callRenderProps } from '../../utils';\nimport { AriaHeader, AriaSection, AriaSelectValue } from '../aria';\nimport { Button } from '../button';\nimport { Options, OptionsItem, OptionsList } from '../options';\nimport { Select } from '../select';\nimport { QueryBuilderContext } from './constants';\n\nexport function ValueSelector<T extends FullOption = FullOption>({\n  handleOnChange,\n  listsAsArrays,\n  options: optionsProp,\n  multiple,\n  title,\n  validation,\n  value,\n  ...rest\n}: ValueSelectorProps<T>) {\n  const { icons, size } = useContext(QueryBuilderContext);\n\n  const { onChange, val } = useValueSelector({\n    handleOnChange,\n    listsAsArrays,\n    multiple,\n    value,\n  });\n\n  const handleSelectionChange = useCallback(\n    (selection: Key) => onChange(`${selection}`),\n    [onChange],\n  );\n\n  const handleMultiSelectChange = useCallback(\n    (keys: Selection) => onChange([...keys].join(', ')),\n    [onChange],\n  );\n\n  const options = useMemo(\n    () =>\n      isOptionGroupArray(optionsProp)\n        ? optionsProp.map((section) => (\n            <AriaSection key={section.label}>\n              <AriaHeader>{section.label}</AriaHeader>\n              {section.options.map((option) => (\n                <OptionsItem id={option.name} key={option.name}>\n                  {option.label}\n                </OptionsItem>\n              ))}\n            </AriaSection>\n          ))\n        : optionsProp.map((option) => (\n            <OptionsItem id={option.name} key={option.name}>\n              {option.label}\n            </OptionsItem>\n          )),\n    [optionsProp],\n  );\n\n  return multiple ? (\n    <OptionsList // TODO: Replace with ChipField when it exists\n      {...rest}\n      selectedKeys={val}\n      selectionMode='multiple'\n      size={size}\n      onSelectionChange={handleMultiSelectChange}\n      aria-label={title}\n    >\n      {options}\n    </OptionsList>\n  ) : (\n    <Select\n      {...rest}\n      selectedKey={Array.isArray(val) ? val[0] : val}\n      size={size}\n      isInvalid={title === 'Value' && !validation}\n      onSelectionChange={handleSelectionChange}\n      aria-label={title}\n    >\n      {(renderProps) => (\n        <>\n          <Button>\n            <AriaSelectValue>\n              {({ selectedText }) => selectedText}\n            </AriaSelectValue>\n            {callRenderProps(icons?.select, renderProps)}\n          </Button>\n          <Options>\n            <OptionsList>{options}</OptionsList>\n          </Options>\n        </>\n      )}\n    </Select>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/radio/index.d.ts

@@ -0,0 +1,3 @@
+export { Radio, RadioContext, RadioGroup, RadioGroupContext } from './radio';
+export { radioClassNames, radioColorVars, radioSpaceVars, radioGroupStateVars, radioStateVars, } from './radio.css';
+export { type RadioAlignment, type RadioClassNames, type RadioContextProps, type RadioGroupProps, type RadioGroupState, type RadioProps, type RadioState, } from './types';

package/dist/components/radio/radio.css.d.ts

@@ -0,0 +1,34 @@
+import type { RadioClassNames } from './types';
+export declare const radioContainer: string;
+export declare const radioGroupContainer: string;
+export declare const radioColorVars: {
+    border: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const radioSpaceVars: {
+    diameter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    elementGap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const radioStateVars: {
+    alignInput: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocused: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isFocusVisible: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isHovered: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isPressed: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isReadOnly: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isSelected: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isInvalid: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isRequired: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const radioGroupStateVars: {
+    alignInput: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    orientation: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isDisabled: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isReadOnly: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isInvalid: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    isRequired: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const radioClassNames: RadioClassNames;

package/dist/components/radio/radio.d.ts

@@ -0,0 +1,16 @@
+import { type ContextValue } from 'react-aria-components';
+import type { RadioGroupProps, RadioRenderProps, RadioContextProps } from './types';
+export declare const RadioContext: import("react").Context<ContextValue<RadioContextProps, HTMLLabelElement>>;
+export declare const Radio: (props: Omit<import("react-aria-components").RadioProps, "children" | "className" | "style"> & {
+    children?: import("../..").RenderPropsChildren<RadioRenderProps>;
+    label?: string;
+    classNames?: import("./types").RadioClassNames;
+    alignInput?: import("./types").RadioAlignment;
+} & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement | null;
+export declare const RadioGroupContext: import("react").Context<ContextValue<RadioGroupProps, HTMLDivElement>>;
+export declare const RadioGroup: (props: Omit<import("react-aria-components").RadioGroupProps, "className" | "style"> & Pick<{
+    children?: import("../..").RenderPropsChildren<RadioRenderProps>;
+    label?: string;
+    classNames?: import("./types").RadioClassNames;
+    alignInput?: import("./types").RadioAlignment;
+}, "classNames" | "label" | "alignInput"> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;