import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef } from 'react';
import { cx } from '../../../../utils/index.js';
import { classes } from '../../tokens.js';
import { useSegmentInner, dividerOrientationMap } from '../../SegmentProvider/SegmentProvider.js';
import { StyledDivider } from '../SegmentGroup/SegmentGroup.styles.js';
import { base as base$1 } from './variations/_size/base.js';
import { base as base$2 } from './variations/_view/base.js';
import { base as base$3 } from './variations/_disabled/base.js';
import { base as base$4 } from './variations/_pilled/base.js';
import { StyledIcon, base } from './SegmentIconItem.styles.js';
import { safeUseId } from '../../../../utils/react.js';

var _excluded = ["style", "size", "view", "className", "id", "icon", "value", "pilled", "customHandleSelect", "aria-label"];
var segmentIconItemRoot = function segmentIconItemRoot(Root) {
  return /*#__PURE__*/forwardRef(function (props, outerRef) {
    var style = props.style,
      size = props.size,
      _props$view = props.view,
      view = _props$view === void 0 ? 'default' : _props$view,
      className = props.className,
      id = props.id,
      icon = props.icon,
      value = props.value,
      pilled = props.pilled,
      customHandleSelect = props.customHandleSelect,
      ariaLabelExternal = props['aria-label'],
      rest = _objectWithoutProperties(props, _excluded);
    var _useSegmentInner = useSegmentInner(),
      disabledGroup = _useSegmentInner.disabledGroup,
      handleSelect = _useSegmentInner.handleSelect,
      selectedSegmentItems = _useSegmentInner.selectedSegmentItems,
      hasDivider = _useSegmentInner.hasDivider,
      orientation = _useSegmentInner.orientation;
    var uniqId = safeUseId();
    var segmentId = id || "label-".concat(uniqId);
    var pilledClass = pilled ? classes.segmentPilled : undefined;
    var isSelected = selectedSegmentItems === null || selectedSegmentItems === void 0 ? void 0 : selectedSegmentItems.includes(value);
    var selectedClass = isSelected ? classes.selectedSegmentItem : undefined;
    var handleSelectSegment = function handleSelectSegment(event) {
      if (disabledGroup) {
        return;
      }
      customHandleSelect === null || customHandleSelect === void 0 || customHandleSelect(event);
      handleSelect === null || handleSelect === void 0 || handleSelect(value);
    };
    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, hasDivider && /*#__PURE__*/React__default.createElement(StyledDivider, {
      orientation: dividerOrientationMap[orientation]
    }), /*#__PURE__*/React__default.createElement(Root, _extends({
      view: view,
      size: size,
      id: segmentId,
      ref: outerRef,
      "aria-label": ariaLabelExternal || value,
      value: value,
      pilled: pilled,
      className: cx(classes.segmentItem, selectedClass, pilledClass, className),
      onClick: handleSelectSegment,
      tabIndex: disabledGroup ? -1 : 0,
      disabled: disabledGroup,
      style: style
    }, rest), /*#__PURE__*/React__default.createElement(StyledIcon, null, icon)));
  });
};
var segmentIconItemConfig = {
  name: 'SegmentIconItem',
  tag: 'button',
  layout: segmentIconItemRoot,
  base: base,
  variations: {
    size: {
      css: base$1
    },
    view: {
      css: base$2
    },
    disabled: {
      css: base$3,
      attrs: true
    },
    pilled: {
      css: base$4,
      attrs: true
    }
  },
  defaults: {
    view: 'default',
    size: 'xs'
  }
};

export { segmentIconItemConfig, segmentIconItemRoot };
