@chief-editor/ui/lib/components/select/Option.js

UI Component for chief editor

"use strict";var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,a=1,l=arguments.length;a<l;a++)for(var s in t=arguments[a])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,t){var a={};for(var l in e)Object.prototype.hasOwnProperty.call(e,l)&&t.indexOf(l)<0&&(a[l]=e[l]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(l=Object.getOwnPropertySymbols(e);s<l.length;s++)t.indexOf(l[s])<0&&Object.prototype.propertyIsEnumerable.call(e,l[s])&&(a[l[s]]=e[l[s]])}return a},__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var a in e)Object.hasOwnProperty.call(e,a)&&(t[a]=e[a]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var select_1=require("@rc-hooks/select"),icons_1=require("@byte-design/icons"),util_1=require("@co-hooks/util"),react_1=__importStar(require("react")),hooks_1=require("../../hooks"),ListItem_1=require("../util/ListItem");function Option(e){var t=e.value,a=e.label,l=e.readonly,s=e.disabled,r=e.children,n=e.className,i=e.style,o=__rest(e,["value","label","readonly","disabled","children","className","style"]),c=select_1.useSelect(),u=react_1.useState(!0),_=u[0],p=u[1],d=react_1.useState(!1),f=d[0],y=d[1],b=util_1.getUniqueKey(t),h=react_1.useCallback((function(e){p(!!e[b])}),[]),O=react_1.useCallback((function(e){y((function(t){return e===b&&!t||(e===b||!t)&&t}))}),[]),m=select_1.useOption({value:t,label:a,disabled:s,readonly:l},b,h,O),g=m.getData(),S=c.getExtraProps()||{},k=util_1.classnames(hooks_1.usePrefixCls("select-option",{selected:g.selected,"fill-back":f}),n),v=react_1.useCallback((function(e){m.setOptionState(e?select_1.OptionState.SELECTED:select_1.OptionState.UNSELECTED)}),[]),E=react_1.useCallback((function(){var e=m.getData(),t=e.disabled,a=e.readonly,l=e.selected;t||a||m.setOptionState(l?select_1.OptionState.UNSELECTED:select_1.OptionState.SELECTED)}),[]);return react_1.default.createElement("div",{"data-type":"select-option","data-option-id":b,className:k},react_1.default.createElement(ListItem_1.ListItem,__assign({},o,{key:b,prefixCls:"select-option",checkable:c.multiple&&"checkbox"===S.checkType,disabled:g.disabled,readonly:g.readonly,state:m.getOptionState(),onCheckboxChange:v,onClick:E,style:__assign(__assign({},i),{display:_?void 0:"none"}),level:m.getOptionIdPath().length}),react_1.default.createElement("span",{className:"item-text"},"function"==typeof r?r(g):r||a),react_1.default.createElement(icons_1.CheckSmall,{className:"option-check-icon"})))}exports.Option=Option;