code:
'use strict';

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

var types = require('../types.js');
require('../browser.js');
require('../strings.js');
var objects = require('../objects.js');
var error = require('../error.js');
var core = require('@vueuse/core');
var shared = require('@vue/shared');

const SCOPE = "utils/dom/style";
const classNameToArray = (cls = "") => cls.split(" ").filter((item) => !!item.trim());
const hasClass = (el, cls) => {
  if (!el || !cls)
    return false;
  if (cls.includes(" "))
    throw new Error("className should not contain space.");
  return el.classList.contains(cls);
};
const addClass = (el, cls) => {
  if (!el || !cls.trim())
    return;
  el.classList.add(...classNameToArray(cls));
};
const removeClass = (el, cls) => {
  if (!el || !cls.trim())
    return;
  el.classList.remove(...classNameToArray(cls));
};
const getStyle = (element, styleName) => {
  var _a;
  if (!core.isClient || !element || !styleName)
    return "";
  let key = shared.camelize(styleName);
  if (key === "float")
    key = "cssFloat";
  try {
    const style = element.style[key];
    if (style)
      return style;
    const computed = (_a = document.defaultView) == null ? void 0 : _a.getComputedStyle(element, "");
    return computed ? computed[key] : "";
  } catch (e) {
    return element.style[key];
  }
};
const setStyle = (element, styleName, value) => {
  if (!element || !styleName)
    return;
  if (shared.isObject(styleName)) {
    objects.entriesOf(styleName).forEach(([prop, value2]) => setStyle(element, prop, value2));
  } else {
    const key = shared.camelize(styleName);
    element.style[key] = value;
  }
};
const removeStyle = (element, style) => {
  if (!element || !style)
    return;
  if (shared.isObject(style)) {
    objects.keysOf(style).forEach((prop) => removeStyle(element, prop));
  } else {
    setStyle(element, style, "");
  }
};
function addUnit(value, defaultUnit = "px") {
  if (!value)
    return "";
  if (types.isNumber(value) || types.isStringNumber(value)) {
    return `${value}${defaultUnit}`;
  } else if (shared.isString(value)) {
    return value;
  }
  error.debugWarn(SCOPE, "binding value must be a string or number");
}

exports.addClass = addClass;
exports.addUnit = addUnit;
exports.classNameToArray = classNameToArray;
exports.getStyle = getStyle;
exports.hasClass = hasClass;
exports.removeClass = removeClass;
exports.removeStyle = removeStyle;
exports.setStyle = setStyle;
//# sourceMappingURL=style.js.map


code: export declare function easeInOutCubic(t: number, b: number, c: number, d: number): number;

license: mit


code:
'use strict';

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

function easeInOutCubic(t, b, c, d) {
  const cc = c - b;
  t /= d / 2;
  if (t < 1) {
    return cc / 2 * t * t * t + b;
  }
  return cc / 2 * ((t -= 2) * t * t + 2) + b;
}

exports.easeInOutCubic = easeInOutCubic;
//# sourceMappingURL=easings.js.map


sourcesContent:
export function easeInOutCubic(t: number, b: number, c: number, d: number) {
  const cc = c - b
  t /= d / 2
  if (t < 1) {
    return (cc / 2) * t * t * t + b
  }
  return (cc / 2) * ((t -= 2) * t * t + 2) + b
}


code:
export declare function throwError(scope: string, m: string): never;
export declare function debugWarn(err: Error): void;
export declare function debugWarn(scope: string, message: string): void;


code:
'use strict';

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

require('./types.js');
var shared = require('@vue/shared');

class ElementPlusError extends Error {
  constructor(m) {
    super(m);
    this.name = "ElementPlusError";
  }
}
function throwError(scope, m) {
  throw new ElementPlusError(`[${scope}] ${m}`);
}
function debugWarn(scope, message) {
  if (process.env.NODE_ENV !== "production") {
    const error = shared.isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
    console.warn(error);
  }
}

exports.debugWarn = debugWarn;
exports.throwError = throwError;
//# sourceMappingURL=error.js.map


code: export { NOOP, toRawType } from '@vue/shared';


code:
'use strict';

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

var shared = require('@vue/shared');

Object.defineProperty(exports, 'NOOP', {
	enumerable: true,
	get: function () { return shared.NOOP; }
});
Object.defineProperty(exports, 'toRawType', {
	enumerable: true,
	get: function () { return shared.toRawType; }
});
//# sourceMappingURL=functions.js.map


code: export declare const isKorean: (text: string) => boolean;


code:
'use strict';

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

const isKorean = (text) => /([\uAC00-\uD7AF\u3130-\u318F])+/gi.test(text);

exports.isKorean = isKorean;
//# sourceMappingURL=i18n.js.map


sourcesContent:
export const isKorean = (text: string) =>
  /([\uAC00-\uD7AF\u3130-\u318F])+/gi.test(text)


code:
export * from './dom';
export * from './vue';
export * from './arrays';
export * from './browser';
export * from './error';
export * from './functions';
export * from './i18n';
export * from './objects';
export * from './raf';
export * from './rand';
export * from './strings';
export * from './types';
export * from './typescript';
export * from './throttleByRaf';
export * from './easings';


code:
'use strict';

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

require('./dom/index.js');
require('./vue/index.js');
var arrays = require('./arrays.js');
var browser = require('./browser.js');
var error = require('./error.js');
require('./functions.js');
var i18n = require('./i18n.js');
var objects = require('./objects.js');
var raf = require('./raf.js');
var rand = require('./rand.js');
var strings = require('./strings.js');
var types = require('./types.js');
var typescript = require('./typescript.js');
var throttleByRaf = require('./throttleByRaf.js');
var easings = require('./easings.js');
var aria = require('./dom/aria.js');
var event = require('./dom/event.js');
var position = require('./dom/position.js');
var scroll = require('./dom/scroll.js');
var style = require('./dom/style.js');
var element = require('./dom/element.js');
var globalNode = require('./vue/global-node.js');
var icon = require('./vue/icon.js');
var install = require('./vue/install.js');
var runtime = require('./vue/props/runtime.js');
var refs = require('./vue/refs.js');
var size = require('./vue/size.js');
var validator = require('./vue/validator.js');
var vnode = require('./vue/vnode.js');
var lodashUnified = require('lodash-unified');
var core = require('@vueuse/core');
var shared = require('@vue/shared');
var vue = require('vue');

exports.castArray = arrays.castArray;
exports.unique = arrays.unique;
exports.isFirefox = browser.isFirefox;
exports.debugWarn = error.debugWarn;
exports.throwError = error.throwError;
exports.isKorean = i18n.isKorean;
exports.entriesOf = objects.entriesOf;
exports.getProp = objects.getProp;
exports.keysOf = objects.keysOf;
exports.cAF = raf.cAF;
exports.rAF = raf.rAF;
exports.generateId = rand.generateId;
exports.getRandomInt = rand.getRandomInt;
exports.capitalize = strings.capitalize;
exports.escapeStringRegexp = strings.escapeStringRegexp;
exports.isBoolean = types.isBoolean;
exports.isElement = types.isElement;
exports.isEmpty = types.isEmpty;
exports.isNumber = types.isNumber;
exports.isPropAbsent = types.isPropAbsent;
exports.isStringNumber = types.isStringNumber;
exports.isUndefined = types.isUndefined;
exports.isWindow = types.isWindow;
exports.mutable = typescript.mutable;
exports.throttleByRaf = throttleByRaf.throttleByRaf;
exports.easeInOutCubic = easings.easeInOutCubic;
exports.attemptFocus = aria.attemptFocus;
exports.focusNode = aria.focusNode;
exports.getSibling = aria.getSibling;
exports.isFocusable = aria.isFocusable;
exports.isLeaf = aria.isLeaf;
exports.isVisible = aria.isVisible;
exports.obtainAllFocusableElements = aria.obtainAllFocusableElements;
exports.triggerEvent = aria.triggerEvent;
exports.composeEventHandlers = event.composeEventHandlers;
exports.whenMouse = event.whenMouse;
exports.getClientXY = position.getClientXY;
exports.getOffsetTop = position.getOffsetTop;
exports.getOffsetTopDistance = position.getOffsetTopDistance;
exports.isInContainer = position.isInContainer;
exports.animateScrollTo = scroll.animateScrollTo;
exports.getScrollBarWidth = scroll.getScrollBarWidth;
exports.getScrollContainer = scroll.getScrollContainer;
exports.getScrollElement = scroll.getScrollElement;
exports.getScrollTop = scroll.getScrollTop;
exports.isScroll = scroll.isScroll;
exports.scrollIntoView = scroll.scrollIntoView;
exports.addClass = style.addClass;
exports.addUnit = style.addUnit;
exports.classNameToArray = style.classNameToArray;
exports.getStyle = style.getStyle;
exports.hasClass = style.hasClass;
exports.removeClass = style.removeClass;
exports.removeStyle = style.removeStyle;
exports.setStyle = style.setStyle;
exports.getElement = element.getElement;
exports.changeGlobalNodesTarget = globalNode.changeGlobalNodesTarget;
exports.createGlobalNode = globalNode.createGlobalNode;
exports.removeGlobalNode = globalNode.removeGlobalNode;
exports.CloseComponents = icon.CloseComponents;
exports.TypeComponents = icon.TypeComponents;
exports.TypeComponentsMap = icon.TypeComponentsMap;
exports.ValidateComponentsMap = icon.ValidateComponentsMap;
exports.iconPropType = icon.iconPropType;
exports.withInstall = install.withInstall;
exports.withInstallDirective = install.withInstallDirective;
exports.withInstallFunction = install.withInstallFunction;
exports.withNoopInstall = install.withNoopInstall;
exports.buildProp = runtime.buildProp;
exports.buildProps = runtime.buildProps;
exports.definePropType = runtime.definePropType;
exports.epPropKey = runtime.epPropKey;
exports.isEpProp = runtime.isEpProp;
exports.composeRefs = refs.composeRefs;
exports.getComponentSize = size.getComponentSize;
exports.isValidComponentSize = validator.isValidComponentSize;
exports.isValidDatePickType = validator.isValidDatePickType;
exports.PatchFlags = vnode.PatchFlags;
exports.ensureOnlyChild = vnode.ensureOnlyChild;
exports.flattedChildren = vnode.flattedChildren;
exports.getFirstValidNode = vnode.getFirstValidNode;
exports.getNormalizedProps = vnode.getNormalizedProps;
exports.isComment = vnode.isComment;
exports.isFragment = vnode.isFragment;
exports.isTemplate = vnode.isTemplate;
exports.isText = vnode.isText;
exports.isValidElementNode = vnode.isValidElementNode;
exports.renderBlock = vnode.renderBlock;
exports.renderIf = vnode.renderIf;
Object.defineProperty(exports, 'ensureArray', {
	enumerable: true,
	get: function () { return lodashUnified.castArray; }
});
Object.defineProperty(exports, 'isClient', {
	enumerable: true,
	get: function () { return core.isClient; }
});
Object.defineProperty(exports, 'isIOS', {
	enumerable: true,
	get: function () { return core.isIOS; }
});
Object.defineProperty(exports, 'NOOP', {
	enumerable: true,
	get: function () { return shared.NOOP; }
});
Object.defineProperty(exports, 'camelize', {
	enumerable: true,
	get: function () { return shared.camelize; }
});
Object.defineProperty(exports, 'hasOwn', {
	enumerable: true,
	get: function () { return shared.hasOwn; }
});
Object.defineProperty(exports, 'hyphenate', {
	enumerable: true,
	get: function () { return shared.hyphenate; }
});
Object.defineProperty(exports, 'isArray', {
	enumerable: true,
	get: function () { return shared.isArray; }
});
Object.defineProperty(exports, 'isDate', {
	enumerable: true,
	get: function () { return shared.isDate; }
});
Object.defineProperty(exports, 'isFunction', {
	enumerable: true,
	get: function () { return shared.isFunction; }
});
Object.defineProperty(exports, 'isObject', {
	enumerable: true,
	get: function () { return shared.isObject; }
});
Object.defineProperty(exports, 'isPlainObject', {
	enumerable: true,
	get: function () { return shared.isPlainObject; }
});
Object.defineProperty(exports, 'isPromise', {
	enumerable: true,
	get: function () { return shared.isPromise; }
});
Object.defineProperty(exports, 'isString', {
	enumerable: true,
	get: function () { return shared.isString; }
});
Object.defineProperty(exports, 'isSymbol', {
	enumerable: true,
	get: function () { return shared.isSymbol; }
});
Object.defineProperty(exports, 'kebabCase', {
	enumerable: true,
	get: function () { return shared.hyphenate; }
});
Object.defineProperty(exports, 'toRawType', {
	enumerable: true,
	get: function () { return shared.toRawType; }
});
Object.defineProperty(exports, 'isVNode', {
	enumerable: true,
	get: function () { return vue.isVNode; }
});
//# sourceMappingURL=index.js.map


code:
import type { Entries } from 'type-fest';
import type { Arrayable } from '.';
export declare const keysOf: <T>(arr: T) => (keyof T)[];
export declare const entriesOf: <T>(arr: T) => Entries<T>;
export { hasOwn } from '@vue/shared';
export declare const getProp: <T = any>(obj: Record<string, any>, path: Arrayable<string>, defaultValue?: any) => {
    value: T;
};


code:
'use strict';

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

var lodashUnified = require('lodash-unified');
var shared = require('@vue/shared');

const keysOf = (arr) => Object.keys(arr);
const entriesOf = (arr) => Object.entries(arr);
const getProp = (obj, path, defaultValue) => {
  return {
    get value() {
      return lodashUnified.get(obj, path, defaultValue);
    },
    set value(val) {
      lodashUnified.set(obj, path, val);
    }
  };
};

Object.defineProperty(exports, 'hasOwn', {
  enumerable: true,
  get: function () { return shared.hasOwn; }
});
exports.entriesOf = entriesOf;
exports.getProp = getProp;
exports.keysOf = keysOf;
//# sourceMappingURL=objects.js.map


code:
export declare const rAF: (fn: () => void) => number;
export declare const cAF: (handle: number) => void;


code:
'use strict';

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

require('./browser.js');
var core = require('@vueuse/core');

const rAF = (fn) => core.isClient ? window.requestAnimationFrame(fn) : setTimeout(fn, 16);
const cAF = (handle) => core.isClient ? window.cancelAnimationFrame(handle) : clearTimeout(handle);

exports.cAF = cAF;
exports.rAF = rAF;
//# sourceMappingURL=raf.js.map


sourcesContent:
import { isClient } from './browser'

export const rAF = (fn: () => void) =>
  isClient
    ? window.requestAnimationFrame(fn)
    : (setTimeout(fn, 16) as unknown as number)

export const cAF = (handle: number) =>
  isClient ? window.cancelAnimationFrame(handle) : clearTimeout(handle)


code:
/**
 * @deprecated Use `useId` `useIdInjection` instead
 * Generate random number in range [0, 1000]
 * Maybe replace with [uuid](https://www.npmjs.com/package/uuid)
 */
export declare const generateId: () => number;
/**
 * @deprecated
 * Generating a random int in range (0, max - 1)
 * @param max {number}
 */
export declare const getRandomInt: (max: number) => number;


code:
'use strict';

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

const generateId = () => Math.floor(Math.random() * 1e4);
const getRandomInt = (max) => Math.floor(Math.random() * Math.floor(max));

exports.generateId = generateId;
exports.getRandomInt = getRandomInt;
//# sourceMappingURL=rand.js.map


sourcesContent:
/**
 * @deprecated Use `useId` `useIdInjection` instead
 * Generate random number in range [0, 1000]
 * Maybe replace with [uuid](https://www.npmjs.com/package/uuid)
 */
export const generateId = (): number => Math.floor(Math.random() * 10000)

/**
 * @deprecated
 * Generating a random int in range (0, max - 1)
 * @param max {number}
 */
export const getRandomInt = (max: number) =>
  Math.floor(Math.random() * Math.floor(max))


code:
export { camelize, hyphenate, hyphenate as kebabCase, } from '@vue/shared';
/**
 * fork from {@link https://github.com/sindresorhus/escape-string-regexp}
 */
export declare const escapeStringRegexp: (string?: string) => string;
export declare const capitalize: <T extends string>(str: T) => Capitalize<T>;


code:
'use strict';

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

var shared = require('@vue/shared');

const escapeStringRegexp = (string = "") => string.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
const capitalize = (str) => shared.capitalize(str);

Object.defineProperty(exports, 'camelize', {
  enumerable: true,
  get: function () { return shared.camelize; }
});
Object.defineProperty(exports, 'hyphenate', {
  enumerable: true,
  get: function () { return shared.hyphenate; }
});
Object.defineProperty(exports, 'kebabCase', {
  enumerable: true,
  get: function () { return shared.hyphenate; }
});
exports.capitalize = capitalize;
exports.escapeStringRegexp = escapeStringRegexp;
//# sourceMappingURL=strings.js.map


sourcesContent:
import { capitalize as toCapitalize } from '@vue/shared'
export {
  camelize,
  hyphenate,
  hyphenate as kebabCase, // alias
} from '@vue/shared'

/**
 * fork from {@link https://github.com/sindresorhus/escape-string-regexp}
 */
export const escapeStringRegexp = (string = '') =>
  string.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&').replace(/-/g, '\\x2d')

// NOTE: improve capitalize types. Restore previous code after the [PR](https://github.com/vuejs/core/pull/6212) merge
export const capitalize = <T extends string>(str: T) =>
  toCapitalize(str) as Capitalize<T>


code:
export declare function throttleByRaf(cb: (...args: any[]) => void): {
    (...args: any[]): void;
    cancel(): void;
};


code:
'use strict';

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

var raf = require('./raf.js');

function throttleByRaf(cb) {
  let timer = 0;
  const throttle = (...args) => {
    if (timer) {
      raf.cAF(timer);
    }
    timer = raf.rAF(() => {
      cb(...args);
      timer = 0;
    });
  };
  throttle.cancel = () => {
    raf.cAF(timer);
    timer = 0;
  };
  return throttle;
}

exports.throttleByRaf = throttleByRaf;
//# sourceMappingURL=throttleByRaf.js.map


code:
export { isArray, isFunction, isObject, isString, isDate, isPromise, isSymbol, isPlainObject, } from '@vue/shared';
export { isVNode } from 'vue';
export declare const isUndefined: (val: any) => val is undefined;
export declare const isBoolean: (val: any) => val is boolean;
export declare const isNumber: (val: any) => val is number;
export declare const isEmpty: (val: unknown) => boolean;
export declare const isElement: (e: unknown) => e is Element;
export declare const isPropAbsent: (prop: unknown) => prop is null | undefined;
export declare const isStringNumber: (val: string) => boolean;
export declare const isWindow: (val: unknown) => val is Window;


code:
'use strict';

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

var shared = require('@vue/shared');
var lodashUnified = require('lodash-unified');
var vue = require('vue');

const isUndefined = (val) => val === void 0;
const isBoolean = (val) => typeof val === "boolean";
const isNumber = (val) => typeof val === "number";
const isEmpty = (val) => !val && val !== 0 || shared.isArray(val) && val.length === 0 || shared.isObject(val) && !Object.keys(val).length;
const isElement = (e) => {
  if (typeof Element === "undefined")
    return false;
  return e instanceof Element;
};
const isPropAbsent = (prop) => {
  return lodashUnified.isNil(prop);
};
const isStringNumber = (val) => {
  if (!shared.isString(val)) {
    return false;
  }
  return !Number.isNaN(Number(val));
};
const isWindow = (val) => {
  return val === window;
};

Object.defineProperty(exports, 'isArray', {
  enumerable: true,
  get: function () { return shared.isArray; }
});
Object.defineProperty(exports, 'isDate', {
  enumerable: true,
  get: function () { return shared.isDate; }
});
Object.defineProperty(exports, 'isFunction', {
  enumerable: true,
  get: function () { return shared.isFunction; }
});
Object.defineProperty(exports, 'isObject', {
  enumerable: true,
  get: function () { return shared.isObject; }
});
Object.defineProperty(exports, 'isPlainObject', {
  enumerable: true,
  get: function () { return shared.isPlainObject; }
});
Object.defineProperty(exports, 'isPromise', {
  enumerable: true,
  get: function () { return shared.isPromise; }
});
Object.defineProperty(exports, 'isString', {
  enumerable: true,
  get: function () { return shared.isString; }
});
Object.defineProperty(exports, 'isSymbol', {
  enumerable: true,
  get: function () { return shared.isSymbol; }
});
Object.defineProperty(exports, 'isVNode', {
  enumerable: true,
  get: function () { return vue.isVNode; }
});
exports.isBoolean = isBoolean;
exports.isElement = isElement;
exports.isEmpty = isEmpty;
exports.isNumber = isNumber;
exports.isPropAbsent = isPropAbsent;
exports.isStringNumber = isStringNumber;
exports.isUndefined = isUndefined;
exports.isWindow = isWindow;
//# sourceMappingURL=types.js.map


code:
export declare const mutable: <T extends readonly any[] | Record<string, unknown>>(val: T) => Mutable<T>;
export declare type Mutable<T> = {
    -readonly [P in keyof T]: T[P];
};
export declare type HTMLElementCustomized<T> = HTMLElement & T;
/**
 * @deprecated stop to use null
 * @see {@link https://github.com/sindresorhus/meta/discussions/7}
 */
export declare type Nullable<T> = T | null;
export declare type Arrayable<T> = T | T[];
export declare type Awaitable<T> = Promise<T> | T;


code:
'use strict';

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

const mutable = (val) => val;

exports.mutable = mutable;
//# sourceMappingURL=typescript.js.map


sourcesContent:
export const mutable = <T extends readonly any[] | Record<string, unknown>>(
  val: T
) => val as Mutable<typeof val>
export type Mutable<T> = { -readonly [P in keyof T]: T[P] }

export type HTMLElementCustomized<T> = HTMLElement & T

/**
 * @deprecated stop to use null
 * @see {@link https://github.com/sindresorhus/meta/discussions/7}
 */
export type Nullable<T> = T | null

export type Arrayable<T> = T | T[]
export type Awaitable<T> = Promise<T> | T


code:
export declare function createGlobalNode(id?: string): HTMLDivElement;
export declare function removeGlobalNode(el: HTMLElement): void;
export declare function changeGlobalNodesTarget(el: HTMLElement): void;


code:
'use strict';

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

require('../browser.js');
var core = require('@vueuse/core');

const globalNodes = [];
let target = !core.isClient ? void 0 : document.body;
function createGlobalNode(id) {
  const el = document.createElement("div");
  if (id !== void 0) {
    el.setAttribute("id", id);
  }
  if (target) {
    target.appendChild(el);
    globalNodes.push(el);
  }
  return el;
}
function removeGlobalNode(el) {
  globalNodes.splice(globalNodes.indexOf(el), 1);
  el.remove();
}
function changeGlobalNodesTarget(el) {
  if (el === target)
    return;
  target = el;
  globalNodes.forEach((el2) => {
    if (target && !el2.contains(target)) {
      target.appendChild(el2);
    }
  });
}

exports.changeGlobalNodesTarget = changeGlobalNodesTarget;
exports.createGlobalNode = createGlobalNode;
exports.removeGlobalNode = removeGlobalNode;
//# sourceMappingURL=global-node.js.map


code:
import type { Component } from 'vue';
export declare const iconPropType: import("vue").PropType<string | Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>>;
export declare const CloseComponents: {
    Close: any;
};
export declare const TypeComponents: {
    Close: any;
    SuccessFilled: any;
    InfoFilled: any;
    WarningFilled: any;
    CircleCloseFilled: any;
};
export declare const TypeComponentsMap: {
    success: any;
    warning: any;
    error: any;
    info: any;
};
export declare const ValidateComponentsMap: {
    validating: any;
    success: any;
    error: any;
};


code:
'use strict';

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

var iconsVue = require('@element-plus/icons-vue');
require('./props/index.js');
var runtime = require('./props/runtime.js');

const iconPropType = runtime.definePropType([
  String,
  Object,
  Function
]);
const CloseComponents = {
  Close: iconsVue.Close
};
const TypeComponents = {
  Close: iconsVue.Close,
  SuccessFilled: iconsVue.SuccessFilled,
  InfoFilled: iconsVue.InfoFilled,
  WarningFilled: iconsVue.WarningFilled,
  CircleCloseFilled: iconsVue.CircleCloseFilled
};
const TypeComponentsMap = {
  success: iconsVue.SuccessFilled,
  warning: iconsVue.WarningFilled,
  error: iconsVue.CircleCloseFilled,
  info: iconsVue.InfoFilled
};
const ValidateComponentsMap = {
  validating: iconsVue.Loading,
  success: iconsVue.CircleCheck,
  error: iconsVue.CircleClose
};

exports.CloseComponents = CloseComponents;
exports.TypeComponents = TypeComponents;
exports.TypeComponentsMap = TypeComponentsMap;
exports.ValidateComponentsMap = ValidateComponentsMap;
exports.iconPropType = iconPropType;
//# sourceMappingURL=icon.js.map


code:
export * from './global-node';
export * from './icon';
export * from './install';
export * from './props';
export * from './refs';
export * from './size';
export * from './typescript';
export * from './validator';
export * from './vnode';


code:
'use strict';

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

var globalNode = require('./global-node.js');
var icon = require('./icon.js');
var install = require('./install.js');
require('./props/index.js');
var refs = require('./refs.js');
var size = require('./size.js');
require('./typescript.js');
var validator = require('./validator.js');
var vnode = require('./vnode.js');
var runtime = require('./props/runtime.js');

exports.changeGlobalNodesTarget = globalNode.changeGlobalNodesTarget;
exports.createGlobalNode = globalNode.createGlobalNode;
exports.removeGlobalNode = globalNode.removeGlobalNode;
exports.CloseComponents = icon.CloseComponents;
exports.TypeComponents = icon.TypeComponents;
exports.TypeComponentsMap = icon.TypeComponentsMap;
exports.ValidateComponentsMap = icon.ValidateComponentsMap;
exports.iconPropType = icon.iconPropType;
exports.withInstall = install.withInstall;
exports.withInstallDirective = install.withInstallDirective;
exports.withInstallFunction = install.withInstallFunction;
exports.withNoopInstall = install.withNoopInstall;
exports.composeRefs = refs.composeRefs;
exports.getComponentSize = size.getComponentSize;
exports.isValidComponentSize = validator.isValidComponentSize;
exports.isValidDatePickType = validator.isValidDatePickType;
exports.PatchFlags = vnode.PatchFlags;
exports.ensureOnlyChild = vnode.ensureOnlyChild;
exports.flattedChildren = vnode.flattedChildren;
exports.getFirstValidNode = vnode.getFirstValidNode;
exports.getNormalizedProps = vnode.getNormalizedProps;
exports.isComment = vnode.isComment;
exports.isFragment = vnode.isFragment;
exports.isTemplate = vnode.isTemplate;
exports.isText = vnode.isText;
exports.isValidElementNode = vnode.isValidElementNode;
exports.renderBlock = vnode.renderBlock;
exports.renderIf = vnode.renderIf;
exports.buildProp = runtime.buildProp;
exports.buildProps = runtime.buildProps;
exports.definePropType = runtime.definePropType;
exports.epPropKey = runtime.epPropKey;
exports.isEpProp = runtime.isEpProp;
//# sourceMappingURL=index.js.map


code:
import type { Directive } from 'vue';
import type { SFCInstallWithContext, SFCWithInstall } from './typescript';
export declare const withInstall: <T, E extends Record<string, any>>(main: T, extra?: E | undefined) => SFCWithInstall<T> & E;
export declare const withInstallFunction: <T>(fn: T, name: string) => SFCInstallWithContext<T>;
export declare const withInstallDirective: <T extends Directive<any, any>>(directive: T, name: string) => SFCWithInstall<T>;
export declare const withNoopInstall: <T>(component: T) => SFCWithInstall<T>;


code:
'use strict';

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

require('../functions.js');
var shared = require('@vue/shared');

const withInstall = (main, extra) => {
  ;
  main.install = (app) => {
    for (const comp of [main, ...Object.values(extra != null ? extra : {})]) {
      app.component(comp.name, comp);
    }
  };
  if (extra) {
    for (const [key, comp] of Object.entries(extra)) {
      ;
      main[key] = comp;
    }
  }
  return main;
};
const withInstallFunction = (fn, name) => {
  ;
  fn.install = (app) => {
    ;
    fn._context = app._context;
    app.config.globalProperties[name] = fn;
  };
  return fn;
};
const withInstallDirective = (directive, name) => {
  ;
  directive.install = (app) => {
    app.directive(name, directive);
  };
  return directive;
};
const withNoopInstall = (component) => {
  ;
  component.install = shared.NOOP;
  return component;
};

exports.withInstall = withInstall;
exports.withInstallDirective = withInstallDirective;
exports.withInstallFunction = withInstallFunction;
exports.withNoopInstall = withNoopInstall;
//# sourceMappingURL=install.js.map


code:
export * from './util';
export * from './types';
export * from './runtime';


code:
'use strict';

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

require('./util.js');
require('./types.js');
var runtime = require('./runtime.js');

exports.buildProp = runtime.buildProp;
exports.buildProps = runtime.buildProps;
exports.definePropType = runtime.definePropType;
exports.epPropKey = runtime.epPropKey;
exports.isEpProp = runtime.isEpProp;
//# sourceMappingURL=index.js.map


code:
import type { PropType } from 'vue';
import type { EpProp, EpPropConvert, EpPropFinalized, EpPropInput, EpPropMergeType, IfEpProp, IfNativePropType, NativePropType } from './types';
export declare const epPropKey = "__epPropKey";
export declare const definePropType: <T>(val: any) => PropType<T>;
export declare const isEpProp: (val: unknown) => val is EpProp<any, any, any>;
/**
 * @description Build prop. It can better optimize prop types
 * @description 生成 prop，能更好地优化类型
 * @example
  // limited options
  // the type will be PropType<'light' | 'dark'>
  buildProp({
    type: String,
    values: ['light', 'dark'],
  } as const)
  * @example
  // limited options and other types
  // the type will be PropType<'small' | 'large' | number>
  buildProp({
    type: [String, Number],
    values: ['small', 'large'],
    validator: (val: unknown): val is number => typeof val === 'number',
  } as const)
  @link see more: https://github.com/element-plus/element-plus/pull/3341
 */
export declare const buildProp: <Type = never, Value = never, Validator = never, Default extends EpPropMergeType<Type, Value, Validator> = never, Required_1 extends boolean = false>(prop: EpPropInput<Type, Value, Validator, Default, Required_1>, key?: string) => EpPropFinalized<Type, Value, Validator, Default, Required_1>;
export declare const buildProps: <Props extends Record<string, {
    __epPropKey: true;
} | NativePropType | EpPropInput<any, any, any, any, any>>>(props: Props) => { [K in keyof Props]: IfEpProp<Props[K], Props[K], IfNativePropType<Props[K], Props[K], EpPropConvert<Props[K]>>>; };


code:
'use strict';

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

var vue = require('vue');
var lodashUnified = require('lodash-unified');
require('../../types.js');
require('../../objects.js');
var shared = require('@vue/shared');

const epPropKey = "__epPropKey";
const definePropType = (val) => val;
const isEpProp = (val) => shared.isObject(val) && !!val[epPropKey];
const buildProp = (prop, key) => {
  if (!shared.isObject(prop) || isEpProp(prop))
    return prop;
  const { values, required, default: defaultValue, type, validator } = prop;
  const _validator = values || validator ? (val) => {
    let valid = false;
    let allowedValues = [];
    if (values) {
      allowedValues = Array.from(values);
      if (shared.hasOwn(prop, "default")) {
        allowedValues.push(defaultValue);
      }
      valid || (valid = allowedValues.includes(val));
    }
    if (validator)
      valid || (valid = validator(val));
    if (!valid && allowedValues.length > 0) {
      const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
      vue.warn(`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(val)}.`);
    }
    return valid;
  } : void 0;
  const epProp = {
    type,
    required: !!required,
    validator: _validator,
    [epPropKey]: true
  };
  if (shared.hasOwn(prop, "default"))
    epProp.default = defaultValue;
  return epProp;
};
const buildProps = (props) => lodashUnified.fromPairs(Object.entries(props).map(([key, option]) => [
  key,
  buildProp(option, key)
]));

exports.buildProp = buildProp;
exports.buildProps = buildProps;
exports.definePropType = definePropType;
exports.epPropKey = epPropKey;
exports.isEpProp = isEpProp;
//# sourceMappingURL=runtime.js.map


code:
import type { epPropKey } from './runtime';
import type { ExtractPropTypes, PropType } from 'vue';
import type { IfNever, UnknownToNever, WritableArray } from './util';
declare type Value<T> = T[keyof T];
/**
 * Extract the type of a single prop
 *
 * 提取单个 prop 的参数类型
 *
 * @example
 * ExtractPropType<{ type: StringConstructor }> => string | undefined
 * ExtractPropType<{ type: StringConstructor, required: true }> => string
 * ExtractPropType<{ type: BooleanConstructor }> => boolean
 */
export declare type ExtractPropType<T extends object> = Value<ExtractPropTypes<{
    key: T;
}>>;
/**
 * Extracts types via `ExtractPropTypes`, accepting `PropType<T>`, `XXXConstructor`, `never`...
 *
 * 通过 `ExtractPropTypes` 提取类型，接受 `PropType<T>`、`XXXConstructor`、`never`...
 *
 * @example
 * ResolvePropType<BooleanConstructor> => boolean
 * ResolvePropType<PropType<T>> => T
 **/
export declare type ResolvePropType<T> = IfNever<T, never, ExtractPropType<{
    type: WritableArray<T>;
    required: true;
}>>;
/**
 * Merge Type, Value, Validator types
 * 合并 Type、Value、Validator 的类型
 *
 * @example
 * EpPropMergeType<StringConstructor, '1', 1> =>  1 | "1" // ignores StringConstructor
 * EpPropMergeType<StringConstructor, never, number> =>  string | number
 */
export declare type EpPropMergeType<Type, Value, Validator> = IfNever<UnknownToNever<Value>, ResolvePropType<Type>, never> | UnknownToNever<Value> | UnknownToNever<Validator>;
/**
 * Handling default values for input (constraints)
 *
 * 处理输入参数的默认值（约束）
 */
export declare type EpPropInputDefault<Required extends boolean, Default> = Required extends true ? never : Default extends Record<string, unknown> | Array<any> ? () => Default : (() => Default) | Default;
/**
 * Native prop types, e.g: `BooleanConstructor`, `StringConstructor`, `null`, `undefined`, etc.
 *
 * 原生 prop `类型，BooleanConstructor`、`StringConstructor`、`null`、`undefined` 等
 */
export declare type NativePropType = ((...args: any) => any) | {
    new (...args: any): any;
} | undefined | null;
export declare type IfNativePropType<T, Y, N> = [T] extends [NativePropType] ? Y : N;
/**
 * input prop `buildProp` or `buildProps` (constraints)
 *
 * prop 输入参数（约束）
 *
 * @example
 * EpPropInput<StringConstructor, 'a', never, never, true>
 * ⬇
 * {
    type?: StringConstructor | undefined;
    required?: true | undefined;
    values?: readonly "a"[] | undefined;
    validator?: ((val: any) => boolean) | ((val: any) => val is never) | undefined;
    default?: undefined;
  }
 */
export declare type EpPropInput<Type, Value, Validator, Default extends EpPropMergeType<Type, Value, Validator>, Required extends boolean> = {
    type?: Type;
    required?: Required;
    values?: readonly Value[];
    validator?: ((val: any) => val is Validator) | ((val: any) => boolean);
    default?: EpPropInputDefault<Required, Default>;
};
/**
 * output prop `buildProp` or `buildProps`.
 *
 * prop 输出参数。
 *
 * @example
 * EpProp<'a', 'b', true>
 * ⬇
 * {
    readonly type: PropType<"a">;
    readonly required: true;
    readonly validator: ((val: unknown) => boolean) | undefined;
    readonly default: "b";
    __epPropKey: true;
  }
 */
export declare type EpProp<Type, Default, Required> = {
    readonly type: PropType<Type>;
    readonly required: [Required] extends [true] ? true : false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    [epPropKey]: true;
} & IfNever<Default, unknown, {
    readonly default: Default;
}>;
/**
 * Determine if it is `EpProp`
 */
export declare type IfEpProp<T, Y, N> = T extends {
    [epPropKey]: true;
} ? Y : N;
/**
 * Converting input to output.
 *
 * 将输入转换为输出
 */
export declare type EpPropConvert<Input> = Input extends EpPropInput<infer Type, infer Value, infer Validator, any, infer Required> ? EpPropFinalized<Type, Value, Validator, Input['default'], Required> : never;
/**
 * Finalized conversion output
 *
 * 最终转换 EpProp
 */
export declare type EpPropFinalized<Type, Value, Validator, Default, Required> = EpProp<EpPropMergeType<Type, Value, Validator>, UnknownToNever<Default>, Required>;
export {};


code:
'use strict';

//# sourceMappingURL=types.js.map


code:
export declare type Writable<T> = {
    -readonly [P in keyof T]: T[P];
};
export declare type WritableArray<T> = T extends readonly any[] ? Writable<T> : T;
export declare type IfNever<T, Y = true, N = false> = [T] extends [never] ? Y : N;
export declare type IfUnknown<T, Y, N> = [unknown] extends [T] ? Y : N;
export declare type UnknownToNever<T> = IfUnknown<T, never, T>;
export {};


code:
'use strict';

//# sourceMappingURL=util.js.map


code:
import type { ComponentPublicInstance, Ref } from 'vue';
export declare type RefSetter = (el: Element | ComponentPublicInstance | undefined) => void;
export declare const composeRefs: (...refs: (Ref<HTMLElement | undefined> | RefSetter)[]) => (el: Element | ComponentPublicInstance | null) => void;


code:
'use strict';

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

require('../types.js');
var shared = require('@vue/shared');

const composeRefs = (...refs) => {
  return (el) => {
    refs.forEach((ref) => {
      if (shared.isFunction(ref)) {
        ref(el);
      } else {
        ref.value = el;
      }
    });
  };
};

exports.composeRefs = composeRefs;
//# sourceMappingURL=refs.js.map


code:
import type { ComponentSize } from 'element-plus/es/constants';
export declare const getComponentSize: (size?: ComponentSize) => 40 | 32 | 24;


code:
'use strict';

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

require('../../constants/index.js');
var size = require('../../constants/size.js');

const getComponentSize = (size$1) => {
  return size.componentSizeMap[size$1 || "default"];
};

exports.getComponentSize = getComponentSize;
//# sourceMappingURL=size.js.map


sourcesContent:
import { componentSizeMap } from '@element-plus/constants'

import type { ComponentSize } from '@element-plus/constants'

export const getComponentSize = (size?: ComponentSize) => {
  return componentSizeMap[size || 'default']
}

names: size componentSizeMap


code:
import type { AppContext, EmitsOptions, Plugin, SetupContext } from 'vue';
export declare type SFCWithInstall<T> = T & Plugin;
export declare type SFCInstallWithContext<T> = SFCWithInstall<T> & {
    _context: AppContext | null;
};
export declare type EmitFn<E extends EmitsOptions> = SetupContext<E>['emit'];


code:
'use strict';

//# sourceMappingURL=typescript.js.map


code:
export declare const isValidComponentSize: (val: string) => val is "" | "small" | "default" | "large";
export declare const isValidDatePickType: (val: string) => val is "year" | "years" | "month" | "months" | "date" | "dates" | "week" | "datetime" | "datetimerange" | "daterange" | "monthrange" | "yearrange";


code:
'use strict';

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

require('../../constants/index.js');
var size = require('../../constants/size.js');
var date = require('../../constants/date.js');

const isValidComponentSize = (val) => ["", ...size.componentSizes].includes(val);
const isValidDatePickType = (val) => [...date.datePickTypes].includes(val);

exports.isValidComponentSize = isValidComponentSize;
exports.isValidDatePickType = isValidDatePickType;
//# sourceMappingURL=validator.js.map


sourcesContent:
import { componentSizes, datePickTypes } from '@element-plus/constants'
import type { ComponentSize, DatePickType } from '@element-plus/constants'

export const isValidComponentSize = (val: string): val is ComponentSize | '' =>
  ['', ...componentSizes].includes(val)

export const isValidDatePickType = (val: string): val is DatePickType =>
  ([...datePickTypes] as string[]).includes(val)

names: componentSizes datePickTypes


code:
import { createBlock } from 'vue';
import type { VNode, VNodeArrayChildren, VNodeChild, VNodeNormalizedChildren } from 'vue';
export declare enum PatchFlags {
    TEXT = 1,
    CLASS = 2,
    STYLE = 4,
    PROPS = 8,
    FULL_PROPS = 16,
    HYDRATE_EVENTS = 32,
    STABLE_FRAGMENT = 64,
    KEYED_FRAGMENT = 128,
    UNKEYED_FRAGMENT = 256,
    NEED_PATCH = 512,
    DYNAMIC_SLOTS = 1024,
    HOISTED = -1,
    BAIL = -2
}
export declare type VNodeChildAtom = Exclude<VNodeChild, Array<any>>;
export declare type RawSlots = Exclude<VNodeNormalizedChildren, Array<any> | null | string>;
export declare function isFragment(node: VNode): boolean;
export declare function isFragment(node: unknown): node is VNode;
export declare function isText(node: VNode): boolean;
export declare function isText(node: unknown): node is VNode;
export declare function isComment(node: VNode): boolean;
export declare function isComment(node: unknown): node is VNode;
export declare function isTemplate(node: VNode): boolean;
export declare function isTemplate(node: unknown): node is VNode;
/**
 * determine if the element is a valid element type rather than fragments and comment e.g. <template> v-if
 * @param node {VNode} node to be tested
 */
export declare function isValidElementNode(node: VNode): boolean;
export declare function isValidElementNode(node: unknown): node is VNode;
export declare const getFirstValidNode: (nodes: VNodeNormalizedChildren, maxDepth?: number) => string | number | boolean | void | VNode<import("vue").RendererNode, import("vue").RendererElement, {
    [key: string]: any;
}> | VNodeArrayChildren | {
    [name: string]: unknown;
    $stable?: boolean | undefined;
} | null | undefined;
export declare function renderIf(condition: boolean, ...args: Parameters<typeof createBlock>): VNode<import("vue").RendererNode, import("vue").RendererElement, {
    [key: string]: any;
}>;
export declare function renderBlock(...args: Parameters<typeof createBlock>): VNode<import("vue").RendererNode, import("vue").RendererElement, {
    [key: string]: any;
}>;
export declare const getNormalizedProps: (node: VNode) => Record<string, any>;
export declare const ensureOnlyChild: (children: VNodeArrayChildren | undefined) => (string | number | boolean | void | VNode<import("vue").RendererNode, import("vue").RendererElement, {
    [key: string]: any;
}> | null | undefined) | VNodeArrayChildren;
export declare type FlattenVNodes = Array<VNodeChildAtom | RawSlots>;
export declare const flattedChildren: (children: FlattenVNodes | VNode | VNodeNormalizedChildren) => FlattenVNodes;


code:
'use strict';

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

var vue = require('vue');
require('../strings.js');
require('../types.js');
require('../objects.js');
var error = require('../error.js');
var shared = require('@vue/shared');

const SCOPE = "utils/vue/vnode";
var PatchFlags = /* @__PURE__ */ ((PatchFlags2) => {
  PatchFlags2[PatchFlags2["TEXT"] = 1] = "TEXT";
  PatchFlags2[PatchFlags2["CLASS"] = 2] = "CLASS";
  PatchFlags2[PatchFlags2["STYLE"] = 4] = "STYLE";
  PatchFlags2[PatchFlags2["PROPS"] = 8] = "PROPS";
  PatchFlags2[PatchFlags2["FULL_PROPS"] = 16] = "FULL_PROPS";
  PatchFlags2[PatchFlags2["HYDRATE_EVENTS"] = 32] = "HYDRATE_EVENTS";
  PatchFlags2[PatchFlags2["STABLE_FRAGMENT"] = 64] = "STABLE_FRAGMENT";
  PatchFlags2[PatchFlags2["KEYED_FRAGMENT"] = 128] = "KEYED_FRAGMENT";
  PatchFlags2[PatchFlags2["UNKEYED_FRAGMENT"] = 256] = "UNKEYED_FRAGMENT";
  PatchFlags2[PatchFlags2["NEED_PATCH"] = 512] = "NEED_PATCH";
  PatchFlags2[PatchFlags2["DYNAMIC_SLOTS"] = 1024] = "DYNAMIC_SLOTS";
  PatchFlags2[PatchFlags2["HOISTED"] = -1] = "HOISTED";
  PatchFlags2[PatchFlags2["BAIL"] = -2] = "BAIL";
  return PatchFlags2;
})(PatchFlags || {});
function isFragment(node) {
  return vue.isVNode(node) && node.type === vue.Fragment;
}
function isText(node) {
  return vue.isVNode(node) && node.type === vue.Text;
}
function isComment(node) {
  return vue.isVNode(node) && node.type === vue.Comment;
}
const TEMPLATE = "template";
function isTemplate(node) {
  return vue.isVNode(node) && node.type === TEMPLATE;
}
function isValidElementNode(node) {
  return vue.isVNode(node) && !isFragment(node) && !isComment(node);
}
function getChildren(node, depth) {
  if (isComment(node))
    return;
  if (isFragment(node) || isTemplate(node)) {
    return depth > 0 ? getFirstValidNode(node.children, depth - 1) : void 0;
  }
  return node;
}
const getFirstValidNode = (nodes, maxDepth = 3) => {
  if (Array.isArray(nodes)) {
    return getChildren(nodes[0], maxDepth);
  } else {
    return getChildren(nodes, maxDepth);
  }
};
function renderIf(condition, ...args) {
  return condition ? renderBlock(...args) : vue.createCommentVNode("v-if", true);
}
function renderBlock(...args) {
  return vue.openBlock(), vue.createBlock(...args);
}
const getNormalizedProps = (node) => {
  if (!vue.isVNode(node)) {
    error.debugWarn(SCOPE, "[getNormalizedProps] must be a VNode");
    return {};
  }
  const raw = node.props || {};
  const type = (vue.isVNode(node.type) ? node.type.props : void 0) || {};
  const props = {};
  Object.keys(type).forEach((key) => {
    if (shared.hasOwn(type[key], "default")) {
      props[key] = type[key].default;
    }
  });
  Object.keys(raw).forEach((key) => {
    props[shared.camelize(key)] = raw[key];
  });
  return props;
};
const ensureOnlyChild = (children) => {
  if (!shared.isArray(children) || children.length > 1) {
    throw new Error("expect to receive a single Vue element child");
  }
  return children[0];
};
const flattedChildren = (children) => {
  const vNodes = shared.isArray(children) ? children : [children];
  const result = [];
  vNodes.forEach((child) => {
    var _a;
    if (shared.isArray(child)) {
      result.push(...flattedChildren(child));
    } else if (vue.isVNode(child) && shared.isArray(child.children)) {
      result.push(...flattedChildren(child.children));
    } else {
      result.push(child);
      if (vue.isVNode(child) && ((_a = child.component) == null ? void 0 : _a.subTree)) {
        result.push(...flattedChildren(child.component.subTree));
      }
    }
  });
  return result;
};

exports.PatchFlags = PatchFlags;
exports.ensureOnlyChild = ensureOnlyChild;
exports.flattedChildren = flattedChildren;
exports.getFirstValidNode = getFirstValidNode;
exports.getNormalizedProps = getNormalizedProps;
exports.isComment = isComment;
exports.isFragment = isFragment;
exports.isTemplate = isTemplate;
exports.isText = isText;
exports.isValidElementNode = isValidElementNode;
exports.renderBlock = renderBlock;
exports.renderIf = renderIf;
//# sourceMappingURL=vnode.js.map


code: export declare const version = "2.8.6";


code:
'use strict';

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

const version = "2.8.6";

exports.version = version;
//# sourceMappingURL=version.js.map


element-plus

description: A Component Library for Vue 3

keywords:
element-plus
element
component library
ui framework
ui
vue

license: MIT

type: git

access: public

browserslist:
> 1%
not ie 11
not op_mini all


code: @media only screen and (max-width:767px){.hidden-xs-only{display:none!important}}@media only screen and (min-width:768px){.hidden-sm-and-up{display:none!important}}@media only screen and (min-width:768px) and (max-width:991px){.hidden-sm-only{display:none!important}}@media only screen and (max-width:991px){.hidden-sm-and-down{display:none!important}}@media only screen and (min-width:992px){.hidden-md-and-up{display:none!important}}@media only screen and (min-width:992px) and (max-width:1199px){.hidden-md-only{display:none!important}}@media only screen and (max-width:1199px){.hidden-md-and-down{display:none!important}}@media only screen and (min-width:1200px){.hidden-lg-and-up{display:none!important}}@media only screen and (min-width:1200px) and (max-width:1919px){.hidden-lg-only{display:none!important}}@media only screen and (max-width:1919px){.hidden-lg-and-down{display:none!important}}@media only screen and (min-width:1920px){.hidden-xl-only{display:none!important}}


code:
@use 'mixins/mixins' as *;

@include b(affix) {
  @include m(fixed) {
    position: fixed;
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(alert) {
  @include set-component-css-var('alert', $alert);

  width: 100%;
  padding: getCssVar('alert', 'padding');
  margin: 0;
  box-sizing: border-box;
  border-radius: getCssVar('alert', 'border-radius-base');
  position: relative;
  background-color: getCssVar('color', 'white');
  overflow: hidden;
  opacity: 1;
  display: flex;
  align-items: center;
  transition: opacity getCssVar('transition-duration', 'fast');

  @include when(light) {
    .#{$namespace}-alert__close-btn {
      color: getCssVar('text-color', 'placeholder');
    }
  }

  @include when(dark) {
    .#{$namespace}-alert__close-btn {
      color: getCssVar('color', 'white');
    }
    .#{$namespace}-alert__description {
      color: getCssVar('color', 'white');
    }
  }

  @include when(center) {
    justify-content: center;
  }

  @each $type in (success, info, warning, error) {
    @include m($type) {
      @include css-var-from-global(
        ('alert', 'bg-color'),
        ('color', $type, 'light-9')
      );

      &.is-light {
        background-color: getCssVar('alert', 'bg-color');
        color: getCssVar('color', $type);

        .#{$namespace}-alert__description {
          color: getCssVar('color', $type);
        }
      }

      &.is-dark {
        background-color: getCssVar('color', $type);
        color: getCssVar('color', 'white');
      }
    }
  }

  @include e(content) {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  & .#{$namespace}-alert__icon {
    font-size: getCssVar('alert', 'icon-size');
    width: getCssVar('alert', 'icon-size');
    margin-right: 8px;

    @include when(big) {
      font-size: getCssVar('alert', 'icon-large-size');
      width: getCssVar('alert', 'icon-large-size');
      margin-right: 12px;
    }
  }

  @include e(title) {
    font-size: getCssVar('alert', 'title-font-size');
    line-height: 24px;

    &.with-description {
      font-size: getCssVar('alert', 'title-with-description-font-size');
    }
  }

  & .#{$namespace}-alert__description {
    font-size: getCssVar('alert', 'description-font-size');
    margin: 0;
  }

  & .#{$namespace}-alert__close-btn {
    font-size: getCssVar('alert', 'close-font-size');
    opacity: 1;
    position: absolute;
    top: 12px;
    right: 16px;
    cursor: pointer;

    @include when(customed) {
      font-style: normal;
      font-size: getCssVar('alert', 'close-customed-font-size');
      line-height: 24px;
      top: 8px;
    }
  }
}

.#{$namespace}-alert-fade-enter-from,
.#{$namespace}-alert-fade-leave-active {
  opacity: 0;
}


code:
@use 'sass:map';

@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(anchor) {
  @include e(item) {
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  @include e(link) {
    font-size: getCssVar('anchor-font-size');
    line-height: getCssVar('anchor-line-height');
    padding: 4px 0;
    color: getCssVar('anchor-color');
    transition: color getCssVar('transition-duration');
    white-space: nowrap;
    text-decoration: none;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
    outline: none;
    cursor: pointer;

    &:hover,
    &:focus {
      color: getCssVar('anchor-color');
    }

    @include when(active) {
      color: getCssVar('anchor-active-color');
    }
  }

  & .#{$namespace}-anchor__list .#{$namespace}-anchor__item a {
    display: inline-block;
  }
}


code:
@use 'sass:map';

@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(anchor) {
  @include set-component-css-var('anchor', $anchor);

  position: relative;
  background-color: getCssVar('anchor-bg-color');

  @include e(marker) {
    position: absolute;
    background-color: getCssVar('anchor-marker-bg-color');
    border-radius: 4px;
    opacity: 0;
    z-index: 0;
  }

  &.#{$namespace}-anchor--vertical {
    @include e(marker) {
      width: 4px;
      height: 14px;
      top: 8px;
      left: 0;
      transition: top 0.25s ease-in-out, opacity 0.25s;
    }

    @include e(list) {
      padding-left: getCssVar('anchor-padding-indent');
    }

    &.#{$namespace}-anchor--underline {
      &::before {
        position: absolute;
        left: 0;
        width: 2px;
        height: 100%;
        background-color: rgba(5, 5, 5, 0.06);
        content: '';
      }

      @include e(marker) {
        width: 2px;
        border-radius: unset;
      }
    }
  }

  &.#{$namespace}-anchor--horizontal {
    @include e(marker) {
      height: 2px;
      width: 20px;
      bottom: 0;
      transition: left 0.25s ease-in-out, opacity 0.25s, width 0.25s;
    }

    @include e(list) {
      display: flex;
      padding-bottom: 4px;

      @include e(item) {
        padding-left: 16px;

        &:first-child {
          padding-left: 0;
        }
      }
    }

    &.#{$namespace}-anchor--underline {
      &::before {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 2px;
        background-color: rgba(5, 5, 5, 0.06);
        content: '';
      }

      @include e(marker) {
        height: 2px;
        border-radius: unset;
      }
    }
  }
}


code:
@use 'mixins/mixins' as *;

@include b(aside) {
  overflow: auto;
  box-sizing: border-box;
  flex-shrink: 0;
  width: var(#{getCssVarName('aside', 'width')}, 300px);
}


code:
@use 'sass:map';

@use 'mixins/mixins' as *;
@use 'mixins/utils' as *;
@use 'common/var' as *;

@include b(autocomplete) {
  @include set-component-css-var('input', $input);
}

@include b(autocomplete) {
  width: getCssVar('input-width');
  position: relative;
  display: inline-block;

  @include e(popper) {
    @include picker-popper(
      getCssVar('bg-color', 'overlay'),
      1px solid getCssVar('border-color', 'light'),
      getCssVar('box-shadow', 'light')
    );
  }
}

@include b(autocomplete-suggestion) {
  border-radius: getCssVar('border-radius', 'base');
  box-sizing: border-box;

  @include e(wrap) {
    max-height: 280px;
    padding: 10px 0;
    box-sizing: border-box;
  }

  @include e(list) {
    margin: 0;
    padding: 0;
  }

  & li {
    padding: 0 20px;
    margin: 0;
    line-height: 34px;
    cursor: pointer;
    color: getCssVar('text-color', 'regular');
    font-size: getCssVar('font-size', 'base');
    list-style: none;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    &:hover {
      background-color: map.get($select-option, 'hover-background');
    }

    &.highlighted {
      background-color: map.get($select-option, 'hover-background');
    }

    &.divider {
      margin-top: 6px;
      border-top: 1px solid getCssVar('color', 'black');
    }

    &.divider:last-child {
      margin-bottom: -6px;
    }
  }

  @include when(loading) {
    li {
      text-align: center;
      height: 100px;
      line-height: 100px;
      font-size: 20px;
      color: getCssVar('text-color', 'secondary');
      @include utils-vertical-center;

      &:hover {
        background-color: getCssVar('bg-color', 'overlay');
      }
    }

    & .#{$namespace}-icon-loading {
      vertical-align: middle;
    }
  }
}


code:
@use 'sass:map';

@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(avatar) {
  @include set-component-css-var('avatar', $avatar);
  @include set-component-css-var('avatar-size', $avatar-size);

  @include set-css-var-value(
    ('avatar', 'size'),
    map.get($avatar-size, 'default')
  );

  display: inline-flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  text-align: center;
  overflow: hidden;
  outline: none;
  color: getCssVar('avatar', 'text-color');
  background: getCssVar('avatar', 'bg-color');
  width: getCssVar('avatar', 'size');
  height: getCssVar('avatar', 'size');
  font-size: getCssVar('avatar', 'text-size');

  > img {
    display: block;
    width: 100%;
    height: 100%;
  }

  @include m(circle) {
    border-radius: 50%;
  }

  @include m(square) {
    border-radius: getCssVar('avatar', 'border-radius');
  }

  @include m(icon) {
    font-size: getCssVar('avatar', 'icon-size');
  }

  @each $size in (small, large) {
    @include m($size) {
      @include set-css-var-value(
        ('avatar', 'size'),
        map.get($avatar-size, $size)
      );
    }
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(backtop) {
  @include set-component-css-var('backtop', $backtop);

  position: fixed;
  background-color: getCssVar('backtop', 'bg-color');
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: getCssVar('backtop', 'text-color');
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  box-shadow: getCssVar('box-shadow', 'lighter');
  cursor: pointer;
  z-index: 5;

  &:hover {
    background-color: getCssVar('backtop', 'hover-bg-color');
  }

  @include e(icon) {
    font-size: 20px;
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(badge) {
  @include set-component-css-var('badge', $badge);

  position: relative;
  vertical-align: middle;
  display: inline-block;
  width: fit-content;

  @include e(content) {
    background-color: getCssVar('badge', 'bg-color');
    border-radius: getCssVar('badge', 'radius');
    color: getCssVar('color', 'white');

    display: inline-flex;
    justify-content: center;
    align-items: center;

    font-size: getCssVar('badge', 'font-size');
    height: getCssVar('badge', 'size');
    padding: 0 getCssVar('badge', 'padding');
    white-space: nowrap;
    border: 1px solid getCssVar('bg-color');

    @include when(fixed) {
      position: absolute;
      top: 0;
      right: calc(1px + #{getCssVar('badge', 'size')} / 2);
      transform: translateY(-50%) translateX(100%);
      z-index: getCssVar('index', 'normal');

      @include when(dot) {
        right: 5px;
      }
    }

    @include when(dot) {
      height: 8px;
      width: 8px;
      padding: 0;
      right: 0;
      border-radius: 50%;
    }

    @include when(hide-zero) {
      display: none;
    }

    @each $type in (primary, success, warning, info, danger) {
      @include m($type) {
        background-color: getCssVar('color', $type);
      }
    }
  }
}


code:
@use 'var.scss';
@use 'common/transition.scss';
@use 'icon.scss';


code:
@use 'mixins/mixins' as *;
@use 'mixins/utils' as *;
@use 'common/var' as *;

@include b(breadcrumb) {
  font-size: 14px;
  line-height: 1;
  @include utils-clearfix;

  @include e(separator) {
    margin: 0 9px;
    font-weight: bold;
    color: getCssVar('text-color', 'placeholder');

    &.#{$namespace}-icon {
      margin: 0 6px;
      font-weight: normal;
      svg {
        vertical-align: middle;
      }
    }
  }

  @include e(item) {
    float: left;
    display: inline-flex;
    align-items: center;

    @include e(inner) {
      color: getCssVar('text-color', 'regular');

      &.is-link,
      & a {
        font-weight: bold;
        text-decoration: none;
        transition: getCssVar('transition', 'color');
        color: getCssVar('text-color', 'primary');

        &:hover {
          color: getCssVar('color-primary');
          cursor: pointer;
        }
      }
    }

    &:last-child {
      .#{$namespace}-breadcrumb__inner,
      .#{$namespace}-breadcrumb__inner a {
        &,
        &:hover {
          font-weight: normal;
          color: getCssVar('text-color', 'regular');
          cursor: text;
        }
      }

      .#{$namespace}-breadcrumb__separator {
        display: none;
      }
    }
  }
}


code:
@use 'sass:map';

@use 'common/var' as *;
@use 'mixins/mixins' as *;
@use 'mixins/utils' as *;

@include b(button-group) {
  display: inline-block;
  vertical-align: middle;
  @include utils-clearfix;

  & > .#{$namespace}-button {
    float: left;
    position: relative;
    & + .#{$namespace}-button {
      margin-left: 0;
    }
    &:first-child {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
    &:last-child {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
    &:first-child:last-child {
      border-top-right-radius: map.get($button-border-radius, 'default');
      border-bottom-right-radius: map.get($button-border-radius, 'default');
      border-top-left-radius: map.get($button-border-radius, 'default');
      border-bottom-left-radius: map.get($button-border-radius, 'default');

      &.is-round {
        border-radius: getCssVar('border-radius', 'round');
      }

      &.is-circle {
        border-radius: 50%;
      }
    }
    &:not(:first-child):not(:last-child) {
      border-radius: 0;
    }
    &:not(:last-child) {
      margin-right: -1px;
    }

    &:hover,
    &:focus,
    &:active {
      z-index: 1;
    }

    @include when(active) {
      z-index: 1;
    }
  }

  & > .#{$namespace}-dropdown {
    & > .#{$namespace}-button {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border-left-color: getCssVar('button', 'divide-border-color');
    }
  }

  @each $type in (primary, success, warning, danger, info) {
    .#{$namespace}-button--#{$type} {
      &:first-child {
        border-right-color: getCssVar('button', 'divide-border-color');
      }
      &:last-child {
        border-left-color: getCssVar('button', 'divide-border-color');
      }
      &:not(:first-child):not(:last-child) {
        border-left-color: getCssVar('button', 'divide-border-color');
        border-right-color: getCssVar('button', 'divide-border-color');
      }
    }
  }
}


code:
@use 'sass:map';

@use 'common/var' as *;
@use 'mixins/button' as *;
@use 'mixins/mixins' as *;
@use 'mixins/utils' as *;
@use 'mixins/var' as *;

$button-icon-span-gap: () !default;
$button-icon-span-gap: map.merge(
  (
    'large': 8px,
    'default': 6px,
    'small': 4px,
  ),
  $button-icon-span-gap
);

@include b(button) {
  @include set-component-css-var('button', $button);
}

@include b(button) {
  display: inline-flex;
  justify-content: center;
  align-items: center;

  line-height: 1;
  // min-height will expand when in flex
  height: map.get($input-height, 'default');
  white-space: nowrap;
  cursor: pointer;
  color: getCssVar('button', 'text-color');
  text-align: center;
  box-sizing: border-box;
  outline: none;
  transition: 0.1s;
  font-weight: getCssVar('button', 'font-weight');
  user-select: none;
  vertical-align: middle;
  -webkit-appearance: none;
  background-color: getCssVar('button', 'bg-color');
  border: getCssVar('border');
  border-color: getCssVar('button', 'border-color');

  &:hover {
    color: getCssVar('button', 'hover', 'text-color');
    border-color: getCssVar('button', 'hover', 'border-color');
    background-color: getCssVar('button', 'hover', 'bg-color');
    outline: none;
  }

  &:active {
    color: getCssVar('button', 'active', 'text-color');
    border-color: getCssVar('button', 'active', 'border-color');
    background-color: getCssVar('button', 'active', 'bg-color');
    outline: none;
  }

  &:focus-visible {
    outline: 2px solid getCssVar('button', 'outline-color');
    outline-offset: 1px;
    transition: outline-offset 0s, outline 0s;
  }

  > span {
    display: inline-flex;
    align-items: center;
  }

  & + & {
    margin-left: 12px;
  }

  & {
    @include button-size(
      map.get($button-padding-vertical, 'default') - $button-border-width,
      map.get($button-padding-horizontal, 'default') - $button-border-width,
      map.get($button-font-size, 'default'),
      map.get($button-border-radius, 'default')
    );
  }

  &::-moz-focus-inner {
    border: 0;
  }

  & [class*='#{$namespace}-icon'] {
    & + span {
      margin-left: map.get($button-icon-span-gap, 'default');
    }
    svg {
      vertical-align: bottom;
    }
  }

  @include when(plain) {
    @include css-var-from-global(
      ('button', 'hover', 'text-color'),
      ('color', 'primary')
    );
    @include css-var-from-global(
      ('button', 'hover', 'bg-color'),
      ('fill-color', 'blank')
    );
    @include css-var-from-global(
      ('button', 'hover', 'border-color'),
      ('color', 'primary')
    );
  }

  @include when(active) {
    color: getCssVar('button', 'active', 'text-color');
    border-color: getCssVar('button', 'active', 'border-color');
    background-color: getCssVar('button', 'active', 'bg-color');
    outline: none;
  }

  @include when(disabled) {
    &,
    &:hover {
      color: getCssVar('button', 'disabled', 'text-color');
      cursor: not-allowed;
      background-image: none;
      background-color: getCssVar('button', 'disabled', 'bg-color');
      border-color: getCssVar('button', 'disabled', 'border-color');
    }
  }

  @include when(loading) {
    position: relative;
    pointer-events: none;

    &:before {
      // mask the button
      z-index: 1;
      pointer-events: none;
      content: '';
      position: absolute;
      left: -1px;
      top: -1px;
      right: -1px;
      bottom: -1px;
      border-radius: inherit;
      background-color: getCssVar('mask-color', 'extra-light');
    }
  }
  @include when(round) {
    border-radius: getCssVar('border-radius', 'round');
  }
  @include when(circle) {
    width: map.get($input-height, 'default');
    border-radius: 50%;
    padding: map.get($button-padding-vertical, 'default') - $button-border-width;
  }

  @include when(text) {
    color: getCssVar('button', 'text-color');
    border: 0 solid transparent;
    background-color: transparent;

    @include when(disabled) {
      color: getCssVar('button', 'disabled', 'text-color');
      background-color: transparent !important;
    }

    &:not(.is-disabled) {
      &:hover {
        background-color: getCssVar('fill-color', 'light');
      }

      &:focus-visible {
        outline: 2px solid getCssVar('button', 'outline-color');
        outline-offset: 1px;
        transition: outline-offset 0s, outline 0s;
      }

      &:active {
        background-color: getCssVar('fill-color');
      }

      @include when(has-bg) {
        background-color: getCssVar('fill-color', 'light');

        &:hover {
          background-color: getCssVar('fill-color');
        }

        &:active {
          background-color: getCssVar('fill-color', 'dark');
        }
      }
    }
  }

  @include e(text) {
    @include m(expand) {
      letter-spacing: 0.3em;
      margin-right: -0.3em;
    }
  }

  @include when(link) {
    border-color: transparent;
    color: getCssVar('button', 'text-color');
    background: transparent;
    padding: 2px;
    height: auto;

    &:hover {
      color: getCssVar('button', 'hover', 'link-text-color');
    }

    @include when(disabled) {
      color: getCssVar('button', 'disabled', 'text-color');
      background-color: transparent !important;
      border-color: transparent !important;
    }

    &:not(.is-disabled) {
      &:hover {
        border-color: transparent;
        background-color: transparent;
      }

      &:active {
        color: getCssVar('button', 'active-color');
        border-color: transparent;
        background-color: transparent;
      }
    }
  }

  @include m(text) {
    border-color: transparent;
    background: transparent;
    color: getCssVar('color', 'primary');
    padding-left: 0;
    padding-right: 0;
    @include when(disabled) {
      color: getCssVar('button', 'disabled', 'text-color');
      background-color: transparent !important;
      border-color: transparent !important;
    }

    &:not(.is-disabled) {
      &:hover {
        color: getCssVar('color', 'primary', 'light-3');
        border-color: transparent;
        background-color: transparent;
      }

      &:active {
        color: getCssVar('color', 'primary', 'dark-2');
        border-color: transparent;
        background-color: transparent;
      }
    }
  }

  @include e(link) {
    @include m(expand) {
      letter-spacing: 0.3em;
      margin-right: -0.3em;
    }
  }

  @each $type in (primary, success, warning, danger, info) {
    @include m($type) {
      @include button-variant($type);
    }
  }

  @each $size in (large, small) {
    @include m($size) {
      @include set-css-var-value(
        ('button', 'size'),
        map.get($input-height, $size)
      );

      height: getCssVar('button', 'size');

      & [class*='#{$namespace}-icon'] {
        & + span {
          margin-left: map.get($button-icon-span-gap, $size);
        }
      }

      & {
        @include button-size(
          map.get($button-padding-vertical, $size) - $button-border-width,
          map.get($button-padding-horizontal, $size) - $button-border-width,
          map.get($button-font-size, $size),
          map.get($button-border-radius, $size)
        );
      }

      @include when(circle) {
        width: getCssVar('button', 'size');
        padding: map.get($button-padding-vertical, $size) - $button-border-width;
      }
    }
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(calendar) {
  @include set-component-css-var('calendar', $calendar);

  background-color: getCssVar('fill-color', 'blank');

  @include e(header) {
    display: flex;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: getCssVar('calendar', 'header-border-bottom');
  }

  @include e(title) {
    color: getCssVar('text-color');
    align-self: center;
  }

  @include e(body) {
    padding: 12px 20px 35px;
  }
}

@include b(calendar-table) {
  table-layout: fixed;
  width: 100%;

  thead th {
    padding: 12px 0;
    color: getCssVar('text-color', 'regular');
    font-weight: normal;
  }

  &:not(.is-range) {
    td.prev,
    td.next {
      color: getCssVar('text-color', 'placeholder');
    }
  }

  td {
    border-bottom: getCssVar('calendar', 'border');
    border-right: getCssVar('calendar', 'border');
    vertical-align: top;
    transition: background-color getCssVar('transition-duration', 'fast') ease;

    @include when(selected) {
      background-color: getCssVar('calendar', 'selected-bg-color');
    }

    @include when(today) {
      color: getCssVar('color-primary');
    }
  }

  tr:first-child td {
    border-top: getCssVar('calendar', 'border');
  }

  tr td:first-child {
    border-left: getCssVar('calendar', 'border');
  }

  tr.#{$namespace}-calendar-table__row--hide-border td {
    border-top: none;
  }

  @include b(calendar-day) {
    box-sizing: border-box;
    padding: 8px;
    height: getCssVar('calendar', 'cell-width');
    &:hover {
      cursor: pointer;
      background-color: getCssVar('calendar', 'selected-bg-color');
    }
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(card) {
  @include set-component-css-var('card', $card);
}

@include b(card) {
  border-radius: getCssVar('card', 'border-radius');
  border: 1px solid getCssVar('card', 'border-color');
  background-color: getCssVar('card', 'bg-color');
  overflow: hidden;
  color: getCssVar('text-color', 'primary');
  transition: getCssVar('transition-duration');

  @include when(always-shadow) {
    box-shadow: getCssVar('box-shadow', 'light');
  }

  @include when(hover-shadow) {
    &:hover,
    &:focus {
      box-shadow: getCssVar('box-shadow', 'light');
    }
  }

  @include e(header) {
    padding: calc(#{getCssVar('card', 'padding')} - 2px)
      getCssVar('card', 'padding');
    border-bottom: 1px solid getCssVar('card', 'border-color');
    box-sizing: border-box;
  }

  @include e(body) {
    padding: getCssVar('card', 'padding');
  }

  @include e(footer) {
    padding: calc(#{getCssVar('card', 'padding')} - 2px)
      getCssVar('card', 'padding');
    border-top: 1px solid getCssVar('card', 'border-color');
    box-sizing: border-box;
  }
}


code:
@use 'mixins/mixins' as *;
@use 'common/var' as *;

@include b(carousel) {
  @include e(item) {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
    overflow: hidden;
    z-index: calc(getCssVar('index', 'normal') - 1);

    @include when(active) {
      z-index: calc(getCssVar('index', 'normal') - 1);
    }

    @include when(animating) {
      transition: transform 0.4s ease-in-out;
    }

    @include m(card) {
      width: 50%;
      transition: transform 0.4s ease-in-out;

      &.is-in-stage {
        cursor: pointer;
        z-index: getCssVar('index', 'normal');

        &:hover .#{$namespace}-carousel__mask,
        &.is-hover .#{$namespace}-carousel__mask {
          opacity: 0.12;
        }
      }

      &.is-active {
        z-index: calc(getCssVar('index', 'normal') + 1);
      }
    }

    @include m(card-vertical) {
      width: 100%;
      height: 50%;
    }
  }

  @include e(mask) {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: getCssVar('color', 'white');
    opacity: 0.24;
    transition: getCssVar('transition-duration', 'fast');
  }
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'mixins/utils' as *;
@use 'common/var' as *;

@include b(carousel) {
  @include set-component-css-var('carousel', $carousel);

  position: relative;

  @include m(horizontal) {
    overflow: hidden;
  }

  @include m(vertical) {
    overflow: hidden;
  }

  @include e(container) {
    position: relative;
    height: 300px;
  }

  @include e(arrow) {
    border: none;
    outline: none;
    padding: 0;
    margin: 0;
    height: getCssVar('carousel', 'arrow-size');
    width: getCssVar('carousel', 'arrow-size');
    cursor: pointer;
    transition: getCssVar('transition', 'duration');
    border-radius: 50%;
    background-color: getCssVar('carousel', 'arrow-background');
    color: $color-white;
    position: absolute;
    top: 50%;
    z-index: 10;
    transform: translateY(-50%);
    text-align: center;
    font-size: getCssVar('carousel', 'arrow-font-size');

    @include utils-inline-flex-center;

    @include m(left) {
      left: 16px;
    }

    @include m(right) {
      right: 16px;
    }

    &:hover {
      background-color: getCssVar('carousel', 'arrow-hover-background');
    }

    & i {
      cursor: pointer;
    }
  }

  @include e(indicators) {
    position: absolute;
    list-style: none;
    margin: 0;
    padding: 0;
    z-index: calc(#{getCssVar('index-normal')} + 1);

    @include m(horizontal) {
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
    }

    @include m(vertical) {
      right: 0;
      top: 50%;
      transform: translateY(-50%);
    }

    @include m(outside) {
      bottom: calc(
        getCssVar('carousel-indicator-height') +
          getCssVar('carousel-indicator-padding-vertical') * 2
      );
      text-align: center;
      position: static;
      transform: none;

      .#{$namespace}-carousel__indicator:hover button {
        opacity: 0.64;
      }

      button {
        background-color: getCssVar('carousel', 'indicator-out-color');
        opacity: 0.24;
      }
    }

    @include m(right) {
      right: 0;
    }

    @include m(labels) {
      left: 0;
      right: 0;
      transform: none;
      text-align: center;

      .#{$namespace}-carousel__button {
        height: auto;
        width: auto;
        padding: 2px 18px;
        font-size: 12px;
        color: $color-black;
      }

      .#{$namespace}-carousel__indicator {
        padding: 6px 4px;
      }
    }
  }

  @include e(indicator) {
    background-color: transparent;
    cursor: pointer;

    &:hover button {
      opacity: 0.72;
    }

    @include m(horizontal) {
      display: inline-block;
      padding: getCssVar('carousel-indicator-padding-vertical')
        getCssVar('carousel-indicator-padding-horizontal');
    }

    @include m(vertical) {
      padding: getCssVar('carousel-indicator-padding-horizontal')
        getCssVar('carousel-indicator-padding-vertical');

      .#{$namespace}-carousel__button {
        width: getCssVar('carousel-indicator-height');
        height: calc(#{getCssVar('carousel-indicator-width')} / 2);
      }
    }

    @include when(active) {
      button {
        opacity: 1;
      }
    }
  }

  @include e(button) {
    display: block;
    opacity: 0.48;
    width: getCssVar('carousel-indicator-width');
    height: getCssVar('carousel-indicator-height');
    background-color: $color-white;
    border: none;
    outline: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    transition: getCssVar('transition-duration');
  }
}

.carousel-arrow-left-enter-from,
.carousel-arrow-left-leave-active {
  transform: translateY(-50%) translateX(-10px);
  opacity: 0;
}

.carousel-arrow-right-enter-from,
.carousel-arrow-right-leave-active {
  transform: translateY(-50%) translateX(10px);
  opacity: 0;
}

.#{$namespace}-transitioning {
  filter: url('#elCarouselHorizontal');
}

.#{$namespace}-transitioning-vertical {
  filter: url('#elCarouselVertical');
}


code:
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@include b(cascader-panel) {
  @include set-component-css-var('cascader', $cascader);
}

@include b(cascader-panel) {
  display: flex;
  border-radius: getCssVar('cascader-menu', 'radius');
  font-size: getCssVar('cascader-menu', 'font-size');

  @include when(bordered) {
    border: getCssVar('cascader-menu', 'border');
    border-radius: getCssVar('cascader-menu', 'radius');
  }
}

@include b(cascader-menu) {
  min-width: 180px;
  box-sizing: border-box;
  color: getCssVar('cascader-menu', 'text-color');
  border-right: getCssVar('cascader-menu', 'border');

  &:last-child {
    border-right: none;

    .#{$namespace}-cascader-node {
      padding-right: 20px;
    }
  }

  @include e(wrap) {
    // Raise the priority
    &.#{$namespace}-scrollbar__wrap {
      height: 204px;
    }
  }

  @include e(list) {
    position: relative;
    min-height: 100%;
    margin: 0;
    padding: 6px 0;
    list-style: none;
    box-sizing: border-box;
  }

  @include e(hover-zone) {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
  }

  @include e(empty-text) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    color: getCssVar('cascader', 'color-empty');

    .is-loading {
      margin-right: 2px;
    }
  }
}

@include b(cascader-node) {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 30px 0 20px;
  height: 34px;
  line-height: 34px;
  outline: none;

  &.is-selectable.in-active-path {
    color: getCssVar('cascader-menu', 'text-color');
  }

  &.in-active-path,
  &.is-selectable.in-checked-path,
  &.is-active {
    color: getCssVar('cascader-menu', 'selected-text-color');
    font-weight: bold;
  }

  &:not(.is-disabled) {
    cursor: pointer;

    &:hover,
    &:focus {
      background: getCssVar('cascader-node', 'background-hover');
    }
  }

  @include when(disabled) {
    color: getCssVar('cascader-node', 'color-disabled');
    cursor: not-allowed;
  }

  @include e(prefix) {
    position: absolute;
    left: 10px;
  }

  @include e(postfix) {
    position: absolute;
    right: 10px;
  }

  @include e(label) {
    flex: 1;
    text-align: left;
    padding: 0 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  > .#{$namespace}-checkbox {
    margin-right: 0;
  }

  > .#{$namespace}-radio {
    margin-right: 0;

    .#{$namespace}-radio__label {
      padding-left: 0;
    }
  }
}


code:
@use 'sass:map';

@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'common/var' as *;

@mixin cascader-tag-normal($background-color) {
  .#{$namespace}-tag {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    margin: 2px 0 2px 6px;
    text-overflow: ellipsis;
    background: $background-color;

    &.#{$namespace}-tag--dark,
    &.#{$namespace}-tag--plain {
      background-color: getCssVar('tag', 'bg-color');
    }

    &:not(.is-hit) {
      border-color: transparent;

      &.#{$namespace}-tag--dark,
      &.#{$namespace}-tag--plain {
        border-color: getCssVar('tag', 'border-color');
      }
    }

    > span {
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .#{$namespace}-icon-close {
      flex: none;
      background-color: getCssVar('text-color', 'placeholder');
      color: getCssVar('color-white');

      &:hover {
        background-color: getCssVar('text-color', 'secondary');
      }
    }
  }
}

@include b(cascader) {
  @include set-component-css-var('cascader', $cascader);

  display: inline-block;
  vertical-align: middle;
  position: relative;
  font-size: getCssVar('font-size', 'base');
  line-height: map.get($input-height, 'default');
  outline: none;

  &:not(.is-disabled):hover {
    .#{$namespace}-input__wrapper {
      cursor: pointer;
      box-shadow: 0 0 0 1px getCssVar('input', 'hover-border-color') inset;
    }
  }

  .#{$namespace}-input {
    display: flex;
    cursor: pointer;

    .#{$namespace}-input__inner {
      text-overflow: ellipsis;
      cursor: pointer;
    }

    .#{$namespace}-input__suffix-inner {
      .#{$namespace}-icon {
        height: calc(100% - 2px);

        svg {
          vertical-align: middle;
        }
      }
    }

    .icon-arrow-down {
      transition: transform getCssVar('transition-duration');
      font-size: 14px;

      @include when(reverse) {
        transform: rotateZ(180deg);
      }
    }

    .icon-circle-close:hover {
      color: var(
        #{getCssVarName('input', 'clear-hover-color')},
        map.get($input, 'clear-hover-color')
      );
    }

    @include when(focus) {
      .#{$namespace}-input__wrapper {
        box-shadow: 0 0 0 1px
          var(
            #{getCssVarName('input', 'focus-border-color')},
            map.get($input, 'focus-border-color')
          )
          inset;
      }
    }
  }

  @each $size in (large, small) {
    @include m($size) {
      font-size: map.get($input-font-size, $size);
      line-height: map.get($input-height, $size);
    }
  }

  @include when(disabled) {
    .#{$namespace}-cascader__label {
      z-index: calc(getCssVar('index', 'normal') + 1);
      color: getCssVar('disabled-text-color');
    }
  }

  @include e(dropdown) {
    @include set-component-css-var('cascader', $cascader);
  }

  @include e(dropdown) {
    font-size: getCssVar('cascader-menu-font-size');
    border-radius: getCssVar('cascader-menu-radius');

    @include picker-popper(
      getCssVar('cascader-menu-fill'),
      getCssVar('cascader-menu-border'),
      getCssVar('cascader-menu-shadow')
    );

    &.#{$namespace}-popper {
      box-shadow: getCssVar('cascader-menu-shadow');
    }
  }

  @include e(tags) {
    position: absolute;
    left: 0;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-wrap: wrap;
    line-height: normal;
    text-align: left;
    box-sizing: border-box;
    @include cascader-tag-normal(getCssVar('cascader-tag-background'));

    &.is-validate {
      right: 55px;
    }
  }

  @include e(collapse-tags) {
    white-space: normal;
    z-index: getCssVar('index-normal');
    @include cascader-tag-normal(getCssVar('fill-color'));
  }

  @include e(suggestion-panel) {
    border-radius: getCssVar('cascader-menu', 'radius');
  }

  @include e(suggestion-list) {
    max-height: 204px;
    margin: 0;
    padding: 6px 0;
    font-size: getCssVar('font-size', 'base');
    color: getCssVar('cascader-menu', 'text-color');
    text-align: center;
  }

  @include e(suggestion-item) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 34px;
    padding: 0 15px;
    text-align: left;
    outline: none;
    cursor: pointer;

    &:hover,
    &:focus {
      background: getCssVar('cascader-node', 'background-hover');
    }

    &.is-checked {
      color: getCssVar('cascader', 'menu-selected-text-color');
      font-weight: bold;
    }

    > span {
      margin-right: 10px;
    }
  }

  @include e(empty-text) {
    margin: 10px 0;
    color: getCssVar('cascader', 'color-empty');
  }

  @include e(search-input) {
    flex: 1;
    height: 24px;
    min-width: 60px;
    margin: 2px 0 2px map.get($input-padding-horizontal, 'default')-$border-width;
    padding: 0;
    color: getCssVar('cascader', 'menu-text-color');
    border: none;
    outline: none;
    box-sizing: border-box;

    background: transparent;

    &::placeholder {
      // two input overlap
      color: transparent;
    }
  }
}


code:
@use 'mixins/mixins' as *;
@use 'common/var' as *;

@include b(check-tag) {
  background-color: getCssVar('color', 'info', 'light-9');
  border-radius: getCssVar('border-radius', 'base');
  color: getCssVar('color', 'info');
  cursor: pointer;
  display: inline-block;
  font-size: getCssVar('font-size', 'base');
  line-height: getCssVar('font-size', 'base');
  padding: 7px 15px;
  transition: getCssVar('transition', 'all');
  font-weight: bold;

  &:hover {
    background-color: getCssVar('color', 'info', 'light-7');
  }

  @each $type in $types {
    &.#{bem('check-tag', '', $type)} {
      @include when(checked) {
        background-color: getCssVar('color', $type, 'light-8');
        color: getCssVar('color', $type);

        &:hover {
          background-color: getCssVar('color', $type, 'light-7');
        }

        @include when(disabled) {
          background-color: getCssVar('color', $type, 'light-8');
          color: getCssVar('disabled-text-color');
          cursor: not-allowed;

          &:hover {
            background-color: getCssVar('color', $type, 'light-8');
          }
        }
      }

      @include when(disabled) {
        @if $type == 'primary' {
          background-color: getCssVar('color', 'info', 'light-9');
        } @else {
          background-color: getCssVar('color', $type, 'light-9');
        }
        color: getCssVar('disabled-text-color');
        cursor: not-allowed;

        &:hover {
          @if $type == 'primary' {
            background-color: getCssVar('color', 'info', 'light-9');
          } @else {
            background-color: getCssVar('color', $type, 'light-9');
          }
        }
      }
    }
  }
}


code:
@use 'sass:map';

@use 'common/var' as *;
@use 'mixins/mixins' as *;
@use 'mixins/utils' as *;
@use 'mixins/var' as *;
@use 'mixins/button' as *;

@include b(checkbox-button) {
  @include set-component-css-var('checkbox-button', $checkbox-button);
}

@include b(checkbox-button) {
  position: relative;
  display: inline-block;

  @include e(inner) {
    display: inline-block;
    line-height: 1;
    font-weight: getCssVar('checkbox-font-weight');
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    background: var(
      #{getCssVarName('button-bg-color')},
      map.get($button, 'bg-color')
    );
    border: getCssVar('border');
    border-left-color: transparent;
    color: var(
      #{getCssVarName('button-text-color')},
      map.get($button, 'text-color')
    );
    -webkit-appearance: none;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    position: relative;
    transition: getCssVar('transition-all');
    user-select: none;

    @include button-size(
      map.get($button-padding-vertical, 'default') - $button-border-width,
      map.get($button-padding-horizontal, 'default') - $button-border-width,
      map.get($button-font-size, 'default'),
      0
    );

    &:hover {
      color: getCssVar('color-primary');
    }

    & [class*='#{$namespace}-icon-'] {
      line-height: 0.9;

      & + span {
        margin-left: 5px;
      }
    }
  }

  @include e(original) {
    opacity: 0;
    outline: none;
    position: absolute;
    margin: 0;
    z-index: -1;
  }

  &.is-checked {
    & .#{$namespace}-checkbox-button__inner {
      color: getCssVar('checkbox-button-checked-text-color');
      background-color: getCssVar('checkbox-button-checked-bg-color');
      border-color: getCssVar('checkbox-button-checked-border-color');
      box-shadow: -1px 0 0 0 getCssVar('color-primary-light-7');
    }
    &:first-child .#{$namespace}-checkbox-button__inner {
      border-left-color: getCssVar('checkbox-button-checked-border-color');
    }
  }

  &.is-disabled {
    & .#{$namespace}-checkbox-button__inner {
      color: getCssVar('disabled-text-color');
      cursor: not-allowed;
      background-image: none;
      background-color: var(
        #{getCssVarName('button-disabled-bg-color')},
        map.get($button, 'disabled-bg-color')
      );
      border-color: var(
        #{getCssVarName('button-disabled-border-color')},
        map.get($button, 'disabled-border-color')
      );
      box-shadow: none;
    }
    &:first-child .#{$namespace}-checkbox-button__inner {
      border-left-color: var(
        #{getCssVarName('button-disabled-border-color')},
        map.get($button, 'disabled-border-color')
      );
    }
  }

  &:first-child {
    .#{$namespace}-checkbox-button__inner {
      border-left: getCssVar('border');
      border-top-left-radius: getCssVar('border-radius-base');
      border-bottom-left-radius: getCssVar('border-radius-base');
      box-shadow: none !important;
    }
  }

  &.is-focus {
    & .#{$namespace}-checkbox-button__inner {
      border-color: getCssVar('checkbox-button-checked-border-color');
    }
  }

  &:last-child {
    .#{$namespace}-checkbox-button__inner {
      border-top-right-radius: getCssVar('border-radius-base');
      border-bottom-right-radius: getCssVar('border-radius-base');
    }
  }

  @each $size in (large, small) {
    @include m($size) {
      .#{$namespace}-checkbox-button__inner {
        @include button-size(
          map.get($button-padding-vertical, $size) - $button-border-width,
          map.get($button-padding-horizontal, $size) - $button-border-width,
          map.get($button-font-size, $size),
          0
        );
      }
    }
  }
}


code:
@use 'common/var' as *;
@use 'mixins/mixins' as *;

@include b(checkbox-group) {
  font-size: 0;
  line-height: 0;
}


code:
@use 'sass:map';

@use 'common/var' as *;
@use 'mixins/mixins' as *;
@use 'mixins/var' as *;
@use 'mixins/_button';
@use 'mixins/utils' as *;

$checkbox-height: () !default;
$checkbox-height: map.merge($common-component-size, $checkbox-height);

$checkbox-bordered-input-height: () !default;
$checkbox-bordered-input-height: map.merge(
  (
    'large': 14px,
    'default': 12px,
    'small': 12px,
  ),
  $checkbox-bordered-input-height
);

$checkbox-font-size: () !default;
$checkbox-font-size: map.merge(
  (
    'large': 14px,
    'small': 12px,
  ),
  $checkbox-font-size
);

$checkbox-bordered-input-width: () !default;
$checkbox-bordered-input-width: map.merge(
  $checkbox-bordered-input-height,
  $checkbox-bordered-input-width
);

@include b(checkbox) {
  @include set-component-css-var('checkbox', $checkbox);
}

@include b(checkbox) {
  color: getCssVar('checkbox-text-color');
  font-weight: getCssVar('checkbox-font-weight');
  font-size: getCssVar('font-size', 'base');
  position: relative;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  user-select: none;
  margin-right: 30px;
  height: getCssVarWithDefault(
    'checkbox-height',
    map.get($checkbox-height, 'default')
  );

  @include when(disabled) {
    cursor: not-allowed;
  }

  @include when(bordered) {
    padding: 0 map.get($checkbox-bordered-padding-right, 'default')-$border-width
      0 map.get($checkbox-bordered-padding-left, 'default')-$border-width;
    border-radius: getCssVar('border-radius-base');
    border: getCssVar('border');
    box-sizing: border-box;

    &.is-checked {
      border-color: getCssVar('color-primary');
    }

    &.is-disabled {
      border-color: getCssVar('border-color-lighter');
    }

    @each $size in (large, small) {
      &.#{$namespace}-checkbox--#{$size} {
        padding: 0
          map.get($checkbox-bordered-padding-right, $size)-$border-width
          0
          map.get($checkbox-bordered-padding-left, $size)-$border-width;

        border-radius: map.get($button-border-radius, $size);

        .#{$namespace}-checkbox__label {
          font-size: map.get($button-font-size, $size);
        }

        .#{$namespace}-checkbox__inner {
          height: map.get($checkbox-bordered-input-height, $size);
          width: map.get($checkbox-bordered-input-width, $size);
        }
      }
    }

    &.#{$namespace}-checkbox--small {
      .#{$namespace}-checkbox__inner {
        &::after {
          height: 6px;
          width: 2px;
        }
      }
    }
  }

  input:focus-visible {
    & + .#{$namespace}-checkbox__inner {
      outline: 2px solid getCssVar('checkbox-input-border-color-hover');
      outline-offset: 1px;
      border-radius: getCssVar('checkbox-border-radius');
    }
  }

  @include e(input) {
    white-space: nowrap;
    cursor: pointer;
    outline: none;
    display: inline-flex;
    position: relative;

    @include when(disabled) {
      .#{$namespace}-checkbox__inner {
        background-color: getCssVar('checkbox-disabled-input-fill');
        border-color: getCssVar('checkbox-disabled-border-color');
        cursor: not-allowed;

        &::after {
          cursor: not-allowed;
          border-color: getCssVar('checkbox-disabled-icon-color');
        }
      }

      &.is-checked {
        .#{$namespace}-checkbox__inner {
          background-color: getCssVar('checkbox-disabled-checked-input-fill');
          border-color: getCssVar(
            'checkbox-disabled-checked-input-border-color'
          );

          &::after {
            border-color: getCssVar('checkbox-disabled-checked-icon-color');
          }
        }
      }

      &.is-indeterminate {
        .#{$namespace}-checkbox__inner {
          background-color: getCssVar('checkbox-disabled-checked-input-fill');
          border-color: getCssVar(
            'checkbox-disabled-checked-input-border-color'
          );

          &::before {
            background-color: getCssVar('checkbox-disabled-checked-icon-color');
            border-color: getCssVar('checkbox-disabled-checked-icon-color');
          }
        }
      }

      & + span.#{$namespace}-checkbox__label {
        color: getCssVar('disabled-text-color');
        cursor: not-allowed;
      }
    }

    @include when(checked) {
      .#{$namespace}-checkbox__inner {
        background-color: getCssVar('checkbox-checked-bg-color');
        border-color: getCssVar('checkbox-checked-input-border-color');

        &::after {
          transform: rotate(45deg) scaleY(1);
          border-color: getCssVar('checkbox-checked-icon-color');
        }
      }

      & + .#{$namespace}-checkbox__label {
        color: getCssVar('checkbox-checked-text-color');
      }
    }
    @include when(focus) {
      // Visually distinguish when focus
      &:not(.is-checked) {
        .#{$namespace}-checkbox__original:not(:focus-visible) {
          border-color: getCssVar('checkbox-input-border-color-hover');
        }
      }
    }
    @include when(indeterminate) {
      .#{$namespace}-checkbox__inner {
        background-color: getCssVar('checkbox-checked-bg-color');
        border-color: getCssVar('checkbox-checked-input-border-color');

        &::before {
          content: '';
          position: absolute;
          display: block;
          background-color: getCssVar('checkbox-checked-icon-color');
          height: 2px;
          transform: scale(0.5);
          left: 0;
          right: 0;
          top: 5px;
        }

        &::after {
          display: none;
        }
      }
    }
  }
  @include e(inner) {
    display: inline-block;
    position: relative;
    border: getCssVar('checkbox-input-border');
    border-radius: getCssVar('checkbox-border-radius');
    box-sizing: border-box;
    width: getCssVar('checkbox-input-width');
    height: getCssVar('checkbox-input-height');
    background-color: getCssVar('checkbox-bg-color');
    z-index: getCssVar('index-normal');
    transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
      background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
      outline 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);

    &:hover {
      border-color: getCssVar('checkbox-input-border-color-hover');
    }

    &::after {
      box-sizing: content-box;
      content: '';
      border: 1px solid transparent;
      border-left: 0;
      border-top: 0;
      height: 7px;
      left: 4px;
      position: absolute;
      top: 1px;
      transform: rotate(45deg) scaleY(0);
      width: 3px;
      transition: transform 0.15s ease-in 0.05s;
      transform-origin: center;
    }
  }

  @include e(original) {
    opacity: 0;
    outline: none;
    position: absolute;
    margin: 0;
    width: 0;
    height: 0;
    z-index: -1;
  }

  @include e(label) {
    display: inline-block;
    padding-left: 8px;
    line-height: 1;
    font-size: getCssVar('checkbox-font-size');
  }

  @each $size in (large, small) {
    &.#{$namespace}-checkbox--#{$size} {
      height: map.get($checkbox-height, $size);
      @include e(label) {
        font-size: map.get($checkbox-font-size, $size);
      }
      @include e(inner) {
        width: map.get($checkbox-font-size, $size);
        height: map.get($checkbox-font-size, $size);
      }
    }
  }

  &.#{$namespace}-checkbox--small {
    @include e(input) {
      @include when(indeterminate) {
        @include e(inner) {
          &::before {
            top: 4px;
          }
        }
      }
    }
    @include e(inner) {
      &::after {
        width: 2px;
        height: 6px;
      }
    }
  }

  &:last-of-type {
    margin-right: 0;
  }
}


code:
@use 'sass:math';

@use 'common/var' as *;
@use 'mixins/mixins' as *;
@use 'mixins/_col' as *;

[class*='#{$namespace}-col-'] {
  box-sizing: border-box;
  @include when(guttered) {
    display: block;
    min-height: 1px;
  }
}

@for $i from 0 through 24 {
  .#{$namespace}-col-#{$i} {
    display: if($i == 0, none, block);
    max-width: (math.div(1, 24) * $i * 100) * 1%;
    flex: 0 0 (math.div(1, 24) * $i * 100) * 1%;
    @include when(guttered) {
      display: if($i == 0, none, block);
    }
  }

  .#{$namespace}-col-offset-#{$i} {
    margin-left: (math.div(1, 24) * $i * 100) * 1%;
  }

  .#{$namespace}-col-pull-#{$i} {
    position: relative;
    right: (math.div(1, 24) * $i * 100) * 1%;
  }

  .#{$namespace}-col-push-#{$i} {
    position: relative;
    left: (math.div(1, 24) * $i * 100) * 1%;
  }
}

@include col-size(xs);

@include col-size(sm);

@include col-size(md);

@include col-size(lg);

@include col-size(xl);