'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-8277cbb3.js');
const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
const index_module = require('./index.module-f8c8495f.js');
const cjs = require('./cjs-1066ec21.js');
const utils = require('./utils-6847bc06.js');
require('./JSS-8503a151.js');
require('./mixins-4761d472.js');
const sqmNavigationSidebarItemView = require('./sqm-navigation-sidebar-item-view-49b152dd.js');

function useNavigationSidebarItem(props) {
  const currentPage = index_module.kn();
  return {
    states: {
      active: currentPage.pathname === props.path,
    },
    data: {
      label: props.label,
      icon: props.icon,
      path: props.path,
    },
    backgroundColor: props.backgroundColor,
    backgroundHoverColor: props.backgroundHoverColor,
    textColor: props.textColor,
    textHoverColor: props.textHoverColor,
    borderRadius: props.borderRadius,
    backgroundFocusedColor: props.backgroundFocusedColor,
    textFocusedColor: props.textFocusedColor,
    padding: props.padding,
  };
}

const NavigationSidebarItem = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    /**
     * @uiName Padding
     * @uiType string
     * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
     * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
     */
    this.padding = "x-small";
    domContextHooks_module.h$1(this);
  }
  disconnectedCallback() { }
  render() {
    const props = index_module.isDemo()
      ? useSidebarItemDemo(utils.getProps(this))
      : useNavigationSidebarItem(utils.getProps(this));
    return index.h(sqmNavigationSidebarItemView.NavigationSidebarItemView, Object.assign({}, props));
  }
};
function useSidebarItemDemo(props) {
  return cjs.cjs({
    states: {
      active: false,
    },
    data: {
      label: props.label || "Dashboard",
      icon: props.icon || "house",
    },
    backgroundColor: props.backgroundColor,
    backgroundHoverColor: props.backgroundHoverColor,
    textColor: props.textColor,
    textHoverColor: props.textHoverColor,
    borderRadius: props.borderRadius,
    backgroundFocusedColor: props.backgroundFocusedColor,
    textFocusedColor: props.textFocusedColor,
    padding: props.padding,
  }, props.demoData || {}, { arrayMerge: (_, a) => a });
}

exports.sqm_navigation_sidebar_item = NavigationSidebarItem;
