@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
220 lines (219 loc) • 9.95 kB
JavaScript
//#region src/core/css/conditions.ts
const toGroup = (selector) => [
"[role=group]",
"[data-group]",
".group"
].map((prefix) => `${prefix}${selector.slice(1)} &`).join(", ");
const toPeer = (selector) => [...["[data-peer]", ".peer"].flatMap((prefix) => [`&:has(~ ${prefix}${selector.slice(1)})`, `${prefix}${selector.slice(1)} ~ &`]), ...["[data-peer]", ".peer"].flatMap((prefix) => [`&:has(~ ${prefix} *${selector.slice(1)})`, `${prefix}:has(*${selector.slice(1)}) ~ &`])].join(", ");
const attributes = {
_accept: "&[data-accept]",
_between: "&[data-between]",
_complete: "&[data-complete]",
_current: "&:is([aria-current], [data-current]):not([aria-current='false'])",
_dark: ".dark &:not([data-mode]), [data-mode=dark] &:not([data-mode]), &[data-mode=dark]",
_end: "&:is([data-end], [data-group-end])",
_expanded: "&:is([data-expanded], [aria-expanded=true])",
_fallback: "&[data-fallback]",
_filled: "&[data-filled]",
_grabbed: "&:is([data-grabbed], [aria-grabbed=true])",
_grid: "&:is([role=grid], [data-grid])",
_hasIcon: "&:has(> [data-icon])",
_idle: "&[data-idle]",
_incomplete: "&[data-incomplete]",
_light: ".light &:not([data-mode]), [data-mode=light] &:not([data-mode]), &[data-mode=light]",
_loaded: "&[data-loaded]",
_loading: "&:is([data-loading], [aria-busy=true])",
_ltr: "[dir=ltr] &",
_nativeHidden: "&[hidden]",
_notAllowed: "&[data-not-allowed]",
_notCurrent: "&:not([aria-current], [data-current]), &[aria-current='false']",
_notFallback: "&:not([data-fallback])",
_notSelected: "&:not([data-selected]):not([aria-selected=true])",
_numeric: "&[data-numeric]",
_pressed: "&:is([data-pressed], [aria-pressed=true])",
_range: "&:is([data-range])",
_reject: "&[data-reject]",
_ripple: "& .ui-ripple",
_rtl: "[dir=rtl] &",
_start: "&:is([data-start], [data-group-start])",
_selected: "&:is([data-selected], [aria-selected=true])",
_hidden: "&:is([hidden], [data-hidden])",
_never: "&[data-never]"
};
const attributeProperties = Object.keys(attributes);
const attributeSelectors = Object.values(attributes);
const pseudoElements = {
_after: "&::after",
_backdrop: "&::backdrop",
_before: "&::before",
_cue: "&::cue",
_cueRegion: "&::cue-region",
_fileSelector: "&::file-selector-button",
_firstLetter: "&::first-letter",
_firstLine: "&::first-line",
_marker: "&::marker",
_placeholder: "&::placeholder, &[data-placeholder]",
_scrollbar: "&::-webkit-scrollbar, &[data-scrollbar]",
_scrollbarButton: "&::-webkit-scrollbar-button",
_scrollbarCorner: "&::-webkit-scrollbar-corner",
_scrollbarThumb: "&::-webkit-scrollbar-thumb",
_scrollbarTrack: "&::-webkit-scrollbar-track",
_scrollbarTrackPiece: "&::-webkit-scrollbar-track-piece",
_selection: "&::selection"
};
const pseudoElementProperties = Object.keys(pseudoElements);
const pseudoElementSelectors = Object.values(pseudoElements);
const pseudoClasses = {
_activedescendant: "&:is([data-activedescendant])",
_anyLink: "&:is(:any-link, [data-any-link])",
_autofill: "&:autofill",
_blank: "&:is(:blank, [data-blank])",
_checked: "&:is(:checked, [data-checked], [aria-checked=true])",
_child: "& > *",
_default: "&:default",
_empty: "&:empty",
_enabled: "&:is(:enabled, [data-enabled])",
_even: "&:nth-of-type(even)",
_first: "&:first-of-type",
_firstChild: "& > *:first-child",
_focusWithin: "&:not(:focus-within, [data-focus-within])",
_fullScreen: "&:fullscreen",
_horizontal: "&:is([data-orientation=horizontal], [aria-orientation=horizontal])",
_icon: "&:where(svg:not([data-loading])), & > [data-icon]",
_indeterminate: "&:is(:indeterminate, [data-indeterminate], [aria-checked=mixed])",
_inRange: "&:is(:in-range, [data-in-range])",
_last: "&:last-of-type",
_lastChild: "& > *:last-child",
_link: "&:is(:link, [data-link])",
_modal: "&:modal",
_nativeActive: "&:active",
_nativeChecked: "&:checked",
_nativeDisabled: "&:is(disabled, [disabled])",
_nativeFocus: "&:focus",
_nativeFocusVisible: "&:focus-visible",
_nativeFocusWithin: "&:focus-within",
_nativeHover: "&:hover",
_nativeReadOnly: "&:is([readonly], [aria-readonly=true])",
_nativeTarget: "&:target",
_nativeValid: "&:valid",
_notChecked: "&:not(:checked):not([data-checked]):not([aria-checked=true])",
_notEmpty: "&:not(:empty)",
_notFirst: "&:not(:first-of-type)",
_notFirstChild: "& > *:not(:first-child)",
_notLast: "&:not(:last-of-type)",
_notLastChild: "& > *:not(:last-child)",
_notTarget: "&:not(:target)",
_odd: "&:nth-of-type(odd)",
_only: "&:only-of-type",
_onlyChild: "&:only-child",
_optional: "&:is(:optional, [data-optional])",
_outRange: "&:is(:out-of-range, [data-out-of-range])",
_paused: "&:is(:paused, [data-paused])",
_picture: "&:picture-in-picture",
_placeholderShown: "&:placeholder-shown",
_playing: "&:is(:playing, [data-playing])",
_readWrite: "&:is(:read-write, [data-read-write])",
_required: "&:is(:required, [required])",
_target: "&:is(:target, [data-target])",
_userInvalid: "&:is(:user-invalid, [data-user-invalid])",
_valid: "&:is(:valid, [data-valid])",
_vertical: "&:is([data-orientation=vertical], [aria-orientation=vertical])",
_visited: "&:visited",
_hover: "&:is(:hover, [data-hover]):not(:disabled, [disabled], [aria-disabled=true], [data-disabled])",
_active: "&:is(:active, [data-active]):not(:disabled, [disabled], [aria-disabled=true], [data-disabled])",
_focus: "&:is(:focus, [data-focus])",
_focusVisible: "&:is(:focus-visible, [data-focus-visible])",
_invalid: "&:is([data-invalid], [aria-invalid=true])",
_readOnly: "&:is([readonly], [data-readonly], [aria-readonly=true])",
_disabled: "&:is(:disabled, [disabled], [data-disabled])"
};
const pseudoClassProperties = Object.keys(pseudoClasses);
const pseudoClassSelectors = Object.values(pseudoClasses);
const groupAttributes = {
_groupAccept: toGroup(attributes._accept),
_groupActive: toGroup(pseudoClasses._active),
_groupActivedescendant: toGroup(pseudoClasses._activedescendant),
_groupBlank: toGroup(pseudoClasses._blank),
_groupChecked: toGroup(pseudoClasses._checked),
_groupComplete: toGroup(attributes._complete),
_groupCurrent: toGroup(attributes._current),
_groupDisabled: toGroup(pseudoClasses._disabled),
_groupEnabled: toGroup(pseudoClasses._enabled),
_groupExpanded: toGroup(attributes._expanded),
_groupFocus: toGroup(pseudoClasses._focus),
_groupFocusVisible: toGroup(pseudoClasses._focusVisible),
_groupFocusWithin: toGroup(pseudoClasses._focusWithin),
_groupGrabbed: toGroup(attributes._grabbed),
_groupHorizontal: toGroup(pseudoClasses._horizontal),
_groupHover: toGroup(pseudoClasses._hover),
_groupIdle: toGroup(attributes._idle),
_groupIncomplete: toGroup(attributes._incomplete),
_groupInvalid: toGroup(pseudoClasses._invalid),
_groupLoaded: toGroup(attributes._loaded),
_groupLoading: toGroup(attributes._loading),
_groupOptional: toGroup(pseudoClasses._optional),
_groupPlaceholderShown: toGroup(pseudoClasses._placeholderShown),
_groupPressed: toGroup(attributes._pressed),
_groupRange: toGroup(attributes._range),
_groupReadOnly: toGroup(pseudoClasses._readOnly),
_groupReadWrite: toGroup(pseudoClasses._readWrite),
_groupReject: toGroup(attributes._reject),
_groupRequired: toGroup(pseudoClasses._required),
_groupSelected: toGroup(attributes._selected),
_groupUserInvalid: toGroup(pseudoClasses._userInvalid),
_groupValid: toGroup(pseudoClasses._valid),
_groupVertical: toGroup(pseudoClasses._vertical)
};
const groupAttributeProperties = Object.keys(groupAttributes);
const groupAttributeSelectors = Object.values(groupAttributes);
const peerAttributes = {
_peerAccept: toPeer(attributes._accept),
_peerActive: toPeer(pseudoClasses._active),
_peerBlank: toPeer(pseudoClasses._blank),
_peerChecked: toPeer(pseudoClasses._checked),
_peerComplete: toPeer(attributes._complete),
_peerCurrent: toPeer(attributes._current),
_peerDisabled: toPeer(pseudoClasses._disabled),
_peerEnabled: toPeer(pseudoClasses._enabled),
_peerExpanded: toPeer(attributes._expanded),
_peerFocus: toPeer(pseudoClasses._focus),
_peerFocusVisible: toPeer(pseudoClasses._focusVisible),
_peerFocusWithin: toPeer(pseudoClasses._focusWithin),
_peerGrabbed: toPeer(attributes._grabbed),
_peerHorizontal: toPeer(pseudoClasses._horizontal),
_peerHover: toPeer(pseudoClasses._hover),
_peerIdle: toPeer(attributes._idle),
_peerIncomplete: toPeer(attributes._incomplete),
_peerInvalid: toPeer(pseudoClasses._invalid),
_peerLoaded: toPeer(attributes._loaded),
_peerLoading: toPeer(attributes._loading),
_peerOptional: toPeer(pseudoClasses._optional),
_peerPlaceholderShown: toPeer(pseudoClasses._placeholderShown),
_peerPressed: toPeer(attributes._pressed),
_peerRange: toPeer(attributes._range),
_peerReadOnly: toPeer(pseudoClasses._readOnly),
_peerReadWrite: toPeer(pseudoClasses._readWrite),
_peerReject: toPeer(attributes._reject),
_peerRequired: toPeer(pseudoClasses._required),
_peerSelected: toPeer(attributes._selected),
_peerUserInvalid: toPeer(pseudoClasses._userInvalid),
_peerValid: toPeer(pseudoClasses._valid),
_peerVertical: toPeer(pseudoClasses._vertical)
};
const peerAttributeProperties = Object.keys(peerAttributes);
const peerAttributeSelectors = Object.values(peerAttributes);
const conditions = {
...pseudoElements,
...attributes,
...pseudoClasses,
...groupAttributes,
...peerAttributes
};
const conditionProperties = Object.keys(conditions);
const conditionSelectors = Object.values(conditions);
function getCondition(key) {
return key in conditions ? conditions[key] : key;
}
//#endregion
export { attributeProperties, attributeSelectors, attributes, conditionProperties, conditionSelectors, conditions, getCondition, groupAttributeProperties, groupAttributeSelectors, groupAttributes, peerAttributeProperties, peerAttributeSelectors, peerAttributes, pseudoClassProperties, pseudoClassSelectors, pseudoClasses, pseudoElementProperties, pseudoElementSelectors, pseudoElements };
//# sourceMappingURL=conditions.js.map