DocSpace-client/packages/components/view-selector
2023-06-16 16:42:47 +02:00
..
index.js Web: Components: ViewSelector - added description 2023-04-21 16:25:48 +05:00
README.md Web:Common/Client/Components: add PUBLIC_DIR alias 2023-01-27 17:08:30 +03:00
styled-view-selector.js Web: Components: Adapt ViewSelector component to RTL interface 2023-06-16 16:42:47 +02:00
view-selector.stories.js Web:Common/Client/Components: add PUBLIC_DIR alias 2023-01-27 17:08:30 +03:00
view-selector.test.js

ViewSelector

Actions with a button.

Usage

import { ViewSelector } from "app-components";
import ViewRowsReactSvgUrl from "PUBLIC_DIR/images/view-rows.react.svg?url";
import ViewTilesReactSvgUrl from "PUBLIC_DIR/images/view-tiles.react.svg?url";

View Settings

const viewSettings = [
  {
    value: "row",
    icon: ViewRowsReactSvgUrl,
  },
  {
    value: "tile",

    icon: ViewTilesReactSvgUrl,
    callback: createThumbnails,
  },
];
<ViewSelector
  isDisabled={false}
  onChangeView={(view) => console.log("current view:", view)}
  viewSettings={viewSettings}
  viewAs="row"
  isFilter={false}
/>

Properties

Props Type Required Values Default Description
isDisabled bool - - - Disables the button default functionality
isFilter bool - - - Show only available option icon in selector
onChangeView func - - - The event triggered when the button is clicked
viewSettings arr - - - Array containing view settings.
viewAs string - - - Current application view