@infomaximum/ui-kit 0.9.1

package/dist/components/Radio/Radio.styles.js

@@ -0,0 +1,72 @@
+const radioWrapperClassName = "radio-wrapper";
+const baseRadioWrapperStyle = (theme, disabled) => ({
+  cursor: disabled ? "not-allowed" : "pointer",
+  ...theme.typography.body2
+});
+const getRadioButtonWrapperStyle = (theme, radioTokens, isRenderIcon, checked, disabled) => ({
+  position: "relative",
+  zIndex: checked ? 1 : void 0,
+  color: disabled ? radioTokens.radioTextDisabled : checked ? radioTokens.radioChecked : radioTokens.radioText,
+  backgroundColor: disabled && checked ? radioTokens.radioBorder : disabled ? radioTokens.radioBgDisabled : radioTokens.radioBg,
+  height: theme.controlHeightM,
+  boxSizing: "border-box",
+  paddingInline: isRenderIcon ? radioTokens.radioPaddingIconOnly - 1 : radioTokens.radioPaddingHorizontal - 1,
+  paddingBlock: radioTokens.radioPaddingVertical - 1,
+  borderWidth: 1,
+  borderStyle: "solid",
+  borderColor: checked && !disabled ? radioTokens.radioChecked : radioTokens.radioBorder,
+  borderInlineStartWidth: 0,
+  ":first-of-type": {
+    borderInlineStartWidth: 1,
+    borderStartStartRadius: theme.borderRadiusM,
+    borderEndStartRadius: theme.borderRadiusM
+  },
+  ":last-of-type": {
+    borderStartEndRadius: theme.borderRadiusM,
+    borderEndEndRadius: theme.borderRadiusM
+  },
+  ":not(:first-of-type)::before": {
+    content: "''",
+    position: "absolute",
+    width: 1,
+    height: "100%",
+    backgroundColor: checked && !disabled ? radioTokens.radioChecked : radioTokens.radioBorder,
+    paddingBlock: 1,
+    insetBlockStart: -1,
+    insetInlineStart: -1
+  },
+  ":hover": {
+    color: disabled || checked ? void 0 : "#2CBFBA"
+    // TODO: buttonTextHover thrush50 как это относится к radio ?
+  }
+});
+const getRadioWrapperStyle = (radioTokens, disabled) => ({
+  display: "inline-flex",
+  alignItems: "center",
+  color: disabled ? radioTokens.radioTextDisabled : radioTokens.radioText
+});
+const iconWrapperStyle = (theme) => ({
+  display: "flex",
+  fontSize: theme.iconM,
+  height: "100%",
+  justifyContent: "center",
+  alignItems: "center"
+});
+const baseRadioLabelStyle = {
+  "&&": {
+    fontFamily: "inherit",
+    fontSize: "inherit"
+  }
+};
+const radioLabelStyle = (theme) => ({
+  paddingInline: theme.paddingM
+});
+export {
+  baseRadioLabelStyle,
+  baseRadioWrapperStyle,
+  getRadioButtonWrapperStyle,
+  getRadioWrapperStyle,
+  iconWrapperStyle,
+  radioLabelStyle,
+  radioWrapperClassName
+};

package/dist/components/Radio/Radio.tokens.d.ts

@@ -0,0 +1,16 @@
+import { Theme } from 'themes';
+export declare const getRadioTokens: (theme: Theme) => {
+    radioBg: "#FFFFFF";
+    radioBgDisabled: "#F0F0F0";
+    radioBorder: "#D9D9D9";
+    radioText: "#262626";
+    radioTextDisabled: "#8C8C8C";
+    radioHover: "#50CCC4";
+    radioChecked: "#0CB3B3";
+    radioButtonBgCheckedDisabled: "#D9D9D9";
+    radioPaddingVertical: 4;
+    radioPaddingHorizontal: 12;
+    radioPaddingIconOnly: 6;
+    radioDotSize: 8;
+};
+export type RadioTokens = ReturnType<typeof getRadioTokens>;

package/dist/components/Radio/Radio.tokens.js

@@ -0,0 +1,17 @@
+const getRadioTokens = (theme) => ({
+  radioBg: theme.bgContainer,
+  radioBgDisabled: theme.bgContainerDisabled,
+  radioBorder: theme.lineBorder,
+  radioText: theme.textPrimary,
+  radioTextDisabled: theme.textDisabled,
+  radioHover: theme.primaryHover,
+  radioChecked: theme.primaryBase,
+  radioButtonBgCheckedDisabled: theme.bgContainerDisabledContrast,
+  radioPaddingVertical: theme.x1,
+  radioPaddingHorizontal: theme.x3,
+  radioPaddingIconOnly: theme.x1AndHalf,
+  radioDotSize: theme.x2
+});
+export {
+  getRadioTokens
+};

package/dist/components/Radio/Radio.types.d.ts

@@ -0,0 +1,9 @@
+import { ComponentType, PropsWithChildren, ReactNode } from 'react';
+import { RadioGroupProps } from './components/RadioGroup/RadioGroup.types';
+import { RadioInternalProps } from './components/RadioInternal/RadioInternal.types';
+export interface RadioProps extends PropsWithChildren, Omit<RadioInternalProps, "hideRadioInput"> {
+    icon?: ReactNode;
+}
+export interface WithGroup {
+    Group: ComponentType<RadioGroupProps>;
+}

package/dist/components/Radio/components/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { RadioGroupProps } from './RadioGroup.types';
+export declare const RadioGroup: FC<RadioGroupProps>;

package/dist/components/Radio/components/RadioGroup/RadioGroup.js

@@ -0,0 +1,58 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { useCallback, useMemo } from "react";
+import { RadioGroupContext } from "../../contexts/RadioGroupContext.js";
+import { useMergedState } from "../../hooks/useMergeState/useMergeState.js";
+import { Radio } from "../../Radio.js";
+import { isString, isNumber } from "lodash-es";
+import { getRadioGroupStyle } from "./RadioGroup.styles.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const RadioGroupComponent = (props) => {
+  const {
+    defaultValue,
+    value: valueProp,
+    name: nameProp,
+    disabled = false,
+    optionType = "default",
+    buttonType = "text",
+    options,
+    onChange,
+    children
+  } = props;
+  const theme = useTheme();
+  const isButtonType = optionType === "button";
+  const [value, setValue] = useMergedState(defaultValue, {
+    value: valueProp
+  });
+  const handleRadioChange = useCallback((event) => {
+    const lastValue = value;
+    const val = event.target.value;
+    if (!("value" in props)) {
+      setValue(val);
+    }
+    if (val !== lastValue) {
+      onChange == null ? void 0 : onChange(event);
+    }
+  }, [value, setValue, onChange]);
+  const contextValue = useMemo(() => ({
+    value,
+    disabled,
+    name: nameProp,
+    optionType,
+    buttonType,
+    onChange: handleRadioChange
+  }), [buttonType, disabled, handleRadioChange, nameProp, optionType, value]);
+  let childrenToRender = children;
+  if (options && options.length > 0) {
+    childrenToRender = options.map((option) => {
+      if (isString(option) || isNumber(option)) {
+        return /* @__PURE__ */ jsx(Radio, { disabled, value: option, checked: value === option, children: option }, option.toString());
+      }
+      return /* @__PURE__ */ jsx(Radio, { disabled: option.disabled || disabled, value: option.value, checked: value === option.value, icon: option.icon, children: option.label }, `radio-group-value-options-${option.value}`);
+    });
+  }
+  return /* @__PURE__ */ jsx("div", { css: getRadioGroupStyle(theme, isButtonType), children: /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: contextValue, children: childrenToRender }) });
+};
+const RadioGroup = RadioGroupComponent;
+export {
+  RadioGroup
+};

package/dist/components/Radio/components/RadioGroup/RadioGroup.styles.d.ts

@@ -0,0 +1,5 @@
+import { Theme } from 'themes';
+export declare const getRadioGroupStyle: (theme: Theme, isButtonType: boolean) => {
+    readonly display: "inline-flex";
+    readonly columnGap: 8 | undefined;
+};

package/dist/components/Radio/components/RadioGroup/RadioGroup.styles.js

@@ -0,0 +1,7 @@
+const getRadioGroupStyle = (theme, isButtonType) => ({
+  display: "inline-flex",
+  columnGap: isButtonType ? void 0 : theme.spaceM
+});
+export {
+  getRadioGroupStyle
+};

package/dist/components/Radio/components/RadioGroup/RadioGroup.types.d.ts

@@ -0,0 +1,11 @@
+import { RadioProps } from '../../Radio.types';
+import { HTMLAttributes, PropsWithChildren, ReactNode } from 'react';
+interface RadioOptionType extends Pick<RadioProps, "value" | "disabled" | "icon"> {
+    label?: ReactNode;
+}
+export interface RadioGroupProps extends PropsWithChildren, Pick<RadioProps, "disabled" | "name" | "value" | "onChange">, Pick<HTMLAttributes<HTMLElement>, "defaultValue"> {
+    options?: (string | number | RadioOptionType)[];
+    optionType?: "default" | "button";
+    buttonType?: "text" | "icon";
+}
+export {};

package/dist/components/Radio/components/RadioInternal/RadioInternal.d.ts

@@ -0,0 +1,2 @@
+import { RadioInternalProps } from './RadioInternal.types';
+export declare const RadioInternal: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<RadioInternalProps & import('react').RefAttributes<HTMLInputElement>>>;

package/dist/components/Radio/components/RadioInternal/RadioInternal.js

@@ -0,0 +1,52 @@
+import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef, useMemo, memo } from "react";
+import { useMergedState } from "../../hooks/useMergeState/useMergeState.js";
+import { getRadioTokens } from "../../Radio.tokens.js";
+import { hiddenRadioStyle, radioStyleStyle, baseRadioInputStyle, hiddenRadioInputStyle, getRadioInputStyle, radioInnerClassName, getRadioInnerStyle } from "./RadioInternal.styles.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const RadioInternalComponent = forwardRef((props, ref) => {
+  const {
+    checked: checkedProp,
+    defaultChecked = false,
+    disabled = false,
+    autoFocus = false,
+    value,
+    hideRadioInput,
+    onChange,
+    ...restProps
+  } = props;
+  const theme = useTheme();
+  const radioTokens = useMemo(() => getRadioTokens(theme), [theme]);
+  const [checked, setChecked] = useMergedState(defaultChecked, {
+    value: checkedProp
+  });
+  const handleChange = (e) => {
+    if (disabled) {
+      return;
+    }
+    if (!("checked" in props)) {
+      setChecked(e.target.checked);
+    }
+    onChange == null ? void 0 : onChange({
+      target: {
+        checked: e.target.checked,
+        value
+      },
+      stopPropagation() {
+        e.stopPropagation();
+      },
+      preventDefault() {
+        e.preventDefault();
+      },
+      nativeEvent: e.nativeEvent
+    });
+  };
+  return /* @__PURE__ */ jsxs("span", { css: hideRadioInput ? hiddenRadioStyle : radioStyleStyle, children: [
+    /* @__PURE__ */ jsx("input", { ...restProps, ref, type: "radio", css: [baseRadioInputStyle, hideRadioInput ? hiddenRadioInputStyle : getRadioInputStyle(theme, disabled), process.env.NODE_ENV === "production" ? "" : ";label:RadioInternalComponent;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvUmFkaW8vY29tcG9uZW50cy9SYWRpb0ludGVybmFsL1JhZGlvSW50ZXJuYWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStEUSIsImZpbGUiOiIvYnVpbGRzL2Zyb250ZW5kL2xpYnMvdWkta2l0L3NyYy9jb21wb25lbnRzL1JhZGlvL2NvbXBvbmVudHMvUmFkaW9JbnRlcm5hbC9SYWRpb0ludGVybmFsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGZvcndhcmRSZWYsIG1lbW8sIHVzZU1lbW8sIHR5cGUgQ2hhbmdlRXZlbnRIYW5kbGVyIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgdHlwZSB7IFJhZGlvSW50ZXJuYWxQcm9wcyB9IGZyb20gXCIuL1JhZGlvSW50ZXJuYWwudHlwZXNcIjtcbmltcG9ydCB7IHVzZU1lcmdlZFN0YXRlIH0gZnJvbSBcImNvbXBvbmVudHMvUmFkaW8vaG9va3MvdXNlTWVyZ2VTdGF0ZVwiO1xuaW1wb3J0IHsgdXNlVGhlbWUgfSBmcm9tIFwiaG9va3MvdXNlVGhlbWVcIjtcbmltcG9ydCB7IGdldFJhZGlvVG9rZW5zIH0gZnJvbSBcImNvbXBvbmVudHMvUmFkaW8vUmFkaW8udG9rZW5zXCI7XG5pbXBvcnQge1xuICBiYXNlUmFkaW9JbnB1dFN0eWxlLFxuICBnZXRSYWRpb0lubmVyU3R5bGUsXG4gIGdldFJhZGlvSW5wdXRTdHlsZSxcbiAgaGlkZGVuUmFkaW9JbnB1dFN0eWxlLFxuICBoaWRkZW5SYWRpb1N0eWxlLFxuICByYWRpb0lubmVyQ2xhc3NOYW1lLFxuICByYWRpb1N0eWxlU3R5bGUsXG59IGZyb20gXCIuL1JhZGlvSW50ZXJuYWwuc3R5bGVzXCI7XG5cbmNvbnN0IFJhZGlvSW50ZXJuYWxDb21wb25lbnQgPSBmb3J3YXJkUmVmPEhUTUxJbnB1dEVsZW1lbnQsIFJhZGlvSW50ZXJuYWxQcm9wcz4oKHByb3BzLCByZWYpID0+IHtcbiAgY29uc3Qge1xuICAgIGNoZWNrZWQ6IGNoZWNrZWRQcm9wLFxuICAgIGRlZmF1bHRDaGVja2VkID0gZmFsc2UsXG4gICAgZGlzYWJsZWQgPSBmYWxzZSxcbiAgICBhdXRvRm9jdXMgPSBmYWxzZSxcbiAgICB2YWx1ZSxcbiAgICBoaWRlUmFkaW9JbnB1dCxcbiAgICBvbkNoYW5nZSxcbiAgICAuLi5yZXN0UHJvcHNcbiAgfSA9IHByb3BzO1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG4gIGNvbnN0IHJhZGlvVG9rZW5zID0gdXNlTWVtbygoKSA9PiBnZXRSYWRpb1Rva2Vucyh0aGVtZSksIFt0aGVtZV0pO1xuXG4gIGNvbnN0IFtjaGVja2VkLCBzZXRDaGVja2VkXSA9IHVzZU1lcmdlZFN0YXRlKGRlZmF1bHRDaGVja2VkLCB7XG4gICAgdmFsdWU6IGNoZWNrZWRQcm9wLFxuICB9KTtcblxuICBjb25zdCBoYW5kbGVDaGFuZ2U6IENoYW5nZUV2ZW50SGFuZGxlcjxIVE1MSW5wdXRFbGVtZW50PiA9IChlKSA9PiB7XG4gICAgaWYgKGRpc2FibGVkKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgaWYgKCEoXCJjaGVja2VkXCIgaW4gcHJvcHMpKSB7XG4gICAgICBzZXRDaGVja2VkKGUudGFyZ2V0LmNoZWNrZWQpO1xuICAgIH1cblxuICAgIG9uQ2hhbmdlPy4oe1xuICAgICAgdGFyZ2V0OiB7XG4gICAgICAgIGNoZWNrZWQ6IGUudGFyZ2V0LmNoZWNrZWQsXG4gICAgICAgIHZhbHVlLFxuICAgICAgfSxcbiAgICAgIHN0b3BQcm9wYWdhdGlvbigpIHtcbiAgICAgICAgZS5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICAgIH0sXG4gICAgICBwcmV2ZW50RGVmYXVsdCgpIHtcbiAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgfSxcbiAgICAgIG5hdGl2ZUV2ZW50OiBlLm5hdGl2ZUV2ZW50LFxuICAgIH0pO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPHNwYW4gY3NzPXtoaWRlUmFkaW9JbnB1dCA/IGhpZGRlblJhZGlvU3R5bGUgOiByYWRpb1N0eWxlU3R5bGV9PlxuICAgICAgPGlucHV0XG4gICAgICAgIHsuLi5yZXN0UHJvcHN9XG4gICAgICAgIHJlZj17cmVmfVxuICAgICAgICB0eXBlPVwicmFkaW9cIlxuICAgICAgICBjc3M9e1tcbiAgICAgICAgICBiYXNlUmFkaW9JbnB1dFN0eWxlLFxuICAgICAgICAgIGhpZGVSYWRpb0lucHV0ID8gaGlkZGVuUmFkaW9JbnB1dFN0eWxlIDogZ2V0UmFkaW9JbnB1dFN0eWxlKHRoZW1lLCBkaXNhYmxlZCksXG4gICAgICAgIF19XG4gICAgICAgIG9uQ2hhbmdlPXtoYW5kbGVDaGFuZ2V9XG4gICAgICAgIGNoZWNrZWQ9e2NoZWNrZWR9XG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgYXV0b0ZvY3VzPXthdXRvRm9jdXN9XG4gICAgICAgIHZhbHVlPXt2YWx1ZX1cbiAgICAgIC8+XG4gICAgICA8c3BhblxuICAgICAgICBjbGFzc05hbWU9e3JhZGlvSW5uZXJDbGFzc05hbWV9XG4gICAgICAgIGNzcz17aGlkZVJhZGlvSW5wdXQgPyB1bmRlZmluZWQgOiBnZXRSYWRpb0lubmVyU3R5bGUodGhlbWUsIHJhZGlvVG9rZW5zLCBjaGVja2VkLCBkaXNhYmxlZCl9XG4gICAgICAvPlxuICAgIDwvc3Bhbj5cbiAgKTtcbn0pO1xuXG5leHBvcnQgY29uc3QgUmFkaW9JbnRlcm5hbCA9IG1lbW8oUmFkaW9JbnRlcm5hbENvbXBvbmVudCk7XG4iXX0= */"], onChange: handleChange, checked, disabled, autoFocus, value }),
+    /* @__PURE__ */ jsx("span", { className: radioInnerClassName, css: hideRadioInput ? void 0 : getRadioInnerStyle(theme, radioTokens, checked, disabled) })
+  ] });
+});
+const RadioInternal = memo(RadioInternalComponent);
+export {
+  RadioInternal
+};

package/dist/components/Radio/components/RadioInternal/RadioInternal.styles.d.ts

@@ -0,0 +1,61 @@
+import { RadioTokens } from 'components/Radio/Radio.tokens';
+import { Theme } from 'themes';
+export declare const radioInnerClassName = "radio-inner";
+export declare const hiddenRadioStyle: {
+    readonly position: "absolute";
+    readonly width: "100%";
+    readonly height: "100%";
+    readonly zIndex: -1;
+    readonly insetBlockStart: 0;
+    readonly insetInlineStart: 0;
+};
+export declare const radioStyleStyle: {
+    readonly position: "relative";
+    readonly display: "inline-block";
+};
+export declare const baseRadioInputStyle: {
+    margin: number;
+    opacity: number;
+};
+export declare const hiddenRadioInputStyle: {
+    readonly pointerEvents: "none";
+    readonly width: 0;
+    readonly height: 0;
+};
+export declare const getRadioInputStyle: (theme: Theme, disabled: boolean) => {
+    readonly position: "absolute";
+    readonly inset: 0;
+    readonly zIndex: 1;
+    readonly cursor: "pointer" | "not-allowed";
+    readonly ":focus-visible + .radio-inner": {
+        readonly outline: "2px solid #A3E6DD";
+        readonly outlineOffset: 1;
+    };
+};
+export declare const getRadioInnerStyle: (theme: Theme, radioTokens: RadioTokens, checked: boolean, disabled: boolean) => {
+    readonly position: "relative";
+    readonly display: "block";
+    readonly boxSizing: "border-box";
+    readonly width: 16;
+    readonly height: 16;
+    readonly backgroundColor: "#F0F0F0" | "#FFFFFF";
+    readonly borderWidth: 1;
+    readonly borderStyle: "solid";
+    readonly borderColor: "#D9D9D9" | "#0CB3B3";
+    readonly borderRadius: "50%";
+    readonly "::after": {
+        readonly content: "''";
+        readonly display: "block";
+        readonly position: "absolute";
+        readonly top: "50%";
+        readonly left: "50%";
+        readonly transform: "translate(-50%, -50%)";
+        readonly width: 8;
+        readonly height: 8;
+        readonly borderRadius: "50%";
+        readonly backgroundColor: "#8C8C8C" | "#0CB3B3" | undefined;
+    };
+    readonly ".radio-wrapper:hover &": {
+        readonly borderColor: "#50CCC4" | undefined;
+    };
+};

package/dist/components/Radio/components/RadioInternal/RadioInternal.styles.js

@@ -0,0 +1,70 @@
+import { radioWrapperClassName } from "../../Radio.styles.js";
+const radioInnerClassName = "radio-inner";
+const hiddenRadioStyle = {
+  position: "absolute",
+  width: "100%",
+  height: "100%",
+  zIndex: -1,
+  insetBlockStart: 0,
+  insetInlineStart: 0
+};
+const radioStyleStyle = {
+  position: "relative",
+  display: "inline-block"
+};
+const baseRadioInputStyle = {
+  margin: 0,
+  opacity: 0
+};
+const hiddenRadioInputStyle = {
+  pointerEvents: "none",
+  width: 0,
+  height: 0
+};
+const getRadioInputStyle = (theme, disabled) => ({
+  position: "absolute",
+  inset: 0,
+  zIndex: 1,
+  cursor: disabled ? "not-allowed" : "pointer",
+  [`:focus-visible + .${radioInnerClassName}`]: {
+    outline: `2px solid ${theme.primaryActiveInverse}`,
+    // на макете этого цвета нет, взял на свое усмотрение
+    outlineOffset: 1
+  }
+});
+const getRadioInnerStyle = (theme, radioTokens, checked, disabled) => ({
+  position: "relative",
+  display: "block",
+  boxSizing: "border-box",
+  width: theme.controlInteractiveSize,
+  height: theme.controlInteractiveSize,
+  backgroundColor: disabled ? radioTokens.radioBgDisabled : radioTokens.radioBg,
+  borderWidth: 1,
+  borderStyle: "solid",
+  borderColor: checked && !disabled ? radioTokens.radioChecked : radioTokens.radioBorder,
+  borderRadius: "50%",
+  "::after": {
+    content: "''",
+    display: "block",
+    position: "absolute",
+    top: "50%",
+    left: "50%",
+    transform: "translate(-50%, -50%)",
+    width: radioTokens.radioDotSize,
+    height: radioTokens.radioDotSize,
+    borderRadius: "50%",
+    backgroundColor: disabled && checked ? radioTokens.radioTextDisabled : checked ? radioTokens.radioChecked : void 0
+  },
+  [`.${radioWrapperClassName}:hover &`]: {
+    borderColor: disabled || checked ? void 0 : radioTokens.radioHover
+  }
+});
+export {
+  baseRadioInputStyle,
+  getRadioInnerStyle,
+  getRadioInputStyle,
+  hiddenRadioInputStyle,
+  hiddenRadioStyle,
+  radioInnerClassName,
+  radioStyleStyle
+};

package/dist/components/Radio/components/RadioInternal/RadioInternal.types.d.ts

@@ -0,0 +1,14 @@
+import { ChangeEvent, InputHTMLAttributes } from 'react';
+export interface RadioInternalProps extends Pick<InputHTMLAttributes<HTMLInputElement>, "checked" | "defaultChecked" | "disabled" | "value" | "autoFocus" | "name" | "id" | "onFocus" | "onBlur"> {
+    hideRadioInput?: boolean;
+    onChange?: (e: RadioChangeEvent) => void;
+}
+export interface RadioChangeEvent {
+    target: RadioChangeEventTarget;
+    stopPropagation: () => void;
+    preventDefault: () => void;
+    nativeEvent: ChangeEvent<HTMLInputElement>["nativeEvent"];
+}
+interface RadioChangeEventTarget extends Required<Pick<RadioInternalProps, "checked">>, Pick<RadioInternalProps, "value"> {
+}
+export {};

package/dist/components/Radio/contexts/RadioGroupContext.d.ts

@@ -0,0 +1,4 @@
+import { RadioGroupProps } from '../components/RadioGroup/RadioGroup.types';
+export interface RadioGroupContextProps extends Required<Pick<RadioGroupProps, "optionType" | "buttonType" | "disabled" | "onChange">>, Pick<RadioGroupProps, "value" | "name"> {
+}
+export declare const RadioGroupContext: import('react').Context<RadioGroupContextProps | null>;

package/dist/components/Radio/contexts/RadioGroupContext.js

@@ -0,0 +1,5 @@
+import { createContext } from "react";
+const RadioGroupContext = createContext(null);
+export {
+  RadioGroupContext
+};

package/dist/components/Radio/hooks/useMergeState/index.d.ts

@@ -0,0 +1 @@
+export { useMergedState } from './useMergeState';

package/dist/components/Radio/hooks/useMergeState/useMergeState.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+type Updater1<T> = T | ((prevValue: T) => T);
+export type SetState<T> = (nextValue: Updater1<T>, 
+/**
+ * Will not update state when destroyed.
+ * Developer should make sure this is safe to ignore.
+ */
+ignoreDestroy?: boolean) => void;
+export declare const useLayoutUpdateEffect: typeof React.useEffect;
+type Updater<T> = (updater: T | ((origin: T) => T), ignoreDestroy?: boolean) => void;
+/**
+ * Similar to `useState` but will use props value if provided.
+ * Note that internal use rc-util `useState` hook.
+ */
+export declare function useMergedState<T, R = T>(defaultStateValue: T | (() => T), option?: {
+    defaultValue?: T | (() => T);
+    value?: T;
+    onChange?: (value: T, prevValue: T) => void;
+    postState?: (value: T) => T;
+}): [R, Updater<T>];
+export {};

package/dist/components/Radio/hooks/useMergeState/useMergeState.js

@@ -0,0 +1,94 @@
+import React from "react";
+function useSafeState(defaultValue) {
+  const destroyRef = React.useRef(false);
+  const [value, setValue] = React.useState(defaultValue);
+  React.useEffect(() => {
+    destroyRef.current = false;
+    return () => {
+      destroyRef.current = true;
+    };
+  }, []);
+  function safeSetState(updater, ignoreDestroy) {
+    if (ignoreDestroy && destroyRef.current) {
+      return;
+    }
+    setValue(updater);
+  }
+  return [value, safeSetState];
+}
+function canUseDom() {
+  return !!(typeof window !== "undefined" && window.document && window.document.createElement);
+}
+function useEvent(callback) {
+  const fnRef = React.useRef();
+  fnRef.current = callback;
+  const memoFn = React.useCallback((...args) => {
+    var _a;
+    return (_a = fnRef.current) == null ? void 0 : _a.call(fnRef, ...args);
+  }, []);
+  return memoFn;
+}
+const useInternalLayoutEffect = process.env.NODE_ENV !== "test" && canUseDom() ? React.useLayoutEffect : React.useEffect;
+const useLayoutEffect = (callback, deps) => {
+  const firstMountRef = React.useRef(true);
+  useInternalLayoutEffect(() => {
+    return callback(firstMountRef.current);
+  }, deps);
+  useInternalLayoutEffect(() => {
+    firstMountRef.current = false;
+    return () => {
+      firstMountRef.current = true;
+    };
+  }, []);
+};
+const useLayoutUpdateEffect = (callback, deps) => {
+  useLayoutEffect((firstMount) => {
+    if (!firstMount) {
+      return callback();
+    }
+  }, deps);
+};
+function hasValue(value) {
+  return value !== void 0;
+}
+function useMergedState(defaultStateValue, option) {
+  const {
+    defaultValue,
+    value,
+    onChange,
+    postState
+  } = option || {};
+  const [innerValue, setInnerValue] = useSafeState(() => {
+    if (hasValue(value)) {
+      return value;
+    } else if (hasValue(defaultValue)) {
+      return typeof defaultValue === "function" ? defaultValue() : defaultValue;
+    } else {
+      return typeof defaultStateValue === "function" ? defaultStateValue() : defaultStateValue;
+    }
+  });
+  const mergedValue = value !== void 0 ? value : innerValue;
+  const postMergedValue = postState ? postState(mergedValue) : mergedValue;
+  const onChangeFn = useEvent(onChange);
+  const [prevValue, setPrevValue] = useSafeState([mergedValue]);
+  useLayoutUpdateEffect(() => {
+    const prev = prevValue[0];
+    if (innerValue !== prev) {
+      onChangeFn(innerValue, prev);
+    }
+  }, [prevValue]);
+  useLayoutUpdateEffect(() => {
+    if (!hasValue(value)) {
+      setInnerValue(value);
+    }
+  }, [value]);
+  const triggerChange = useEvent((updater, ignoreDestroy) => {
+    setInnerValue(updater, ignoreDestroy);
+    setPrevValue([mergedValue], ignoreDestroy);
+  });
+  return [postMergedValue, triggerChange];
+}
+export {
+  useLayoutUpdateEffect,
+  useMergedState
+};

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

@@ -0,0 +1,2 @@
+export { Radio } from './Radio';
+export type { RadioProps } from './Radio.types';

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,3 @@
+import { FC, PropsWithChildren } from 'react';
+import { SelectProps } from './Select.types';
+export declare const Select: FC<PropsWithChildren<SelectProps>>;