@jetbrains/ring-ui 7.0.62 → 7.0.63

package/components/collapse/collapse.d.ts

@@ -1,13 +1,13 @@
-import { PropsWithChildren } from 'react';
+import { type PropsWithChildren } from 'react';
 import * as React from 'react';
-type Props = {
+interface Props {
     onChange?: (collapsed: boolean) => void;
     duration?: number;
     disableAnimation?: boolean;
     className?: string;
     defaultCollapsed?: boolean;
     collapsed?: boolean | null;
-};
+}
 /**
  * @name Collapse
  */

package/components/confirm/confirm.d.ts

@@ -1,4 +1,4 @@
-import { PureComponent, ReactNode } from 'react';
+import { PureComponent, type ReactNode } from 'react';
 import * as React from 'react';
 export interface ConfirmProps {
     text: string;

package/components/confirm/confirm.js

@@ -27,6 +27,6 @@ export default class Confirm extends PureComponent {
     };
     render() {
         const { show, className, inProgress, cancelIsDefault, text, description, confirmLabel, rejectLabel, onConfirm, onReject, native, } = this.props;
-        return (_jsxs(Dialog, { label: text || (typeof description === 'string' ? description : undefined), className: className, onEscPress: this.onEscPress, show: show, trapFocus: true, "data-test": "ring-confirm", native: native, children: [text && _jsx(Header, { children: text }), description && _jsx(Content, { children: description }), _jsxs(Panel, { children: [_jsx(Button, { "data-test": "confirm-ok-button", primary: !cancelIsDefault, loader: inProgress, disabled: inProgress, onClick: onConfirm, children: confirmLabel }), _jsx(Button, { "data-test": "confirm-reject-button", onClick: onReject, disabled: inProgress, primary: cancelIsDefault, children: rejectLabel })] })] }));
+        return (_jsxs(Dialog, { label: text || (typeof description === 'string' ? description : undefined), className: className, onEscPress: this.onEscPress, show: show, trapFocus: true, "data-test": 'ring-confirm', native: native, children: [text && _jsx(Header, { children: text }), description && _jsx(Content, { children: description }), _jsxs(Panel, { children: [_jsx(Button, { "data-test": 'confirm-ok-button', primary: !cancelIsDefault, loader: inProgress, disabled: inProgress, onClick: onConfirm, children: confirmLabel }), _jsx(Button, { "data-test": 'confirm-reject-button', onClick: onReject, disabled: inProgress, primary: cancelIsDefault, children: rejectLabel })] })] }));
     }
 }

package/components/confirm-service/confirm-service.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from 'react';
-import { ConfirmAttributes } from '../confirm/confirm';
-import { ControlsHeight } from '../global/controls-height';
+import { type ReactNode } from 'react';
+import { type ConfirmAttributes } from '../confirm/confirm';
+import { type ControlsHeight } from '../global/controls-height';
 /**
  * @name Confirm Service
  */

package/components/content-layout/content-layout.css

@@ -1,6 +1,6 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
-@value extra-small-screen-media, small-screen-media from "../global/global.css";
+@value extra-small-screen-media, small-screen-media from '../global/global.css';
 
 .contentLayout {
   --ring-content-layout-sidebar-width: calc(var(--ring-unit) * 30);

package/components/content-layout/content-layout.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes } from 'react';
+import { Component, type HTMLAttributes } from 'react';
 export interface ContentLayoutProps extends HTMLAttributes<HTMLElement> {
     responsive: boolean;
     contentClassName?: string | null | undefined;

package/components/content-layout/content-layout.js

@@ -23,13 +23,13 @@ export default class ContentLayout extends Component {
         });
         const contentClasses = classNames(styles.contentLayoutContent, contentClassName);
         const childrenArray = Children.toArray(children);
-        const sidebarChild = childrenArray.filter((child) => child != null && typeof child === 'object' && 'type' in child && child.type === Sidebar)[0];
+        const sidebarChild = childrenArray.filter((child) => !!child && typeof child === 'object' && 'type' in child && child.type === Sidebar)[0];
         const sidebar = sidebarChild &&
             cloneElement(sidebarChild, {
                 contentNode: this.state.contentNode,
             });
         const contentChildren = childrenArray.filter(child => child !== sidebarChild);
-        return (_jsxs("div", { "data-test": "content-layout", ...restProps, className: classes, children: [sidebar, _jsx("main", { className: contentClasses, ref: this.saveContentNode, children: contentChildren })] }));
+        return (_jsxs("div", { "data-test": 'content-layout', ...restProps, className: classes, children: [sidebar, _jsx("main", { className: contentClasses, ref: this.saveContentNode, children: contentChildren })] }));
     }
 }
 export { default as Sidebar } from './sidebar';

package/components/content-layout/sidebar.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes } from 'react';
+import { Component, type HTMLAttributes } from 'react';
 import { Waypoint } from 'react-waypoint';
 export interface SidebarProps extends HTMLAttributes<HTMLElement> {
     right?: boolean | null | undefined;

package/components/contenteditable/contenteditable.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes, Ref } from 'react';
+import { Component, type HTMLAttributes, type Ref } from 'react';
 /**
  * @name ContentEditable
  */

package/components/contenteditable/contenteditable.js

@@ -13,6 +13,7 @@ class ContentEditableBase extends Component {
         onComponentUpdate: noop,
     };
     shouldComponentUpdate(nextProps) {
+        // eslint-disable-next-line no-underscore-dangle
         return nextProps.disabled !== this.props.disabled || nextProps.__html !== this.props.__html;
     }
     componentDidUpdate(prevProps) {
@@ -23,7 +24,7 @@ class ContentEditableBase extends Component {
         return (_jsx("div", { ...props, ref: inputRef, 
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
-            disabled: disabled, role: "textbox", tabIndex: disabled ? undefined : tabIndex, contentEditable: !this.props.disabled, dangerouslySetInnerHTML: { __html } }));
+            disabled: disabled, role: 'textbox', tabIndex: disabled ? undefined : tabIndex, contentEditable: !this.props.disabled, dangerouslySetInnerHTML: { __html } }));
     }
 }
 const ContentEditable = ({ children, ...props }) => (_jsx(ContentEditableBase, { ...props, __html: renderToStaticMarkup(children) }));

package/components/control-help/control-help.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .help {
   color: var(--ring-secondary-color);

package/components/control-help/control-help.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 type ControlHelpProps = HTMLAttributes<HTMLDivElement>;
 export default function ControlHelp({ className, ...restProps }: ControlHelpProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/components/control-label/control-label.d.ts

@@ -1,4 +1,4 @@
-import { LabelHTMLAttributes } from 'react';
+import { type LabelHTMLAttributes } from 'react';
 import * as React from 'react';
 export declare enum LabelType {
     SECONDARY = "secondary",

package/components/data-list/data-list.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .dataListWrapper {
   --ring-table-compensate: 2px;

package/components/data-list/data-list.d.ts

@@ -2,11 +2,11 @@
  * @name Data List
  */
 import { Component } from 'react';
-import { FocusSensorOuterProps } from '../global/focus-sensor-hoc';
-import { SelectionShortcutsAddProps, SelectionShortcutsOuterProps } from '../table/selection-shortcuts-hoc';
-import { DisableHoverAddProps } from '../table/disable-hover-hoc';
-import { SelectionItem } from '../table/selection';
-import { FormattedItem, moreLessButtonStates } from './item';
+import { type FocusSensorOuterProps } from '../global/focus-sensor-hoc';
+import { type SelectionShortcutsAddProps, type SelectionShortcutsOuterProps } from '../table/selection-shortcuts-hoc';
+import { type DisableHoverAddProps } from '../table/disable-hover-hoc';
+import { type SelectionItem } from '../table/selection';
+import { type FormattedItem, moreLessButtonStates } from './item';
 export interface DataListBaseProps<T extends SelectionItem> {
     data: readonly T[];
     itemFormatter: (item: T) => FormattedItem<T>;

package/components/data-list/data-list.js

@@ -45,7 +45,7 @@ class DataList extends PureComponent {
     onEqualPress = () => {
         const { selection, itemFormatter } = this.props;
         const focused = selection.getFocused();
-        if (focused == null) {
+        if (!focused) {
             throw new Error('No focused item');
         }
         const item = itemFormatter(focused);
@@ -67,7 +67,7 @@ class DataList extends PureComponent {
             [styles.disabledHover]: disabledHover,
             [styles.multiSelection]: selection.getSelected().size > 0,
         });
-        return (_jsxs("div", { className: styles.dataListWrapper, "data-test": "ring-data-list", ref: innerRef, children: [focused && _jsx(Shortcuts, { map: shortcutsMap, scope: this.shortcutsScope }), _jsx("ul", { className: classes, children: data.map(model => {
+        return (_jsxs("div", { className: styles.dataListWrapper, "data-test": 'ring-data-list', ref: innerRef, children: [focused && _jsx(Shortcuts, { map: shortcutsMap, scope: this.shortcutsScope }), _jsx("ul", { className: classes, children: data.map(model => {
                         const item = itemFormatter(model);
                         const { id, key, title, items } = item;
                         const showMoreLessButton = this.props.itemMoreLessState?.(item);

package/components/data-list/data-list.mock.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { SelectionItem } from '../table/selection';
+import { type ReactNode } from 'react';
+import { type SelectionItem } from '../table/selection';
 export interface Item extends SelectionItem {
     title: ReactNode;
     collapsible?: boolean;

package/components/data-list/data-list.mock.js

@@ -17,27 +17,27 @@ const items = [
                     {
                         id: 111,
                         selectable: true,
-                        title: _jsx(Link, { href: "#", children: "TeamCity" }),
+                        title: _jsx(Link, { href: '#', children: "TeamCity" }),
                     },
                     {
                         id: 112,
                         selectable: true,
-                        title: _jsx(Link, { href: "#", children: "YouTrack" }),
+                        title: _jsx(Link, { href: '#', children: "YouTrack" }),
                     },
                     {
                         id: 113,
                         selectable: true,
-                        title: _jsx(Link, { href: "#", children: "Sandbox" }),
+                        title: _jsx(Link, { href: '#', children: "Sandbox" }),
                     },
                     {
                         id: 114,
                         selectable: true,
-                        title: _jsx(Link, { href: "#", children: "Exception Analyzer" }),
+                        title: _jsx(Link, { href: '#', children: "Exception Analyzer" }),
                     },
                     {
                         id: 115,
                         selectable: true,
-                        title: _jsx(Link, { href: "#", children: "MPS" }),
+                        title: _jsx(Link, { href: '#', children: "MPS" }),
                     },
                 ],
             },
@@ -52,7 +52,7 @@ const items = [
             {
                 id: 21,
                 selectable: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "JetProfile" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "JetProfile" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
             },
             {
                 id: 22,
@@ -62,34 +62,34 @@ const items = [
                     {
                         id: 221,
                         collapsible: true,
-                        title: _jsx(Link, { href: "#", children: "TeamCity" }),
+                        title: _jsx(Link, { href: '#', children: "TeamCity" }),
                     },
                     {
                         id: 222,
                         collapsible: true,
-                        title: _jsx(Link, { href: "#", children: "YouTrack" }),
+                        title: _jsx(Link, { href: '#', children: "YouTrack" }),
                     },
                     {
                         id: 223,
                         collapsible: true,
-                        title: _jsx(Link, { href: "#", children: "Sandbox" }),
+                        title: _jsx(Link, { href: '#', children: "Sandbox" }),
                     },
                     {
                         id: 224,
                         collapsible: true,
-                        title: _jsx(Link, { href: "#", children: "Exception Analyzer" }),
+                        title: _jsx(Link, { href: '#', children: "Exception Analyzer" }),
                     },
                     {
                         id: 225,
                         collapsible: true,
-                        title: _jsx(Link, { href: "#", children: "MPS" }),
+                        title: _jsx(Link, { href: '#', children: "MPS" }),
                     },
                 ],
             },
             {
                 id: 23,
                 collapsible: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "CustomJDK" }), _jsx("span", { children: ": as a member of ide-developers" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "CustomJDK" }), _jsx("span", { children: ": as a member of ide-developers" })] })),
             },
         ],
     },
@@ -102,12 +102,12 @@ const items = [
             {
                 id: 31,
                 collapsible: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "ide-frontend" }), _jsx("span", { children: ": as a member of ide-developers" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "ide-frontend" }), _jsx("span", { children: ": as a member of ide-developers" })] })),
             },
             {
                 id: 32,
                 collapsible: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "ide-frontend" }), _jsx("span", { children: ": as a member of ide-frontend Code Viewers" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "ide-frontend" }), _jsx("span", { children: ": as a member of ide-frontend Code Viewers" })] })),
             },
         ],
     },
@@ -119,12 +119,12 @@ const items = [
             {
                 id: 41,
                 collapsible: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "Intellij IDEA" }), _jsx("span", { children: ": as a member of Registered Users" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "Intellij IDEA" }), _jsx("span", { children: ": as a member of Registered Users" })] })),
             },
             {
                 id: 42,
                 collapsible: true,
-                title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "YouTrack Backlog" }), _jsx("span", { children: ": as a member of jetbrains-team" })] })),
+                title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "YouTrack Backlog" }), _jsx("span", { children: ": as a member of jetbrains-team" })] })),
             },
         ],
     },
@@ -137,14 +137,14 @@ const items = [
                 id: 51,
                 selectable: true,
                 collapsible: true,
-                title: _jsx(Link, { href: "#", children: "Wasabi" }),
+                title: _jsx(Link, { href: '#', children: "Wasabi" }),
             },
         ],
     },
     {
         id: 6,
         collapsible: true,
-        title: (_jsxs("span", { children: [_jsx("strong", { children: "Git Hosting Admin" }), _jsx("span", { children: " in project " }), _jsx(Link, { href: "#", children: "Hackathon 2016" }), _jsx("span", { children: ": as a member of jetbrains-team" })] })),
+        title: (_jsxs("span", { children: [_jsx("strong", { children: "Git Hosting Admin" }), _jsx("span", { children: " in project " }), _jsx(Link, { href: '#', children: "Hackathon 2016" }), _jsx("span", { children: ": as a member of jetbrains-team" })] })),
     },
     {
         id: 7,
@@ -158,13 +158,13 @@ export const moreItems = [
         id: 91,
         selectable: true,
         collapsible: true,
-        title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "More item 1" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
+        title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "More item 1" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
     },
     {
         id: 92,
         selectable: true,
         collapsible: true,
-        title: (_jsxs("span", { children: [_jsx(Link, { href: "#", children: "More item 2" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
+        title: (_jsxs("span", { children: [_jsx(Link, { href: '#', children: "More item 2" }), _jsx("span", { children: " " }), _jsx(Tag, { children: "duplicate" })] })),
     },
 ];
 export default items;

package/components/data-list/item.d.ts

@@ -1,6 +1,6 @@
-import { PureComponent, ReactNode } from 'react';
-import { SelectionItem } from '../table/selection';
-import Selection from './selection';
+import { PureComponent, type ReactNode } from 'react';
+import { type SelectionItem } from '../table/selection';
+import type Selection from './selection';
 export declare enum moreLessButtonStates {
     UNUSED = 0,
     MORE = 1,

package/components/data-list/item.js

@@ -58,10 +58,10 @@ export default class Item extends PureComponent {
         let collapserExpander = null;
         if (collapsible) {
             if (collapsed) {
-                collapserExpander = (_jsx(Button, { title: "Expand", onClick: onExpand, icon: chevronRightIcon, className: styles.collapseButton, iconClassName: styles.collapseIcon, "data-test": "ring-data-list-expand" }));
+                collapserExpander = (_jsx(Button, { title: 'Expand', onClick: onExpand, icon: chevronRightIcon, className: styles.collapseButton, iconClassName: styles.collapseIcon, "data-test": 'ring-data-list-expand' }));
             }
             else {
-                collapserExpander = (_jsx(Button, { title: "Collapse", onClick: onCollapse, icon: chevronDownIcon, className: styles.collapseButton, iconClassName: styles.collapseIcon, "data-test": "ring-data-list-collapse" }));
+                collapserExpander = (_jsx(Button, { title: 'Collapse', onClick: onCollapse, icon: chevronDownIcon, className: styles.collapseButton, iconClassName: styles.collapseIcon, "data-test": 'ring-data-list-collapse' }));
             }
         }
         const itemIsEmpty = !items?.length || (collapsible && collapsed);

package/components/data-list/selection.d.ts

@@ -1,4 +1,4 @@
-import TableSelection, { CloneWithConfig, SelectionItem, TableSelectionConfig } from '../table/selection';
+import TableSelection, { type CloneWithConfig, type SelectionItem, type TableSelectionConfig } from '../table/selection';
 interface DataListSelectionConfig<T extends SelectionItem> extends TableSelectionConfig<T> {
     partialSelected?: Set<T> | undefined;
 }

package/components/data-list/selection.js

@@ -9,6 +9,7 @@ export default class Selection extends TableSelection {
         return new Set(this._getDescendants(data));
     }
     _buildSelected(data, selected) {
+        // eslint-disable-next-line no-underscore-dangle
         const _selected = new Set(selected);
         [...data].forEach(item => {
             if (_selected.has(item)) {
@@ -90,7 +91,7 @@ export default class Selection extends TableSelection {
         return this.cloneWith({ selected, partialSelected });
     }
     isPartialSelected(value) {
-        return value != null && this._partialSelected.has(value);
+        return value !== null && value !== undefined && this._partialSelected.has(value);
     }
     focus(value) {
         return super.focus(value);
@@ -101,11 +102,17 @@ export default class Selection extends TableSelection {
     cloneWith({ partialSelected = this._partialSelected, ...rest }) {
         const parentClone = super.cloneWith(rest);
         return new this.constructor({
+            // eslint-disable-next-line no-underscore-dangle
             data: parentClone._rawData,
+            // eslint-disable-next-line no-underscore-dangle
             selected: parentClone._selected,
+            // eslint-disable-next-line no-underscore-dangle
             focused: parentClone._focused,
+            // eslint-disable-next-line no-underscore-dangle
             getKey: parentClone._getKey,
+            // eslint-disable-next-line no-underscore-dangle
             getChildren: parentClone._getChildren,
+            // eslint-disable-next-line no-underscore-dangle
             isItemSelectable: parentClone._isItemSelectable,
             partialSelected,
         });

package/components/data-list/title.d.ts

@@ -1,5 +1,5 @@
-import { PureComponent, ReactNode } from 'react';
-import { FocusSensorAddProps } from '../global/focus-sensor-hoc';
+import { PureComponent, type ReactNode } from 'react';
+import { type FocusSensorAddProps } from '../global/focus-sensor-hoc';
 export interface TitleProps extends FocusSensorAddProps<HTMLDivElement> {
     onSelect: (selected: boolean) => void;
     selectable?: boolean | undefined;

package/components/date-picker/consts.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import type { Locale } from 'date-fns';
 declare const units: {
     unit: number;

package/components/date-picker/date-input.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DatePopupBaseProps, Field } from './consts';
+import { type DatePopupBaseProps, type Field } from './consts';
 export interface UpdateInputConfig {
     active: boolean;
     text: string | null;

package/components/date-picker/date-input.js

@@ -53,7 +53,7 @@ export default class DateInput extends React.PureComponent {
         if (active && hoverDate) {
             displayText = displayFormat(hoverDate, locale);
         }
-        else if (active && text != null) {
+        else if (active && text !== null && text !== undefined) {
             displayText = text;
         }
         else if (date) {
@@ -77,6 +77,6 @@ export default class DateInput extends React.PureComponent {
             }
         })();
         const classes = classNames(styles.filter, styles[`${name}Input`], divider && styles[`${name}InputWithDivider`], 'ring-js-shortcuts');
-        return (_jsx(Input, { autoComplete: "off", borderless: true, height: ControlsHeight.L, "data-name": name, inputRef: this.inputRef, className: classes, value: displayText, onChange: this.handleChange, onFocus: onActivate, onKeyDown: this.handleKeyDown, onClear: onClear, placeholder: placeholder }));
+        return (_jsx(Input, { autoComplete: 'off', borderless: true, height: ControlsHeight.L, "data-name": name, inputRef: this.inputRef, className: classes, value: displayText, onChange: this.handleChange, onFocus: onActivate, onKeyDown: this.handleKeyDown, onClear: onClear, placeholder: placeholder }));
     }
 }

package/components/date-picker/date-picker.css

@@ -1,8 +1,8 @@
-@import "../global/variables.css";
-@import "../global/global.css";
+@import '../global/variables.css';
+@import '../global/global.css';
 
 /* ensure styles order */
-@import "../input/input.css";
+@import '../input/input.css';
 
 :root,
 :host {
@@ -101,7 +101,7 @@
 }
 
 .filterWrapper {
-  composes: filterWrapper from "../select/select-popup.css";
+  composes: filterWrapper from '../select/select-popup.css';
 
   display: flex;
 
@@ -109,7 +109,7 @@
 }
 
 .filter {
-  composes: filter from "../select/select-popup.css";
+  composes: filter from '../select/select-popup.css';
 }
 
 .calendarIcon {
@@ -158,7 +158,7 @@
     top: 0;
     right: var(--ring-unit);
 
-    content: "—";
+    content: '—';
 
     line-height: calc(4 * var(--ring-unit) - 2px);
   }
@@ -185,7 +185,7 @@
     position: absolute;
     left: calc(-1 * var(--ring-unit));
 
-    content: ",";
+    content: ',';
 
     line-height: calc(4 * var(--ring-unit) - 3px);
   }
@@ -272,7 +272,7 @@
 }
 
 .day {
-  composes: resetButton from "../global/global.css";
+  composes: resetButton from '../global/global.css';
 }
 
 .day.day {
@@ -348,7 +348,7 @@
     width: calc(var(--ring-unit) * 2);
     height: 100%;
 
-    content: "";
+    content: '';
     transition: background-color var(--ring-ease);
   }
 
@@ -391,7 +391,7 @@
     width: calc(var(--ring-unit) * 23);
     height: calc(var(--ring-unit) * 8);
 
-    content: "";
+    content: '';
     transition: background-color var(--ring-ease);
   }
 
@@ -423,7 +423,7 @@
       width: calc(var(--ring-unit) * 2);
       height: 100%;
 
-      content: "";
+      content: '';
       transition: background-color var(--ring-ease);
     }
   }
@@ -475,7 +475,7 @@
   top: 0;
   left: calc(var(--ring-unit) * 0.5);
 
-  content: "•";
+  content: '•';
 
   font-size: var(--ring-font-size-smaller);
 }
@@ -508,7 +508,7 @@
 
 .monthName {
   composes: hoverable;
-  composes: resetButton from "../global/global.css";
+  composes: resetButton from '../global/global.css';
 }
 
 .monthName.monthName {
@@ -525,7 +525,7 @@
 }
 
 .monthSlider {
-  composes: resetButton from "../global/global.css";
+  composes: resetButton from '../global/global.css';
 }
 
 .monthSlider.monthSlider {
@@ -578,7 +578,7 @@
 
 .year {
   composes: hoverable;
-  composes: resetButton from "../global/global.css";
+  composes: resetButton from '../global/global.css';
 }
 
 .year.year {

package/components/date-picker/date-picker.d.ts

@@ -1,11 +1,11 @@
-import { PureComponent, ButtonHTMLAttributes } from 'react';
+import { PureComponent, type ButtonHTMLAttributes } from 'react';
 import * as React from 'react';
-import type { Locale } from 'date-fns';
 import Popup from '../popup/popup';
-import { DropdownAttrs } from '../dropdown/dropdown';
+import { type DropdownAttrs } from '../dropdown/dropdown';
 import { Size } from '../input/input';
-import { DatePopupProps } from './date-popup';
-import { DateInputTranslations, DatePickerChange } from './consts';
+import { type DatePopupProps } from './date-popup';
+import { type DateInputTranslations, type DatePickerChange } from './consts';
+import type { Locale } from 'date-fns';
 export interface DatePickerTranslations extends Partial<DateInputTranslations> {
     setDate: string;
     setDateTime: string;