@crisp-ui-kit/crisp 0.21.0 → 0.21.1
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/cjs/product/sidebar/sidebar.js +1 -1
- package/dist/cjs/product/sidebar/sidebar.recipe.js +2 -0
- package/dist/esm/product/sidebar/sidebar.js +1 -1
- package/dist/esm/product/sidebar/sidebar.recipe.js +3 -1
- package/dist/sidebar.css +2 -0
- package/dist/styles.css +2 -0
- package/package.json +1 -1
|
@@ -57,7 +57,7 @@ const IconSearch = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.Sea
|
|
|
57
57
|
const IconInbox = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.Inbox, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
58
58
|
const IconInvite = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.UserPlus, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
59
59
|
const IconChat = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.MessageSquare, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
60
|
-
const IconCollapsePanel = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.PanelLeft, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
60
|
+
const IconCollapsePanel = ({ className }) => ((0, jsx_runtime_1.jsx)(lucide_react_1.PanelLeft, { "data-rtl-flip": "", className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
61
61
|
const IconChevronMini = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { size: 12, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
62
62
|
const GlyphCompanies = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
63
63
|
const GlyphPeople = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.User, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
@@ -30,6 +30,8 @@ const config = (0, core_1.defineRecipe)({
|
|
|
30
30
|
& .sidebar-divider { height: 0; border: none; border-top: 1px solid ${tokens_1.contract.borderSubtle}; margin: ${tokens_1.contract.space["2"]} calc(-1 * ${tokens_1.contract.space["2"]}) 0; }
|
|
31
31
|
& .sidebar-newlist { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: ${tokens_1.contract.size.row}; border-radius: ${tokens_1.contract.radius.md}; border: 1px dashed ${tokens_1.contract.borderDefault}; background: transparent; color: ${tokens_1.contract.fgMuted}; font-family: ${tokens_1.contract.font.sans}; font-size: ${tokens_1.contract.text.md}; font-weight: ${tokens_1.contract.weight.medium}; cursor: pointer; }
|
|
32
32
|
& .sidebar-newlist:hover { background: ${tokens_1.contract.bgRaised}; color: ${tokens_1.contract.fgPrimary}; }
|
|
33
|
+
|
|
34
|
+
${core_1.rtlFlipCss}
|
|
33
35
|
`,
|
|
34
36
|
variants: {},
|
|
35
37
|
defaultVariants: {},
|
|
@@ -21,7 +21,7 @@ const IconSearch = ({ className }) => (_jsx(Search, { className: className, size
|
|
|
21
21
|
const IconInbox = ({ className }) => (_jsx(Inbox, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
22
22
|
const IconInvite = ({ className }) => (_jsx(UserPlus, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
23
23
|
const IconChat = ({ className }) => (_jsx(MessageSquare, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
24
|
-
const IconCollapsePanel = ({ className }) => (_jsx(PanelLeft, { className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
24
|
+
const IconCollapsePanel = ({ className }) => (_jsx(PanelLeft, { "data-rtl-flip": "", className: className, size: 16, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
25
25
|
const IconChevronMini = () => (_jsx(ChevronDown, { size: 12, strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
26
26
|
const GlyphCompanies = () => (_jsx(Building2, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
27
27
|
const GlyphPeople = () => (_jsx(User, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineRecipe, resolveRecipe } from "../../core/index.js";
|
|
1
|
+
import { defineRecipe, resolveRecipe, rtlFlipCss } from "../../core/index.js";
|
|
2
2
|
import { contract as c, elevation as e } from "../../tokens/index.js";
|
|
3
3
|
const config = defineRecipe({
|
|
4
4
|
name: "sidebar",
|
|
@@ -27,6 +27,8 @@ const config = defineRecipe({
|
|
|
27
27
|
& .sidebar-divider { height: 0; border: none; border-top: 1px solid ${c.borderSubtle}; margin: ${c.space["2"]} calc(-1 * ${c.space["2"]}) 0; }
|
|
28
28
|
& .sidebar-newlist { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: ${c.size.row}; border-radius: ${c.radius.md}; border: 1px dashed ${c.borderDefault}; background: transparent; color: ${c.fgMuted}; font-family: ${c.font.sans}; font-size: ${c.text.md}; font-weight: ${c.weight.medium}; cursor: pointer; }
|
|
29
29
|
& .sidebar-newlist:hover { background: ${c.bgRaised}; color: ${c.fgPrimary}; }
|
|
30
|
+
|
|
31
|
+
${rtlFlipCss}
|
|
30
32
|
`,
|
|
31
33
|
variants: {},
|
|
32
34
|
defaultVariants: {},
|
package/dist/sidebar.css
CHANGED
|
@@ -24,6 +24,8 @@
|
|
|
24
24
|
& .sidebar-divider { height: 0; border: none; border-top: 1px solid var(--border-subtle); margin: var(--space-2) calc(-1 * var(--space-2)) 0; }
|
|
25
25
|
& .sidebar-newlist { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: var(--size-row); border-radius: var(--radius-md); border: 1px dashed var(--border-default); background: transparent; color: var(--fg-muted); font-family: var(--font-sans); font-size: var(--text-md); font-weight: var(--weight-medium); cursor: pointer; }
|
|
26
26
|
& .sidebar-newlist:hover { background: var(--bg-raised); color: var(--fg-primary); }
|
|
27
|
+
|
|
28
|
+
[dir="rtl"] & [data-rtl-flip] { transform: scaleX(-1); }
|
|
27
29
|
|
|
28
30
|
}
|
|
29
31
|
|
package/dist/styles.css
CHANGED
|
@@ -2718,6 +2718,8 @@
|
|
|
2718
2718
|
& .sidebar-divider { height: 0; border: none; border-top: 1px solid var(--border-subtle); margin: var(--space-2) calc(-1 * var(--space-2)) 0; }
|
|
2719
2719
|
& .sidebar-newlist { box-sizing: border-box; display: flex; align-items: center; justify-content: center; width: 100%; height: var(--size-row); border-radius: var(--radius-md); border: 1px dashed var(--border-default); background: transparent; color: var(--fg-muted); font-family: var(--font-sans); font-size: var(--text-md); font-weight: var(--weight-medium); cursor: pointer; }
|
|
2720
2720
|
& .sidebar-newlist:hover { background: var(--bg-raised); color: var(--fg-primary); }
|
|
2721
|
+
|
|
2722
|
+
[dir="rtl"] & [data-rtl-flip] { transform: scaleX(-1); }
|
|
2721
2723
|
|
|
2722
2724
|
}
|
|
2723
2725
|
|