import * as React from "react";
import {
  header,
  tabs,
  tab,
  description,
  importExample,
  title,
  divider
} from "@wix/wix-storybook-utils/Sections";
import SystemCategoryListBase from "../../components/system-category-list-base/SystemCategoryListBase";
import HeaderIcons from "../../components/header-icons";
import IconsExample from "../../components/icons-example";
import { systemIconsMetadata } from "../../../default/system/metadata";
import * as iconComponents from "../../../default/system";
import API_Table from "../../APITable";
import { SYSTEM_ICONS, DEFAULT_CATEGORY } from "../../constants";
import {
  AddItemMedium,
  BreadcrumbsChevronRight,
  CheckboxChecked,
  DragAndDropLarge,
  FaceSmiling30,
  Help24
} from "../../../default/system";
var index_story_default = {
  category: DEFAULT_CATEGORY,
  storyName: SYSTEM_ICONS,
  component: () => /* @__PURE__ */ React.createElement(IconsExample, { dataHook: "icon-list", ...{ iconComponents } }),
  sections: [
    header({
      component: /* @__PURE__ */ React.createElement(HeaderIcons, null, /* @__PURE__ */ React.createElement(AddItemMedium, null), /* @__PURE__ */ React.createElement(BreadcrumbsChevronRight, null), /* @__PURE__ */ React.createElement(CheckboxChecked, null), /* @__PURE__ */ React.createElement(DragAndDropLarge, null), /* @__PURE__ */ React.createElement(FaceSmiling30, null), /* @__PURE__ */ React.createElement(Help24, null)),
      sourceUrl: "https://github.com/wix-private/wix-design-systems/tree/master/packages/wix-ui-icons-common/src/default/system/raw"
    }),
    tabs([
      tab({
        title: "Icon List",
        sections: [
          description({
            title: "Purpose of Use",
            text: "System icons are used to..."
          }),
          description({
            title: "Adding New Icons",
            text: "WSR icons are owned by Wix Style Team.<br/>If you can\u2019t find an icon for your needs or some adjustments need to be made to existing ones, please submit Icon Request."
          }),
          importExample(
            "import { AddItemLarge } from '@wix/wix-ui-icons-common/system';"
          ),
          divider(),
          title("Categories"),
          description({
            text: "The usage of each icon type is determined by intention and size. Icons should be used strictly according to the description."
          }),
          /* @__PURE__ */ React.createElement(
            SystemCategoryListBase,
            {
              iconsMetadata: systemIconsMetadata,
              iconComponents
            }
          )
        ]
      }),
      tab({
        title: "API",
        sections: [description({ title: "Props", text: API_Table })]
      })
    ])
  ]
};
export {
  index_story_default as default
};
