@shmidko61/lc-ui-kit 0.0.5 → 0.2.0
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/dist/box/box.d.ts +2 -2
- package/dist/box/box.types.d.ts +2 -2
- package/dist/box.cjs +1 -1
- package/dist/box.js +170 -139
- package/dist/grid.cjs +1 -1
- package/dist/grid.js +67 -63
- package/dist/picture/picture.d.ts +2 -2
- package/dist/picture/picture.helpers.d.ts +21 -3
- package/dist/picture/picture.types.d.ts +26 -3
- package/dist/picture.cjs +1 -1
- package/dist/picture.js +109 -35
- package/dist/styles.css +1 -1
- package/dist/types/interaction.types.d.ts +11 -0
- package/dist/types/layout.types.d.ts +30 -0
- package/dist/types/shared.types.d.ts +7 -0
- package/dist/types/typography.types.d.ts +22 -1
- package/dist/types/visual.types.d.ts +29 -0
- package/dist/typography/typography.helpers.d.ts +3 -3
- package/dist/typography.cjs +1 -1
- package/dist/typography.js +288 -235
- package/package.json +1 -1
package/dist/box/box.d.ts
CHANGED
|
@@ -8,5 +8,5 @@ type BoxComponentType = {
|
|
|
8
8
|
displayName?: string;
|
|
9
9
|
};
|
|
10
10
|
export declare const Box: BoxComponentType;
|
|
11
|
-
export type { BoxAs, BoxBackgroundValue, BoxBreakpointProps, BoxComponentProps, BoxProps } from './box.types';
|
|
12
|
-
export type { BorderRadiusItem, BorderRadiusKeys, BorderRadiusSides, BorderWidthItem, BorderWidthSides, PositionValue, UiKitAnyIndentationMargin, UiKitAnyIndentationPadding, UiKitArrayIndentation, UiKitAxisIndentationMargin, UiKitAxisIndentationPadding, UiKitDimensionProps, UiKitIndentations, UiKitIndentationsProps, UiKitMarginArrayIndentation, UiKitMarginIndentation, UiKitBackgroundProps, UiKitBorderColor, UiKitBorderProps, UiKitBorderRadius, UiKitBorderWidth, UiKitCursorProps, UiKitDisplayProps, UiKitListStyleProps, UiKitMixedXAxisIndentationMargin, UiKitMixedXAxisIndentationPadding, UiKitMixedYAxisIndentationMargin, UiKitMixedYAxisIndentationPadding, UiKitOutlineProps, UiKitPositionProps, } from '../types/index';
|
|
11
|
+
export type { BoxAs, BoxBackgroundValue, BoxBreakpointProps, BoxComponentProps, BoxProps, } from './box.types';
|
|
12
|
+
export type { BorderRadiusItem, BorderRadiusKeys, BorderRadiusSides, BorderWidthItem, BorderWidthSides, PositionValue, UiKitAnyIndentationMargin, UiKitAnyIndentationPadding, UiKitArrayIndentation, UiKitAxisIndentationMargin, UiKitAxisIndentationPadding, UiKitDimensionProps, UiKitIndentations, UiKitIndentationsProps, UiKitMarginArrayIndentation, UiKitMarginIndentation, UiKitBackgroundProps, UiKitAspectRatioProps, UiKitAspectRatioValue, UiKitBoxShadowProps, UiKitBoxShadowValue, UiKitBorderColor, UiKitBorderProps, UiKitBorderRadius, UiKitBorderWidth, UiKitCursorProps, UiKitColorProps, UiKitColorValue, UiKitDisplayProps, UiKitListStyleProps, UiKitMixedXAxisIndentationMargin, UiKitMixedXAxisIndentationPadding, UiKitMixedYAxisIndentationMargin, UiKitMixedYAxisIndentationPadding, UiKitOutlineProps, UiKitOpacityProps, UiKitOpacityValue, UiKitOverflowProps, UiKitOverflowValue, UiKitPointerEventsProps, UiKitPointerEventsValue, UiKitPositionProps, } from '../types/index';
|
package/dist/box/box.types.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
|
|
2
2
|
import { ResponsiveStyleBreakpoint } from '../shared/responsive-style/responsive-style.types';
|
|
3
|
-
import { UiKitBackgroundProps, UiKitBackgroundValue, UiKitBorderProps, UiKitCursorProps, UiKitDimensionProps, UiKitIndentationsProps, UiKitDisplayProps, UiKitListStyleProps, UiKitOutlineProps, UiKitPositionProps } from '../types/index';
|
|
3
|
+
import { UiKitBackgroundProps, UiKitBackgroundValue, UiKitAspectRatioProps, UiKitBoxShadowProps, UiKitBorderProps, UiKitColorProps, UiKitCursorProps, UiKitDimensionProps, UiKitIndentationsProps, UiKitDisplayProps, UiKitListStyleProps, UiKitOutlineProps, UiKitOpacityProps, UiKitOverflowProps, UiKitPointerEventsProps, UiKitPositionProps } from '../types/index';
|
|
4
4
|
/**
|
|
5
5
|
* Допустимые HTML-теги для Box.
|
|
6
6
|
*
|
|
@@ -20,7 +20,7 @@ export type BoxBackgroundValue = UiKitBackgroundValue;
|
|
|
20
20
|
/**
|
|
21
21
|
* Стилевые props, общие для base-состояния и responsive overrides.
|
|
22
22
|
*/
|
|
23
|
-
export type BoxStyleProps = UiKitDisplayProps & UiKitPositionProps & UiKitBackgroundProps & UiKitCursorProps & UiKitIndentationsProps & UiKitOutlineProps & UiKitListStyleProps & UiKitDimensionProps;
|
|
23
|
+
export type BoxStyleProps = UiKitDisplayProps & UiKitPositionProps & UiKitOverflowProps & UiKitAspectRatioProps & UiKitColorProps & UiKitOpacityProps & UiKitPointerEventsProps & UiKitBoxShadowProps & UiKitBackgroundProps & UiKitCursorProps & UiKitIndentationsProps & UiKitOutlineProps & UiKitListStyleProps & UiKitDimensionProps;
|
|
24
24
|
/**
|
|
25
25
|
* Собственные стилевые props Box поверх общих контрактов ui-kit.
|
|
26
26
|
*/
|
package/dist/box.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const to=require("react/jsx-runtime"),io=require("react"),X=require("./responsive-style.config-B2m9jVlX.cjs");function eo({background:t,backgroundColor:o,bg:i,bgSize:d,bgRepeat:u,bgPosition:a,border:v,boxShadow:f,color:l,cursor:b,opacity:c,overflow:s,overflowX:p,overflowY:x,pointerEvents:R,aspectRatio:g,p:O,m:A,outlineColor:k,outlineWidth:S,outlineOffset:z,outlineStyle:W,listStyle:h,display:C,position:r,width:T,maxWidth:L,minWidth:N,height:V,maxHeight:P,minHeight:w}){const e={};return i!==void 0?Bo(e,i):t!==void 0&&(e.background=I(t)),o!==void 0&&(e.backgroundColor=I(o)),d!==void 0&&(e.backgroundSize=ho(d)),u!==void 0&&(e.backgroundRepeat=$o(u)),a!==void 0&&(e.backgroundPosition=vo(a)),so(e,v),f!==void 0&&(e.boxShadow=m(f)),l!==void 0&&(e.color=m(l)),b!==void 0&&(e.cursor=b),c!==void 0&&(e.opacity=typeof c=="number"?c:m(c)),s!==void 0&&(e.overflowX=s,e.overflowY=s),p!==void 0&&(e.overflowX=p),x!==void 0&&(e.overflowY=x),R!==void 0&&(e.pointerEvents=R),g!==void 0&&(e.aspectRatio=typeof g=="number"?String(g):m(g)),ao(e,O),co(e,A),k!==void 0&&(e.outlineColor=m(k)),S!==void 0&&(e.outlineWidth=S),z!==void 0&&(e.outlineOffset=z),W!==void 0&&(e.outlineStyle=W),h?.position!==void 0&&(e.listStylePosition=h.position),h?.type!==void 0&&(e.listStyleType=h.type),C!==void 0&&(e.display=go(C)),r?.type!==void 0&&(e.position=r.type),r?.top!==void 0&&(e.top=j(r.top)),r?.left!==void 0&&(e.left=j(r.left)),r?.right!==void 0&&(e.right=j(r.right)),r?.bottom!==void 0&&(e.bottom=j(r.bottom)),r?.zIndex!==void 0&&(e.zIndex=r.zIndex),T!==void 0&&(e.width=$(T)),L!==void 0&&(e.maxWidth=$(L)),N!==void 0&&(e.minWidth=$(N)),V!==void 0&&(e.height=$(V)),P!==void 0&&(e.maxHeight=$(P)),w!==void 0&&(e.minHeight=$(w)),Object.keys(e).length>0?e:void 0}function no(t){const o=[],i={},d=t.groupParent===!0;q(t,o,i,"","",d);for(const u of X.responsiveBreakpoints){const a=t[u];a&&q(a,o,i,`${u}:`,`${u}-`,d)}return{className:o.join(" "),style:Object.keys(i).length>0?i:void 0}}function q(t,o,i,d="",u="",a=!1){const v=eo(t);for(const[f,l]of Object.entries(v??{})){if(l==null)continue;const b=String(l),c=ro(f,b);if(c){o.push(`${d}${c}`);continue}const s=`${u}${uo(f)}`,p=fo(f,s);p&&(i[`--${s}`]=b,o.push(`${d}${p}`))}if(t.bgGroup!==void 0){const f=`${u}group-background`;i[`--${f}`]=I(t.bgGroup),o.push(`${d}group-hover:[background:var(--${f})]`),a&&o.push(`${d}hover:[background:var(--${f})]`)}}function ro(t,o){if(t==="display")return o==="none"?"hidden":o;if(t==="position")return o==="inherit"?"[position:inherit]":o;if(t==="cursor")return`cursor-${o}`;if(t==="backgroundRepeat")return{"no-repeat":"bg-no-repeat",repeat:"bg-repeat",round:"bg-repeat-round",space:"bg-repeat-space","repeat-x":"bg-repeat-x","repeat-y":"bg-repeat-y"}[o];if(t==="backgroundSize")return{auto:"bg-auto",contain:"bg-contain",cover:"bg-cover"}[o];if(t==="backgroundPosition")return{bottom:"bg-bottom",center:"bg-center",left:"bg-left","left bottom":"bg-left-bottom","left top":"bg-left-top",right:"bg-right","right bottom":"bg-right-bottom","right top":"bg-right-top",top:"bg-top"}[o];if(t==="borderStyle")return o==="none"?"border-none":`border-${o}`;if(t==="outlineStyle")return o==="none"?"outline-none":`outline-${o}`;if(t==="listStylePosition")return`list-${o}`;if(t==="listStyleType")return`list-${o}`}function fo(t,o){const i=`var(--${o})`;return{background:`[background:${i}]`,backgroundColor:`bg-[${i}]`,backgroundPosition:`bg-[position:${i}]`,backgroundSize:`bg-[length:${i}]`,aspectRatio:`[aspect-ratio:${i}]`,borderBottomLeftRadius:`rounded-bl-[${i}]`,borderBottomRightRadius:`rounded-br-[${i}]`,borderBottomWidth:`border-b-[length:${i}]`,borderColor:`border-[color:${i}]`,borderLeftWidth:`border-l-[length:${i}]`,borderRadius:`rounded-[${i}]`,borderRightWidth:`border-r-[length:${i}]`,borderTopLeftRadius:`rounded-tl-[${i}]`,borderTopRightRadius:`rounded-tr-[${i}]`,borderTopWidth:`border-t-[length:${i}]`,borderWidth:`border-[length:${i}]`,boxShadow:`[box-shadow:${i}]`,bottom:`bottom-[${i}]`,color:`[color:${i}]`,height:`h-[${i}]`,left:`left-[${i}]`,margin:`m-[${i}]`,marginBottom:`mb-[${i}]`,marginLeft:`ml-[${i}]`,marginRight:`mr-[${i}]`,marginTop:`mt-[${i}]`,maxHeight:`max-h-[${i}]`,maxWidth:`max-w-[${i}]`,minHeight:`min-h-[${i}]`,minWidth:`min-w-[${i}]`,outlineColor:`outline-[color:${i}]`,outlineOffset:`outline-offset-[${i}]`,outlineWidth:`outline-[length:${i}]`,opacity:`[opacity:${i}]`,overflowX:`[overflow-x:${i}]`,overflowY:`[overflow-y:${i}]`,padding:`p-[${i}]`,paddingBottom:`pb-[${i}]`,paddingLeft:`pl-[${i}]`,paddingRight:`pr-[${i}]`,paddingTop:`pt-[${i}]`,pointerEvents:`[pointer-events:${i}]`,right:`right-[${i}]`,top:`top-[${i}]`,width:`w-[${i}]`,zIndex:`z-[${i}]`}[t]}function uo(t){return t.replace(/[A-Z]/g,o=>`-${o.toLowerCase()}`)}function ao(t,o){if(o!==void 0){if(Array.isArray(o)){t.padding=o.map(n).join(" ");return}if(typeof o!="object"){t.padding=n(o);return}"px"in o&&o.px!==void 0&&(t.paddingLeft=n(o.px),t.paddingRight=n(o.px)),"py"in o&&o.py!==void 0&&(t.paddingTop=n(o.py),t.paddingBottom=n(o.py)),"pt"in o&&o.pt!==void 0&&(t.paddingTop=n(o.pt)),"pb"in o&&o.pb!==void 0&&(t.paddingBottom=n(o.pb)),"pl"in o&&o.pl!==void 0&&(t.paddingLeft=n(o.pl)),"pr"in o&&o.pr!==void 0&&(t.paddingRight=n(o.pr))}}function co(t,o){if(o!==void 0){if(Array.isArray(o)){t.margin=o.map(n).join(" ");return}if(typeof o!="object"){t.margin=n(o);return}"mx"in o&&o.mx!==void 0&&(t.marginLeft=n(o.mx),t.marginRight=n(o.mx)),"my"in o&&o.my!==void 0&&(t.marginTop=n(o.my),t.marginBottom=n(o.my)),"mt"in o&&o.mt!==void 0&&(t.marginTop=n(o.mt)),"mb"in o&&o.mb!==void 0&&(t.marginBottom=n(o.mb)),"ml"in o&&o.ml!==void 0&&(t.marginLeft=n(o.ml)),"mr"in o&&o.mr!==void 0&&(t.marginRight=n(o.mr))}}function so(t,o){o&&(o.radius!==void 0&&lo(t,o.radius),o.color!==void 0&&(t.borderColor=m(o.color)),o.width!==void 0&&bo(t,o.width),o.style!==void 0&&(t.borderStyle=o.style))}function lo(t,o){if(po(o)){o.topLeft!==void 0&&(t.borderTopLeftRadius=B(o.topLeft)),o.topRight!==void 0&&(t.borderTopRightRadius=B(o.topRight)),o.bottomLeft!==void 0&&(t.borderBottomLeftRadius=B(o.bottomLeft)),o.bottomRight!==void 0&&(t.borderBottomRightRadius=B(o.bottomRight));return}t.borderRadius=B(o)}function bo(t,o){if(mo(o)){o.top!==void 0&&(t.borderTopWidth=y(o.top)),o.bottom!==void 0&&(t.borderBottomWidth=y(o.bottom)),o.left!==void 0&&(t.borderLeftWidth=y(o.left)),o.right!==void 0&&(t.borderRightWidth=y(o.right));return}t.borderWidth=y(o)}function po(t){return typeof t=="object"}function mo(t){return typeof t=="object"}function B(t){return t.startsWith("--")?`var(${t})`:t}function y(t){return t.startsWith("--")?`var(${t})`:t}function go(t){return t==="hidden"?"none":t}function j(t){return typeof t=="number"?`${t}px`:t}function n(t){return typeof t=="number"?`${t}px`:t}function $(t){return typeof t=="number"?`${t}px`:t}function ho(t){return typeof t=="number"?`${t}px`:t}function $o(t){return{"no-repeat":"no-repeat",repeat:"repeat","repeat-round":"round","repeat-space":"space","repeat-x":"repeat-x","repeat-y":"repeat-y"}[t]}function vo(t){return t.replace("-"," ")}function I(t){return m(t)}function Bo(t,o){const i=I(o);if(yo(o)){t.background=i;return}t.backgroundColor=i}function yo(t){const o=t.trim().toLowerCase();return o.includes("url(")||o.includes("gradient(")||o.includes("image-set(")||o.includes("cross-fade(")||o.includes("element(")||o.includes("paint(")}function m(t){return t.startsWith("--")?`var(${t})`:t}function xo(t,o){const{as:i,children:d,className:u,background:a,backgroundColor:v,bg:f,bgSize:l,bgRepeat:b,bgGroup:c,groupParent:s,bgPosition:p,border:x,boxShadow:R,color:g,cursor:O,opacity:A,overflow:k,overflowX:S,overflowY:z,pointerEvents:W,aspectRatio:h,p:C,m:r,outlineColor:T,outlineWidth:L,outlineOffset:N,outlineStyle:V,listStyle:P,display:w,position:e,width:Y,maxWidth:D,minWidth:E,height:M,maxHeight:K,minHeight:Z,md:_,lg:F,xl:J,style:H,...Q}=t,U=i??"div",G=no({background:a,backgroundColor:v,bg:f,bgSize:l,bgRepeat:b,bgGroup:c,groupParent:s,bgPosition:p,border:x,boxShadow:R,color:g,cursor:O,opacity:A,overflow:k,overflowX:S,overflowY:z,pointerEvents:W,aspectRatio:h,p:C,m:r,outlineColor:T,outlineWidth:L,outlineOffset:N,outlineStyle:V,listStyle:P,display:w,position:e,width:Y,maxWidth:D,minWidth:E,height:M,maxHeight:K,minHeight:Z,md:_,lg:F,xl:J}),oo=G.style||H?{...G.style,...H}:void 0;return to.jsx(U,{className:X.cn(G.className,s&&"group",u),ref:o,style:oo,...Q,children:d})}const Ro=io.forwardRef(xo);exports.Box=Ro;
|
package/dist/box.js
CHANGED
|
@@ -1,40 +1,48 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { a as
|
|
4
|
-
function
|
|
1
|
+
import { jsx as oo } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as to } from "react";
|
|
3
|
+
import { a as io, c as eo } from "./responsive-style.config-DFuATrIM.js";
|
|
4
|
+
function ro({
|
|
5
5
|
background: t,
|
|
6
6
|
backgroundColor: o,
|
|
7
7
|
bg: i,
|
|
8
8
|
bgSize: d,
|
|
9
9
|
bgRepeat: a,
|
|
10
10
|
bgPosition: u,
|
|
11
|
-
border:
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
11
|
+
border: v,
|
|
12
|
+
boxShadow: f,
|
|
13
|
+
color: l,
|
|
14
|
+
cursor: b,
|
|
15
|
+
opacity: c,
|
|
16
|
+
overflow: s,
|
|
17
|
+
overflowX: m,
|
|
18
|
+
overflowY: x,
|
|
19
|
+
pointerEvents: R,
|
|
20
|
+
aspectRatio: g,
|
|
21
|
+
p: A,
|
|
22
|
+
m: O,
|
|
23
|
+
outlineColor: k,
|
|
24
|
+
outlineWidth: S,
|
|
25
|
+
outlineOffset: z,
|
|
26
|
+
outlineStyle: W,
|
|
27
|
+
listStyle: h,
|
|
28
|
+
display: C,
|
|
29
|
+
position: n,
|
|
30
|
+
width: T,
|
|
31
|
+
maxWidth: L,
|
|
32
|
+
minWidth: N,
|
|
33
|
+
height: V,
|
|
34
|
+
maxHeight: w,
|
|
35
|
+
minHeight: P
|
|
28
36
|
}) {
|
|
29
37
|
const e = {};
|
|
30
|
-
return i !== void 0 ?
|
|
38
|
+
return i !== void 0 ? yo(e, i) : t !== void 0 && (e.background = j(t)), o !== void 0 && (e.backgroundColor = j(o)), d !== void 0 && (e.backgroundSize = $o(d)), a !== void 0 && (e.backgroundRepeat = vo(a)), u !== void 0 && (e.backgroundPosition = Bo(u)), lo(e, v), f !== void 0 && (e.boxShadow = p(f)), l !== void 0 && (e.color = p(l)), b !== void 0 && (e.cursor = b), c !== void 0 && (e.opacity = typeof c == "number" ? c : p(c)), s !== void 0 && (e.overflowX = s, e.overflowY = s), m !== void 0 && (e.overflowX = m), x !== void 0 && (e.overflowY = x), R !== void 0 && (e.pointerEvents = R), g !== void 0 && (e.aspectRatio = typeof g == "number" ? String(g) : p(g)), co(e, A), so(e, O), k !== void 0 && (e.outlineColor = p(k)), S !== void 0 && (e.outlineWidth = S), z !== void 0 && (e.outlineOffset = z), W !== void 0 && (e.outlineStyle = W), h?.position !== void 0 && (e.listStylePosition = h.position), h?.type !== void 0 && (e.listStyleType = h.type), C !== void 0 && (e.display = ho(C)), n?.type !== void 0 && (e.position = n.type), n?.top !== void 0 && (e.top = I(n.top)), n?.left !== void 0 && (e.left = I(n.left)), n?.right !== void 0 && (e.right = I(n.right)), n?.bottom !== void 0 && (e.bottom = I(n.bottom)), n?.zIndex !== void 0 && (e.zIndex = n.zIndex), T !== void 0 && (e.width = $(T)), L !== void 0 && (e.maxWidth = $(L)), N !== void 0 && (e.minWidth = $(N)), V !== void 0 && (e.height = $(V)), w !== void 0 && (e.maxHeight = $(w)), P !== void 0 && (e.minHeight = $(P)), Object.keys(e).length > 0 ? e : void 0;
|
|
31
39
|
}
|
|
32
|
-
function
|
|
40
|
+
function no(t) {
|
|
33
41
|
const o = [], i = {}, d = t.groupParent === !0;
|
|
34
|
-
|
|
35
|
-
for (const a of
|
|
42
|
+
X(t, o, i, "", "", d);
|
|
43
|
+
for (const a of io) {
|
|
36
44
|
const u = t[a];
|
|
37
|
-
u &&
|
|
45
|
+
u && X(
|
|
38
46
|
u,
|
|
39
47
|
o,
|
|
40
48
|
i,
|
|
@@ -48,25 +56,25 @@ function X(t) {
|
|
|
48
56
|
style: Object.keys(i).length > 0 ? i : void 0
|
|
49
57
|
};
|
|
50
58
|
}
|
|
51
|
-
function
|
|
52
|
-
const
|
|
53
|
-
for (const [f,
|
|
54
|
-
if (
|
|
59
|
+
function X(t, o, i, d = "", a = "", u = !1) {
|
|
60
|
+
const v = ro(t);
|
|
61
|
+
for (const [f, l] of Object.entries(v ?? {})) {
|
|
62
|
+
if (l == null)
|
|
55
63
|
continue;
|
|
56
|
-
const
|
|
57
|
-
if (
|
|
58
|
-
o.push(`${d}${
|
|
64
|
+
const b = String(l), c = fo(f, b);
|
|
65
|
+
if (c) {
|
|
66
|
+
o.push(`${d}${c}`);
|
|
59
67
|
continue;
|
|
60
68
|
}
|
|
61
|
-
const
|
|
62
|
-
|
|
69
|
+
const s = `${a}${uo(f)}`, m = ao(f, s);
|
|
70
|
+
m && (i[`--${s}`] = b, o.push(`${d}${m}`));
|
|
63
71
|
}
|
|
64
72
|
if (t.bgGroup !== void 0) {
|
|
65
73
|
const f = `${a}group-background`;
|
|
66
|
-
i[`--${f}`] =
|
|
74
|
+
i[`--${f}`] = j(t.bgGroup), o.push(`${d}group-hover:[background:var(--${f})]`), u && o.push(`${d}hover:[background:var(--${f})]`);
|
|
67
75
|
}
|
|
68
76
|
}
|
|
69
|
-
function
|
|
77
|
+
function fo(t, o) {
|
|
70
78
|
if (t === "display")
|
|
71
79
|
return o === "none" ? "hidden" : o;
|
|
72
80
|
if (t === "position")
|
|
@@ -109,13 +117,14 @@ function Y(t, o) {
|
|
|
109
117
|
if (t === "listStyleType")
|
|
110
118
|
return `list-${o}`;
|
|
111
119
|
}
|
|
112
|
-
function
|
|
120
|
+
function ao(t, o) {
|
|
113
121
|
const i = `var(--${o})`;
|
|
114
122
|
return {
|
|
115
123
|
background: `[background:${i}]`,
|
|
116
124
|
backgroundColor: `bg-[${i}]`,
|
|
117
125
|
backgroundPosition: `bg-[position:${i}]`,
|
|
118
126
|
backgroundSize: `bg-[length:${i}]`,
|
|
127
|
+
aspectRatio: `[aspect-ratio:${i}]`,
|
|
119
128
|
borderBottomLeftRadius: `rounded-bl-[${i}]`,
|
|
120
129
|
borderBottomRightRadius: `rounded-br-[${i}]`,
|
|
121
130
|
borderBottomWidth: `border-b-[length:${i}]`,
|
|
@@ -127,7 +136,9 @@ function _(t, o) {
|
|
|
127
136
|
borderTopRightRadius: `rounded-tr-[${i}]`,
|
|
128
137
|
borderTopWidth: `border-t-[length:${i}]`,
|
|
129
138
|
borderWidth: `border-[length:${i}]`,
|
|
139
|
+
boxShadow: `[box-shadow:${i}]`,
|
|
130
140
|
bottom: `bottom-[${i}]`,
|
|
141
|
+
color: `[color:${i}]`,
|
|
131
142
|
height: `h-[${i}]`,
|
|
132
143
|
left: `left-[${i}]`,
|
|
133
144
|
margin: `m-[${i}]`,
|
|
@@ -142,91 +153,95 @@ function _(t, o) {
|
|
|
142
153
|
outlineColor: `outline-[color:${i}]`,
|
|
143
154
|
outlineOffset: `outline-offset-[${i}]`,
|
|
144
155
|
outlineWidth: `outline-[length:${i}]`,
|
|
156
|
+
opacity: `[opacity:${i}]`,
|
|
157
|
+
overflowX: `[overflow-x:${i}]`,
|
|
158
|
+
overflowY: `[overflow-y:${i}]`,
|
|
145
159
|
padding: `p-[${i}]`,
|
|
146
160
|
paddingBottom: `pb-[${i}]`,
|
|
147
161
|
paddingLeft: `pl-[${i}]`,
|
|
148
162
|
paddingRight: `pr-[${i}]`,
|
|
149
163
|
paddingTop: `pt-[${i}]`,
|
|
164
|
+
pointerEvents: `[pointer-events:${i}]`,
|
|
150
165
|
right: `right-[${i}]`,
|
|
151
166
|
top: `top-[${i}]`,
|
|
152
167
|
width: `w-[${i}]`,
|
|
153
168
|
zIndex: `z-[${i}]`
|
|
154
169
|
}[t];
|
|
155
170
|
}
|
|
156
|
-
function
|
|
171
|
+
function uo(t) {
|
|
157
172
|
return t.replace(/[A-Z]/g, (o) => `-${o.toLowerCase()}`);
|
|
158
173
|
}
|
|
159
|
-
function
|
|
174
|
+
function co(t, o) {
|
|
160
175
|
if (o !== void 0) {
|
|
161
176
|
if (Array.isArray(o)) {
|
|
162
|
-
t.padding = o.map(
|
|
177
|
+
t.padding = o.map(r).join(" ");
|
|
163
178
|
return;
|
|
164
179
|
}
|
|
165
180
|
if (typeof o != "object") {
|
|
166
|
-
t.padding =
|
|
181
|
+
t.padding = r(o);
|
|
167
182
|
return;
|
|
168
183
|
}
|
|
169
|
-
"px" in o && o.px !== void 0 && (t.paddingLeft =
|
|
184
|
+
"px" in o && o.px !== void 0 && (t.paddingLeft = r(o.px), t.paddingRight = r(o.px)), "py" in o && o.py !== void 0 && (t.paddingTop = r(o.py), t.paddingBottom = r(o.py)), "pt" in o && o.pt !== void 0 && (t.paddingTop = r(o.pt)), "pb" in o && o.pb !== void 0 && (t.paddingBottom = r(o.pb)), "pl" in o && o.pl !== void 0 && (t.paddingLeft = r(o.pl)), "pr" in o && o.pr !== void 0 && (t.paddingRight = r(o.pr));
|
|
170
185
|
}
|
|
171
186
|
}
|
|
172
|
-
function
|
|
187
|
+
function so(t, o) {
|
|
173
188
|
if (o !== void 0) {
|
|
174
189
|
if (Array.isArray(o)) {
|
|
175
|
-
t.margin = o.map(
|
|
190
|
+
t.margin = o.map(r).join(" ");
|
|
176
191
|
return;
|
|
177
192
|
}
|
|
178
193
|
if (typeof o != "object") {
|
|
179
|
-
t.margin =
|
|
194
|
+
t.margin = r(o);
|
|
180
195
|
return;
|
|
181
196
|
}
|
|
182
|
-
"mx" in o && o.mx !== void 0 && (t.marginLeft =
|
|
197
|
+
"mx" in o && o.mx !== void 0 && (t.marginLeft = r(o.mx), t.marginRight = r(o.mx)), "my" in o && o.my !== void 0 && (t.marginTop = r(o.my), t.marginBottom = r(o.my)), "mt" in o && o.mt !== void 0 && (t.marginTop = r(o.mt)), "mb" in o && o.mb !== void 0 && (t.marginBottom = r(o.mb)), "ml" in o && o.ml !== void 0 && (t.marginLeft = r(o.ml)), "mr" in o && o.mr !== void 0 && (t.marginRight = r(o.mr));
|
|
183
198
|
}
|
|
184
199
|
}
|
|
185
|
-
function
|
|
186
|
-
o && (o.radius !== void 0 &&
|
|
200
|
+
function lo(t, o) {
|
|
201
|
+
o && (o.radius !== void 0 && bo(t, o.radius), o.color !== void 0 && (t.borderColor = p(o.color)), o.width !== void 0 && mo(t, o.width), o.style !== void 0 && (t.borderStyle = o.style));
|
|
187
202
|
}
|
|
188
|
-
function
|
|
189
|
-
if (
|
|
190
|
-
o.topLeft !== void 0 && (t.borderTopLeftRadius =
|
|
203
|
+
function bo(t, o) {
|
|
204
|
+
if (po(o)) {
|
|
205
|
+
o.topLeft !== void 0 && (t.borderTopLeftRadius = B(o.topLeft)), o.topRight !== void 0 && (t.borderTopRightRadius = B(o.topRight)), o.bottomLeft !== void 0 && (t.borderBottomLeftRadius = B(o.bottomLeft)), o.bottomRight !== void 0 && (t.borderBottomRightRadius = B(o.bottomRight));
|
|
191
206
|
return;
|
|
192
207
|
}
|
|
193
|
-
t.borderRadius =
|
|
208
|
+
t.borderRadius = B(o);
|
|
194
209
|
}
|
|
195
|
-
function
|
|
196
|
-
if (
|
|
197
|
-
o.top !== void 0 && (t.borderTopWidth =
|
|
210
|
+
function mo(t, o) {
|
|
211
|
+
if (go(o)) {
|
|
212
|
+
o.top !== void 0 && (t.borderTopWidth = y(o.top)), o.bottom !== void 0 && (t.borderBottomWidth = y(o.bottom)), o.left !== void 0 && (t.borderLeftWidth = y(o.left)), o.right !== void 0 && (t.borderRightWidth = y(o.right));
|
|
198
213
|
return;
|
|
199
214
|
}
|
|
200
|
-
t.borderWidth =
|
|
215
|
+
t.borderWidth = y(o);
|
|
201
216
|
}
|
|
202
|
-
function
|
|
217
|
+
function po(t) {
|
|
203
218
|
return typeof t == "object";
|
|
204
219
|
}
|
|
205
|
-
function
|
|
220
|
+
function go(t) {
|
|
206
221
|
return typeof t == "object";
|
|
207
222
|
}
|
|
208
|
-
function
|
|
223
|
+
function B(t) {
|
|
209
224
|
return t.startsWith("--") ? `var(${t})` : t;
|
|
210
225
|
}
|
|
211
|
-
function
|
|
226
|
+
function y(t) {
|
|
212
227
|
return t.startsWith("--") ? `var(${t})` : t;
|
|
213
228
|
}
|
|
214
|
-
function
|
|
229
|
+
function ho(t) {
|
|
215
230
|
return t === "hidden" ? "none" : t;
|
|
216
231
|
}
|
|
217
|
-
function
|
|
232
|
+
function I(t) {
|
|
218
233
|
return typeof t == "number" ? `${t}px` : t;
|
|
219
234
|
}
|
|
220
|
-
function
|
|
235
|
+
function r(t) {
|
|
221
236
|
return typeof t == "number" ? `${t}px` : t;
|
|
222
237
|
}
|
|
223
|
-
function
|
|
238
|
+
function $(t) {
|
|
224
239
|
return typeof t == "number" ? `${t}px` : t;
|
|
225
240
|
}
|
|
226
|
-
function
|
|
241
|
+
function $o(t) {
|
|
227
242
|
return typeof t == "number" ? `${t}px` : t;
|
|
228
243
|
}
|
|
229
|
-
function
|
|
244
|
+
function vo(t) {
|
|
230
245
|
return {
|
|
231
246
|
"no-repeat": "no-repeat",
|
|
232
247
|
repeat: "repeat",
|
|
@@ -236,107 +251,123 @@ function so(t) {
|
|
|
236
251
|
"repeat-y": "repeat-y"
|
|
237
252
|
}[t];
|
|
238
253
|
}
|
|
239
|
-
function
|
|
254
|
+
function Bo(t) {
|
|
240
255
|
return t.replace("-", " ");
|
|
241
256
|
}
|
|
242
|
-
function
|
|
243
|
-
return
|
|
257
|
+
function j(t) {
|
|
258
|
+
return p(t);
|
|
244
259
|
}
|
|
245
|
-
function
|
|
246
|
-
const i =
|
|
247
|
-
if (
|
|
260
|
+
function yo(t, o) {
|
|
261
|
+
const i = j(o);
|
|
262
|
+
if (xo(o)) {
|
|
248
263
|
t.background = i;
|
|
249
264
|
return;
|
|
250
265
|
}
|
|
251
266
|
t.backgroundColor = i;
|
|
252
267
|
}
|
|
253
|
-
function
|
|
268
|
+
function xo(t) {
|
|
254
269
|
const o = t.trim().toLowerCase();
|
|
255
270
|
return o.includes("url(") || o.includes("gradient(") || o.includes("image-set(") || o.includes("cross-fade(") || o.includes("element(") || o.includes("paint(");
|
|
256
271
|
}
|
|
257
|
-
function
|
|
272
|
+
function p(t) {
|
|
258
273
|
return t.startsWith("--") ? `var(${t})` : t;
|
|
259
274
|
}
|
|
260
|
-
function
|
|
275
|
+
function Ro(t, o) {
|
|
261
276
|
const {
|
|
262
277
|
as: i,
|
|
263
278
|
children: d,
|
|
264
279
|
className: a,
|
|
265
280
|
background: u,
|
|
266
|
-
backgroundColor:
|
|
281
|
+
backgroundColor: v,
|
|
267
282
|
bg: f,
|
|
268
|
-
bgSize:
|
|
269
|
-
bgRepeat:
|
|
270
|
-
bgGroup:
|
|
271
|
-
groupParent:
|
|
272
|
-
bgPosition:
|
|
273
|
-
border:
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
+
bgSize: l,
|
|
284
|
+
bgRepeat: b,
|
|
285
|
+
bgGroup: c,
|
|
286
|
+
groupParent: s,
|
|
287
|
+
bgPosition: m,
|
|
288
|
+
border: x,
|
|
289
|
+
boxShadow: R,
|
|
290
|
+
color: g,
|
|
291
|
+
cursor: A,
|
|
292
|
+
opacity: O,
|
|
293
|
+
overflow: k,
|
|
294
|
+
overflowX: S,
|
|
295
|
+
overflowY: z,
|
|
296
|
+
pointerEvents: W,
|
|
297
|
+
aspectRatio: h,
|
|
298
|
+
p: C,
|
|
299
|
+
m: n,
|
|
300
|
+
outlineColor: T,
|
|
301
|
+
outlineWidth: L,
|
|
302
|
+
outlineOffset: N,
|
|
303
|
+
outlineStyle: V,
|
|
304
|
+
listStyle: w,
|
|
305
|
+
display: P,
|
|
283
306
|
position: e,
|
|
284
|
-
width:
|
|
285
|
-
maxWidth:
|
|
286
|
-
minWidth:
|
|
287
|
-
height:
|
|
288
|
-
maxHeight:
|
|
289
|
-
minHeight:
|
|
290
|
-
md:
|
|
291
|
-
lg:
|
|
292
|
-
xl:
|
|
293
|
-
style:
|
|
294
|
-
...
|
|
295
|
-
} = t,
|
|
307
|
+
width: Y,
|
|
308
|
+
maxWidth: D,
|
|
309
|
+
minWidth: E,
|
|
310
|
+
height: K,
|
|
311
|
+
maxHeight: M,
|
|
312
|
+
minHeight: Z,
|
|
313
|
+
md: q,
|
|
314
|
+
lg: F,
|
|
315
|
+
xl: J,
|
|
316
|
+
style: H,
|
|
317
|
+
...Q
|
|
318
|
+
} = t, U = i ?? "div", G = no({
|
|
296
319
|
background: u,
|
|
297
|
-
backgroundColor:
|
|
320
|
+
backgroundColor: v,
|
|
298
321
|
bg: f,
|
|
299
|
-
bgSize:
|
|
300
|
-
bgRepeat:
|
|
301
|
-
bgGroup:
|
|
302
|
-
groupParent:
|
|
303
|
-
bgPosition:
|
|
304
|
-
border:
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
322
|
+
bgSize: l,
|
|
323
|
+
bgRepeat: b,
|
|
324
|
+
bgGroup: c,
|
|
325
|
+
groupParent: s,
|
|
326
|
+
bgPosition: m,
|
|
327
|
+
border: x,
|
|
328
|
+
boxShadow: R,
|
|
329
|
+
color: g,
|
|
330
|
+
cursor: A,
|
|
331
|
+
opacity: O,
|
|
332
|
+
overflow: k,
|
|
333
|
+
overflowX: S,
|
|
334
|
+
overflowY: z,
|
|
335
|
+
pointerEvents: W,
|
|
336
|
+
aspectRatio: h,
|
|
337
|
+
p: C,
|
|
338
|
+
m: n,
|
|
339
|
+
outlineColor: T,
|
|
340
|
+
outlineWidth: L,
|
|
341
|
+
outlineOffset: N,
|
|
342
|
+
outlineStyle: V,
|
|
343
|
+
listStyle: w,
|
|
344
|
+
display: P,
|
|
314
345
|
position: e,
|
|
315
|
-
width:
|
|
316
|
-
maxWidth:
|
|
317
|
-
minWidth:
|
|
318
|
-
height:
|
|
319
|
-
maxHeight:
|
|
320
|
-
minHeight:
|
|
321
|
-
md:
|
|
322
|
-
lg:
|
|
323
|
-
xl:
|
|
324
|
-
}),
|
|
325
|
-
...
|
|
326
|
-
...
|
|
346
|
+
width: Y,
|
|
347
|
+
maxWidth: D,
|
|
348
|
+
minWidth: E,
|
|
349
|
+
height: K,
|
|
350
|
+
maxHeight: M,
|
|
351
|
+
minHeight: Z,
|
|
352
|
+
md: q,
|
|
353
|
+
lg: F,
|
|
354
|
+
xl: J
|
|
355
|
+
}), _ = G.style || H ? {
|
|
356
|
+
...G.style,
|
|
357
|
+
...H
|
|
327
358
|
} : void 0;
|
|
328
|
-
return /* @__PURE__ */
|
|
329
|
-
|
|
359
|
+
return /* @__PURE__ */ oo(
|
|
360
|
+
U,
|
|
330
361
|
{
|
|
331
|
-
className:
|
|
362
|
+
className: eo(G.className, s && "group", a),
|
|
332
363
|
ref: o,
|
|
333
|
-
style:
|
|
334
|
-
...
|
|
364
|
+
style: _,
|
|
365
|
+
...Q,
|
|
335
366
|
children: d
|
|
336
367
|
}
|
|
337
368
|
);
|
|
338
369
|
}
|
|
339
|
-
const
|
|
370
|
+
const Co = to(Ro);
|
|
340
371
|
export {
|
|
341
|
-
|
|
372
|
+
Co as Box
|
|
342
373
|
};
|
package/dist/grid.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),w=require("./box.cjs"),g=require("./responsive-style.config-B2m9jVlX.cjs");function j(t){const i=[],n={},l={md:t.md,lg:t.lg,xl:t.xl};r(t,i,n);for(const e of g.responsiveBreakpoints){const o=l[e];o&&r(o,i,n,`${e}:`,`${e}-`)}return{className:i.join(" "),style:Object.keys(n).length>0?n:void 0}}function r({cols:t,gap:i},n,l,e="",o=""){if(t!==void 0){const c=`${o}grid-template-columns`;l[`--${c}`]=`repeat(${t}, minmax(0, 1fr))`,n.push(`${e}${u("grid-cols",`var(--${c})`)}`)}if(i!==void 0){const c=`${o}grid-gap`;l[`--${c}`]=G(i),n.push(`${e}${u("gap",`var(--${c})`)}`)}}function u(t,i){return[t,"-[",i,"]"].join("")}function G(t){return typeof t=="number"?`${t}px`:t}function N({children:t,className:i,cols:n=1,gap:l=0,md:e,lg:o,xl:c,style:a,...h}){const d=j({cols:n,gap:l,md:e,lg:o,xl:c}),v=s(e),x=s(o),y=s(c),$=d.style||a?{...d.style,...a}:void 0;return m.jsx(w.Box,{...h,display:"grid",className:g.cn(d.className,i),md:v,lg:x,xl:y,style:$,children:t})}function f({children:t,className:i,...n}){return m.jsx("div",{className:i,...n,children:t})}const S=Object.assign(N,{Item:f});function s(t){if(t)return{aspectRatio:t.aspectRatio,background:t.background,backgroundColor:t.backgroundColor,boxShadow:t.boxShadow,color:t.color,height:t.height,maxHeight:t.maxHeight,maxWidth:t.maxWidth,minHeight:t.minHeight,minWidth:t.minWidth,opacity:t.opacity,overflow:t.overflow,overflowX:t.overflowX,overflowY:t.overflowY,pointerEvents:t.pointerEvents,width:t.width}}exports.Grid=S;exports.GridItem=f;
|