UNPKG

@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
//#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