@arthurzakharov/ui-kit 1.0.113 → 1.0.114

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.
Files changed (5) hide show
  1. package/dist/assets/flex-BShjn6Be.css +1 -0
  2. package/dist/components/flex/flex.component.d.ts +3 -0
  3. package/dist/components/flex/flex.component.js +49 -38
  4. package/package.json +1 -1
  5. package/dist/assets/flex-Bb3RqRpb.css +0 -1
package/dist/assets/flex-BShjn6Be.css ADDED
@@ -0,0 +1 @@
1
+ ._Flex_13gky_1{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:initial}._FlexGapXxs_13gky_8{gap:var(--rm-ui-padding-xxs)}._FlexGapXs_13gky_12{gap:var(--rm-ui-padding-xs)}._FlexGapSm_13gky_16{gap:var(--rm-ui-padding-sm)}._FlexGapMd_13gky_20{gap:var(--rm-ui-padding-md)}._FlexGapLg_13gky_24{gap:var(--rm-ui-padding-lg)}._FlexGapXl_13gky_28{gap:var(--rm-ui-padding-xl)}._FlexGapXxl_13gky_32{gap:var(--rm-ui-padding-xxl)}._FlexGapXxxl_13gky_36{gap:var(--rm-ui-padding-xxxl)}._FlexMarginTopSm_13gky_40{margin-top:var(--rm-ui-padding-sm)}._FlexMarginTopMd_13gky_44{margin-top:var(--rm-ui-padding-md)}._FlexMarginBottomSm_13gky_48{margin-bottom:var(--rm-ui-padding-sm)}._FlexMarginBottomMd_13gky_52{margin-bottom:var(--rm-ui-padding-md)}._FlexChildGrowContent_13gky_56{flex-grow:initial}._FlexChildGrowEqual_13gky_60,._FlexChildGrow1_13gky_64{flex-grow:1}._FlexChildGrow2_13gky_68{flex-grow:2}._FlexChildGrow3_13gky_72{flex-grow:3}._FlexChildGrow4_13gky_76{flex-grow:4}._FlexDirectionRow_13gky_80{flex-direction:row;align-items:flex-start}._FlexDirectionColumn_13gky_85{flex-direction:column;align-items:stretch}@media screen and (min-width:768px){._FlexDirectionRow_13gky_80._FlexChangeDirectionAfterTabletSize_13gky_91{flex-direction:column}._FlexDirectionColumn_13gky_85._FlexChangeDirectionAfterTabletSize_13gky_91{flex-direction:row}}@media screen and (min-width:1024px){._FlexDirectionRow_13gky_80._FlexChangeDirectionAfterLaptopSize_13gky_101{flex-direction:column}._FlexDirectionColumn_13gky_85._FlexChangeDirectionAfterLaptopSize_13gky_101{flex-direction:row}}@media screen and (min-width:1200px){._FlexDirectionRow_13gky_80._FlexChangeDirectionAfterPcSize_13gky_111{flex-direction:column}._FlexDirectionColumn_13gky_85._FlexChangeDirectionAfterPcSize_13gky_111{flex-direction:row}}
package/dist/components/flex/flex.component.d.ts CHANGED
@@ -3,6 +3,9 @@ export interface FlexProps extends PropsWithChildren {
3
3
  gap?: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
4
4
  grow?: 'content' | 'equal' | (1 | 2 | 3 | 4)[];
5
5
  direction?: 'column' | 'row';
6
+ marginTop?: 'sm' | 'md';
7
+ marginBottom?: 'sm' | 'md';
8
+ className?: string;
6
9
  changeDirectionAfterTabletSize?: boolean;
7
10
  changeDirectionAfterLaptopSize?: boolean;
8
11
  changeDirectionAfterPcSize?: boolean;
package/dist/components/flex/flex.component.js CHANGED
@@ -1,44 +1,51 @@
1
1
  import { jsx as G } from "react/jsx-runtime";
2
- import { Children as s, cloneElement as p, isValidElement as d } from "react";
3
- import t from "clsx";
4
- import '../../assets/flex-Bb3RqRpb.css';const C = "_Flex_o2d5u_1", h = "_FlexGapXxs_o2d5u_8", u = "_FlexGapXs_o2d5u_12", w = "_FlexGapSm_o2d5u_16", m = "_FlexGapMd_o2d5u_20", A = "_FlexGapLg_o2d5u_24", D = "_FlexGapXl_o2d5u_28", g = "_FlexGapXxl_o2d5u_32", f = "_FlexGapXxxl_o2d5u_36", X = "_FlexChildGrowContent_o2d5u_40", S = "_FlexChildGrowEqual_o2d5u_44", z = "_FlexChildGrow1_o2d5u_48", L = "_FlexChildGrow2_o2d5u_52", y = "_FlexChildGrow3_o2d5u_56", E = "_FlexChildGrow4_o2d5u_60", b = "_FlexDirectionRow_o2d5u_64", q = "_FlexDirectionColumn_o2d5u_69", P = "_FlexChangeDirectionAfterTabletSize_o2d5u_75", T = "_FlexChangeDirectionAfterLaptopSize_o2d5u_85", M = "_FlexChangeDirectionAfterPcSize_o2d5u_95", e = {
5
- Flex: C,
6
- FlexGapXxs: h,
7
- FlexGapXs: u,
8
- FlexGapSm: w,
9
- FlexGapMd: m,
10
- FlexGapLg: A,
11
- FlexGapXl: D,
12
- FlexGapXxl: g,
2
+ import { Children as m, cloneElement as C, isValidElement as d } from "react";
3
+ import a from "clsx";
4
+ import '../../assets/flex-BShjn6Be.css';const h = "_Flex_13gky_1", y = "_FlexGapXxs_13gky_8", w = "_FlexGapXs_13gky_12", M = "_FlexGapSm_13gky_16", S = "_FlexGapMd_13gky_20", k = "_FlexGapLg_13gky_24", A = "_FlexGapXl_13gky_28", D = "_FlexGapXxl_13gky_32", f = "_FlexGapXxxl_13gky_36", X = "_FlexMarginTopSm_13gky_40", z = "_FlexMarginTopMd_13gky_44", T = "_FlexMarginBottomSm_13gky_48", u = "_FlexMarginBottomMd_13gky_52", B = "_FlexChildGrowContent_13gky_56", L = "_FlexChildGrowEqual_13gky_60", E = "_FlexChildGrow1_13gky_64", b = "_FlexChildGrow2_13gky_68", q = "_FlexChildGrow3_13gky_72", P = "_FlexChildGrow4_13gky_76", N = "_FlexDirectionRow_13gky_80", R = "_FlexDirectionColumn_13gky_85", j = "_FlexChangeDirectionAfterTabletSize_13gky_91", v = "_FlexChangeDirectionAfterLaptopSize_13gky_101", V = "_FlexChangeDirectionAfterPcSize_13gky_111", e = {
5
+ Flex: h,
6
+ FlexGapXxs: y,
7
+ FlexGapXs: w,
8
+ FlexGapSm: M,
9
+ FlexGapMd: S,
10
+ FlexGapLg: k,
11
+ FlexGapXl: A,
12
+ FlexGapXxl: D,
13
13
  FlexGapXxxl: f,
14
- FlexChildGrowContent: X,
15
- FlexChildGrowEqual: S,
16
- FlexChildGrow1: z,
17
- FlexChildGrow2: L,
18
- FlexChildGrow3: y,
19
- FlexChildGrow4: E,
20
- FlexDirectionRow: b,
21
- FlexDirectionColumn: q,
22
- FlexChangeDirectionAfterTabletSize: P,
23
- FlexChangeDirectionAfterLaptopSize: T,
24
- FlexChangeDirectionAfterPcSize: M
25
- }, v = (a) => {
14
+ FlexMarginTopSm: X,
15
+ FlexMarginTopMd: z,
16
+ FlexMarginBottomSm: T,
17
+ FlexMarginBottomMd: u,
18
+ FlexChildGrowContent: B,
19
+ FlexChildGrowEqual: L,
20
+ FlexChildGrow1: E,
21
+ FlexChildGrow2: b,
22
+ FlexChildGrow3: q,
23
+ FlexChildGrow4: P,
24
+ FlexDirectionRow: N,
25
+ FlexDirectionColumn: R,
26
+ FlexChangeDirectionAfterTabletSize: j,
27
+ FlexChangeDirectionAfterLaptopSize: v,
28
+ FlexChangeDirectionAfterPcSize: V
29
+ }, K = (F) => {
26
30
  const {
27
- children: n,
31
+ children: _,
28
32
  gap: o,
29
33
  grow: l,
30
34
  direction: i = "row",
31
- changeDirectionAfterTabletSize: F = !1,
32
- changeDirectionAfterLaptopSize: _ = !1,
33
- changeDirectionAfterPcSize: c = !1
34
- } = a;
35
+ marginTop: t,
36
+ marginBottom: n,
37
+ className: c = "",
38
+ changeDirectionAfterTabletSize: g = !1,
39
+ changeDirectionAfterLaptopSize: p = !1,
40
+ changeDirectionAfterPcSize: s = !1
41
+ } = F;
35
42
  return /* @__PURE__ */ G(
36
43
  "div",
37
44
  {
38
- className: t(e.Flex, {
39
- [e.FlexChangeDirectionAfterTabletSize]: F,
40
- [e.FlexChangeDirectionAfterLaptopSize]: _,
41
- [e.FlexChangeDirectionAfterPcSize]: c,
45
+ className: a(e.Flex, c, {
46
+ [e.FlexChangeDirectionAfterTabletSize]: g,
47
+ [e.FlexChangeDirectionAfterLaptopSize]: p,
48
+ [e.FlexChangeDirectionAfterPcSize]: s,
42
49
  [e.FlexDirectionColumn]: i === "column",
43
50
  [e.FlexDirectionRow]: i === "row",
44
51
  [e.FlexGapXxs]: o === "xxs",
@@ -48,12 +55,16 @@ import '../../assets/flex-Bb3RqRpb.css';const C = "_Flex_o2d5u_1", h = "_FlexGap
48
55
  [e.FlexGapLg]: o === "lg",
49
56
  [e.FlexGapXl]: o === "xl",
50
57
  [e.FlexGapXxl]: o === "xxl",
51
- [e.FlexGapXxxl]: o === "xxxl"
58
+ [e.FlexGapXxxl]: o === "xxxl",
59
+ [e.FlexMarginTopSm]: t === "sm",
60
+ [e.FlexMarginTopMd]: t === "md",
61
+ [e.FlexMarginBottomSm]: n === "sm",
62
+ [e.FlexMarginBottomMd]: n === "md"
52
63
  }),
53
- children: s.map(
54
- n,
55
- (x, r) => d(x) && l ? p(x, {
56
- className: t(x.props.className, {
64
+ children: m.map(
65
+ _,
66
+ (x, r) => d(x) && l ? C(x, {
67
+ className: a(x.props.className, {
57
68
  [e.FlexChildGrowContent]: l === "content",
58
69
  [e.FlexChildGrowEqual]: l === "equal",
59
70
  [e.FlexChildGrow1]: Array.isArray(l) && l[r] === 1,
@@ -67,5 +78,5 @@ import '../../assets/flex-Bb3RqRpb.css';const C = "_Flex_o2d5u_1", h = "_FlexGap
67
78
  );
68
79
  };
69
80
  export {
70
- v as Flex
81
+ K as Flex
71
82
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@arthurzakharov/ui-kit",
3
3
  "private": false,
4
- "version": "1.0.113",
4
+ "version": "1.0.114",
5
5
  "type": "module",
6
6
  "main": "dist/main.js",
7
7
  "types": "dist/main.d.ts",
package/dist/assets/flex-Bb3RqRpb.css DELETED
@@ -1 +0,0 @@
1
- ._Flex_o2d5u_1{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:initial}._FlexGapXxs_o2d5u_8{gap:var(--rm-ui-padding-xxs)}._FlexGapXs_o2d5u_12{gap:var(--rm-ui-padding-xs)}._FlexGapSm_o2d5u_16{gap:var(--rm-ui-padding-sm)}._FlexGapMd_o2d5u_20{gap:var(--rm-ui-padding-md)}._FlexGapLg_o2d5u_24{gap:var(--rm-ui-padding-lg)}._FlexGapXl_o2d5u_28{gap:var(--rm-ui-padding-xl)}._FlexGapXxl_o2d5u_32{gap:var(--rm-ui-padding-xxl)}._FlexGapXxxl_o2d5u_36{gap:var(--rm-ui-padding-xxxl)}._FlexChildGrowContent_o2d5u_40{flex-grow:initial}._FlexChildGrowEqual_o2d5u_44,._FlexChildGrow1_o2d5u_48{flex-grow:1}._FlexChildGrow2_o2d5u_52{flex-grow:2}._FlexChildGrow3_o2d5u_56{flex-grow:3}._FlexChildGrow4_o2d5u_60{flex-grow:4}._FlexDirectionRow_o2d5u_64{flex-direction:row;align-items:flex-start}._FlexDirectionColumn_o2d5u_69{flex-direction:column;align-items:stretch}@media screen and (min-width:768px){._FlexDirectionRow_o2d5u_64._FlexChangeDirectionAfterTabletSize_o2d5u_75{flex-direction:column}._FlexDirectionColumn_o2d5u_69._FlexChangeDirectionAfterTabletSize_o2d5u_75{flex-direction:row}}@media screen and (min-width:1024px){._FlexDirectionRow_o2d5u_64._FlexChangeDirectionAfterLaptopSize_o2d5u_85{flex-direction:column}._FlexDirectionColumn_o2d5u_69._FlexChangeDirectionAfterLaptopSize_o2d5u_85{flex-direction:row}}@media screen and (min-width:1200px){._FlexDirectionRow_o2d5u_64._FlexChangeDirectionAfterPcSize_o2d5u_95{flex-direction:column}._FlexDirectionColumn_o2d5u_69._FlexChangeDirectionAfterPcSize_o2d5u_95{flex-direction:row}}