UNPKG

@pnp/spfx-property-controls

Version:

Reusable property pane controls for SharePoint Framework solutions

22 lines 1.55 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.IconsList = void 0; const tslib_1 = require("tslib"); const React = tslib_1.__importStar(require("react")); const Icon_1 = require("@fluentui/react/lib/Icon"); const Utilities_1 = require("@fluentui/react/lib/Utilities"); const IconsList_module_scss_1 = tslib_1.__importDefault(require("./IconsList.module.scss")); const radioIdBase = (0, Utilities_1.getId)('radio'); const IconsList = ({ onChange, icons, selectedIconName }) => { const renderIcon = (iconName) => { const radioId = `${radioIdBase}-${iconName}`; return React.createElement("li", { className: IconsList_module_scss_1.default.iconItem }, React.createElement("input", { type: "radio", name: radioIdBase, id: radioId, className: IconsList_module_scss_1.default.iconRadio, "data-automation-id": `icon-picker-${iconName}`, checked: iconName === selectedIconName, onChange: () => onChange(iconName) }), React.createElement("label", { className: IconsList_module_scss_1.default.iconLabel, htmlFor: radioId, title: iconName }, React.createElement(Icon_1.Icon, { iconName: iconName, className: IconsList_module_scss_1.default.iconGlyph }), React.createElement("span", { className: IconsList_module_scss_1.default.iconName }, iconName))); }; return React.createElement("ul", { className: IconsList_module_scss_1.default.iconList }, icons.map(renderIcon)); }; exports.IconsList = IconsList; //# sourceMappingURL=IconsList.js.map