@mekari/pixel3-styled-system 0.1.5-dev.0 → 0.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/css/conditions.mjs +4 -2
- package/css/css.mjs +1 -1
- package/helpers.mjs +18 -5
- package/jsx/factory.mjs +5 -3
- package/jsx/is-valid-prop.mjs +2 -2
- package/package.json +1 -1
- package/patterns/aspect-ratio.d.ts +0 -1
- package/patterns/bleed.d.ts +0 -1
- package/patterns/box.d.ts +0 -1
- package/patterns/center.d.ts +0 -1
- package/patterns/circle.d.ts +0 -1
- package/patterns/container.d.ts +0 -1
- package/patterns/cq.d.ts +0 -1
- package/patterns/divider.d.ts +0 -1
- package/patterns/flex.d.ts +0 -1
- package/patterns/float.d.ts +0 -1
- package/patterns/grid-item.d.ts +0 -1
- package/patterns/grid.d.ts +0 -1
- package/patterns/hstack.d.ts +0 -1
- package/patterns/link-overlay.d.ts +0 -1
- package/patterns/spacer.d.ts +0 -1
- package/patterns/square.d.ts +0 -1
- package/patterns/stack.d.ts +0 -1
- package/patterns/visually-hidden.d.ts +0 -1
- package/patterns/vstack.d.ts +0 -1
- package/patterns/wrap.d.ts +0 -1
- package/recipes/modal-slot-recipe.d.ts +0 -2
- package/themes/index.mjs +1 -1
- package/themes/theme-next.json +5 -0
- package/tokens/tokens.d.ts +2 -2
- package/types/composition.d.ts +26 -0
- package/types/conditions.d.ts +40 -10
- package/types/global.d.ts +1 -0
- package/types/prop-type.d.ts +5 -4
- package/types/selectors.d.ts +1 -1
- package/types/static-css.d.ts +9 -4
- package/types/style-props.d.ts +228 -205
- package/types/system-types.d.ts +86 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @mekari/pixel3-styled-system
|
|
2
2
|
|
|
3
|
+
## 0.1.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 42e1094: generated new style
|
|
8
|
+
- 42e1094: Generate new styled-system
|
|
9
|
+
|
|
10
|
+
## 0.1.5-dev.1
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- e48645c: Generate new styled-system
|
|
15
|
+
|
|
3
16
|
## 0.1.5-dev.0
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
package/css/conditions.mjs
CHANGED
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { withoutSpace } from '../helpers.mjs';
|
|
2
2
|
|
|
3
|
-
const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_default,_optional,_open,_closed,_fullscreen,_loading,_currentPage,_currentStep,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_starting,
|
|
3
|
+
const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_collapsed,_hasIcon,_hasLabel,_highlight,_hasBorder,_hasBackground,_isFullWidth,_placementLeft,_placementRight,_nextTheme,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,smToMd,smToLg,smToXl,mdToLg,mdToXl,lgToXl,_themeNext,base"
|
|
4
4
|
const conditions = new Set(conditionsStr.split(','))
|
|
5
5
|
|
|
6
|
+
const conditionRegex = /^@|&|&$/
|
|
7
|
+
|
|
6
8
|
export function isCondition(value){
|
|
7
|
-
return conditions.has(value) ||
|
|
9
|
+
return conditions.has(value) || conditionRegex.test(value)
|
|
8
10
|
}
|
|
9
11
|
|
|
10
12
|
const underscoreRegex = /^_/
|
package/css/css.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { createCss, createMergeCss, hypenateProperty, withoutSpace } from '../helpers.mjs';
|
|
2
2
|
import { sortConditions, finalizeConditions } from './conditions.mjs';
|
|
3
3
|
|
|
4
|
-
const utilities = "aspectRatio:asp,boxDecorationBreak:bx-db,zIndex:z,boxSizing:bx-s,objectPosition:obj-p,objectFit:obj-f,overscrollBehavior:ovs-b,overscrollBehaviorX:ovs-bx,overscrollBehaviorY:ovs-by,position:pos/1,top:top,left:left,inset:inset,insetInline:inset-x/insetX,insetBlock:inset-y/insetY,insetBlockEnd:inset-be,insetBlockStart:inset-bs,insetInlineEnd:inset-e/insetEnd/end,insetInlineStart:inset-s/insetStart/start,right:right,bottom:bottom,float:float,visibility:vis,display:d,hideFrom:hide,hideBelow:show,flexBasis:flex-b,flex:flex,flexDirection:flex-d/flexDir,flexGrow:flex-g,flexShrink:flex-sh,gridTemplateColumns:grid-tc,gridTemplateRows:grid-tr,gridColumn:grid-c,gridRow:grid-r,gridColumnStart:grid-cs,gridColumnEnd:grid-ce,gridAutoFlow:grid-af,gridAutoColumns:grid-ac,gridAutoRows:grid-ar,gap:gap,gridGap:grid-g,gridRowGap:grid-rg,gridColumnGap:grid-cg,rowGap:rg,columnGap:cg,justifyContent:jc,alignContent:ac,alignItems:ai,alignSelf:as,padding:p/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,paddingBottom:pb/1,paddingBlock:py/1/paddingY,paddingBlockEnd:pbe,paddingBlockStart:pbs,paddingInline:px/paddingX/1,paddingInlineEnd:pe/1/paddingEnd,paddingInlineStart:ps/1/paddingStart,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,marginBottom:mb/1,margin:m/1,marginBlock:my/1/marginY,marginBlockEnd:mbe,marginBlockStart:mbs,marginInline:mx/1/marginX,marginInlineEnd:me/1/marginEnd,marginInlineStart:ms/1/marginStart,spaceX:sx,spaceY:sy,outlineWidth:ring-w/ringWidth,outlineColor:ring-c/ringColor,outline:ring/1,outlineOffset:ring-o/ringOffset,divideX:dvd-x,divideY:dvd-y,divideColor:dvd-c,divideStyle:dvd-s,width:w/1,inlineSize:w-is,minWidth:min-w/minW,minInlineSize:min-w-is,maxWidth:max-w/maxW,maxInlineSize:max-w-is,height:h/1,blockSize:h-bs,minHeight:min-h/minH,minBlockSize:min-h-bs,maxHeight:max-h/maxH,maxBlockSize:max-b,color:c,fontFamily:ff,fontSize:fs,fontSizeAdjust:fs-a,fontPalette:fp,fontKerning:fk,fontFeatureSettings:ff-s,fontWeight:fw,fontSmoothing:fsmt,fontVariant:fv,fontVariantAlternates:fv-alt,fontVariantCaps:fv-caps,fontVariationSettings:fv-s,fontVariantNumeric:fv-num,letterSpacing:ls,lineHeight:lh,textAlign:ta,textDecoration:td,textDecorationColor:td-c,textEmphasisColor:te-c,textDecorationStyle:td-s,textDecorationThickness:td-t,textUnderlineOffset:tu-o,textTransform:tt,textIndent:ti,textShadow:tsh,textShadowColor:tsh-c/textShadowColor,textOverflow:tov,verticalAlign:va,wordBreak:wb,textWrap:tw,truncate:trunc,lineClamp:lc,listStyleType:li-t,listStylePosition:li-pos,listStyleImage:li-img,listStyle:li-s,backgroundPosition:bg-p/bgPosition,backgroundPositionX:bg-p-x/bgPositionX,backgroundPositionY:bg-p-y/bgPositionY,backgroundAttachment:bg-a/bgAttachment,backgroundClip:bg-cp/bgClip,background:bg/1,backgroundColor:bg-c/bgColor,backgroundOrigin:bg-o/bgOrigin,backgroundImage:bg-i/bgImage,backgroundRepeat:bg-r/bgRepeat,backgroundBlendMode:bg-bm/bgBlendMode,backgroundSize:bg-s/bgSize,backgroundGradient:bg-grad/bgGradient,textGradient:txt-grad,gradientFromPosition:grad-from-pos,gradientToPosition:grad-to-pos,gradientFrom:grad-from,gradientTo:grad-to,gradientVia:grad-via,gradientViaPosition:grad-via-pos,borderRadius:bdr/rounded,borderTopLeftRadius:bdr-tl/roundedTopLeft,borderTopRightRadius:bdr-tr/roundedTopRight,borderBottomRightRadius:bdr-br/roundedBottomRight,borderBottomLeftRadius:bdr-bl/roundedBottomLeft,borderTopRadius:bdr-t/roundedTop,borderRightRadius:bdr-r/roundedRight,borderBottomRadius:bdr-b/roundedBottom,borderLeftRadius:bdr-l/roundedLeft,borderStartStartRadius:bdr-ss/roundedStartStart,borderStartEndRadius:bdr-se/roundedStartEnd,borderStartRadius:bdr-s/roundedStart,borderEndStartRadius:bdr-es/roundedEndStart,borderEndEndRadius:bdr-ee/roundedEndEnd,borderEndRadius:bdr-e/roundedEnd,border:bd,borderWidth:bd-w,borderTopWidth:bd-t-w,borderLeftWidth:bd-l-w,borderRightWidth:bd-r-w,borderBottomWidth:bd-b-w,borderColor:bd-c,borderInline:bd-x/borderX,borderInlineWidth:bd-x-w/borderXWidth,borderInlineColor:bd-x-c/borderXColor,borderBlock:bd-y/borderY,borderBlockWidth:bd-y-w/borderYWidth,borderBlockColor:bd-y-c/borderYColor,borderLeft:bd-l,borderLeftColor:bd-l-c,borderInlineStart:bd-s/borderStart,borderInlineStartWidth:bd-s-w/borderStartWidth,borderInlineStartColor:bd-s-c/borderStartColor,borderRight:bd-r,borderRightColor:bd-r-c,borderInlineEnd:bd-e/borderEnd,borderInlineEndWidth:bd-e-w/borderEndWidth,borderInlineEndColor:bd-e-c/borderEndColor,borderTop:bd-t,borderTopColor:bd-t-c,borderBottom:bd-b,borderBottomColor:bd-b-c,borderBlockEnd:bd-be,borderBlockEndColor:bd-be-c,borderBlockStart:bd-bs,borderBlockStartColor:bd-bs-c,opacity:op,boxShadow:bx-sh/shadow,boxShadowColor:bx-sh-c/shadowColor,mixBlendMode:mix-bm,filter:filter,brightness:brightness,contrast:contrast,grayscale:grayscale,hueRotate:hue-rotate,invert:invert,saturate:saturate,sepia:sepia,dropShadow:drop-shadow,blur:blur,backdropFilter:bkdp,backdropBlur:bkdp-blur,backdropBrightness:bkdp-brightness,backdropContrast:bkdp-contrast,backdropGrayscale:bkdp-grayscale,backdropHueRotate:bkdp-hue-rotate,backdropInvert:bkdp-invert,backdropOpacity:bkdp-opacity,backdropSaturate:bkdp-saturate,backdropSepia:bkdp-sepia,borderCollapse:bd-cl,borderSpacing:bd-sp,borderSpacingX:bd-sx,borderSpacingY:bd-sy,tableLayout:tbl,transitionTimingFunction:trs-tmf,transitionDelay:trs-dly,transitionDuration:trs-dur,transitionProperty:trs-prop,transition:trs,animation:anim,animationName:anim-n,animationTimingFunction:anim-tmf,animationDuration:anim-dur,animationDelay:anim-dly,animationPlayState:anim-ps,animationComposition:anim-comp,animationFillMode:anim-fm,animationDirection:anim-dir,animationIterationCount:anim-ic,animationRange:anim-r,animationState:anim-s,animationRangeStart:anim-rs,animationRangeEnd:anim-re,animationTimeline:anim-tl,transformOrigin:trf-o,transformBox:trf-b,transformStyle:trf-s,transform:trf,rotate:rotate,rotateX:rotate-x,rotateY:rotate-y,rotateZ:rotate-z,scale:scale,scaleX:scale-x,scaleY:scale-y,translate:translate,translateX:translate-x/x,translateY:translate-y/y,translateZ:translate-z/z,accentColor:ac-c,caretColor:ca-c,scrollBehavior:scr-bhv,scrollbar:scr-bar,scrollbarColor:scr-bar-c,scrollbarGutter:scr-bar-g,scrollbarWidth:scr-bar-w,scrollMargin:scr-m,scrollMarginLeft:scr-ml,scrollMarginRight:scr-mr,scrollMarginTop:scr-mt,scrollMarginBottom:scr-mb,scrollMarginBlock:scr-my/scrollMarginY,scrollMarginBlockEnd:scr-mbe,scrollMarginBlockStart:scr-mbt,scrollMarginInline:scr-mx/scrollMarginX,scrollMarginInlineEnd:scr-me,scrollMarginInlineStart:scr-ms,scrollPadding:scr-p,scrollPaddingBlock:scr-py/scrollPaddingY,scrollPaddingBlockStart:scr-pbs,scrollPaddingBlockEnd:scr-pbe,scrollPaddingInline:scr-px/scrollPaddingX,scrollPaddingInlineEnd:scr-pe,scrollPaddingInlineStart:scr-ps,scrollPaddingLeft:scr-pl,scrollPaddingRight:scr-pr,scrollPaddingTop:scr-pt,scrollPaddingBottom:scr-pb,scrollSnapAlign:scr-sa,scrollSnapStop:scrs-s,scrollSnapType:scrs-t,scrollSnapStrictness:scrs-strt,scrollSnapMargin:scrs-m,scrollSnapMarginTop:scrs-mt,scrollSnapMarginBottom:scrs-mb,scrollSnapMarginLeft:scrs-ml,scrollSnapMarginRight:scrs-mr,scrollSnapCoordinate:scrs-c,scrollSnapDestination:scrs-d,scrollSnapPointsX:scrs-px,scrollSnapPointsY:scrs-py,scrollSnapTypeX:scrs-tx,scrollSnapTypeY:scrs-ty,scrollTimeline:scrtl,scrollTimelineAxis:scrtl-a,scrollTimelineName:scrtl-n,touchAction:tch-a,userSelect:us,overflow:ov,overflowWrap:ov-wrap,overflowX:ov-x,overflowY:ov-y,overflowAnchor:ov-a,overflowBlock:ov-b,overflowInline:ov-i,overflowClipBox:ovcp-bx,overflowClipMargin:ovcp-m,overscrollBehaviorBlock:ovs-bb,overscrollBehaviorInline:ovs-bi,fill:fill,stroke:stk,strokeWidth:stk-w,strokeDasharray:stk-dsh,strokeDashoffset:stk-do,strokeLinecap:stk-lc,strokeLinejoin:stk-lj,strokeMiterlimit:stk-ml,strokeOpacity:stk-op,srOnly:sr,debug:debug,appearance:ap,backfaceVisibility:bfv,clipPath:cp-path,hyphens:hy,mask:msk,maskImage:msk-i,maskSize:msk-s,textSizeAdjust:txt-adj,container:cq,containerName:cq-n,containerType:cq-t,textStyle:textStyle"
|
|
4
|
+
const utilities = "aspectRatio:asp,boxDecorationBreak:bx-db,zIndex:z,boxSizing:bx-s,objectPosition:obj-p,objectFit:obj-f,overscrollBehavior:ovs-b,overscrollBehaviorX:ovs-bx,overscrollBehaviorY:ovs-by,position:pos/1,top:top,left:left,inset:inset,insetInline:inset-x/insetX,insetBlock:inset-y/insetY,insetBlockEnd:inset-be,insetBlockStart:inset-bs,insetInlineEnd:inset-e/insetEnd/end,insetInlineStart:inset-s/insetStart/start,right:right,bottom:bottom,float:float,visibility:vis,display:d,hideFrom:hide,hideBelow:show,flexBasis:flex-b,flex:flex,flexDirection:flex-d/flexDir,flexGrow:flex-g,flexShrink:flex-sh,gridTemplateColumns:grid-tc,gridTemplateRows:grid-tr,gridColumn:grid-c,gridRow:grid-r,gridColumnStart:grid-cs,gridColumnEnd:grid-ce,gridAutoFlow:grid-af,gridAutoColumns:grid-ac,gridAutoRows:grid-ar,gap:gap,gridGap:grid-g,gridRowGap:grid-rg,gridColumnGap:grid-cg,rowGap:rg,columnGap:cg,justifyContent:jc,alignContent:ac,alignItems:ai,alignSelf:as,padding:p/1,paddingLeft:pl/1,paddingRight:pr/1,paddingTop:pt/1,paddingBottom:pb/1,paddingBlock:py/1/paddingY,paddingBlockEnd:pbe,paddingBlockStart:pbs,paddingInline:px/paddingX/1,paddingInlineEnd:pe/1/paddingEnd,paddingInlineStart:ps/1/paddingStart,marginLeft:ml/1,marginRight:mr/1,marginTop:mt/1,marginBottom:mb/1,margin:m/1,marginBlock:my/1/marginY,marginBlockEnd:mbe,marginBlockStart:mbs,marginInline:mx/1/marginX,marginInlineEnd:me/1/marginEnd,marginInlineStart:ms/1/marginStart,spaceX:sx,spaceY:sy,outlineWidth:ring-w/ringWidth,outlineColor:ring-c/ringColor,outline:ring/1,outlineOffset:ring-o/ringOffset,divideX:dvd-x,divideY:dvd-y,divideColor:dvd-c,divideStyle:dvd-s,width:w/1,inlineSize:w-is,minWidth:min-w/minW,minInlineSize:min-w-is,maxWidth:max-w/maxW,maxInlineSize:max-w-is,height:h/1,blockSize:h-bs,minHeight:min-h/minH,minBlockSize:min-h-bs,maxHeight:max-h/maxH,maxBlockSize:max-b,color:c,fontFamily:ff,fontSize:fs,fontSizeAdjust:fs-a,fontPalette:fp,fontKerning:fk,fontFeatureSettings:ff-s,fontWeight:fw,fontSmoothing:fsmt,fontVariant:fv,fontVariantAlternates:fv-alt,fontVariantCaps:fv-caps,fontVariationSettings:fv-s,fontVariantNumeric:fv-num,letterSpacing:ls,lineHeight:lh,textAlign:ta,textDecoration:td,textDecorationColor:td-c,textEmphasisColor:te-c,textDecorationStyle:td-s,textDecorationThickness:td-t,textUnderlineOffset:tu-o,textTransform:tt,textIndent:ti,textShadow:tsh,textShadowColor:tsh-c/textShadowColor,textOverflow:tov,verticalAlign:va,wordBreak:wb,textWrap:tw,truncate:trunc,lineClamp:lc,listStyleType:li-t,listStylePosition:li-pos,listStyleImage:li-img,listStyle:li-s,backgroundPosition:bg-p/bgPosition,backgroundPositionX:bg-p-x/bgPositionX,backgroundPositionY:bg-p-y/bgPositionY,backgroundAttachment:bg-a/bgAttachment,backgroundClip:bg-cp/bgClip,background:bg/1,backgroundColor:bg-c/bgColor,backgroundOrigin:bg-o/bgOrigin,backgroundImage:bg-i/bgImage,backgroundRepeat:bg-r/bgRepeat,backgroundBlendMode:bg-bm/bgBlendMode,backgroundSize:bg-s/bgSize,backgroundGradient:bg-grad/bgGradient,textGradient:txt-grad,gradientFromPosition:grad-from-pos,gradientToPosition:grad-to-pos,gradientFrom:grad-from,gradientTo:grad-to,gradientVia:grad-via,gradientViaPosition:grad-via-pos,borderRadius:bdr/rounded,borderTopLeftRadius:bdr-tl/roundedTopLeft,borderTopRightRadius:bdr-tr/roundedTopRight,borderBottomRightRadius:bdr-br/roundedBottomRight,borderBottomLeftRadius:bdr-bl/roundedBottomLeft,borderTopRadius:bdr-t/roundedTop,borderRightRadius:bdr-r/roundedRight,borderBottomRadius:bdr-b/roundedBottom,borderLeftRadius:bdr-l/roundedLeft,borderStartStartRadius:bdr-ss/roundedStartStart,borderStartEndRadius:bdr-se/roundedStartEnd,borderStartRadius:bdr-s/roundedStart,borderEndStartRadius:bdr-es/roundedEndStart,borderEndEndRadius:bdr-ee/roundedEndEnd,borderEndRadius:bdr-e/roundedEnd,border:bd,borderWidth:bd-w,borderTopWidth:bd-t-w,borderLeftWidth:bd-l-w,borderRightWidth:bd-r-w,borderBottomWidth:bd-b-w,borderBlockStartWidth:bd-bs-w,borderBlockEndWidth:bd-be-w,borderColor:bd-c,borderInline:bd-x/borderX,borderInlineWidth:bd-x-w/borderXWidth,borderInlineColor:bd-x-c/borderXColor,borderBlock:bd-y/borderY,borderBlockWidth:bd-y-w/borderYWidth,borderBlockColor:bd-y-c/borderYColor,borderLeft:bd-l,borderLeftColor:bd-l-c,borderInlineStart:bd-s/borderStart,borderInlineStartWidth:bd-s-w/borderStartWidth,borderInlineStartColor:bd-s-c/borderStartColor,borderRight:bd-r,borderRightColor:bd-r-c,borderInlineEnd:bd-e/borderEnd,borderInlineEndWidth:bd-e-w/borderEndWidth,borderInlineEndColor:bd-e-c/borderEndColor,borderTop:bd-t,borderTopColor:bd-t-c,borderBottom:bd-b,borderBottomColor:bd-b-c,borderBlockEnd:bd-be,borderBlockEndColor:bd-be-c,borderBlockStart:bd-bs,borderBlockStartColor:bd-bs-c,opacity:op,boxShadow:bx-sh/shadow,boxShadowColor:bx-sh-c/shadowColor,mixBlendMode:mix-bm,filter:filter,brightness:brightness,contrast:contrast,grayscale:grayscale,hueRotate:hue-rotate,invert:invert,saturate:saturate,sepia:sepia,dropShadow:drop-shadow,blur:blur,backdropFilter:bkdp,backdropBlur:bkdp-blur,backdropBrightness:bkdp-brightness,backdropContrast:bkdp-contrast,backdropGrayscale:bkdp-grayscale,backdropHueRotate:bkdp-hue-rotate,backdropInvert:bkdp-invert,backdropOpacity:bkdp-opacity,backdropSaturate:bkdp-saturate,backdropSepia:bkdp-sepia,borderCollapse:bd-cl,borderSpacing:bd-sp,borderSpacingX:bd-sx,borderSpacingY:bd-sy,tableLayout:tbl,transitionTimingFunction:trs-tmf,transitionDelay:trs-dly,transitionDuration:trs-dur,transitionProperty:trs-prop,transition:trs,animation:anim,animationName:anim-n,animationTimingFunction:anim-tmf,animationDuration:anim-dur,animationDelay:anim-dly,animationPlayState:anim-ps,animationComposition:anim-comp,animationFillMode:anim-fm,animationDirection:anim-dir,animationIterationCount:anim-ic,animationRange:anim-r,animationState:anim-s,animationRangeStart:anim-rs,animationRangeEnd:anim-re,animationTimeline:anim-tl,transformOrigin:trf-o,transformBox:trf-b,transformStyle:trf-s,transform:trf,rotate:rotate,rotateX:rotate-x,rotateY:rotate-y,rotateZ:rotate-z,scale:scale,scaleX:scale-x,scaleY:scale-y,translate:translate,translateX:translate-x/x,translateY:translate-y/y,translateZ:translate-z/z,accentColor:ac-c,caretColor:ca-c,scrollBehavior:scr-bhv,scrollbar:scr-bar,scrollbarColor:scr-bar-c,scrollbarGutter:scr-bar-g,scrollbarWidth:scr-bar-w,scrollMargin:scr-m,scrollMarginLeft:scr-ml,scrollMarginRight:scr-mr,scrollMarginTop:scr-mt,scrollMarginBottom:scr-mb,scrollMarginBlock:scr-my/scrollMarginY,scrollMarginBlockEnd:scr-mbe,scrollMarginBlockStart:scr-mbt,scrollMarginInline:scr-mx/scrollMarginX,scrollMarginInlineEnd:scr-me,scrollMarginInlineStart:scr-ms,scrollPadding:scr-p,scrollPaddingBlock:scr-py/scrollPaddingY,scrollPaddingBlockStart:scr-pbs,scrollPaddingBlockEnd:scr-pbe,scrollPaddingInline:scr-px/scrollPaddingX,scrollPaddingInlineEnd:scr-pe,scrollPaddingInlineStart:scr-ps,scrollPaddingLeft:scr-pl,scrollPaddingRight:scr-pr,scrollPaddingTop:scr-pt,scrollPaddingBottom:scr-pb,scrollSnapAlign:scr-sa,scrollSnapStop:scrs-s,scrollSnapType:scrs-t,scrollSnapStrictness:scrs-strt,scrollSnapMargin:scrs-m,scrollSnapMarginTop:scrs-mt,scrollSnapMarginBottom:scrs-mb,scrollSnapMarginLeft:scrs-ml,scrollSnapMarginRight:scrs-mr,scrollSnapCoordinate:scrs-c,scrollSnapDestination:scrs-d,scrollSnapPointsX:scrs-px,scrollSnapPointsY:scrs-py,scrollSnapTypeX:scrs-tx,scrollSnapTypeY:scrs-ty,scrollTimeline:scrtl,scrollTimelineAxis:scrtl-a,scrollTimelineName:scrtl-n,touchAction:tch-a,userSelect:us,overflow:ov,overflowWrap:ov-wrap,overflowX:ov-x,overflowY:ov-y,overflowAnchor:ov-a,overflowBlock:ov-b,overflowInline:ov-i,overflowClipBox:ovcp-bx,overflowClipMargin:ovcp-m,overscrollBehaviorBlock:ovs-bb,overscrollBehaviorInline:ovs-bi,fill:fill,stroke:stk,strokeWidth:stk-w,strokeDasharray:stk-dsh,strokeDashoffset:stk-do,strokeLinecap:stk-lc,strokeLinejoin:stk-lj,strokeMiterlimit:stk-ml,strokeOpacity:stk-op,srOnly:sr,debug:debug,appearance:ap,backfaceVisibility:bfv,clipPath:cp-path,hyphens:hy,mask:msk,maskImage:msk-i,maskSize:msk-s,textSizeAdjust:txt-adj,container:cq,containerName:cq-n,containerType:cq-t,cursor:cursor,textStyle:textStyle"
|
|
5
5
|
|
|
6
6
|
const classNameByProp = new Map()
|
|
7
7
|
const shorthands = new Map()
|
package/helpers.mjs
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
function isObject(value) {
|
|
3
3
|
return typeof value === "object" && value != null && !Array.isArray(value);
|
|
4
4
|
}
|
|
5
|
+
var isObjectOrArray = (obj) => typeof obj === "object" && obj !== null;
|
|
5
6
|
|
|
6
7
|
// src/compact.ts
|
|
7
8
|
function compact(value) {
|
|
@@ -63,10 +64,14 @@ var memo = (fn) => {
|
|
|
63
64
|
};
|
|
64
65
|
|
|
65
66
|
// src/merge-props.ts
|
|
67
|
+
var MERGE_OMIT = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
|
|
66
68
|
function mergeProps(...sources) {
|
|
67
|
-
|
|
68
|
-
|
|
69
|
+
return sources.reduce((prev, obj) => {
|
|
70
|
+
if (!obj)
|
|
71
|
+
return prev;
|
|
69
72
|
Object.keys(obj).forEach((key) => {
|
|
73
|
+
if (MERGE_OMIT.has(key))
|
|
74
|
+
return;
|
|
70
75
|
const prevValue = prev[key];
|
|
71
76
|
const value = obj[key];
|
|
72
77
|
if (isObject(prevValue) && isObject(value)) {
|
|
@@ -84,7 +89,7 @@ var isNotNullish = (element) => element != null;
|
|
|
84
89
|
function walkObject(target, predicate, options = {}) {
|
|
85
90
|
const { stop, getKey } = options;
|
|
86
91
|
function inner(value, path = []) {
|
|
87
|
-
if (
|
|
92
|
+
if (isObjectOrArray(value)) {
|
|
88
93
|
const result = {};
|
|
89
94
|
for (const [prop, child] of Object.entries(value)) {
|
|
90
95
|
const key = getKey?.(prop, child) ?? prop;
|
|
@@ -165,9 +170,9 @@ function createCss(context) {
|
|
|
165
170
|
const normalizedObject = normalizeStyleObject(styleObject, context);
|
|
166
171
|
const classNames = /* @__PURE__ */ new Set();
|
|
167
172
|
walkObject(normalizedObject, (value, paths) => {
|
|
168
|
-
const important = isImportant(value);
|
|
169
173
|
if (value == null)
|
|
170
174
|
return;
|
|
175
|
+
const important = isImportant(value);
|
|
171
176
|
const [prop, ...allConditions] = conds.shift(paths);
|
|
172
177
|
const conditions = filterBaseConditions(allConditions);
|
|
173
178
|
const transformed = utility.transform(prop, withoutImportant(sanitize(value)));
|
|
@@ -278,7 +283,15 @@ function splitProps(props, ...keys) {
|
|
|
278
283
|
}
|
|
279
284
|
|
|
280
285
|
// src/uniq.ts
|
|
281
|
-
var uniq = (...items) =>
|
|
286
|
+
var uniq = (...items) => {
|
|
287
|
+
const set = items.reduce((acc, currItems) => {
|
|
288
|
+
if (currItems) {
|
|
289
|
+
currItems.forEach((item) => acc.add(item));
|
|
290
|
+
}
|
|
291
|
+
return acc;
|
|
292
|
+
}, /* @__PURE__ */ new Set([]));
|
|
293
|
+
return Array.from(set);
|
|
294
|
+
};
|
|
282
295
|
export {
|
|
283
296
|
compact,
|
|
284
297
|
createCss,
|
package/jsx/factory.mjs
CHANGED
|
@@ -15,16 +15,18 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
|
|
|
15
15
|
options.defaultProps,
|
|
16
16
|
)
|
|
17
17
|
|
|
18
|
-
const name = getDisplayName(Dynamic)
|
|
19
18
|
const __cvaFn__ = composeCvaFn(Dynamic.__cva__, cvaFn)
|
|
20
19
|
const __shouldForwardProps__ = composeShouldForwardProps(Dynamic, shouldForwardProp)
|
|
20
|
+
|
|
21
|
+
const __base__ = Dynamic.__base__ || Dynamic
|
|
22
|
+
const name = getDisplayName(__base__)
|
|
21
23
|
|
|
22
24
|
const PixelComponent = defineComponent({
|
|
23
25
|
name: `Pixel.${name}`,
|
|
24
26
|
inheritAttrs: false,
|
|
25
27
|
props: {
|
|
26
28
|
modelValue: null,
|
|
27
|
-
as: { type: [String, Object], default:
|
|
29
|
+
as: { type: [String, Object], default: __base__ }
|
|
28
30
|
},
|
|
29
31
|
setup(props, { slots, attrs, emit }) {
|
|
30
32
|
const combinedProps = computed(() => Object.assign({}, defaultProps, attrs))
|
|
@@ -98,7 +100,7 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
|
|
|
98
100
|
|
|
99
101
|
PixelComponent.displayName = `Pixel.${name}`
|
|
100
102
|
PixelComponent.__cva__ = __cvaFn__
|
|
101
|
-
PixelComponent.__base__ =
|
|
103
|
+
PixelComponent.__base__ = __base__
|
|
102
104
|
PixelComponent.__shouldForwardProps__ = shouldForwardProp
|
|
103
105
|
|
|
104
106
|
return PixelComponent
|
package/jsx/is-valid-prop.mjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { splitProps } from '../helpers.mjs';
|
|
2
2
|
import { memo } from '../helpers.mjs';
|
|
3
3
|
// src/index.ts
|
|
4
|
-
var userGeneratedStr = "css,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,p,pl,pr,pt,pb,py,paddingY,paddingX,px,pe,paddingEnd,ps,paddingStart,ml,mr,mt,mb,m,my,marginY,mx,marginX,me,marginEnd,ms,marginStart,ringWidth,ringColor,ring,ringOffset,w,minW,maxW,h,minH,maxH,textShadowColor,bgPosition,bgPositionX,bgPositionY,bgAttachment,bgClip,bg,bgColor,bgOrigin,bgImage,bgRepeat,bgBlendMode,bgSize,bgGradient,rounded,roundedTopLeft,roundedTopRight,roundedBottomRight,roundedBottomLeft,roundedTop,roundedRight,roundedBottom,roundedLeft,roundedStartStart,roundedStartEnd,roundedStart,roundedEndStart,roundedEndEnd,roundedEnd,borderX,borderXWidth,borderXColor,borderY,borderYWidth,borderYColor,borderStart,borderStartWidth,borderStartColor,borderEnd,borderEndWidth,borderEndColor,shadow,shadowColor,x,y,z,scrollMarginY,scrollMarginX,scrollPaddingY,scrollPaddingX,aspectRatio,boxDecorationBreak,zIndex,boxSizing,objectPosition,objectFit,overscrollBehavior,overscrollBehaviorX,overscrollBehaviorY,position,top,left,inset,insetInline,insetBlock,insetBlockEnd,insetBlockStart,insetInlineEnd,insetInlineStart,right,bottom,float,visibility,display,hideFrom,hideBelow,flexBasis,flex,flexDirection,flexGrow,flexShrink,gridTemplateColumns,gridTemplateRows,gridColumn,gridRow,gridColumnStart,gridColumnEnd,gridAutoFlow,gridAutoColumns,gridAutoRows,gap,gridGap,gridRowGap,gridColumnGap,rowGap,columnGap,justifyContent,alignContent,alignItems,alignSelf,padding,paddingLeft,paddingRight,paddingTop,paddingBottom,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingInline,paddingInlineEnd,paddingInlineStart,marginLeft,marginRight,marginTop,marginBottom,margin,marginBlock,marginBlockEnd,marginBlockStart,marginInline,marginInlineEnd,marginInlineStart,spaceX,spaceY,outlineWidth,outlineColor,outline,outlineOffset,divideX,divideY,divideColor,divideStyle,width,inlineSize,minWidth,minInlineSize,maxWidth,maxInlineSize,height,blockSize,minHeight,minBlockSize,maxHeight,maxBlockSize,color,fontFamily,fontSize,fontSizeAdjust,fontPalette,fontKerning,fontFeatureSettings,fontWeight,fontSmoothing,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariationSettings,fontVariantNumeric,letterSpacing,lineHeight,textAlign,textDecoration,textDecorationColor,textEmphasisColor,textDecorationStyle,textDecorationThickness,textUnderlineOffset,textTransform,textIndent,textShadow,textOverflow,verticalAlign,wordBreak,textWrap,truncate,lineClamp,listStyleType,listStylePosition,listStyleImage,listStyle,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundAttachment,backgroundClip,background,backgroundColor,backgroundOrigin,backgroundImage,backgroundRepeat,backgroundBlendMode,backgroundSize,backgroundGradient,textGradient,gradientFromPosition,gradientToPosition,gradientFrom,gradientTo,gradientVia,gradientViaPosition,borderRadius,borderTopLeftRadius,borderTopRightRadius,borderBottomRightRadius,borderBottomLeftRadius,borderTopRadius,borderRightRadius,borderBottomRadius,borderLeftRadius,borderStartStartRadius,borderStartEndRadius,borderStartRadius,borderEndStartRadius,borderEndEndRadius,borderEndRadius,border,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,borderColor,borderInline,borderInlineWidth,borderInlineColor,borderBlock,borderBlockWidth,borderBlockColor,borderLeft,borderLeftColor,borderInlineStart,borderInlineStartWidth,borderInlineStartColor,borderRight,borderRightColor,borderInlineEnd,borderInlineEndWidth,borderInlineEndColor,borderTop,borderTopColor,borderBottom,borderBottomColor,borderBlockEnd,borderBlockEndColor,borderBlockStart,borderBlockStartColor,opacity,boxShadow,boxShadowColor,mixBlendMode,filter,brightness,contrast,grayscale,hueRotate,invert,saturate,sepia,dropShadow,blur,backdropFilter,backdropBlur,backdropBrightness,backdropContrast,backdropGrayscale,backdropHueRotate,backdropInvert,backdropOpacity,backdropSaturate,backdropSepia,borderCollapse,borderSpacing,borderSpacingX,borderSpacingY,tableLayout,transitionTimingFunction,transitionDelay,transitionDuration,transitionProperty,transition,animation,animationName,animationTimingFunction,animationDuration,animationDelay,animationPlayState,animationComposition,animationFillMode,animationDirection,animationIterationCount,animationRange,animationState,animationRangeStart,animationRangeEnd,animationTimeline,transformOrigin,transformBox,transformStyle,transform,rotate,rotateX,rotateY,rotateZ,scale,scaleX,scaleY,translate,translateX,translateY,translateZ,accentColor,caretColor,scrollBehavior,scrollbar,scrollbarColor,scrollbarGutter,scrollbarWidth,scrollMargin,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollMarginBottom,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollPadding,scrollPaddingBlock,scrollPaddingBlockStart,scrollPaddingBlockEnd,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollPaddingBottom,scrollSnapAlign,scrollSnapStop,scrollSnapType,scrollSnapStrictness,scrollSnapMargin,scrollSnapMarginTop,scrollSnapMarginBottom,scrollSnapMarginLeft,scrollSnapMarginRight,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,touchAction,userSelect,overflow,overflowWrap,overflowX,overflowY,overflowAnchor,overflowBlock,overflowInline,overflowClipBox,overflowClipMargin,overscrollBehaviorBlock,overscrollBehaviorInline,fill,stroke,strokeWidth,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,srOnly,debug,appearance,backfaceVisibility,clipPath,hyphens,mask,maskImage,maskSize,textSizeAdjust,container,containerName,containerType,colorPalette,_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_default,_optional,_open,_closed,_fullscreen,_loading,_currentPage,_currentStep,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_starting,
|
|
4
|
+
var userGeneratedStr = "css,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,p,pl,pr,pt,pb,py,paddingY,paddingX,px,pe,paddingEnd,ps,paddingStart,ml,mr,mt,mb,m,my,marginY,mx,marginX,me,marginEnd,ms,marginStart,ringWidth,ringColor,ring,ringOffset,w,minW,maxW,h,minH,maxH,textShadowColor,bgPosition,bgPositionX,bgPositionY,bgAttachment,bgClip,bg,bgColor,bgOrigin,bgImage,bgRepeat,bgBlendMode,bgSize,bgGradient,rounded,roundedTopLeft,roundedTopRight,roundedBottomRight,roundedBottomLeft,roundedTop,roundedRight,roundedBottom,roundedLeft,roundedStartStart,roundedStartEnd,roundedStart,roundedEndStart,roundedEndEnd,roundedEnd,borderX,borderXWidth,borderXColor,borderY,borderYWidth,borderYColor,borderStart,borderStartWidth,borderStartColor,borderEnd,borderEndWidth,borderEndColor,shadow,shadowColor,x,y,z,scrollMarginY,scrollMarginX,scrollPaddingY,scrollPaddingX,aspectRatio,boxDecorationBreak,zIndex,boxSizing,objectPosition,objectFit,overscrollBehavior,overscrollBehaviorX,overscrollBehaviorY,position,top,left,inset,insetInline,insetBlock,insetBlockEnd,insetBlockStart,insetInlineEnd,insetInlineStart,right,bottom,float,visibility,display,hideFrom,hideBelow,flexBasis,flex,flexDirection,flexGrow,flexShrink,gridTemplateColumns,gridTemplateRows,gridColumn,gridRow,gridColumnStart,gridColumnEnd,gridAutoFlow,gridAutoColumns,gridAutoRows,gap,gridGap,gridRowGap,gridColumnGap,rowGap,columnGap,justifyContent,alignContent,alignItems,alignSelf,padding,paddingLeft,paddingRight,paddingTop,paddingBottom,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingInline,paddingInlineEnd,paddingInlineStart,marginLeft,marginRight,marginTop,marginBottom,margin,marginBlock,marginBlockEnd,marginBlockStart,marginInline,marginInlineEnd,marginInlineStart,spaceX,spaceY,outlineWidth,outlineColor,outline,outlineOffset,divideX,divideY,divideColor,divideStyle,width,inlineSize,minWidth,minInlineSize,maxWidth,maxInlineSize,height,blockSize,minHeight,minBlockSize,maxHeight,maxBlockSize,color,fontFamily,fontSize,fontSizeAdjust,fontPalette,fontKerning,fontFeatureSettings,fontWeight,fontSmoothing,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariationSettings,fontVariantNumeric,letterSpacing,lineHeight,textAlign,textDecoration,textDecorationColor,textEmphasisColor,textDecorationStyle,textDecorationThickness,textUnderlineOffset,textTransform,textIndent,textShadow,textOverflow,verticalAlign,wordBreak,textWrap,truncate,lineClamp,listStyleType,listStylePosition,listStyleImage,listStyle,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundAttachment,backgroundClip,background,backgroundColor,backgroundOrigin,backgroundImage,backgroundRepeat,backgroundBlendMode,backgroundSize,backgroundGradient,textGradient,gradientFromPosition,gradientToPosition,gradientFrom,gradientTo,gradientVia,gradientViaPosition,borderRadius,borderTopLeftRadius,borderTopRightRadius,borderBottomRightRadius,borderBottomLeftRadius,borderTopRadius,borderRightRadius,borderBottomRadius,borderLeftRadius,borderStartStartRadius,borderStartEndRadius,borderStartRadius,borderEndStartRadius,borderEndEndRadius,borderEndRadius,border,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,borderBlockStartWidth,borderBlockEndWidth,borderColor,borderInline,borderInlineWidth,borderInlineColor,borderBlock,borderBlockWidth,borderBlockColor,borderLeft,borderLeftColor,borderInlineStart,borderInlineStartWidth,borderInlineStartColor,borderRight,borderRightColor,borderInlineEnd,borderInlineEndWidth,borderInlineEndColor,borderTop,borderTopColor,borderBottom,borderBottomColor,borderBlockEnd,borderBlockEndColor,borderBlockStart,borderBlockStartColor,opacity,boxShadow,boxShadowColor,mixBlendMode,filter,brightness,contrast,grayscale,hueRotate,invert,saturate,sepia,dropShadow,blur,backdropFilter,backdropBlur,backdropBrightness,backdropContrast,backdropGrayscale,backdropHueRotate,backdropInvert,backdropOpacity,backdropSaturate,backdropSepia,borderCollapse,borderSpacing,borderSpacingX,borderSpacingY,tableLayout,transitionTimingFunction,transitionDelay,transitionDuration,transitionProperty,transition,animation,animationName,animationTimingFunction,animationDuration,animationDelay,animationPlayState,animationComposition,animationFillMode,animationDirection,animationIterationCount,animationRange,animationState,animationRangeStart,animationRangeEnd,animationTimeline,transformOrigin,transformBox,transformStyle,transform,rotate,rotateX,rotateY,rotateZ,scale,scaleX,scaleY,translate,translateX,translateY,translateZ,accentColor,caretColor,scrollBehavior,scrollbar,scrollbarColor,scrollbarGutter,scrollbarWidth,scrollMargin,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollMarginBottom,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollPadding,scrollPaddingBlock,scrollPaddingBlockStart,scrollPaddingBlockEnd,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollPaddingBottom,scrollSnapAlign,scrollSnapStop,scrollSnapType,scrollSnapStrictness,scrollSnapMargin,scrollSnapMarginTop,scrollSnapMarginBottom,scrollSnapMarginLeft,scrollSnapMarginRight,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,touchAction,userSelect,overflow,overflowWrap,overflowX,overflowY,overflowAnchor,overflowBlock,overflowInline,overflowClipBox,overflowClipMargin,overscrollBehaviorBlock,overscrollBehaviorInline,fill,stroke,strokeWidth,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,srOnly,debug,appearance,backfaceVisibility,clipPath,hyphens,mask,maskImage,maskSize,textSizeAdjust,container,containerName,containerType,cursor,colorPalette,_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_collapsed,_hasIcon,_hasLabel,_highlight,_hasBorder,_hasBackground,_isFullWidth,_placementLeft,_placementRight,_nextTheme,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,smToMd,smToLg,smToXl,mdToLg,mdToXl,lgToXl,_themeNext,textStyle"
|
|
5
5
|
var userGenerated = userGeneratedStr.split(",");
|
|
6
|
-
var cssPropertiesStr = "WebkitAppearance,WebkitBorderBefore,WebkitBorderBeforeColor,WebkitBorderBeforeStyle,WebkitBorderBeforeWidth,WebkitBoxReflect,WebkitLineClamp,WebkitMask,WebkitMaskAttachment,WebkitMaskClip,WebkitMaskComposite,WebkitMaskImage,WebkitMaskOrigin,WebkitMaskPosition,WebkitMaskPositionX,WebkitMaskPositionY,WebkitMaskRepeat,WebkitMaskRepeatX,WebkitMaskRepeatY,WebkitMaskSize,WebkitOverflowScrolling,WebkitTapHighlightColor,WebkitTextFillColor,WebkitTextStroke,WebkitTextStrokeColor,WebkitTextStrokeWidth,WebkitTouchCallout,WebkitUserModify,accentColor,alignContent,alignItems,alignSelf,alignTracks,all,animation,animationComposition,animationDelay,animationDirection,animationDuration,animationFillMode,animationIterationCount,animationName,animationPlayState,animationRange,animationRangeEnd,animationRangeStart,animationTimingFunction,
|
|
6
|
+
var cssPropertiesStr = "WebkitAppearance,WebkitBorderBefore,WebkitBorderBeforeColor,WebkitBorderBeforeStyle,WebkitBorderBeforeWidth,WebkitBoxReflect,WebkitLineClamp,WebkitMask,WebkitMaskAttachment,WebkitMaskClip,WebkitMaskComposite,WebkitMaskImage,WebkitMaskOrigin,WebkitMaskPosition,WebkitMaskPositionX,WebkitMaskPositionY,WebkitMaskRepeat,WebkitMaskRepeatX,WebkitMaskRepeatY,WebkitMaskSize,WebkitOverflowScrolling,WebkitTapHighlightColor,WebkitTextFillColor,WebkitTextStroke,WebkitTextStrokeColor,WebkitTextStrokeWidth,WebkitTouchCallout,WebkitUserModify,WebkitUserSelect,accentColor,alignContent,alignItems,alignSelf,alignTracks,all,anchorName,anchorScope,animation,animationComposition,animationDelay,animationDirection,animationDuration,animationFillMode,animationIterationCount,animationName,animationPlayState,animationRange,animationRangeEnd,animationRangeStart,animationTimeline,animationTimingFunction,appearance,aspectRatio,backdropFilter,backfaceVisibility,background,backgroundAttachment,backgroundBlendMode,backgroundClip,backgroundColor,backgroundImage,backgroundOrigin,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundRepeat,backgroundSize,blockSize,border,borderBlock,borderBlockColor,borderBlockEnd,borderBlockEndColor,borderBlockEndStyle,borderBlockEndWidth,borderBlockStart,borderBlockStartColor,borderBlockStartStyle,borderBlockStartWidth,borderBlockStyle,borderBlockWidth,borderBottom,borderBottomColor,borderBottomLeftRadius,borderBottomRightRadius,borderBottomStyle,borderBottomWidth,borderCollapse,borderColor,borderEndEndRadius,borderEndStartRadius,borderImage,borderImageOutset,borderImageRepeat,borderImageSlice,borderImageSource,borderImageWidth,borderInline,borderInlineColor,borderInlineEnd,borderInlineEndColor,borderInlineEndStyle,borderInlineEndWidth,borderInlineStart,borderInlineStartColor,borderInlineStartStyle,borderInlineStartWidth,borderInlineStyle,borderInlineWidth,borderLeft,borderLeftColor,borderLeftStyle,borderLeftWidth,borderRadius,borderRight,borderRightColor,borderRightStyle,borderRightWidth,borderSpacing,borderStartEndRadius,borderStartStartRadius,borderStyle,borderTop,borderTopColor,borderTopLeftRadius,borderTopRightRadius,borderTopStyle,borderTopWidth,borderWidth,bottom,boxAlign,boxDecorationBreak,boxDirection,boxFlex,boxFlexGroup,boxLines,boxOrdinalGroup,boxOrient,boxPack,boxShadow,boxSizing,breakAfter,breakBefore,breakInside,captionSide,caret,caretColor,caretShape,clear,clip,clipPath,clipRule,color,colorInterpolationFilters,colorScheme,columnCount,columnFill,columnGap,columnRule,columnRuleColor,columnRuleStyle,columnRuleWidth,columnSpan,columnWidth,columns,contain,containIntrinsicBlockSize,containIntrinsicHeight,containIntrinsicInlineSize,containIntrinsicSize,containIntrinsicWidth,container,containerName,containerType,content,contentVisibility,counterIncrement,counterReset,counterSet,cursor,cx,cy,d,direction,display,dominantBaseline,emptyCells,fieldSizing,fill,fillOpacity,fillRule,filter,flex,flexBasis,flexDirection,flexFlow,flexGrow,flexShrink,flexWrap,float,floodColor,floodOpacity,font,fontFamily,fontFeatureSettings,fontKerning,fontLanguageOverride,fontOpticalSizing,fontPalette,fontSize,fontSizeAdjust,fontSmooth,fontStretch,fontStyle,fontSynthesis,fontSynthesisPosition,fontSynthesisSmallCaps,fontSynthesisStyle,fontSynthesisWeight,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariantEastAsian,fontVariantEmoji,fontVariantLigatures,fontVariantNumeric,fontVariantPosition,fontVariationSettings,fontWeight,forcedColorAdjust,gap,grid,gridArea,gridAutoColumns,gridAutoFlow,gridAutoRows,gridColumn,gridColumnEnd,gridColumnGap,gridColumnStart,gridGap,gridRow,gridRowEnd,gridRowGap,gridRowStart,gridTemplate,gridTemplateAreas,gridTemplateColumns,gridTemplateRows,hangingPunctuation,height,hyphenateCharacter,hyphenateLimitChars,hyphens,imageOrientation,imageRendering,imageResolution,imeMode,initialLetter,initialLetterAlign,inlineSize,inset,insetBlock,insetBlockEnd,insetBlockStart,insetInline,insetInlineEnd,insetInlineStart,interpolateSize,isolation,justifyContent,justifyItems,justifySelf,justifyTracks,left,letterSpacing,lightingColor,lineBreak,lineClamp,lineHeight,lineHeightStep,listStyle,listStyleImage,listStylePosition,listStyleType,margin,marginBlock,marginBlockEnd,marginBlockStart,marginBottom,marginInline,marginInlineEnd,marginInlineStart,marginLeft,marginRight,marginTop,marginTrim,marker,markerEnd,markerMid,markerStart,mask,maskBorder,maskBorderMode,maskBorderOutset,maskBorderRepeat,maskBorderSlice,maskBorderSource,maskBorderWidth,maskClip,maskComposite,maskImage,maskMode,maskOrigin,maskPosition,maskRepeat,maskSize,maskType,masonryAutoFlow,mathDepth,mathShift,mathStyle,maxBlockSize,maxHeight,maxInlineSize,maxLines,maxWidth,minBlockSize,minHeight,minInlineSize,minWidth,mixBlendMode,objectFit,objectPosition,offset,offsetAnchor,offsetDistance,offsetPath,offsetPosition,offsetRotate,opacity,order,orphans,outline,outlineColor,outlineOffset,outlineStyle,outlineWidth,overflow,overflowAnchor,overflowBlock,overflowClipBox,overflowClipMargin,overflowInline,overflowWrap,overflowX,overflowY,overlay,overscrollBehavior,overscrollBehaviorBlock,overscrollBehaviorInline,overscrollBehaviorX,overscrollBehaviorY,padding,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingBottom,paddingInline,paddingInlineEnd,paddingInlineStart,paddingLeft,paddingRight,paddingTop,page,pageBreakAfter,pageBreakBefore,pageBreakInside,paintOrder,perspective,perspectiveOrigin,placeContent,placeItems,placeSelf,pointerEvents,position,positionAnchor,positionArea,positionTry,positionTryFallbacks,positionTryOrder,positionVisibility,printColorAdjust,quotes,r,resize,right,rotate,rowGap,rubyAlign,rubyMerge,rubyPosition,rx,ry,scale,scrollBehavior,scrollMargin,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginBottom,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollPadding,scrollPaddingBlock,scrollPaddingBlockEnd,scrollPaddingBlockStart,scrollPaddingBottom,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollSnapAlign,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapStop,scrollSnapType,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,scrollbarColor,scrollbarGutter,scrollbarWidth,shapeImageThreshold,shapeMargin,shapeOutside,shapeRendering,stopColor,stopOpacity,stroke,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,strokeWidth,tabSize,tableLayout,textAlign,textAlignLast,textAnchor,textBox,textBoxEdge,textBoxTrim,textCombineUpright,textDecoration,textDecorationColor,textDecorationLine,textDecorationSkip,textDecorationSkipInk,textDecorationStyle,textDecorationThickness,textEmphasis,textEmphasisColor,textEmphasisPosition,textEmphasisStyle,textIndent,textJustify,textOrientation,textOverflow,textRendering,textShadow,textSizeAdjust,textSpacingTrim,textTransform,textUnderlineOffset,textUnderlinePosition,textWrap,textWrapMode,textWrapStyle,timelineScope,top,touchAction,transform,transformBox,transformOrigin,transformStyle,transition,transitionBehavior,transitionDelay,transitionDuration,transitionProperty,transitionTimingFunction,translate,unicodeBidi,userSelect,vectorEffect,verticalAlign,viewTimeline,viewTimelineAxis,viewTimelineInset,viewTimelineName,viewTransitionName,visibility,whiteSpace,whiteSpaceCollapse,widows,width,willChange,wordBreak,wordSpacing,wordWrap,writingMode,x,y,zIndex,zoom,alignmentBaseline,baselineShift,colorInterpolation,colorRendering,glyphOrientationVertical";
|
|
7
7
|
var allCssProperties = cssPropertiesStr.split(",").concat(userGenerated);
|
|
8
8
|
var properties = new Map(allCssProperties.map((prop) => [prop, true]));
|
|
9
9
|
var cssPropertySelectorRegex = /&|@/;
|
package/package.json
CHANGED
|
@@ -9,7 +9,6 @@ export interface AspectRatioProperties {
|
|
|
9
9
|
ratio?: ConditionalValue<number>
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
|
|
13
12
|
interface AspectRatioStyles extends AspectRatioProperties, DistributiveOmit<SystemStyleObject, keyof AspectRatioProperties | 'aspectRatio'> {}
|
|
14
13
|
|
|
15
14
|
interface AspectRatioPatternFn {
|
package/patterns/bleed.d.ts
CHANGED
package/patterns/box.d.ts
CHANGED
package/patterns/center.d.ts
CHANGED
package/patterns/circle.d.ts
CHANGED
package/patterns/container.d.ts
CHANGED
package/patterns/cq.d.ts
CHANGED
package/patterns/divider.d.ts
CHANGED
|
@@ -11,7 +11,6 @@ export interface DividerProperties {
|
|
|
11
11
|
color?: ConditionalValue<Tokens["colors"] | Properties["borderColor"]>
|
|
12
12
|
}
|
|
13
13
|
|
|
14
|
-
|
|
15
14
|
interface DividerStyles extends DividerProperties, DistributiveOmit<SystemStyleObject, keyof DividerProperties > {}
|
|
16
15
|
|
|
17
16
|
interface DividerPatternFn {
|
package/patterns/flex.d.ts
CHANGED
package/patterns/float.d.ts
CHANGED
|
@@ -12,7 +12,6 @@ export interface FloatProperties {
|
|
|
12
12
|
placement?: ConditionalValue<"bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start">
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
|
|
16
15
|
interface FloatStyles extends FloatProperties, DistributiveOmit<SystemStyleObject, keyof FloatProperties > {}
|
|
17
16
|
|
|
18
17
|
interface FloatPatternFn {
|
package/patterns/grid-item.d.ts
CHANGED
package/patterns/grid.d.ts
CHANGED
package/patterns/hstack.d.ts
CHANGED
package/patterns/spacer.d.ts
CHANGED
package/patterns/square.d.ts
CHANGED
package/patterns/stack.d.ts
CHANGED
package/patterns/vstack.d.ts
CHANGED
package/patterns/wrap.d.ts
CHANGED
package/themes/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export const getTheme = (themeName) => import(
|
|
1
|
+
export const getTheme = (themeName) => import(`./theme-${themeName}.json`).then((m) => m.default)
|
|
2
2
|
|
|
3
3
|
export function injectTheme(el, theme) {
|
|
4
4
|
const doc = el.ownerDocument || document
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "next",
|
|
3
|
+
"id": "panda-theme-next",
|
|
4
|
+
"css": "[data-panda-theme=next] {\n --mp-border-widths-none: none;\n --mp-border-widths-sm: 1px;\n --mp-border-widths-md: 1.5px;\n --mp-border-widths-lg: 2px;\n --mp-border-widths-xl: 3px;\n --mp-border-widths-2xl: 4px;\n --mp-colors-debug: red;\n --mp-colors-currentcolor: currentcolor;\n --mp-colors-white: #FFFFFF;\n --mp-colors-vibrant-purple: linear-gradient(98deg, #F8F9FB 0%, #B5A2EC 50.01%, #4B61DD 100%);\n --mp-colors-light-purple: radial-gradient(108.28% 139.29% at 0% 0%, var(--mp-colors-background-brand) 0%, var(--mp-colors-background-highlight) 100%);\n --mp-colors-dark-100: #1D2125;\n --mp-colors-dark-200: #22272B;\n --mp-colors-dark-250: #282E33;\n --mp-colors-dark-300: #2C333A;\n --mp-colors-dark-350: #38414A;\n --mp-colors-dark-400: #454F59;\n --mp-colors-dark-500: #596773;\n --mp-colors-dark-600: #738496;\n --mp-colors-dark-700: #8C9BAB;\n --mp-colors-dark-800: #9FADBC;\n --mp-colors-dark-900: #B6C2CF;\n --mp-colors-dark-1000: #C7D1DB;\n --mp-colors-dark--100: #101214;\n --mp-colors-dark: #161A1D;\n --mp-colors-neutral-100: #F7F8F9;\n --mp-colors-neutral-200: #F0F1F3;\n --mp-colors-neutral-300: #DCDFE4;\n --mp-colors-neutral-400: #B2B9C4;\n --mp-colors-neutral-500: #8690A2;\n --mp-colors-neutral-600: #758195;\n --mp-colors-neutral-700: #656F80;\n --mp-colors-neutral-800: #4C5460;\n --mp-colors-neutral-900: #383E48;\n --mp-colors-neutral-1000: #272B32;\n --mp-colors-blue-100: #ECF3FE;\n --mp-colors-blue-200: #CEE0FD;\n --mp-colors-blue-300: #8EB7FA;\n --mp-colors-blue-400: #649CF8;\n --mp-colors-blue-500: #488BF7;\n --mp-colors-blue-600: #387CEB;\n --mp-colors-blue-700: #306AC8;\n --mp-colors-blue-800: #295AAA;\n --mp-colors-blue-900: #173361;\n --mp-colors-blue-1000: #132A4F;\n --mp-colors-indigo-100: #EEF0FC;\n --mp-colors-indigo-200: #D6DBF7;\n --mp-colors-indigo-300: #A8B2EF;\n --mp-colors-indigo-400: #8997E9;\n --mp-colors-indigo-500: #7586E5;\n --mp-colors-indigo-600: #6577E2;\n --mp-colors-indigo-700: #4B61DC;\n --mp-colors-indigo-800: #4053BC;\n --mp-colors-indigo-900: #242F6A;\n --mp-colors-indigo-1000: #1D2656;\n --mp-colors-violet-100: #F3F1FC;\n --mp-colors-violet-200: #DEDAF6;\n --mp-colors-violet-300: #B8AEEB;\n --mp-colors-violet-400: #9F91E3;\n --mp-colors-violet-500: #8F7FDF;\n --mp-colors-violet-600: #8270DB;\n --mp-colors-violet-700: #6F5FBA;\n --mp-colors-violet-800: #5F519F;\n --mp-colors-violet-900: #352E5A;\n --mp-colors-violet-1000: #2B2549;\n --mp-colors-fuchsia-100: #FBEEFE;\n --mp-colors-fuchsia-200: #F6D1FB;\n --mp-colors-fuchsia-300: #EA98F6;\n --mp-colors-fuchsia-400: #E16CF2;\n --mp-colors-fuchsia-500: #DA4DF0;\n --mp-colors-fuchsia-600: #C841DC;\n --mp-colors-fuchsia-700: #AC37BD;\n --mp-colors-fuchsia-800: #932FA2;\n --mp-colors-fuchsia-900: #531B5C;\n --mp-colors-fuchsia-1000: #45164C;\n --mp-colors-red-100: #FCEEED;\n --mp-colors-red-200: #F9D7D5;\n --mp-colors-red-300: #F09E99;\n --mp-colors-red-400: #EA7A72;\n --mp-colors-red-500: #E6645B;\n --mp-colors-red-600: #E2483D;\n --mp-colors-red-700: #C33E35;\n --mp-colors-red-800: #A8352D;\n --mp-colors-red-900: #5E1E19;\n --mp-colors-red-1000: #4E1915;\n --mp-colors-orange-100: #FDF3EC;\n --mp-colors-orange-200: #F9DECB;\n --mp-colors-orange-300: #F5C39F;\n --mp-colors-orange-400: #F0A875;\n --mp-colors-orange-500: #EB8E4B;\n --mp-colors-orange-600: #E46910;\n --mp-colors-orange-700: #BC560D;\n --mp-colors-orange-800: #A14A0B;\n --mp-colors-orange-900: #6B3108;\n --mp-colors-orange-1000: #492105;\n --mp-colors-yellow-100: #FDF6DD;\n --mp-colors-yellow-200: #F9E399;\n --mp-colors-yellow-300: #F5CD47;\n --mp-colors-yellow-400: #D8B53F;\n --mp-colors-yellow-500: #C2A338;\n --mp-colors-yellow-600: #A68A30;\n --mp-colors-yellow-700: #897228;\n --mp-colors-yellow-800: #766222;\n --mp-colors-yellow-900: #4D4016;\n --mp-colors-yellow-1000: #362D10;\n --mp-colors-lime-100: #F4FAEA;\n --mp-colors-lime-200: #D8EFB5;\n --mp-colors-lime-300: #B1DF6B;\n --mp-colors-lime-400: #83CA16;\n --mp-colors-lime-500: #77B814;\n --mp-colors-lime-600: #649B11;\n --mp-colors-lime-700: #53800E;\n --mp-colors-lime-800: #466C0C;\n --mp-colors-lime-900: #304A08;\n --mp-colors-lime-1000: #213306;\n --mp-colors-green-100: #F2F9F6;\n --mp-colors-green-200: #D2EBE1;\n --mp-colors-green-300: #A7D9C4;\n --mp-colors-green-400: #7DC7A8;\n --mp-colors-green-500: #56B78E;\n --mp-colors-green-600: #23A06B;\n --mp-colors-green-700: #1C8459;\n --mp-colors-green-800: #186F4A;\n --mp-colors-green-900: #104B32;\n --mp-colors-green-1000: #0B3524;\n --mp-colors-teal-100: #F2F9F6;\n --mp-colors-teal-200: #C4EDE9;\n --mp-colors-teal-300: #92DED6;\n --mp-colors-teal-400: #4FCABC;\n --mp-colors-teal-500: #19B9A8;\n --mp-colors-teal-600: #119E8F;\n --mp-colors-teal-700: #0E8275;\n --mp-colors-teal-800: #0C6E63;\n --mp-colors-teal-900: #084841;\n --mp-colors-teal-1000: #06342F;\n --mp-colors-brand-capital: #2F5573;\n --mp-colors-brand-esign: #00C853;\n --mp-colors-brand-expense: #183883;\n --mp-colors-brand-flex: #7C4DFF;\n --mp-colors-brand-jurnal: #40C3FF;\n --mp-colors-brand-klikpajak: #FF9100;\n --mp-colors-brand-mekari: #651FFF;\n --mp-colors-brand-qontak: #2979FF;\n --mp-colors-brand-talenta: #F22929;\n --mp-colors-brand-university: #448AFF;\n --mp-durations-slow: 100ms;\n --mp-durations-normal: 250ms;\n --mp-durations-fast: 300ms;\n --mp-fonts-body: \"Inter\", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif, Segoe UI, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n --mp-fonts-mono: SFMono-Regular, Menlo, Monaco,Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n --mp-font-sizes-xs: 0.625rem;\n --mp-font-sizes-sm: 0.75rem;\n --mp-font-sizes-md: 0.875rem;\n --mp-font-sizes-lg: 1rem;\n --mp-font-sizes-xl: 1.25rem;\n --mp-font-sizes-2xl: 1.5rem;\n --mp-font-weights-regular: 400;\n --mp-font-weights-semi-bold: 600;\n --mp-font-weights-bold: 800;\n --mp-line-heights-xs: 1.2;\n --mp-line-heights-sm: 1.34;\n --mp-line-heights-md: 1.43;\n --mp-line-heights-lg: 1.429;\n --mp-line-heights-xl: 1.5;\n --mp-line-heights-2xl: 1.67;\n --mp-line-heights-3xl: 1.71;\n --mp-letter-spacings-tighter: -0.05em;\n --mp-letter-spacings-tight: -0.025em;\n --mp-letter-spacings-normal: 0;\n --mp-letter-spacings-wide: 0.025em;\n --mp-letter-spacings-wider: 0.05em;\n --mp-letter-spacings-widest: 0.1em;\n --mp-opacity-0: 0;\n --mp-opacity-40: 0.4;\n --mp-opacity-60: 0.6;\n --mp-opacity-100: 1;\n --mp-radii-none: 0;\n --mp-radii-sm: 0.25rem;\n --mp-radii-md: 0.375rem;\n --mp-radii-lg: 0.5rem;\n --mp-radii-xl: 0.75rem;\n --mp-radii-full: 999px;\n --mp-shadows-xs: 0px 2px 4px 0px var(--mp-colors-background-shadow), 0px 0px 2px 0px var(--mp-colors-background-shadow);\n --mp-shadows-sm: 0px 10px 15px -3px var(--mp-colors-background-shadow), 0px 4px 6px -2px var(--mp-colors-background-shadow);\n --mp-shadows-md: 0px 20px 25px -5px var(--mp-colors-background-shadow), 0px 10px 10px -5px var(--mp-colors-background-shadow);\n --mp-shadows-lg: 0px 25px 30px -10px var(--mp-colors-background-shadow), 0px 15px 15px -10px var(--mp-colors-background-shadow);\n --mp-shadows-focus: 0 0 0 1px var(--mp-colors-border-focused);\n --mp-shadows-outline: 0 0 0 3px #E0EEFF;\n --mp-shadows-outer: 0 0 0 3px rgba(224, 238, 255, 1);\n --mp-shadows-none: none;\n --mp-sizes-0: 0;\n --mp-sizes-1: 0.25rem;\n --mp-sizes-2: 0.5rem;\n --mp-sizes-3: 0.75rem;\n --mp-sizes-4: 1rem;\n --mp-sizes-5: 1.25rem;\n --mp-sizes-6: 1.5rem;\n --mp-sizes-7: 1.75rem;\n --mp-sizes-8: 2rem;\n --mp-sizes-9: 2.25rem;\n --mp-sizes-10: 2.5rem;\n --mp-sizes-11: 2.75rem;\n --mp-sizes-12: 3rem;\n --mp-sizes-16: 4rem;\n --mp-sizes-20: 5rem;\n --mp-sizes-22: 5.5rem;\n --mp-sizes-56: 14rem;\n --mp-sizes-65: 17.5rem;\n --mp-sizes-0\\.25: 0.0625rem;\n --mp-sizes-0\\.5: 0.125rem;\n --mp-sizes-2\\.5: 0.625rem;\n --mp-sizes-7\\.5: 1.875rem;\n --mp-sizes-9\\.5: 2.375rem;\n --mp-sizes-full: 100%;\n --mp-sizes-sm: 24rem;\n --mp-spacing-0: 0;\n --mp-spacing-1: 0.25rem;\n --mp-spacing-2: 0.5rem;\n --mp-spacing-3: 0.75rem;\n --mp-spacing-4: 1rem;\n --mp-spacing-5: 1.3rem;\n --mp-spacing-6: 1.5rem;\n --mp-spacing-8: 2rem;\n --mp-spacing-10: 2.5rem;\n --mp-spacing-20: 5rem;\n --mp-spacing-0\\.5: 0.125rem;\n --mp-spacing-1\\.5: 0.375rem;\n --mp-z-index-hide: -1;\n --mp-z-index-base: 0;\n --mp-z-index-docked: 10;\n --mp-z-index-sticky: 1100;\n --mp-z-index-overlay: 1300;\n --mp-z-index-modal: 1400;\n --mp-z-index-popover: 1500;\n --mp-z-index-tooltip: 1800;\n --mp-colors-background-surface: #F1F5F9;\n --mp-colors-background-stage: var(--mp-colors-white);\n --mp-colors-background-overlay: rgba(35, 41, 51, 0.80);\n --mp-colors-background-disabled: rgba(29, 31, 36, 0.04);\n --mp-colors-background-inverse: var(--mp-colors-dark-100);\n --mp-colors-background-shadow: rgba(29, 31, 36, 0.16);\n --mp-colors-background-neutral: var(--mp-colors-white);\n --mp-colors-background-neutral-hovered: var(--mp-colors-neutral-100);\n --mp-colors-background-neutral-pressed: var(--mp-colors-neutral-200);\n --mp-colors-background-neutral-subtle: var(--mp-colors-neutral-200);\n --mp-colors-background-neutral-subtle-hovered: var(--mp-colors-neutral-300);\n --mp-colors-background-neutral-subtle-pressed: var(--mp-colors-neutral-400);\n --mp-colors-background-neutral-bold: var(--mp-colors-neutral-800);\n --mp-colors-background-neutral-bold-hovered: var(--mp-colors-neutral-900);\n --mp-colors-background-neutral-bold-pressed: var(--mp-colors-neutral-1000);\n --mp-colors-background-brand: var(--mp-colors-indigo-100);\n --mp-colors-background-brand-hovered: var(--mp-colors-indigo-200);\n --mp-colors-background-brand-pressed: var(--mp-colors-indigo-300);\n --mp-colors-background-brand-selected: var(--mp-colors-indigo-200);\n --mp-colors-background-brand-bold: var(--mp-colors-indigo-700);\n --mp-colors-background-brand-bold-hovered: var(--mp-colors-indigo-800);\n --mp-colors-background-brand-bold-pressed: var(--mp-colors-indigo-900);\n --mp-colors-background-brand-bold-selected: var(--mp-colors-indigo-700);\n --mp-colors-background-tertiary: var(--mp-colors-dark-200);\n --mp-colors-background-tertiary-hovered: var(--mp-colors-dark-300);\n --mp-colors-background-tertiary-pressed: var(--mp-colors-dark-400);\n --mp-colors-background-danger: var(--mp-colors-red-100);\n --mp-colors-background-danger-hovered: var(--mp-colors-red-200);\n --mp-colors-background-danger-pressed: var(--mp-colors-red-300);\n --mp-colors-background-danger-bold: var(--mp-colors-red-700);\n --mp-colors-background-danger-bold-hovered: var(--mp-colors-red-800);\n --mp-colors-background-danger-bold-pressed: var(--mp-colors-red-900);\n --mp-colors-background-warning: var(--mp-colors-yellow-100);\n --mp-colors-background-warning-hovered: var(--mp-colors-yellow-200);\n --mp-colors-background-warning-pressed: var(--mp-colors-yellow-300);\n --mp-colors-background-warning-bold: var(--mp-colors-yellow-300);\n --mp-colors-background-warning-bold-hovered: var(--mp-colors-yellow-400);\n --mp-colors-background-warning-bold-pressed: var(--mp-colors-yellow-500);\n --mp-colors-background-success: var(--mp-colors-green-100);\n --mp-colors-background-success-hovered: var(--mp-colors-green-200);\n --mp-colors-background-success-pressed: var(--mp-colors-green-300);\n --mp-colors-background-success-bold: var(--mp-colors-green-700);\n --mp-colors-background-success-bold-hovered: var(--mp-colors-green-800);\n --mp-colors-background-success-bold-pressed: var(--mp-colors-green-900);\n --mp-colors-background-highlight: var(--mp-colors-violet-100);\n --mp-colors-background-highlight-hovered: var(--mp-colors-violet-200);\n --mp-colors-background-highlight-pressed: var(--mp-colors-violet-300);\n --mp-colors-background-highlight-bold: var(--mp-colors-violet-700);\n --mp-colors-background-highlight-bold-hovered: var(--mp-colors-violet-800);\n --mp-colors-background-highlight-bold-pressed: var(--mp-colors-violet-900);\n --mp-colors-background-airene: radial-gradient(108.28% 139.29% at 0% 0%, #EEF0FC 0%, #F3F1FC 100%);\n --mp-colors-nav-parent: #E7EDF5;\n --mp-colors-nav-stack: var(--mp-colors-neutral-100);\n --mp-colors-nav-stack-hovered: #E7EDF5;\n --mp-colors-text-default: var(--mp-colors-neutral-1000);\n --mp-colors-text-default-static: var(--mp-colors-neutral-1000);\n --mp-colors-text-secondary: var(--mp-colors-neutral-700);\n --mp-colors-text-secondary-pressed: var(--mp-colors-neutral-800);\n --mp-colors-text-placeholder: var(--mp-colors-neutral-600);\n --mp-colors-text-disabled: rgba(29, 31, 36, 0.32);\n --mp-colors-text-inverse: var(--mp-colors-white);\n --mp-colors-text-inverse-static: var(--mp-colors-white);\n --mp-colors-text-selected: var(--mp-colors-indigo-700);\n --mp-colors-text-danger: var(--mp-colors-red-800);\n --mp-colors-text-danger-pressed: var(--mp-colors-red-900);\n --mp-colors-text-warning: var(--mp-colors-orange-800);\n --mp-colors-text-warning-inverse: var(--mp-colors-neutral-1000);\n --mp-colors-text-success: var(--mp-colors-green-800);\n --mp-colors-text-highlight: var(--mp-colors-violet-800);\n --mp-colors-text-information: var(--mp-colors-indigo-800);\n --mp-colors-text-link: var(--mp-colors-indigo-700);\n --mp-colors-text-link-pressed: var(--mp-colors-indigo-800);\n --mp-colors-icon-default: var(--mp-colors-neutral-600);\n --mp-colors-icon-disabled: var(--mp-colors-neutral-400);\n --mp-colors-icon-inverse: var(--mp-colors-white);\n --mp-colors-icon-inverse-static: var(--mp-colors-white);\n --mp-colors-icon-selected: var(--mp-colors-indigo-700);\n --mp-colors-icon-brand: var(--mp-colors-indigo-700);\n --mp-colors-icon-danger: var(--mp-colors-red-700);\n --mp-colors-icon-warning: var(--mp-colors-orange-700);\n --mp-colors-icon-warning-inverse: var(--mp-colors-neutral-1000);\n --mp-colors-icon-success: var(--mp-colors-green-700);\n --mp-colors-icon-highlight: var(--mp-colors-violet-700);\n --mp-colors-icon-information: var(--mp-colors-indigo-700);\n --mp-colors-icon-subtle: var(--mp-colors-neutral-300);\n --mp-colors-icon-logo: var(--mp-colors-neutral-1000);\n --mp-colors-border-default: var(--mp-colors-neutral-300);\n --mp-colors-border-bold: var(--mp-colors-neutral-600);\n --mp-colors-border-disabled: rgba(29, 31, 36, 0.08);\n --mp-colors-border-form: rgba(29, 31, 36, 0.16);\n --mp-colors-border-focused: var(--mp-colors-indigo-500);\n --mp-colors-border-inverse: var(--mp-colors-white);\n --mp-colors-border-selected: var(--mp-colors-indigo-700);\n --mp-colors-border-selected-hovered: var(--mp-colors-indigo-800);\n --mp-colors-border-selected-disabled: var(--mp-colors-indigo-200);\n --mp-colors-border-brand: var(--mp-colors-indigo-700);\n --mp-colors-border-danger: var(--mp-colors-red-700);\n --mp-colors-border-warning: var(--mp-colors-yellow-300);\n --mp-colors-border-success: var(--mp-colors-green-700);\n --mp-colors-border-highlight: var(--mp-colors-violet-700);\n --mp-colors-border-information: var(--mp-colors-indigo-700);\n --mp-colors-chart-cat01: var(--mp-colors-blue-400);\n --mp-colors-chart-cat01-bold: var(--mp-colors-blue-600);\n --mp-colors-chart-cat02: var(--mp-colors-teal-400);\n --mp-colors-chart-cat02-bold: var(--mp-colors-teal-600);\n --mp-colors-chart-cat03: var(--mp-colors-violet-400);\n --mp-colors-chart-cat03-bold: var(--mp-colors-violet-600);\n --mp-colors-chart-cat04: var(--mp-colors-orange-400);\n --mp-colors-chart-cat04-bold: var(--mp-colors-orange-600);\n --mp-colors-chart-cat05: var(--mp-colors-neutral-400);\n --mp-colors-chart-cat05-bold: var(--mp-colors-neutral-600);\n --mp-colors-chart-cat06: var(--mp-colors-red-400);\n --mp-colors-chart-cat06-bold: var(--mp-colors-red-600);\n --mp-colors-chart-cat07: var(--mp-colors-lime-400);\n --mp-colors-chart-cat07-bold: var(--mp-colors-lime-600);\n --mp-colors-chart-cat08: var(--mp-colors-fuchsia-400);\n --mp-colors-chart-cat08-bold: var(--mp-colors-fuchsia-600);\n --mp-spacing-4xs: 0.125rem;\n --mp-spacing-3xs: var(--mp-spacing-1);\n --mp-spacing-2xs: 0.375rem;\n --mp-spacing-xs: var(--mp-spacing-2);\n --mp-spacing-sm: var(--mp-spacing-3);\n --mp-spacing-md: var(--mp-spacing-4);\n --mp-spacing-lg: var(--mp-spacing-5);\n --mp-spacing-xl: var(--mp-spacing-6);\n --mp-spacing-2xl: var(--mp-spacing-8);\n --mp-spacing-3xl: var(--mp-spacing-10);\n --mp-spacing-4xl: var(--mp-spacing-20)\n}\n\n[data-panda-theme=next].light {\n --mp-colors-background-surface: #F1F5F9;\n --mp-colors-background-stage: var(--mp-colors-white);\n --mp-colors-background-overlay: rgba(35, 41, 51, 0.80);\n --mp-colors-background-disabled: rgba(29, 31, 36, 0.04);\n --mp-colors-background-inverse: var(--mp-colors-dark-100);\n --mp-colors-background-shadow: rgba(29, 31, 36, 0.16);\n --mp-colors-background-neutral: var(--mp-colors-white);\n --mp-colors-background-neutral-hovered: var(--mp-colors-neutral-100);\n --mp-colors-background-neutral-pressed: var(--mp-colors-neutral-200);\n --mp-colors-background-neutral-subtle: var(--mp-colors-neutral-200);\n --mp-colors-background-neutral-subtle-hovered: var(--mp-colors-neutral-300);\n --mp-colors-background-neutral-subtle-pressed: var(--mp-colors-neutral-400);\n --mp-colors-background-neutral-bold: var(--mp-colors-neutral-800);\n --mp-colors-background-neutral-bold-hovered: var(--mp-colors-neutral-900);\n --mp-colors-background-neutral-bold-pressed: var(--mp-colors-neutral-1000);\n --mp-colors-background-brand: var(--mp-colors-indigo-100);\n --mp-colors-background-brand-hovered: var(--mp-colors-indigo-200);\n --mp-colors-background-brand-pressed: var(--mp-colors-indigo-300);\n --mp-colors-background-brand-selected: var(--mp-colors-indigo-200);\n --mp-colors-background-brand-bold: var(--mp-colors-indigo-700);\n --mp-colors-background-brand-bold-hovered: var(--mp-colors-indigo-800);\n --mp-colors-background-brand-bold-pressed: var(--mp-colors-indigo-900);\n --mp-colors-background-brand-bold-selected: var(--mp-colors-indigo-700);\n --mp-colors-background-tertiary: var(--mp-colors-dark-200);\n --mp-colors-background-tertiary-hovered: var(--mp-colors-dark-300);\n --mp-colors-background-tertiary-pressed: var(--mp-colors-dark-400);\n --mp-colors-background-danger: var(--mp-colors-red-100);\n --mp-colors-background-danger-hovered: var(--mp-colors-red-200);\n --mp-colors-background-danger-pressed: var(--mp-colors-red-300);\n --mp-colors-background-danger-bold: var(--mp-colors-red-700);\n --mp-colors-background-danger-bold-hovered: var(--mp-colors-red-800);\n --mp-colors-background-danger-bold-pressed: var(--mp-colors-red-900);\n --mp-colors-background-warning: var(--mp-colors-yellow-100);\n --mp-colors-background-warning-hovered: var(--mp-colors-yellow-200);\n --mp-colors-background-warning-pressed: var(--mp-colors-yellow-300);\n --mp-colors-background-warning-bold: var(--mp-colors-yellow-300);\n --mp-colors-background-warning-bold-hovered: var(--mp-colors-yellow-400);\n --mp-colors-background-warning-bold-pressed: var(--mp-colors-yellow-500);\n --mp-colors-background-success: var(--mp-colors-green-100);\n --mp-colors-background-success-hovered: var(--mp-colors-green-200);\n --mp-colors-background-success-pressed: var(--mp-colors-green-300);\n --mp-colors-background-success-bold: var(--mp-colors-green-700);\n --mp-colors-background-success-bold-hovered: var(--mp-colors-green-800);\n --mp-colors-background-success-bold-pressed: var(--mp-colors-green-900);\n --mp-colors-background-highlight: var(--mp-colors-violet-100);\n --mp-colors-background-highlight-hovered: var(--mp-colors-violet-200);\n --mp-colors-background-highlight-pressed: var(--mp-colors-violet-300);\n --mp-colors-background-highlight-bold: var(--mp-colors-violet-700);\n --mp-colors-background-highlight-bold-hovered: var(--mp-colors-violet-800);\n --mp-colors-background-highlight-bold-pressed: var(--mp-colors-violet-900);\n --mp-colors-background-airene: radial-gradient(108.28% 139.29% at 0% 0%, #EEF0FC 0%, #F3F1FC 100%);\n --mp-colors-nav-parent: #E7EDF5;\n --mp-colors-nav-stack: var(--mp-colors-neutral-100);\n --mp-colors-nav-stack-hovered: #E7EDF5;\n --mp-colors-text-default: var(--mp-colors-neutral-1000);\n --mp-colors-text-default-static: var(--mp-colors-neutral-1000);\n --mp-colors-text-secondary: var(--mp-colors-neutral-700);\n --mp-colors-text-secondary-pressed: var(--mp-colors-neutral-800);\n --mp-colors-text-placeholder: var(--mp-colors-neutral-600);\n --mp-colors-text-disabled: rgba(29, 31, 36, 0.32);\n --mp-colors-text-inverse: var(--mp-colors-white);\n --mp-colors-text-inverse-static: var(--mp-colors-white);\n --mp-colors-text-selected: var(--mp-colors-indigo-700);\n --mp-colors-text-danger: var(--mp-colors-red-800);\n --mp-colors-text-danger-pressed: var(--mp-colors-red-900);\n --mp-colors-text-warning: var(--mp-colors-orange-800);\n --mp-colors-text-warning-inverse: var(--mp-colors-neutral-1000);\n --mp-colors-text-success: var(--mp-colors-green-800);\n --mp-colors-text-highlight: var(--mp-colors-violet-800);\n --mp-colors-text-information: var(--mp-colors-indigo-800);\n --mp-colors-text-link: var(--mp-colors-indigo-700);\n --mp-colors-text-link-pressed: var(--mp-colors-indigo-800);\n --mp-colors-icon-default: var(--mp-colors-neutral-600);\n --mp-colors-icon-disabled: var(--mp-colors-neutral-400);\n --mp-colors-icon-inverse: var(--mp-colors-white);\n --mp-colors-icon-inverse-static: var(--mp-colors-white);\n --mp-colors-icon-selected: var(--mp-colors-indigo-700);\n --mp-colors-icon-brand: var(--mp-colors-indigo-700);\n --mp-colors-icon-danger: var(--mp-colors-red-700);\n --mp-colors-icon-warning: var(--mp-colors-orange-700);\n --mp-colors-icon-warning-inverse: var(--mp-colors-neutral-1000);\n --mp-colors-icon-success: var(--mp-colors-green-700);\n --mp-colors-icon-highlight: var(--mp-colors-violet-700);\n --mp-colors-icon-information: var(--mp-colors-indigo-700);\n --mp-colors-icon-subtle: var(--mp-colors-neutral-300);\n --mp-colors-icon-logo: var(--mp-colors-neutral-1000);\n --mp-colors-border-default: var(--mp-colors-neutral-300);\n --mp-colors-border-bold: var(--mp-colors-neutral-600);\n --mp-colors-border-disabled: rgba(29, 31, 36, 0.08);\n --mp-colors-border-form: rgba(29, 31, 36, 0.16);\n --mp-colors-border-focused: var(--mp-colors-indigo-500);\n --mp-colors-border-inverse: var(--mp-colors-white);\n --mp-colors-border-selected: var(--mp-colors-indigo-700);\n --mp-colors-border-selected-hovered: var(--mp-colors-indigo-800);\n --mp-colors-border-selected-disabled: var(--mp-colors-indigo-200);\n --mp-colors-border-brand: var(--mp-colors-indigo-700);\n --mp-colors-border-danger: var(--mp-colors-red-700);\n --mp-colors-border-warning: var(--mp-colors-yellow-300);\n --mp-colors-border-success: var(--mp-colors-green-700);\n --mp-colors-border-highlight: var(--mp-colors-violet-700);\n --mp-colors-border-information: var(--mp-colors-indigo-700);\n --mp-colors-chart-cat01: var(--mp-colors-blue-400);\n --mp-colors-chart-cat01-bold: var(--mp-colors-blue-600);\n --mp-colors-chart-cat02: var(--mp-colors-teal-400);\n --mp-colors-chart-cat02-bold: var(--mp-colors-teal-600);\n --mp-colors-chart-cat03: var(--mp-colors-violet-400);\n --mp-colors-chart-cat03-bold: var(--mp-colors-violet-600);\n --mp-colors-chart-cat04: var(--mp-colors-orange-400);\n --mp-colors-chart-cat04-bold: var(--mp-colors-orange-600);\n --mp-colors-chart-cat05: var(--mp-colors-neutral-400);\n --mp-colors-chart-cat05-bold: var(--mp-colors-neutral-600);\n --mp-colors-chart-cat06: var(--mp-colors-red-400);\n --mp-colors-chart-cat06-bold: var(--mp-colors-red-600);\n --mp-colors-chart-cat07: var(--mp-colors-lime-400);\n --mp-colors-chart-cat07-bold: var(--mp-colors-lime-600);\n --mp-colors-chart-cat08: var(--mp-colors-fuchsia-400);\n --mp-colors-chart-cat08-bold: var(--mp-colors-fuchsia-600)\n }\n\n[data-panda-theme=next].dark {\n --mp-colors-background-surface: var(--mp-colors-dark);\n --mp-colors-background-stage: var(--mp-colors-dark-100);\n --mp-colors-background-overlay: rgba(101, 127, 153, 0.8);\n --mp-colors-background-disabled: rgba(188, 214, 240, 0.04);\n --mp-colors-background-inverse: var(--mp-colors-white);\n --mp-colors-background-shadow: rgba(22, 26, 29, 1);\n --mp-colors-background-neutral: var(--mp-colors-dark-200);\n --mp-colors-background-neutral-hovered: var(--mp-colors-dark-250);\n --mp-colors-background-neutral-pressed: var(--mp-colors-dark-300);\n --mp-colors-background-neutral-subtle: var(--mp-colors-dark-300);\n --mp-colors-background-neutral-subtle-hovered: var(--mp-colors-dark-350);\n --mp-colors-background-neutral-subtle-pressed: var(--mp-colors-dark-400);\n --mp-colors-background-neutral-bold: var(--mp-colors-dark-800);\n --mp-colors-background-neutral-bold-hovered: var(--mp-colors-dark-900);\n --mp-colors-background-neutral-bold-pressed: var(--mp-colors-dark-1000);\n --mp-colors-background-brand: var(--mp-colors-indigo-1000);\n --mp-colors-background-brand-hovered: var(--mp-colors-indigo-900);\n --mp-colors-background-brand-pressed: var(--mp-colors-indigo-800);\n --mp-colors-background-brand-selected: var(--mp-colors-indigo-900);\n --mp-colors-background-brand-bold: var(--mp-colors-indigo-400);\n --mp-colors-background-brand-bold-hovered: var(--mp-colors-indigo-300);\n --mp-colors-background-brand-bold-pressed: var(--mp-colors-indigo-200);\n --mp-colors-background-brand-bold-selected: var(--mp-colors-indigo-400);\n --mp-colors-background-tertiary: var(--mp-colors-dark-200);\n --mp-colors-background-tertiary-hovered: var(--mp-colors-dark-300);\n --mp-colors-background-tertiary-pressed: var(--mp-colors-dark-400);\n --mp-colors-background-danger: var(--mp-colors-red-1000);\n --mp-colors-background-danger-hovered: var(--mp-colors-red-900);\n --mp-colors-background-danger-pressed: var(--mp-colors-red-800);\n --mp-colors-background-danger-bold: var(--mp-colors-red-400);\n --mp-colors-background-danger-bold-hovered: var(--mp-colors-red-300);\n --mp-colors-background-danger-bold-pressed: var(--mp-colors-red-200);\n --mp-colors-background-warning: var(--mp-colors-yellow-1000);\n --mp-colors-background-warning-hovered: var(--mp-colors-yellow-900);\n --mp-colors-background-warning-pressed: var(--mp-colors-yellow-800);\n --mp-colors-background-warning-bold: var(--mp-colors-yellow-300);\n --mp-colors-background-warning-bold-hovered: var(--mp-colors-yellow-400);\n --mp-colors-background-warning-bold-pressed: var(--mp-colors-yellow-500);\n --mp-colors-background-success: var(--mp-colors-green-1000);\n --mp-colors-background-success-hovered: var(--mp-colors-green-900);\n --mp-colors-background-success-pressed: var(--mp-colors-green-800);\n --mp-colors-background-success-bold: var(--mp-colors-green-400);\n --mp-colors-background-success-bold-hovered: var(--mp-colors-green-300);\n --mp-colors-background-success-bold-pressed: var(--mp-colors-green-200);\n --mp-colors-background-highlight: var(--mp-colors-violet-1000);\n --mp-colors-background-highlight-hovered: var(--mp-colors-violet-900);\n --mp-colors-background-highlight-pressed: var(--mp-colors-violet-800);\n --mp-colors-background-highlight-bold: var(--mp-colors-violet-400);\n --mp-colors-background-highlight-bold-hovered: var(--mp-colors-violet-300);\n --mp-colors-background-highlight-bold-pressed: var(--mp-colors-violet-200);\n --mp-colors-background-airene: radial-gradient(108.28% 139.29% at 0% 0%, #1D2656 0%, #2B2549 100%);\n --mp-colors-nav-parent: var(--mp-colors-dark-100);\n --mp-colors-nav-stack: var(--mp-colors-dark);\n --mp-colors-nav-stack-hovered: var(--mp-colors-dark-100);\n --mp-colors-text-default: var(--mp-colors-dark-900);\n --mp-colors-text-default-static: var(--mp-colors-neutral-1000);\n --mp-colors-text-secondary: var(--mp-colors-dark-700);\n --mp-colors-text-secondary-pressed: var(--mp-colors-dark-800);\n --mp-colors-text-placeholder: var(--mp-colors-dark-600);\n --mp-colors-text-disabled: rgba(191, 219, 248, 0.28);\n --mp-colors-text-inverse: var(--mp-colors-dark-100);\n --mp-colors-text-inverse-static: var(--mp-colors-white);\n --mp-colors-text-selected: var(--mp-colors-indigo-400);\n --mp-colors-text-danger: var(--mp-colors-red-300);\n --mp-colors-text-danger-pressed: var(--mp-colors-red-200);\n --mp-colors-text-warning: var(--mp-colors-yellow-300);\n --mp-colors-text-warning-inverse: var(--mp-colors-neutral-1000);\n --mp-colors-text-success: var(--mp-colors-green-300);\n --mp-colors-text-highlight: var(--mp-colors-violet-300);\n --mp-colors-text-information: var(--mp-colors-indigo-300);\n --mp-colors-text-link: var(--mp-colors-indigo-400);\n --mp-colors-text-link-pressed: var(--mp-colors-indigo-300);\n --mp-colors-icon-default: var(--mp-colors-dark-600);\n --mp-colors-icon-disabled: var(--mp-colors-dark-400);\n --mp-colors-icon-inverse: var(--mp-colors-dark-100);\n --mp-colors-icon-inverse-static: var(--mp-colors-white);\n --mp-colors-icon-selected: var(--mp-colors-indigo-400);\n --mp-colors-icon-brand: var(--mp-colors-indigo-400);\n --mp-colors-icon-danger: var(--mp-colors-red-400);\n --mp-colors-icon-warning: var(--mp-colors-yellow-300);\n --mp-colors-icon-warning-inverse: var(--mp-colors-dark-100);\n --mp-colors-icon-success: var(--mp-colors-green-400);\n --mp-colors-icon-highlight: var(--mp-colors-violet-400);\n --mp-colors-icon-information: var(--mp-colors-indigo-400);\n --mp-colors-icon-subtle: var(--mp-colors-dark-300);\n --mp-colors-icon-logo: var(--mp-colors-neutral-100);\n --mp-colors-border-default: var(--mp-colors-dark-300);\n --mp-colors-border-bold: var(--mp-colors-dark-600);\n --mp-colors-border-disabled: rgba(161, 189, 217, 0.08);\n --mp-colors-border-form: rgba(166, 197, 226, 0.16);\n --mp-colors-border-focused: var(--mp-colors-indigo-300);\n --mp-colors-border-inverse: var(--mp-colors-dark-100);\n --mp-colors-border-selected: var(--mp-colors-indigo-400);\n --mp-colors-border-selected-hovered: var(--mp-colors-indigo-300);\n --mp-colors-border-selected-disabled: var(--mp-colors-indigo-900);\n --mp-colors-border-brand: var(--mp-colors-indigo-400);\n --mp-colors-border-danger: var(--mp-colors-red-400);\n --mp-colors-border-warning: var(--mp-colors-yellow-300);\n --mp-colors-border-success: var(--mp-colors-green-400);\n --mp-colors-border-highlight: var(--mp-colors-violet-400);\n --mp-colors-border-information: var(--mp-colors-indigo-400);\n --mp-colors-chart-cat01: var(--mp-colors-blue-300);\n --mp-colors-chart-cat01-bold: var(--mp-colors-blue-500);\n --mp-colors-chart-cat02: var(--mp-colors-teal-300);\n --mp-colors-chart-cat02-bold: var(--mp-colors-teal-500);\n --mp-colors-chart-cat03: var(--mp-colors-violet-300);\n --mp-colors-chart-cat03-bold: var(--mp-colors-violet-500);\n --mp-colors-chart-cat04: var(--mp-colors-orange-300);\n --mp-colors-chart-cat04-bold: var(--mp-colors-orange-500);\n --mp-colors-chart-cat05: var(--mp-colors-neutral-300);\n --mp-colors-chart-cat05-bold: var(--mp-colors-neutral-500);\n --mp-colors-chart-cat06: var(--mp-colors-red-300);\n --mp-colors-chart-cat06-bold: var(--mp-colors-red-500);\n --mp-colors-chart-cat07: var(--mp-colors-lime-300);\n --mp-colors-chart-cat07-bold: var(--mp-colors-lime-500);\n --mp-colors-chart-cat08: var(--mp-colors-fuchsia-300);\n --mp-colors-chart-cat08-bold: var(--mp-colors-fuchsia-500)\n }"
|
|
5
|
+
}
|
package/tokens/tokens.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* eslint-disable */
|
|
2
|
-
export type Token = "borderWidths.none" | "borderWidths.sm" | "borderWidths.md" | "borderWidths.lg" | "colors.debug" | "colors.currentcolor" | "colors.dark" | "colors.background" | "colors.overlay" | "colors.white" | "colors.vibrantPurple" | "colors.lightPurple" | "colors.whiteAlpha.50" | "colors.whiteAlpha.100" | "colors.whiteAlpha.200" | "colors.whiteAlpha.300" | "colors.whiteAlpha.400" | "colors.whiteAlpha.500" | "colors.whiteAlpha.600" | "colors.whiteAlpha.700" | "colors.whiteAlpha.800" | "colors.whiteAlpha.900" | "colors.blackAlpha.50" | "colors.blackAlpha.100" | "colors.blackAlpha.200" | "colors.blackAlpha.300" | "colors.blackAlpha.400" | "colors.blackAlpha.500" | "colors.blackAlpha.600" | "colors.blackAlpha.700" | "colors.blackAlpha.800" | "colors.blackAlpha.900" | "colors.gray.25" | "colors.gray.50" | "colors.gray.100" | "colors.gray.400" | "colors.gray.600" | "colors.blue.50" | "colors.blue.100" | "colors.blue.400" | "colors.blue.500" | "colors.blue.700" | "colors.red.50" | "colors.red.400" | "colors.red.500" | "colors.red.700" | "colors.green.50" | "colors.green.400" | "colors.green.500" | "colors.green.700" | "colors.orange.50" | "colors.orange.400" | "colors.orange.500" | "colors.orange.700" | "colors.sky.100" | "colors.sky.400" | "colors.teal.100" | "colors.teal.400" | "colors.violet.100" | "colors.violet.400" | "colors.amber.100" | "colors.amber.400" | "colors.rose.100" | "colors.rose.400" | "colors.stone.100" | "colors.stone.400" | "colors.lime.100" | "colors.lime.400" | "colors.pink.100" | "colors.pink.400" | "colors.apricot.100" | "colors.apricot.400" | "colors.aqua.100" | "colors.aqua.400" | "colors.leaf.100" | "colors.leaf.400" | "colors.fuchsia.100" | "colors.fuchsia.400" | "colors.ice.50" | "colors.ice.100" | "colors.ash.100" | "colors.brand.capital" | "colors.brand.esign" | "colors.brand.expense" | "colors.brand.flex" | "colors.brand.jurnal" | "colors.brand.klikpajak" | "colors.brand.mekari" | "colors.brand.qontak" | "colors.brand.talenta" | "colors.brand.university" | "durations.slow" | "durations.normal" | "durations.fast" | "fonts.body" | "fonts.mono" | "fontSizes.xs" | "fontSizes.sm" | "fontSizes.md" | "fontSizes.lg" | "fontSizes.xl" | "fontSizes.2xl" | "fontWeights.regular" | "fontWeights.semiBold" | "fontWeights.bold" | "lineHeights.xs" | "lineHeights.sm" | "lineHeights.md" | "lineHeights.lg" | "lineHeights.xl" | "lineHeights.2xl" | "lineHeights.3xl" | "letterSpacings.tighter" | "letterSpacings.tight" | "letterSpacings.normal" | "letterSpacings.wide" | "letterSpacings.wider" | "letterSpacings.widest" | "opacity.0" | "opacity.40" | "opacity.60" | "opacity.100" | "radii.none" | "radii.xs" | "radii.sm" | "radii.md" | "radii.lg" | "radii.xl" | "radii.full" | "shadows.xs" | "shadows.sm" | "shadows.md" | "shadows.lg" | "shadows.focus" | "shadows.xl" | "shadows.2xl" | "shadows.outline" | "shadows.outline-tab" | "shadows.outer" | "shadows.inner" | "shadows.none" | "sizes.0" | "sizes.1" | "sizes.2" | "sizes.3" | "sizes.4" | "sizes.5" | "sizes.6" | "sizes.7" | "sizes.8" | "sizes.9" | "sizes.10" | "sizes.11" | "sizes.12" | "sizes.16" | "sizes.20" | "sizes.22" | "sizes.56" | "sizes.65" | "sizes.0.25" | "sizes.0.5" | "sizes.2.5" | "sizes.7.5" | "sizes.9.5" | "sizes.full" | "sizes.sm" | "sizes.breakpoint-sm" | "sizes.breakpoint-md" | "sizes.breakpoint-lg" | "sizes.breakpoint-xl" | "spacing.0" | "spacing.1" | "spacing.2" | "spacing.3" | "spacing.4" | "spacing.5" | "spacing.6" | "spacing.8" | "spacing.12" | "spacing.16" | "spacing.20" | "spacing.24" | "spacing.32" | "spacing.40" | "spacing.64" | "spacing.0.5" | "spacing.1.5" | "zIndex.hide" | "zIndex.base" | "zIndex.docked" | "zIndex.sticky" | "zIndex.overlay" | "zIndex.modal" | "zIndex.popover" | "zIndex.tooltip" | "breakpoints.sm" | "breakpoints.md" | "breakpoints.lg" | "breakpoints.xl" | "borderWidths.xl" | "borderWidths.2xl" | "colors.dark.100" | "colors.dark.200" | "colors.dark.250" | "colors.dark.300" | "colors.dark.350" | "colors.dark.400" | "colors.dark.500" | "colors.dark.600" | "colors.dark.700" | "colors.dark.800" | "colors.dark.900" | "colors.dark.1000" | "colors.dark.-100" | "colors.neutral.100" | "colors.neutral.200" | "colors.neutral.300" | "colors.neutral.400" | "colors.neutral.500" | "colors.neutral.600" | "colors.neutral.700" | "colors.neutral.800" | "colors.neutral.900" | "colors.neutral.1000" | "colors.blue.200" | "colors.blue.300" | "colors.blue.600" | "colors.blue.800" | "colors.blue.900" | "colors.blue.1000" | "colors.indigo.100" | "colors.indigo.200" | "colors.indigo.300" | "colors.indigo.400" | "colors.indigo.500" | "colors.indigo.600" | "colors.indigo.700" | "colors.indigo.800" | "colors.indigo.900" | "colors.indigo.1000" | "colors.violet.200" | "colors.violet.300" | "colors.violet.500" | "colors.violet.600" | "colors.violet.700" | "colors.violet.800" | "colors.violet.900" | "colors.violet.1000" | "colors.fuchsia.200" | "colors.fuchsia.300" | "colors.fuchsia.500" | "colors.fuchsia.600" | "colors.fuchsia.700" | "colors.fuchsia.800" | "colors.fuchsia.900" | "colors.fuchsia.1000" | "colors.red.100" | "colors.red.200" | "colors.red.300" | "colors.red.600" | "colors.red.800" | "colors.red.900" | "colors.red.1000" | "colors.orange.100" | "colors.orange.200" | "colors.orange.300" | "colors.orange.600" | "colors.orange.800" | "colors.orange.900" | "colors.orange.1000" | "colors.yellow.100" | "colors.yellow.200" | "colors.yellow.300" | "colors.yellow.400" | "colors.yellow.500" | "colors.yellow.600" | "colors.yellow.700" | "colors.yellow.800" | "colors.yellow.900" | "colors.yellow.1000" | "colors.lime.200" | "colors.lime.300" | "colors.lime.500" | "colors.lime.600" | "colors.lime.700" | "colors.lime.800" | "colors.lime.900" | "colors.lime.1000" | "colors.green.100" | "colors.green.200" | "colors.green.300" | "colors.green.600" | "colors.green.800" | "colors.green.900" | "colors.green.1000" | "colors.teal.200" | "colors.teal.300" | "colors.teal.500" | "colors.teal.600" | "colors.teal.700" | "colors.teal.800" | "colors.teal.900" | "colors.teal.1000" | "spacing.10" | "colors.background.surface" | "colors.background.stage" | "colors.background.overlay" | "colors.background.disabled" | "colors.background.inverse" | "colors.background.shadow" | "colors.background.neutral" | "colors.background.neutral.hovered" | "colors.background.neutral.pressed" | "colors.background.neutral.subtle" | "colors.background.neutral.subtle.hovered" | "colors.background.neutral.subtle.pressed" | "colors.background.neutral.bold" | "colors.background.neutral.bold.hovered" | "colors.background.neutral.bold.pressed" | "colors.background.brand" | "colors.background.brand.hovered" | "colors.background.brand.pressed" | "colors.background.brand.selected" | "colors.background.brand.bold" | "colors.background.brand.bold.hovered" | "colors.background.brand.bold.pressed" | "colors.background.brand.bold.selected" | "colors.background.tertiary" | "colors.background.tertiary.hovered" | "colors.background.tertiary.pressed" | "colors.background.danger" | "colors.background.danger.hovered" | "colors.background.danger.pressed" | "colors.background.danger.bold" | "colors.background.danger.bold.hovered" | "colors.background.danger.bold.pressed" | "colors.background.warning" | "colors.background.warning.hovered" | "colors.background.warning.pressed" | "colors.background.warning.bold" | "colors.background.warning.bold.hovered" | "colors.background.warning.bold.pressed" | "colors.background.success" | "colors.background.success.hovered" | "colors.background.success.pressed" | "colors.background.success.bold" | "colors.background.success.bold.hovered" | "colors.background.success.bold.pressed" | "colors.background.highlight" | "colors.background.highlight.hovered" | "colors.background.highlight.pressed" | "colors.background.highlight.bold" | "colors.background.highlight.bold.hovered" | "colors.background.highlight.bold.pressed" | "colors.background.airene" | "colors.nav.parent" | "colors.nav.stack" | "colors.nav.stack.hovered" | "colors.text.default" | "colors.text.default.static" | "colors.text.secondary" | "colors.text.secondary.pressed" | "colors.text.placeholder" | "colors.text.disabled" | "colors.text.inverse" | "colors.text.inverse.static" | "colors.text.selected" | "colors.text.danger" | "colors.text.danger.pressed" | "colors.text.warning" | "colors.text.warning.inverse" | "colors.text.success" | "colors.text.highlight" | "colors.text.information" | "colors.text.link" | "colors.text.link.pressed" | "colors.icon.default" | "colors.icon.disabled" | "colors.icon.inverse" | "colors.icon.inverse.static" | "colors.icon.selected" | "colors.icon.brand" | "colors.icon.danger" | "colors.icon.warning" | "colors.icon.warning.inverse" | "colors.icon.success" | "colors.icon.highlight" | "colors.icon.information" | "colors.icon.subtle" | "colors.icon.logo" | "colors.border.default" | "colors.border.bold" | "colors.border.disabled" | "colors.border.form" | "colors.border.focused" | "colors.border.inverse" | "colors.border.selected" | "colors.border.selected.hovered" | "colors.border.selected.disabled" | "colors.border.brand" | "colors.border.danger" | "colors.border.warning" | "colors.border.success" | "colors.border.highlight" | "colors.border.information" | "colors.chart.cat01" | "colors.chart.cat01.bold" | "colors.chart.cat02" | "colors.chart.cat02.bold" | "colors.chart.cat03" | "colors.chart.cat03.bold" | "colors.chart.cat04" | "colors.chart.cat04.bold" | "colors.chart.cat05" | "colors.chart.cat05.bold" | "colors.chart.cat06" | "colors.chart.cat06.bold" | "colors.chart.cat07" | "colors.chart.cat07.bold" | "colors.chart.cat08" | "colors.chart.cat08.bold" | "spacing.4xs" | "spacing.3xs" | "spacing.2xs" | "spacing.xs" | "spacing.sm" | "spacing.md" | "spacing.lg" | "spacing.xl" | "spacing.2xl" | "spacing.3xl" | "spacing.4xl" | "spacing.-0" | "spacing.-1" | "spacing.-2" | "spacing.-3" | "spacing.-4" | "spacing.-5" | "spacing.-6" | "spacing.-8" | "spacing.-12" | "spacing.-16" | "spacing.-20" | "spacing.-24" | "spacing.-32" | "spacing.-40" | "spacing.-64" | "spacing.-0.5" | "spacing.-1.5" | "spacing.-10" | "spacing.-4xs" | "spacing.-3xs" | "spacing.-2xs" | "spacing.-xs" | "spacing.-sm" | "spacing.-md" | "spacing.-lg" | "spacing.-xl" | "spacing.-2xl" | "spacing.-3xl" | "spacing.-4xl" | "colors.colorPalette" | "colors.colorPalette.50" | "colors.colorPalette.100" | "colors.colorPalette.200" | "colors.colorPalette.300" | "colors.colorPalette.400" | "colors.colorPalette.500" | "colors.colorPalette.600" | "colors.colorPalette.700" | "colors.colorPalette.800" | "colors.colorPalette.900" | "colors.colorPalette.25" | "colors.colorPalette.capital" | "colors.colorPalette.esign" | "colors.colorPalette.expense" | "colors.colorPalette.flex" | "colors.colorPalette.jurnal" | "colors.colorPalette.klikpajak" | "colors.colorPalette.mekari" | "colors.colorPalette.qontak" | "colors.colorPalette.talenta" | "colors.colorPalette.university"
|
|
2
|
+
export type Token = `borderWidths.${BorderWidthToken}` | `colors.${ColorToken}` | `durations.${DurationToken}` | `fonts.${FontToken}` | `fontSizes.${FontSizeToken}` | `fontWeights.${FontWeightToken}` | `lineHeights.${LineHeightToken}` | `letterSpacings.${LetterSpacingToken}` | `opacity.${OpacityToken}` | `radii.${RadiusToken}` | `shadows.${ShadowToken}` | `sizes.${SizeToken}` | `spacing.${SpacingToken}` | `zIndex.${ZIndexToken}` | `breakpoints.${BreakpointToken}`
|
|
3
3
|
|
|
4
4
|
export type ColorPalette = "debug" | "currentcolor" | "dark" | "background" | "overlay" | "white" | "vibrantPurple" | "lightPurple" | "whiteAlpha" | "blackAlpha" | "gray" | "blue" | "red" | "green" | "orange" | "sky" | "teal" | "violet" | "amber" | "rose" | "stone" | "lime" | "pink" | "apricot" | "aqua" | "leaf" | "fuchsia" | "ice" | "ash" | "brand"
|
|
5
5
|
|
|
@@ -51,4 +51,4 @@ export type Tokens = {
|
|
|
51
51
|
breakpoints: BreakpointToken
|
|
52
52
|
} & { [token: string]: never }
|
|
53
53
|
|
|
54
|
-
export type TokenCategory = "aspectRatios" | "zIndex" | "opacity" | "colors" | "fonts" | "fontSizes" | "fontWeights" | "lineHeights" | "letterSpacings" | "sizes" | "shadows" | "spacing" | "radii" | "borders" | "borderWidths" | "durations" | "easings" | "animations" | "blurs" | "gradients" | "breakpoints" | "assets"
|
|
54
|
+
export type TokenCategory = "aspectRatios" | "zIndex" | "opacity" | "colors" | "fonts" | "fontSizes" | "fontWeights" | "lineHeights" | "letterSpacings" | "sizes" | "cursor" | "shadows" | "spacing" | "radii" | "borders" | "borderWidths" | "durations" | "easings" | "animations" | "blurs" | "gradients" | "breakpoints" | "assets"
|