stone-kit 0.0.495 → 0.0.496

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 (11) hide show
  1. package/README.md +59 -59
  2. package/dist/SortSelect-jks4qMel.js +180 -0
  3. package/dist/components/SortSelect/index.js +1 -1
  4. package/dist/components/SortSelect/ui/SortSelect.js +1 -1
  5. package/dist/components/TabSwitcher/index.js +1 -1
  6. package/dist/components/TabSwitcher/ui/TabSwitcher.js +1 -1
  7. package/dist/components/TabSwitcher/ui/TabSwitcher.types.d.ts +1 -0
  8. package/dist/components/ZoomControls/ui/ZoomControls.js +1 -1
  9. package/dist/main.js +1 -1
  10. package/package.json +1 -1
  11. package/dist/SortSelect-CaZ13MQ5.js +0 -179
package/README.md CHANGED
@@ -1,59 +1,59 @@
1
- # Stone-kit
2
-
3
- Uikit for stone redesign 2.0
4
-
5
- ## Installation
6
-
7
- Package installation:
8
-
9
- ```bash
10
- npm i stone-kit@latest
11
- ```
12
-
13
- ## Usage
14
-
15
- For Next.js page router in App.tsx:
16
-
17
- ```bash
18
- import 'stone-kit/dist/style.css'
19
- ```
20
-
21
- and then:
22
-
23
- ```bash
24
- import {Button} from 'stone-kit'
25
- ```
26
-
27
- For other projects u can immediately:
28
-
29
- ```bash
30
- import {Button} from 'stone-kit'
31
- ```
32
-
33
- ## Docs
34
-
35
- ### ButtonProps
36
-
37
- size: optional, size of button. types : 'large' | 'medium' | 'small' | 'tiny'
38
-
39
- pre: optional, insert icon/text before button text. type: ReactNode
40
-
41
- post: optional, insert icon/text after button text. type: ReactNode
42
-
43
- variant: optional, color variants of button. type:
44
- 'blue',
45
- 'gray',
46
- 'whiteStroke',
47
- 'sokolniki',
48
- 'black',
49
- 'whiteFilled'
50
-
51
- width: optional, width of button. type: 'auto' | 'full'
52
-
53
- additionalClass: optional, add your custom class to button. type: 'string'
54
-
55
- as: optional, u can convert button to link. type: 'button' | 'link'. 'button' by default.
56
-
57
- ### MobileButtonProps
58
-
59
- ### Tag
1
+ # Stone-kit
2
+
3
+ Uikit for stone redesign 2.0
4
+
5
+ ## Installation
6
+
7
+ Package installation:
8
+
9
+ ```bash
10
+ npm i stone-kit@latest
11
+ ```
12
+
13
+ ## Usage
14
+
15
+ For Next.js page router in App.tsx:
16
+
17
+ ```bash
18
+ import 'stone-kit/dist/style.css'
19
+ ```
20
+
21
+ and then:
22
+
23
+ ```bash
24
+ import {Button} from 'stone-kit'
25
+ ```
26
+
27
+ For other projects u can immediately:
28
+
29
+ ```bash
30
+ import {Button} from 'stone-kit'
31
+ ```
32
+
33
+ ## Docs
34
+
35
+ ### ButtonProps
36
+
37
+ size: optional, size of button. types : 'large' | 'medium' | 'small' | 'tiny'
38
+
39
+ pre: optional, insert icon/text before button text. type: ReactNode
40
+
41
+ post: optional, insert icon/text after button text. type: ReactNode
42
+
43
+ variant: optional, color variants of button. type:
44
+ 'blue',
45
+ 'gray',
46
+ 'whiteStroke',
47
+ 'sokolniki',
48
+ 'black',
49
+ 'whiteFilled'
50
+
51
+ width: optional, width of button. type: 'auto' | 'full'
52
+
53
+ additionalClass: optional, add your custom class to button. type: 'string'
54
+
55
+ as: optional, u can convert button to link. type: 'button' | 'link'. 'button' by default.
56
+
57
+ ### MobileButtonProps
58
+
59
+ ### Tag
package/dist/SortSelect-jks4qMel.js ADDED
@@ -0,0 +1,180 @@
1
+ import { jsxs as u, jsx as o } from "react/jsx-runtime";
2
+ import { forwardRef as k, useState as T, useRef as D, useEffect as M } from "react";
3
+ import { c as v } from "./index-rKuIKazb.js";
4
+ import { s as t, u as B } from "./useSortSelect-D7K1wk0E.js";
5
+ import { NewIcon as O } from "./components/NewIcon/ui/NewIcon.js";
6
+ import "./components/Button/ui/Button.js";
7
+ import "./components/mobileButton/ui/MobileButton.js";
8
+ import "./components/DestinationTab/ui/DestinationTab.js";
9
+ import "./components/RoundButton/ui/RoundButton.js";
10
+ import "./components/Tag/ui/Tag.js";
11
+ import "./components/Switcher/ui/Switcher.js";
12
+ import { Text as C } from "./components/Text/ui/Text.js";
13
+ import "./components/Flex/ui/Flex.js";
14
+ import "./components/Input/ui/Input.js";
15
+ import { M as j } from "./Modal-BZv6nlLe.js";
16
+ import "./components/GroupedInput/ui/GroupedInputs.js";
17
+ import "./components/MetroTag/ui/MetroTag.js";
18
+ import "./components/LotCard/ui/LotCard.js";
19
+ import "./components/Select/ui/Select.js";
20
+ import { useClientWidth as L } from "./shared/useClientWidth.js";
21
+ import "./components/SliderNavigation/ui/SliderNavigation.js";
22
+ import "./components/LotCardSkeleton/ui/LotCardSkeleton.js";
23
+ import "./components/TabSelect/ui/TabSelect.js";
24
+ import "./components/FormModal/ui/ModalForm.js";
25
+ const E = "_root_1ol37_1", A = "_text_1ol37_18", z = "_rootCol_1ol37_26", $ = "_item_1ol37_32", q = "_whiteRow_1ol37_51", H = "_firstItem_1ol37_62", P = "_lastItem_1ol37_66", V = "_apart_1ol37_97", F = "_isLong_1ol37_97", G = "_autoWidth_1ol37_122", J = "_isDisabled_1ol37_129", K = "_grayRow_1ol37_153", e = {
26
+ root: E,
27
+ text: A,
28
+ rootCol: z,
29
+ item: $,
30
+ whiteRow: q,
31
+ firstItem: H,
32
+ lastItem: P,
33
+ apart: V,
34
+ isLong: F,
35
+ autoWidth: G,
36
+ isDisabled: J,
37
+ grayRow: K
38
+ }, h = v.bind(e), Q = ({
39
+ children: s,
40
+ variant: m = "whiteRow",
41
+ isApart: d = !1,
42
+ addClassName: p = "",
43
+ col: n = !1
44
+ }) => /* @__PURE__ */ o("div", { className: h(e.root, e[m], p, { [e.rootCol]: n, [e.apart]: d }), children: s }), W = k((s, m) => {
45
+ const { isTablet: d, isDesktop: p } = L(), {
46
+ index: n,
47
+ children: i,
48
+ addItemClassName: f,
49
+ addTextClass: x,
50
+ disabled: w = !1,
51
+ itemsLength: b = 0,
52
+ isLongOn: r = !0,
53
+ width: a,
54
+ width_m: c,
55
+ width_l: l,
56
+ ...y
57
+ } = s, S = (i != null && i.toString().length ? (i == null ? void 0 : i.toString().length) > 2 : !1) && r, g = (_, R) => _ && c ? c : R && l ? l : a, I = !a && !c && !l && S;
58
+ return /* @__PURE__ */ u("label", { className: h({ [e.isLong]: S }), children: [
59
+ /* @__PURE__ */ o(
60
+ "input",
61
+ {
62
+ ref: m,
63
+ type: "checkbox",
64
+ ...y,
65
+ disabled: w
66
+ }
67
+ ),
68
+ /* @__PURE__ */ o(
69
+ "div",
70
+ {
71
+ style: { width: g(d, p) },
72
+ className: h(h(
73
+ e.item,
74
+ { [e.firstItem]: n === 0 },
75
+ { [e.lastItem]: n === b - 1 },
76
+ { [e.isDisabled]: w },
77
+ { [e.autoWidth]: I }
78
+ ), f),
79
+ children: /* @__PURE__ */ o(C, { className: h(e.text, x), children: i })
80
+ }
81
+ )
82
+ ] });
83
+ });
84
+ W.displayName = "TabSwitcherItem";
85
+ const It = Object.assign(Q, { Item: W }), N = v.bind(t), U = ({
86
+ options: s,
87
+ selectedOption: m,
88
+ placeholder: d = "",
89
+ error: p,
90
+ disabled: n,
91
+ additionalClass: i = "",
92
+ onChange: f,
93
+ onBlur: x,
94
+ mini: w,
95
+ openOnTop: b = !1
96
+ }) => {
97
+ const [r, a] = T(!1), c = D(null), { isMobile: l } = L(), { handleBlur: y, getInputValue: S, getOption: g, handleDocumentClick: I } = B({
98
+ selectedOption: m,
99
+ setSelectedOption: f,
100
+ setIsOpen: a,
101
+ containerRef: c,
102
+ isOpen: r,
103
+ isMobile: l,
104
+ placeholder: d,
105
+ onChange: f,
106
+ onBlur: x
107
+ });
108
+ return M(() => (document.addEventListener("click", I), () => {
109
+ document.removeEventListener("click", I);
110
+ }), []), /* @__PURE__ */ u(
111
+ "div",
112
+ {
113
+ ref: c,
114
+ className: N(
115
+ t.sortSelectWrapper,
116
+ { [t.sortSelectWrapperError]: p },
117
+ { [t.sortSelectWrapperTop]: b },
118
+ i
119
+ ),
120
+ tabIndex: 0,
121
+ onBlur: y,
122
+ children: [
123
+ /* @__PURE__ */ u("div", { className: N(t.inputWrapper), children: [
124
+ /* @__PURE__ */ o(
125
+ "input",
126
+ {
127
+ type: "text",
128
+ readOnly: !0,
129
+ value: S(),
130
+ className: N(
131
+ t.selectedOptions,
132
+ { [t.selectOptionsDisabled]: n },
133
+ { [t.selectionOptionMini]: w }
134
+ ),
135
+ onClick: () => a(!r)
136
+ }
137
+ ),
138
+ /* @__PURE__ */ o(
139
+ O,
140
+ {
141
+ name: "twoArrows",
142
+ size: "24",
143
+ additionalClass: t.icon
144
+ }
145
+ )
146
+ ] }),
147
+ r && l && /* @__PURE__ */ u(
148
+ j,
149
+ {
150
+ isOpen: r,
151
+ emitIsOpen: a,
152
+ additionalClassModalBody: t.modalAddBody,
153
+ additionalClass: t.selectModal,
154
+ createPortalObj: { domNode: document.querySelector("body") },
155
+ isTransparentBack: !0,
156
+ children: [
157
+ /* @__PURE__ */ u("div", { className: t.mobileSortHeader, children: [
158
+ /* @__PURE__ */ o(C, { children: "Сортировка" }),
159
+ /* @__PURE__ */ o("div", { onClick: () => a(!1), children: /* @__PURE__ */ o(
160
+ O,
161
+ {
162
+ name: "close",
163
+ size: "20"
164
+ }
165
+ ) })
166
+ ] }),
167
+ /* @__PURE__ */ o("div", { className: t.mobileOptionList, children: s == null ? void 0 : s.map((_) => g(_)) })
168
+ ]
169
+ }
170
+ ),
171
+ r && !l && /* @__PURE__ */ o("div", { className: N(t.optionsList, { [t.optionListOnTop]: b }), children: s == null ? void 0 : s.map((_) => g(_)) })
172
+ ]
173
+ }
174
+ );
175
+ };
176
+ U.displayName = "SortSelect";
177
+ export {
178
+ It as S,
179
+ U as a
180
+ };
package/dist/components/SortSelect/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { a as r } from "../../SortSelect-CaZ13MQ5.js";
1
+ import { a as r } from "../../SortSelect-jks4qMel.js";
2
2
  export {
3
3
  r as SortSelect
4
4
  };
package/dist/components/SortSelect/ui/SortSelect.js CHANGED
@@ -13,7 +13,7 @@ import "../../Text/ui/Text.js";
13
13
  import "../../Flex/ui/Flex.js";
14
14
  import "../../Input/ui/Input.js";
15
15
  import "../../../Modal-BZv6nlLe.js";
16
- import { a as z } from "../../../SortSelect-CaZ13MQ5.js";
16
+ import { a as z } from "../../../SortSelect-jks4qMel.js";
17
17
  import "../../GroupedInput/ui/GroupedInputs.js";
18
18
  import "../../MetroTag/ui/MetroTag.js";
19
19
  import "../../LotCard/ui/LotCard.js";
package/dist/components/TabSwitcher/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { S as e } from "../../SortSelect-CaZ13MQ5.js";
1
+ import { S as e } from "../../SortSelect-jks4qMel.js";
2
2
  export {
3
3
  e as TabSwitcher
4
4
  };
package/dist/components/TabSwitcher/ui/TabSwitcher.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import "react/jsx-runtime";
2
2
  import "react";
3
- import { S as v } from "../../../SortSelect-CaZ13MQ5.js";
3
+ import { S as v } from "../../../SortSelect-jks4qMel.js";
4
4
  import "../../Text/ui/Text.js";
5
5
  import "../../../index-rKuIKazb.js";
6
6
  import "../../Button/ui/Button.js";
package/dist/components/TabSwitcher/ui/TabSwitcher.types.d.ts CHANGED
@@ -6,6 +6,7 @@ declare const TAB_SWITCHER_VARIANTS: {
6
6
  };
7
7
  export interface ITabSwitcherItem extends React.InputHTMLAttributes<HTMLInputElement> {
8
8
  addItemClassName?: string;
9
+ addTextClass?: string;
9
10
  index: number;
10
11
  isDisabled?: boolean;
11
12
  itemsLength: number;
package/dist/components/ZoomControls/ui/ZoomControls.js CHANGED
@@ -11,7 +11,7 @@ import "../../Flex/ui/Flex.js";
11
11
  import "../../Input/ui/Input.js";
12
12
  import "react";
13
13
  import "../../../Modal-BZv6nlLe.js";
14
- import "../../../SortSelect-CaZ13MQ5.js";
14
+ import "../../../SortSelect-jks4qMel.js";
15
15
  import "../../GroupedInput/ui/GroupedInputs.js";
16
16
  import "../../../index-rKuIKazb.js";
17
17
  import "../../MetroTag/ui/MetroTag.js";
package/dist/main.js CHANGED
@@ -10,7 +10,7 @@ import { Flex as T } from "./components/Flex/ui/Flex.js";
10
10
  import { Input as b } from "./components/Input/ui/Input.js";
11
11
  import { M as I } from "./Modal-BZv6nlLe.js";
12
12
  import { FieldInput as w } from "./components/FieldInput/ui/FieldInput.js";
13
- import { a as F, S as L } from "./SortSelect-CaZ13MQ5.js";
13
+ import { a as F, S as L } from "./SortSelect-jks4qMel.js";
14
14
  import { GroupedInputs as N } from "./components/GroupedInput/ui/GroupedInputs.js";
15
15
  import { Logo as v } from "./components/Logo/ui/Logo.js";
16
16
  import { MetroTag as D } from "./components/MetroTag/ui/MetroTag.js";
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "stone-kit",
3
3
  "description": "uikit for redesign",
4
4
  "private": false,
5
- "version": "0.0.495",
5
+ "version": "0.0.496",
6
6
  "author": "Mollycodd1e",
7
7
  "license": "ISC",
8
8
  "type": "module",
package/dist/SortSelect-CaZ13MQ5.js DELETED
@@ -1,179 +0,0 @@
1
- import { jsxs as u, jsx as o } from "react/jsx-runtime";
2
- import { forwardRef as R, useState as k, useRef as D, useEffect as T } from "react";
3
- import { c as v } from "./index-rKuIKazb.js";
4
- import { s as t, u as M } from "./useSortSelect-D7K1wk0E.js";
5
- import { NewIcon as O } from "./components/NewIcon/ui/NewIcon.js";
6
- import "./components/Button/ui/Button.js";
7
- import "./components/mobileButton/ui/MobileButton.js";
8
- import "./components/DestinationTab/ui/DestinationTab.js";
9
- import "./components/RoundButton/ui/RoundButton.js";
10
- import "./components/Tag/ui/Tag.js";
11
- import "./components/Switcher/ui/Switcher.js";
12
- import { Text as L } from "./components/Text/ui/Text.js";
13
- import "./components/Flex/ui/Flex.js";
14
- import "./components/Input/ui/Input.js";
15
- import { M as B } from "./Modal-BZv6nlLe.js";
16
- import "./components/GroupedInput/ui/GroupedInputs.js";
17
- import "./components/MetroTag/ui/MetroTag.js";
18
- import "./components/LotCard/ui/LotCard.js";
19
- import "./components/Select/ui/Select.js";
20
- import { useClientWidth as C } from "./shared/useClientWidth.js";
21
- import "./components/SliderNavigation/ui/SliderNavigation.js";
22
- import "./components/LotCardSkeleton/ui/LotCardSkeleton.js";
23
- import "./components/TabSelect/ui/TabSelect.js";
24
- import "./components/FormModal/ui/ModalForm.js";
25
- const j = "_root_1ol37_1", E = "_text_1ol37_18", A = "_rootCol_1ol37_26", z = "_item_1ol37_32", $ = "_whiteRow_1ol37_51", q = "_firstItem_1ol37_62", H = "_lastItem_1ol37_66", P = "_apart_1ol37_97", V = "_isLong_1ol37_97", F = "_autoWidth_1ol37_122", G = "_isDisabled_1ol37_129", J = "_grayRow_1ol37_153", e = {
26
- root: j,
27
- text: E,
28
- rootCol: A,
29
- item: z,
30
- whiteRow: $,
31
- firstItem: q,
32
- lastItem: H,
33
- apart: P,
34
- isLong: V,
35
- autoWidth: F,
36
- isDisabled: G,
37
- grayRow: J
38
- }, N = v.bind(e), K = ({
39
- children: s,
40
- variant: c = "whiteRow",
41
- isApart: m = !1,
42
- addClassName: d = "",
43
- col: l = !1
44
- }) => /* @__PURE__ */ o("div", { className: N(e.root, e[c], d, { [e.rootCol]: l, [e.apart]: m }), children: s }), W = R((s, c) => {
45
- const { isTablet: m, isDesktop: d } = C(), {
46
- index: l,
47
- children: i,
48
- addItemClassName: h,
49
- disabled: f = !1,
50
- itemsLength: x = 0,
51
- isLongOn: w = !0,
52
- width: r,
53
- width_m: a,
54
- width_l: n,
55
- ...p
56
- } = s, b = (i != null && i.toString().length ? (i == null ? void 0 : i.toString().length) > 2 : !1) && w, y = (g, _) => g && a ? a : _ && n ? n : r, S = !r && !a && !n && b;
57
- return /* @__PURE__ */ u("label", { className: N({ [e.isLong]: b }), children: [
58
- /* @__PURE__ */ o(
59
- "input",
60
- {
61
- ref: c,
62
- type: "checkbox",
63
- ...p,
64
- disabled: f
65
- }
66
- ),
67
- /* @__PURE__ */ o(
68
- "div",
69
- {
70
- style: { width: y(m, d) },
71
- className: N(N(
72
- e.item,
73
- { [e.firstItem]: l === 0 },
74
- { [e.lastItem]: l === x - 1 },
75
- { [e.isDisabled]: f },
76
- { [e.autoWidth]: S }
77
- ), h),
78
- children: /* @__PURE__ */ o(L, { className: e.text, children: i })
79
- }
80
- )
81
- ] });
82
- });
83
- W.displayName = "TabSwitcherItem";
84
- const gt = Object.assign(K, { Item: W }), I = v.bind(t), Q = ({
85
- options: s,
86
- selectedOption: c,
87
- placeholder: m = "",
88
- error: d,
89
- disabled: l,
90
- additionalClass: i = "",
91
- onChange: h,
92
- onBlur: f,
93
- mini: x,
94
- openOnTop: w = !1
95
- }) => {
96
- const [r, a] = k(!1), n = D(null), { isMobile: p } = C(), { handleBlur: b, getInputValue: y, getOption: S, handleDocumentClick: g } = M({
97
- selectedOption: c,
98
- setSelectedOption: h,
99
- setIsOpen: a,
100
- containerRef: n,
101
- isOpen: r,
102
- isMobile: p,
103
- placeholder: m,
104
- onChange: h,
105
- onBlur: f
106
- });
107
- return T(() => (document.addEventListener("click", g), () => {
108
- document.removeEventListener("click", g);
109
- }), []), /* @__PURE__ */ u(
110
- "div",
111
- {
112
- ref: n,
113
- className: I(
114
- t.sortSelectWrapper,
115
- { [t.sortSelectWrapperError]: d },
116
- { [t.sortSelectWrapperTop]: w },
117
- i
118
- ),
119
- tabIndex: 0,
120
- onBlur: b,
121
- children: [
122
- /* @__PURE__ */ u("div", { className: I(t.inputWrapper), children: [
123
- /* @__PURE__ */ o(
124
- "input",
125
- {
126
- type: "text",
127
- readOnly: !0,
128
- value: y(),
129
- className: I(
130
- t.selectedOptions,
131
- { [t.selectOptionsDisabled]: l },
132
- { [t.selectionOptionMini]: x }
133
- ),
134
- onClick: () => a(!r)
135
- }
136
- ),
137
- /* @__PURE__ */ o(
138
- O,
139
- {
140
- name: "twoArrows",
141
- size: "24",
142
- additionalClass: t.icon
143
- }
144
- )
145
- ] }),
146
- r && p && /* @__PURE__ */ u(
147
- B,
148
- {
149
- isOpen: r,
150
- emitIsOpen: a,
151
- additionalClassModalBody: t.modalAddBody,
152
- additionalClass: t.selectModal,
153
- createPortalObj: { domNode: document.querySelector("body") },
154
- isTransparentBack: !0,
155
- children: [
156
- /* @__PURE__ */ u("div", { className: t.mobileSortHeader, children: [
157
- /* @__PURE__ */ o(L, { children: "Сортировка" }),
158
- /* @__PURE__ */ o("div", { onClick: () => a(!1), children: /* @__PURE__ */ o(
159
- O,
160
- {
161
- name: "close",
162
- size: "20"
163
- }
164
- ) })
165
- ] }),
166
- /* @__PURE__ */ o("div", { className: t.mobileOptionList, children: s == null ? void 0 : s.map((_) => S(_)) })
167
- ]
168
- }
169
- ),
170
- r && !p && /* @__PURE__ */ o("div", { className: I(t.optionsList, { [t.optionListOnTop]: w }), children: s == null ? void 0 : s.map((_) => S(_)) })
171
- ]
172
- }
173
- );
174
- };
175
- Q.displayName = "SortSelect";
176
- export {
177
- gt as S,
178
- Q as a
179
- };