@gravity-ui/navigation 0.1.0 → 0.2.1

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## [0.2.1](https://github.com/gravity-ui/navigation/compare/v0.2.0...v0.2.1) (2022-10-31)
+
+
+### Bug Fixes
+
+* types declaration dir ([#27](https://github.com/gravity-ui/navigation/issues/27)) ([6840db8](https://github.com/gravity-ui/navigation/commit/6840db839a13ac77b13d11c06907b6fff52b4845))
+
+## [0.2.0](https://github.com/gravity-ui/navigation/compare/v0.1.0...v0.2.0) (2022-10-31)
+
+
+### Features
+
+* add Settings component ([b7ad550](https://github.com/gravity-ui/navigation/commit/b7ad550825d5cc0ac416b57d0c35f6ccd459793d))
+
+
+### Bug Fixes
+
+* component AsideHeader should be stateless ([e2cbd15](https://github.com/gravity-ui/navigation/commit/e2cbd15921d051aada9246f27f34c60ca8169ec9))
+* onClosePanel should be called before onItemClick ([8d0acb5](https://github.com/gravity-ui/navigation/commit/8d0acb5603129817aea929f881f85a264b074fe7))
+* package-lock.json ([#26](https://github.com/gravity-ui/navigation/issues/26)) ([14f012e](https://github.com/gravity-ui/navigation/commit/14f012eeda4f97bbd0e4e48e7b83bf195cb3c0ab))
+* set z-index for .ycn-aside-header__content ([b793bc6](https://github.com/gravity-ui/navigation/commit/b793bc63ca760f608a4f5f2961af1947b0972fc2))
+* sticky-element should not be restrict by an extra parent element ([5ecfac3](https://github.com/gravity-ui/navigation/commit/5ecfac3da2b390255485aef63718b6a2c4c4a8c0))
+
 ## [0.1.0](https://github.com/gravity-ui/navigation/compare/v0.0.7...v0.1.0) (2022-10-17)
 
 

package/build/{esm/types → cjs}/components/AsideHeader/AsideHeader.d.ts

@@ -27,14 +27,9 @@ interface AsideHeaderDefaultProps {
 export interface AsideHeaderProps extends AsideHeaderGeneralProps, Partial<AsideHeaderDefaultProps> {
 }
 declare type AsideHeaderInnerProps = AsideHeaderGeneralProps & AsideHeaderDefaultProps;
-interface AsideHeaderState {
-    compact: boolean;
-}
-export declare class AsideHeader extends React.Component<AsideHeaderInnerProps, AsideHeaderState> {
+export declare class AsideHeader extends React.Component<AsideHeaderInnerProps> {
     static defaultProps: AsideHeaderDefaultProps;
     asideRef: React.RefObject<HTMLDivElement>;
-    constructor(props: AsideHeaderInnerProps);
-    componentDidUpdate(prevProps: AsideHeaderInnerProps): void;
     render(): JSX.Element;
     private renderFirstPane;
     private renderSecondPane;
@@ -45,6 +40,6 @@ export declare class AsideHeader extends React.Component<AsideHeaderInnerProps,
     private renderCollapseButton;
     private onCollapseButtonClick;
     private onCloseDrawer;
-    private onCompositeBarClick;
+    private onItemClick;
 }
 export {};

package/build/cjs/{types/components → components}/CompositeBar/CompositeBar.d.ts

@@ -6,7 +6,7 @@ export interface CompositeBarProps {
     compact: boolean;
     enableCollapsing: boolean;
     dict?: AsideHeaderDict;
-    onItemClick?: (item: MenuItem) => void;
+    onItemClick?: (item: MenuItem, collapsed: boolean) => void;
 }
 interface CompositeBarState {
     activeItemIndex?: number;

package/build/{esm/types → cjs}/components/CompositeBar/Item/Item.d.ts

@@ -13,6 +13,7 @@ interface ItemPopup {
 export interface ItemProps extends ItemPopup {
     item: MenuItem;
     enableTooltip?: boolean;
+    onItemClick?: (item: MenuItem, collapsed: boolean) => void;
 }
 interface ItemInnerProps extends ItemProps {
     compact: boolean;

package/build/{esm/types → cjs}/components/FooterItem/FooterItem.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ItemProps } from '../CompositeBar/Item/Item';
 import './FooterItem.scss';
-export interface FooterItemProps extends ItemProps {
+export interface FooterItemProps extends Omit<ItemProps, 'onItemClick'> {
     compact: boolean;
 }
 export declare const FooterItem: React.FC<FooterItemProps>;

package/build/cjs/components/Settings/Settings.d.ts

@@ -0,0 +1,49 @@
+import React from 'react';
+import { IconProps } from '@gravity-ui/uikit';
+import './Settings.scss';
+interface SettingsProps {
+    initialPage?: string;
+    onPageChange?: (page: string | undefined) => void;
+    children: React.ReactNode;
+    renderNotFound?: () => React.ReactNode;
+    renderLoading?: () => React.ReactNode;
+    loading?: boolean;
+    dict?: SettingsDict;
+}
+declare type SettingsDict = Record<SettingsDictKeys, string>;
+declare type SettingsDictKeys = 'heading_settings' | 'placeholder_search' | 'not_found';
+interface SettingsGroupProps {
+    id?: string;
+    groupTitle: string;
+    children: React.ReactNode;
+}
+interface SettingsPageProps {
+    id?: string;
+    title: string;
+    icon: IconProps;
+    children: React.ReactNode;
+}
+interface SettingsSectionProps {
+    title: string;
+    header?: React.ReactNode;
+    children: React.ReactNode;
+    withBadge?: boolean;
+}
+interface SettingsItemProps {
+    title: string;
+    renderTitleComponent?: (highlightedTitle: React.ReactNode | null) => React.ReactNode;
+    align?: 'top' | 'center';
+    children: React.ReactNode;
+    withBadge?: boolean;
+}
+export declare function Settings({ loading, renderLoading, children, ...props }: SettingsProps): JSX.Element;
+export declare namespace Settings {
+    var defaultProps: {
+        dict: SettingsDict;
+    };
+    var Group: ({ children }: SettingsGroupProps) => JSX.Element;
+    var Page: ({ children }: SettingsPageProps) => JSX.Element;
+    var Section: ({ children }: SettingsSectionProps) => JSX.Element;
+    var Item: ({ title, children, align, withBadge, renderTitleComponent, }: SettingsItemProps) => JSX.Element;
+}
+export {};

package/build/cjs/components/Settings/SettingsMenu/SettingsMenu.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { IconProps } from '@gravity-ui/uikit';
+import './SettingsMenu.scss';
+interface GroupItem {
+    groupTitle: string;
+    items: Item[];
+}
+interface Item {
+    id: string;
+    title: string;
+    icon?: IconProps;
+    disabled?: boolean;
+    withBadge?: boolean;
+}
+export declare type SettingsMenuItems = (GroupItem | Item)[];
+interface SettingsMenuProps {
+    items: SettingsMenuItems;
+    onChange: (id: string) => void;
+    activeItem?: string;
+    focusItem?: string;
+}
+export interface SettingsMenuInstance {
+    handleKeyDown(event: React.KeyboardEvent): boolean;
+    clearFocus(): void;
+}
+export declare const SettingsMenu: React.ForwardRefExoticComponent<SettingsMenuProps & React.RefAttributes<SettingsMenuInstance>>;
+export {};

package/build/cjs/components/Settings/SettingsSearch/SettingsSearch.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface SettingsSearchProps {
+    className?: string;
+    onChange: (search: string) => void;
+    debounce?: number;
+    inputRef?: React.Ref<HTMLInputElement>;
+    placeholder?: string;
+}
+export declare function SettingsSearch({ className, onChange, debounce, inputRef, placeholder, }: SettingsSearchProps): JSX.Element;
+export {};

package/build/cjs/components/Settings/__stories__/SettingsDemo.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './SettingsDemo.scss';
+export interface DemoProps {
+    title: string;
+}
+export interface DemoRowProps {
+    title: string;
+}
+export declare const SettingsComponent: React.MemoExoticComponent<({ initialPage, withBadge }: {
+    initialPage?: string | undefined;
+    withBadge?: boolean | undefined;
+}) => JSX.Element>;
+export declare function SettingsDemo(): JSX.Element;

package/build/cjs/components/Settings/collect-settings.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { IconProps } from '@gravity-ui/uikit';
+declare type SettingsMenu = (SettingsMenuGroup | SettingsMenuItem)[];
+interface SettingsMenuGroup {
+    groupTitle: string;
+    items: SettingsMenuItem[];
+}
+interface SettingsMenuItem {
+    id: string;
+    title: string;
+    icon?: IconProps;
+    withBadge?: boolean;
+    disabled?: boolean;
+}
+export interface SettingsPage {
+    id: string;
+    sections: SettingsPageSection[];
+    hidden?: boolean;
+    withBadge?: boolean;
+}
+interface SettingsPageSection {
+    title: string;
+    header?: React.ReactNode;
+    items: SettingsItem[];
+    hidden?: boolean;
+    withBadge?: boolean;
+}
+interface SettingsItem {
+    title: string;
+    element: React.ReactElement;
+    hidden: boolean;
+    titleComponent?: React.ReactNode;
+    renderTitleComponent?: (highlightedTitle: React.ReactNode | null) => React.ReactNode;
+}
+interface SettingsDescription {
+    menu: SettingsMenu;
+    pages: Record<string, SettingsPage>;
+}
+export declare function getSettingsFromChildren(children: React.ReactNode, searchText?: string): SettingsDescription;
+export {};

package/build/cjs/components/Settings/helpers.d.ts

@@ -0,0 +1,6 @@
+declare type AnyFunc = (...args: any[]) => any;
+export declare function useStableCallback<T extends AnyFunc>(func: T): (...args: Parameters<T>) => ReturnType<T> | undefined;
+export declare function useCurrent<T>(value: T): () => T;
+export declare function invariant(cond: boolean, message: string): void;
+export declare function escapeStringForRegExp(input: string): string;
+export {};

package/build/cjs/components/Settings/index.d.ts

@@ -0,0 +1 @@
+export * from './Settings';

package/build/cjs/{types/components → components}/index.d.ts

@@ -2,4 +2,5 @@ export { ActionBar } from './ActionBar';
 export { AsideHeader, AsideHeaderProps } from './AsideHeader/AsideHeader';
 export { Drawer, DrawerProps, DrawerItemProps, DrawerItem } from './Drawer/Drawer';
 export { FooterItem, FooterItemProps } from './FooterItem/FooterItem';
+export * from './Settings';
 export * from './types';