@workday/canvas-kit-react/dist/commonjs/icon/lib/SystemIconCircle.js

The parent module that contains all Workday Canvas Kit React components

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SystemIconCircle = exports.systemIconCircleStencil = exports.SystemIconCircleSize = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const common_1 = require("@workday/canvas-kit-react/common");
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
const Svg_1 = require("./Svg");
const SystemIcon_1 = require("./SystemIcon");
/* @deprecated Use tokens instead. Deprecated in v15.0.0. */
var SystemIconCircleSize;
(function (SystemIconCircleSize) {
    SystemIconCircleSize[SystemIconCircleSize["xs"] = 16] = "xs";
    SystemIconCircleSize[SystemIconCircleSize["s"] = 24] = "s";
    SystemIconCircleSize[SystemIconCircleSize["m"] = 32] = "m";
    SystemIconCircleSize[SystemIconCircleSize["l"] = 40] = "l";
    SystemIconCircleSize[SystemIconCircleSize["xl"] = 64] = "xl";
    SystemIconCircleSize[SystemIconCircleSize["xxl"] = 120] = "xxl";
})(SystemIconCircleSize = exports.SystemIconCircleSize || (exports.SystemIconCircleSize = {}));
/** Mapping utility for the SystemIconCircleSize enum to the systemLegacy size tokens.
 * @deprecated Use tokens instead. Deprecated in v15.0.0.
 * */
const sizes = {
    xs: canvas_tokens_web_1.system.legacy.size.xxxs,
    s: canvas_tokens_web_1.system.legacy.size.xs,
    m: canvas_tokens_web_1.system.legacy.size.sm,
    l: canvas_tokens_web_1.system.legacy.size.md,
    xl: canvas_tokens_web_1.system.legacy.size.xxl,
    xxl: (0, canvas_kit_styling_1.px2rem)(120),
};
exports.systemIconCircleStencil = (0, canvas_kit_styling_1.createStencil)({
    vars: {
        background: '',
        color: '',
        size: '',
    },
    base: { name: "prult", styles: "box-sizing:border-box;background:var(--background-system-icon-circle-11ad12, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))));display:flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));overflow:hidden;width:var(--size-system-icon-circle-11ad12, var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem)));height:var(--size-system-icon-circle-11ad12, var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem)));--size-svg-bca693:calc(var(--size-system-icon-circle-11ad12, var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem))) * 0.625);--color-system-icon-c9acc3:var(--color-system-icon-circle-11ad12);& img{width:100%;height:100%;}" },
    modifiers: {
        inverse: {
            true: { name: "1pe53t", styles: "background:var(--background-system-icon-circle-11ad12, var(--cnvs-sys-color-accent-info, var(--cnvs-sys-color-bg-info-default, oklch(0.5198 0.1782 256.11 / 1))));--color-system-icon-c9acc3:var(--color-system-icon-circle-11ad12, var(--cnvs-sys-color-fg-inverse));" }
        }
    }
}, "system-icon-circle-11ad12");
exports.SystemIconCircle = (0, common_1.createComponent)('span')({
    displayName: 'SystemIconCircle',
    Component: ({ background, color, size, icon, shouldMirror, shouldMirrorInRTL, inverse, ...elemProps }, ref, Element) => {
        return ((0, jsx_runtime_1.jsx)("div", { ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.systemIconCircleStencil)({
                size: (0, Svg_1.resolveSize)(size, sizes),
                background,
                color,
                inverse,
            })), children: (0, jsx_runtime_1.jsx)(SystemIcon_1.SystemIcon, { as: Element, ref: ref, icon: icon, shouldMirror: shouldMirror, shouldMirrorInRTL: shouldMirrorInRTL }) }));
    },
});