@intlayer/design-system 2.0.11 → 2.0.13

package/dist/components/RightDrawer/RightDrawer.es.js

@@ -3,11 +3,11 @@ import { j as e } from "../../jsx-runtime-Tw_Kw2GZ.js";
 import { p as t } from "../../styled-components.browser.esm-D6kkzXl4.js";
 import { useRef as c, useEffect as g } from "react";
 import { useDevice as y } from "../../hooks/useDevice.es.js";
-import { useScrollBlockage as S } from "../../hooks/useScrollBlockage/index.es.js";
-import { Container as j } from "../Container/index.es.js";
-import { MaxWidthSmoother as v } from "../MaxWidthSmoother/index.es.js";
-import { useRightDrawerStore as C } from "./useRightDrawerStore.es.js";
-import { c as w } from "../../createLucideIcon-DlZEiEGq.js";
+import { useScrollBlockage as v } from "../../hooks/useScrollBlockage/index.es.js";
+import { Container as w } from "../Container/index.es.js";
+import { MaxWidthSmoother as S } from "../MaxWidthSmoother/index.es.js";
+import { useRightDrawerStore as j } from "./useRightDrawerStore.es.js";
+import { c as C } from "../../createLucideIcon-DlZEiEGq.js";
 import { X as D } from "../../x-BKwnSvvj.js";
 /**
  * @license lucide-react v0.376.0 - ISC
@@ -15,7 +15,7 @@ import { X as D } from "../../x-BKwnSvvj.js";
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const L = w("ChevronLeft", [
+const L = C("ChevronLeft", [
   ["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]
 ]), R = t.div({
   position: "fixed",
@@ -25,21 +25,27 @@ const L = w("ChevronLeft", [
   display: "flex",
   height: "100%",
   justifyContent: "flex-end"
-}), E = t(j)(() => [{
+}), k = t(w)(() => [{
   position: "relative",
   display: "flex",
   height: "100vh",
   width: "100vw",
   flexDirection: "column",
+  "--tw-text-opacity": "1",
+  color: "rgba(18, 18, 18, var(--tw-text-opacity))",
   "@media (min-width: 768px)": {
     width: "400px"
+  },
+  '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+    "--tw-text-opacity": "1",
+    color: "rgba(255, 245, 237, var(--tw-text-opacity))"
   }
-}]), I = t.div({
+}]), E = t.div({
   display: "flex",
   flexDirection: "column",
   gap: "0.75rem",
   padding: "1.5rem"
-}), k = t.div({
+}), I = t.div({
   display: "flex",
   justifyContent: "space-between",
   gap: "0.75rem"
@@ -70,37 +76,37 @@ const L = w("ChevronLeft", [
   marginLeft: "auto",
   cursor: "pointer"
 }}
-`, G = ({
+`, F = ({
   title: a,
   identifier: l,
   children: m,
-  header: f,
+  header: p,
   closeOnOutsideClick: d = !0,
   backButton: r
 }) => {
   const {
-    isMobile: p
-  } = y("md"), s = c(null), h = c(null), {
-    isOpen: i,
+    isMobile: f
+  } = y("md"), s = c(null), x = c(null), {
+    isOpen: n,
     close: o
-  } = C(l)();
-  S({
-    disableScroll: i,
+  } = j(l)();
+  v({
+    disableScroll: n,
     key: l ? "right_drawer" : `right_drawer_${l}`
   }), g(() => {
-    const n = (u) => {
-      i && d && s.current && !s.current.contains(u.target) && o();
+    const i = (u) => {
+      n && d && s.current && !s.current.contains(u.target) && o();
     };
-    return document.addEventListener("mousedown", n), () => {
-      document.removeEventListener("mousedown", n);
+    return document.addEventListener("mousedown", i), () => {
+      document.removeEventListener("mousedown", i);
     };
-  }, [i, o, d]);
-  const x = (n) => {
-    n.target === n.currentTarget && p && o();
+  }, [n, o, d]);
+  const h = (i) => {
+    i.target === i.currentTarget && f && o();
   };
-  return /* @__PURE__ */ e.jsx(R, { children: /* @__PURE__ */ e.jsx(v, { isHidden: !i, align: "right", children: /* @__PURE__ */ e.jsxs(E, { ref: s, roundedSize: "none", children: [
-    /* @__PURE__ */ e.jsxs(I, { children: [
-      /* @__PURE__ */ e.jsxs(k, { children: [
+  return /* @__PURE__ */ e.jsx(R, { children: /* @__PURE__ */ e.jsx(S, { isHidden: !n, align: "right", children: /* @__PURE__ */ e.jsxs(k, { ref: s, roundedSize: "none", children: [
+    /* @__PURE__ */ e.jsxs(E, { children: [
+      /* @__PURE__ */ e.jsxs(I, { children: [
         /* @__PURE__ */ e.jsx("div", { children: r && /* @__PURE__ */ e.jsxs(_, { onClick: r.onBack, children: [
           /* @__PURE__ */ e.jsx(L, {}),
           r == null ? void 0 : r.text
@@ -108,11 +114,11 @@ const L = w("ChevronLeft", [
         /* @__PURE__ */ e.jsx(P, { onClick: o })
       ] }),
       /* @__PURE__ */ e.jsx(M, { children: a }),
-      f
+      p
     ] }),
-    /* @__PURE__ */ e.jsx(z, { children: /* @__PURE__ */ e.jsx(H, { onClick: x, ref: h, children: m }) })
+    /* @__PURE__ */ e.jsx(z, { children: /* @__PURE__ */ e.jsx(H, { onClick: h, ref: x, children: m }) })
   ] }) }) });
 };
 export {
-  G as RightDrawer
+  F as RightDrawer
 };

package/dist/components/WithResizer/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../jsx-runtime-D6agescH.cjs"),h=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),e=require("react"),y=h.pt.div(({$minWidth:n,$maxWidth:a})=>[n&&{},a&&{},{position:"relative",height:"100%",width:"100%",maxWidth:"80%",cursor:"ew-resize",borderRightWidth:"2px","--tw-border-opacity":"1",borderColor:"rgba(209, 209, 209, var(--tw-border-opacity))",'&:where([data-theme="dark"], [data-theme="dark"] *)':{"--tw-border-opacity":"1",borderColor:"rgba(48, 48, 48, var(--tw-border-opacity))"}},{"&::after":{content:"var(--tw-content)",position:"absolute",right:"0px",top:"50%",display:"block",height:"2.5rem",width:"0.5rem","--tw-translate-y":"-50%",transform:"translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))","--tw-translate-x":"50%",cursor:"ew-resize",borderRadius:"9999px","--tw-bg-opacity":"1",backgroundColor:"rgba(209, 209, 209, var(--tw-bg-opacity))","--tw-content":'""'},'&:where([data-theme="dark"], [data-theme="dark"] *)::after':{content:"var(--tw-content)","--tw-bg-opacity":"1",backgroundColor:"rgba(48, 48, 48, var(--tw-bg-opacity))"}}]),k=h.pt.div({position:"absolute",left:"0px",top:"0px",height:"100%",width:"100%",cursor:"default",overflow:"hidden"}),R=({initialWidth:n,maxWidth:a,minWidth:p=0,children:v})=>{const s=e.useRef(null),[m,b]=e.useState(n),[c,d]=e.useState(!1),w=e.useCallback(t=>{d(!0),t.preventDefault()},[]),o=e.useCallback(()=>{d(!1)},[]),r=e.useCallback(t=>{const l=s.current;if(c&&l&&parent){const{left:g}=l.getBoundingClientRect();let i=0;t instanceof MouseEvent?i=t.clientX:t instanceof TouchEvent&&(i=t.touches[0].clientX);const x=i-g,f=Math.max(x,0);b(f)}},[c]);return e.useEffect(()=>(window.addEventListener("mousemove",r),window.addEventListener("mouseup",o),window.addEventListener("touchmove",r),window.addEventListener("touchend",o),()=>{window.removeEventListener("mousemove",r),window.removeEventListener("mouseup",o),window.removeEventListener("touchmove",r),window.removeEventListener("touchend",o)}),[r,o]),u.jsxRuntimeExports.jsx(y,{style:{width:`${m}px`},$maxWidth:`max-w-[${a}px]`,$minWidth:`min-w-[${p}px]`,ref:s,onMouseDown:w,onTouchStart:w,children:u.jsxRuntimeExports.jsx(k,{onMouseDown:t=>t.stopPropagation(),onTouchStart:t=>t.stopPropagation(),children:v})})};exports.WithResizer=R;

package/dist/components/WithResizer/index.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren, FC } from 'react';
+
+type WithResizerProps = {
+    initialWidth: number;
+    maxWidth?: number;
+    minWidth?: number;
+};
+export declare const WithResizer: FC<PropsWithChildren<WithResizerProps>>;
+export {};

package/dist/components/WithResizer/index.es.js

@@ -0,0 +1,82 @@
+"use client";
+import { j as p } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { p as u } from "../../styled-components.browser.esm-D6kkzXl4.js";
+import { useRef as k, useState as h, useCallback as i, useEffect as R } from "react";
+const E = u.div(({
+  $minWidth: r,
+  $maxWidth: n
+}) => [r && {}, n && {}, {
+  position: "relative",
+  height: "100%",
+  width: "100%",
+  maxWidth: "80%",
+  cursor: "ew-resize",
+  borderRightWidth: "2px",
+  "--tw-border-opacity": "1",
+  borderColor: "rgba(209, 209, 209, var(--tw-border-opacity))",
+  '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+    "--tw-border-opacity": "1",
+    borderColor: "rgba(48, 48, 48, var(--tw-border-opacity))"
+  }
+}, {
+  "&::after": {
+    content: "var(--tw-content)",
+    position: "absolute",
+    right: "0px",
+    top: "50%",
+    display: "block",
+    height: "2.5rem",
+    width: "0.5rem",
+    "--tw-translate-y": "-50%",
+    transform: "translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))",
+    "--tw-translate-x": "50%",
+    cursor: "ew-resize",
+    borderRadius: "9999px",
+    "--tw-bg-opacity": "1",
+    backgroundColor: "rgba(209, 209, 209, var(--tw-bg-opacity))",
+    "--tw-content": '""'
+  },
+  '&:where([data-theme="dark"], [data-theme="dark"] *)::after': {
+    content: "var(--tw-content)",
+    "--tw-bg-opacity": "1",
+    backgroundColor: "rgba(48, 48, 48, var(--tw-bg-opacity))"
+  }
+}]), L = u.div({
+  position: "absolute",
+  left: "0px",
+  top: "0px",
+  height: "100%",
+  width: "100%",
+  cursor: "default",
+  overflow: "hidden"
+}), S = ({
+  initialWidth: r,
+  maxWidth: n,
+  minWidth: v = 0,
+  children: m
+}) => {
+  const s = k(null), [f, g] = h(r), [c, d] = h(!1), w = i((t) => {
+    d(!0), t.preventDefault();
+  }, []), e = i(() => {
+    d(!1);
+  }, []), o = i((t) => {
+    const l = s.current;
+    if (c && l && parent) {
+      const {
+        left: b
+      } = l.getBoundingClientRect();
+      let a = 0;
+      t instanceof MouseEvent ? a = t.clientX : t instanceof TouchEvent && (a = t.touches[0].clientX);
+      const x = a - b, y = Math.max(x, 0);
+      g(y);
+    }
+  }, [c]);
+  return R(() => (window.addEventListener("mousemove", o), window.addEventListener("mouseup", e), window.addEventListener("touchmove", o), window.addEventListener("touchend", e), () => {
+    window.removeEventListener("mousemove", o), window.removeEventListener("mouseup", e), window.removeEventListener("touchmove", o), window.removeEventListener("touchend", e);
+  }), [o, e]), /* @__PURE__ */ p.jsx(E, { style: {
+    width: `${f}px`
+  }, $maxWidth: `max-w-[${n}px]`, $minWidth: `min-w-[${v}px]`, ref: s, onMouseDown: w, onTouchStart: w, children: /* @__PURE__ */ p.jsx(L, { onMouseDown: (t) => t.stopPropagation(), onTouchStart: (t) => t.stopPropagation(), children: m }) });
+};
+export {
+  S as WithResizer
+};

package/dist/components/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./MaxHeightSmoother/index.cjs.js"),n=require("./MaxWidthSmoother/index.cjs.js"),i=require("./RightDrawer/RightDrawer.cjs.js"),o=require("./RightDrawer/useRightDrawerStore.cjs.js"),c=require("./PressableDiv/PressableDiv.cjs.js"),s=require("./ContentEditor/ContentEditor.cjs.js"),a=require("./ContentSelector/ContentSelector.cjs.js"),_=require("./DictionaryEditor/DictionaryEditor.cjs.js"),D=require("./DropDown/index.cjs.js"),d=require("./LocaleSwitcherDropDown/LocaleSwitcher.cjs.js"),p=require("./ThemeSwitcherDropDown/DesktopThemeSwitcher.cjs.js"),h=require("./ThemeSwitcherDropDown/MobileThemeSwitcher.cjs.js"),m=require("./ThemeSwitcherDropDown/types.cjs.js"),u=require("./RedirectionButton/RedirectionButton.cjs.js"),w=require("./Button/index.cjs.js"),t=require("./Container/index.cjs.js"),S=require("./Footer/index.cjs.js"),q=require("./Navbar/index.cjs.js"),l=require("./ProfileDropDown/index.cjs.js"),g=require("./Avatar/index.cjs.js"),x=require("./Logo/index.cjs.js"),R=require("./IDE/CodeRender.cjs.js"),C=require("./IDE/IDE.cjs.js"),M=require("./Popover/index.cjs.js"),v=require("./MarkDownRender/index.cjs.js"),e=require("./Headers/index.cjs.js"),H=require("./Loader/index.cjs.js");exports.MaxHeightSmoother=r.MaxHeightSmoother;exports.MaxWidthSmoother=n.MaxWidthSmoother;exports.RightDrawer=i.RightDrawer;exports.createRightDrawerStore=o.createRightDrawerStore;exports.useRightDrawerStore=o.useRightDrawerStore;exports.PressableDiv=c.PressableDiv;exports.ContentEditor=s.ContentEditor;exports.ContentSelector=a.ContentSelector;exports.DictionaryEditor=_.DictionaryEditor;exports.DropDown=D.DropDown;exports.LocaleSwitcher=d.LocaleSwitcher;exports.DesktopThemeSwitcher=p.DesktopThemeSwitcher;exports.MobileThemeSwitcher=h.MobileThemeSwitcher;exports.Modes=m.Modes;exports.RedirectionButton=u.RedirectionButton;exports.Button=w.Button;exports.Container=t.Container;exports.getContainerStyles=t.getContainerStyles;exports.Footer=S.Footer;exports.Navbar=q.Navbar;exports.ProfileDropDown=l.ProfileDropDown;exports.Avatar=g.Avatar;exports.Logo=x.Logo;exports.Code=R.Code;exports.IDE=C.IDE;exports.Popover=M.Popover;exports.MarkdownRenderer=v.MarkdownRenderer;exports.H1=e.H1;exports.H2=e.H2;exports.H3=e.H3;exports.H4=e.H4;exports.H5=e.H5;exports.Loader=H.Loader;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./MaxHeightSmoother/index.cjs.js"),n=require("./MaxWidthSmoother/index.cjs.js"),i=require("./RightDrawer/RightDrawer.cjs.js"),o=require("./RightDrawer/useRightDrawerStore.cjs.js"),c=require("./PressableDiv/PressableDiv.cjs.js"),s=require("./ContentEditor/ContentEditor.cjs.js"),a=require("./ContentSelector/ContentSelector.cjs.js"),_=require("./DictionaryEditor/DictionaryEditor.cjs.js"),d=require("./DropDown/index.cjs.js"),h=require("./LocaleSwitcherDropDown/LocaleSwitcher.cjs.js"),D=require("./ThemeSwitcherDropDown/DesktopThemeSwitcher.cjs.js"),p=require("./ThemeSwitcherDropDown/MobileThemeSwitcher.cjs.js"),m=require("./ThemeSwitcherDropDown/types.cjs.js"),u=require("./RedirectionButton/RedirectionButton.cjs.js"),w=require("./Button/index.cjs.js"),t=require("./Container/index.cjs.js"),S=require("./Footer/index.cjs.js"),q=require("./Navbar/index.cjs.js"),l=require("./ProfileDropDown/index.cjs.js"),x=require("./Avatar/index.cjs.js"),R=require("./Logo/index.cjs.js"),g=require("./IDE/CodeRender.cjs.js"),C=require("./IDE/IDE.cjs.js"),M=require("./Popover/index.cjs.js"),v=require("./MarkDownRender/index.cjs.js"),e=require("./Headers/index.cjs.js"),H=require("./Loader/index.cjs.js"),E=require("./WithResizer/index.cjs.js");exports.MaxHeightSmoother=r.MaxHeightSmoother;exports.MaxWidthSmoother=n.MaxWidthSmoother;exports.RightDrawer=i.RightDrawer;exports.createRightDrawerStore=o.createRightDrawerStore;exports.useRightDrawerStore=o.useRightDrawerStore;exports.PressableDiv=c.PressableDiv;exports.ContentEditor=s.ContentEditor;exports.ContentSelector=a.ContentSelector;exports.DictionaryEditor=_.DictionaryEditor;exports.DropDown=d.DropDown;exports.LocaleSwitcher=h.LocaleSwitcher;exports.DesktopThemeSwitcher=D.DesktopThemeSwitcher;exports.MobileThemeSwitcher=p.MobileThemeSwitcher;exports.Modes=m.Modes;exports.RedirectionButton=u.RedirectionButton;exports.Button=w.Button;exports.Container=t.Container;exports.getContainerStyles=t.getContainerStyles;exports.Footer=S.Footer;exports.Navbar=q.Navbar;exports.ProfileDropDown=l.ProfileDropDown;exports.Avatar=x.Avatar;exports.Logo=R.Logo;exports.Code=g.Code;exports.IDE=C.IDE;exports.Popover=M.Popover;exports.MarkdownRenderer=v.MarkdownRenderer;exports.H1=e.H1;exports.H2=e.H2;exports.H3=e.H3;exports.H4=e.H4;exports.H5=e.H5;exports.Loader=H.Loader;exports.WithResizer=E.WithResizer;

package/dist/components/index.d.ts

@@ -21,3 +21,4 @@ export * from './Popover';
 export * from './MarkDownRender';
 export * from './Headers';
 export * from './Loader';
+export * from './WithResizer';

package/dist/components/index.es.js

@@ -6,18 +6,18 @@ import { createRightDrawerStore as i, useRightDrawerStore as a } from "./RightDr
 import { PressableDiv as h } from "./PressableDiv/PressableDiv.es.js";
 import { ContentEditor as c } from "./ContentEditor/ContentEditor.es.js";
 import { ContentSelector as w } from "./ContentSelector/ContentSelector.es.js";
-import { DictionaryEditor as l } from "./DictionaryEditor/DictionaryEditor.es.js";
+import { DictionaryEditor as s } from "./DictionaryEditor/DictionaryEditor.es.js";
 import { DropDown as g } from "./DropDown/index.es.js";
-import { LocaleSwitcher as C } from "./LocaleSwitcherDropDown/LocaleSwitcher.es.js";
-import { DesktopThemeSwitcher as R } from "./ThemeSwitcherDropDown/DesktopThemeSwitcher.es.js";
+import { LocaleSwitcher as R } from "./LocaleSwitcherDropDown/LocaleSwitcher.es.js";
+import { DesktopThemeSwitcher as M } from "./ThemeSwitcherDropDown/DesktopThemeSwitcher.es.js";
 import { MobileThemeSwitcher as v } from "./ThemeSwitcherDropDown/MobileThemeSwitcher.es.js";
 import { Modes as E } from "./ThemeSwitcherDropDown/types.es.js";
 import { RedirectionButton as P } from "./RedirectionButton/RedirectionButton.es.js";
 import { Button as y } from "./Button/index.es.js";
-import { Container as T, getContainerStyles as A } from "./Container/index.es.js";
-import { Footer as I } from "./Footer/index.es.js";
-import { Navbar as W } from "./Navbar/index.es.js";
-import { ProfileDropDown as q } from "./ProfileDropDown/index.es.js";
+import { Container as T, getContainerStyles as W } from "./Container/index.es.js";
+import { Footer as A } from "./Footer/index.es.js";
+import { Navbar as I } from "./Navbar/index.es.js";
+import { ProfileDropDown as j } from "./ProfileDropDown/index.es.js";
 import { Avatar as G } from "./Avatar/index.es.js";
 import { Logo as K } from "./Logo/index.es.js";
 import { Code as Q } from "./IDE/CodeRender.es.js";
@@ -26,6 +26,7 @@ import { Popover as Y } from "./Popover/index.es.js";
 import { MarkdownRenderer as _ } from "./MarkDownRender/index.es.js";
 import { H1 as oo, H2 as ro, H3 as eo, H4 as to, H5 as mo } from "./Headers/index.es.js";
 import { Loader as xo } from "./Loader/index.es.js";
+import { WithResizer as io } from "./WithResizer/index.es.js";
 export {
   G as Avatar,
   y as Button,
@@ -33,10 +34,10 @@ export {
   T as Container,
   c as ContentEditor,
   w as ContentSelector,
-  R as DesktopThemeSwitcher,
-  l as DictionaryEditor,
+  M as DesktopThemeSwitcher,
+  s as DictionaryEditor,
   g as DropDown,
-  I as Footer,
+  A as Footer,
   oo as H1,
   ro as H2,
   eo as H3,
@@ -44,20 +45,21 @@ export {
   mo as H5,
   V as IDE,
   xo as Loader,
-  C as LocaleSwitcher,
+  R as LocaleSwitcher,
   K as Logo,
   _ as MarkdownRenderer,
   e as MaxHeightSmoother,
   m as MaxWidthSmoother,
   v as MobileThemeSwitcher,
   E as Modes,
-  W as Navbar,
+  I as Navbar,
   Y as Popover,
   h as PressableDiv,
-  q as ProfileDropDown,
+  j as ProfileDropDown,
   P as RedirectionButton,
   x as RightDrawer,
+  io as WithResizer,
   i as createRightDrawerStore,
-  A as getContainerStyles,
+  W as getContainerStyles,
   a as useRightDrawerStore
 };

package/dist/index-CJEkIqT6.cjs

@@ -0,0 +1 @@
+"use client";"use strict";const n=require("./jsx-runtime-D6agescH.cjs"),x=require("./styled-components.browser.esm-GqWwDlfY.cjs");require("./localeList-DlUgKn8J.cjs");const l=require("react"),h=require("./StringWrapper-DUDqtkwz.cjs"),m=require("./components/DictionaryEditor/ItemLayout.cjs.js");var u=(t=>(t.Translation="translation",t.Enumeration="enumeration",t))(u||{});const j=t=>{const{keyPath:e,section:i,onFocusKeyPath:s,focusedKeyPath:a=[]}=t;return i.map((r,o)=>{const c={key:o,type:"ArrayExpression"},p=[...e,c];return n.jsxRuntimeExports.jsx(m.ItemLayout,{level:e.length,title:`${o}`,description:"",isSelected:h.isSameKeyPath(p,a),onClick:g=>{g.stopPropagation(),s(p)},children:l.createElement(y,{...t,key:o,keyPath:p,section:r})},o)})},K=x.pt.div({marginLeft:"0.5rem",display:"grid",gridTemplateColumns:"auto 1fr",gap:"0.5rem"}),W=x.pt.span({display:"flex",alignItems:"center",fontWeight:"700"}),E=t=>{const{keyPath:e,section:i}=t;return n.jsxRuntimeExports.jsx(K,{children:Object.keys(i).filter(s=>!d.includes(s)).map(s=>{const a={type:u.Enumeration,key:s},r=[...e,a],o=i.enumeration[s];return n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[n.jsxRuntimeExports.jsx(W,{children:s}),l.createElement(y,{...t,key:s,keyPath:r,section:o})]})})})},f=t=>{const{keyPath:e,section:i,focusedKeyPath:s=[],onFocusKeyPath:a}=t;return Object.keys(i).filter(r=>!d.includes(r)).map(r=>{const o={key:r,type:"ObjectExpression"},c=[...e,o];return n.jsxRuntimeExports.jsx(m.ItemLayout,{level:e.length,title:r,description:"",isSelected:h.isSameKeyPath(c,s),onClick:p=>{p.stopPropagation(),a(c)},children:n.jsxRuntimeExports.jsx(y,{...t,keyPath:c,section:i[r]})},r)})},P=t=>{const{keyPath:e,section:i,locale:s}=t,a={type:u.Translation,key:s},r=[...e,a],o=i.translation[s];return n.jsxRuntimeExports.jsx(y,{...t,keyPath:r,section:o})},d=["filePath","id","nodeType"],b=t=>typeof(t==null?void 0:t.key)<"u"&&typeof(t==null?void 0:t.props)<"u",w=x.pt.span({fontSize:"0.75rem",lineHeight:"1rem","--tw-text-opacity":"1",color:"rgba(93, 93, 93, var(--tw-text-opacity))",'&:where([data-theme="dark"], [data-theme="dark"] *)':{"--tw-text-opacity":"1",color:"rgba(136, 136, 136, var(--tw-text-opacity))"}}),R=t=>{if(typeof t=="string")return t;const i=(r=>{if(r!=null&&r.props&&typeof r.props.children=="object"){const o=[],{children:c}=r.props;return Object.keys(c).forEach(p=>{o.push(R(c[p]))}),{...r,props:{...r.props,children:o}}}return{...r,props:{...r.props,children:r.props.children}}})(t),{type:s,props:a}=i;return l.createElement(s??"div",a,...a.children)},y=t=>{const{section:e}=t;if(typeof e=="object")return b(e)?n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[R(e),n.jsxRuntimeExports.jsx(w,{children:"React node not editable"})]}):e.nodeType===u.Translation?n.jsxRuntimeExports.jsx(P,{...t,section:e}):e.nodeType===u.Enumeration?n.jsxRuntimeExports.jsx(E,{...t,section:e}):Array.isArray(e)?n.jsxRuntimeExports.jsx(j,{...t,section:e}):n.jsxRuntimeExports.jsx(f,{...t,section:e});if(typeof e=="string")return n.jsxRuntimeExports.jsx(h.StringWrapper,{...t,section:e})};exports.ArrayWrapper=j;exports.EnumerationWrapper=E;exports.NestedObjectWrapper=f;exports.NodeWrapper=y;exports.TranslationWrapper=P;exports.traceKeys=d;

package/dist/index-DBWNacRP.js

@@ -0,0 +1,133 @@
+"use client";
+import { j as n } from "./jsx-runtime-Tw_Kw2GZ.js";
+import { p as h } from "./styled-components.browser.esm-D6kkzXl4.js";
+import "./localeList-CaRF-907.js";
+import { createElement as u } from "react";
+import { i as d, S as j } from "./StringWrapper-CW70GPXq.js";
+import { ItemLayout as f } from "./components/DictionaryEditor/ItemLayout.es.js";
+var l = /* @__PURE__ */ ((t) => (t.Translation = "translation", t.Enumeration = "enumeration", t))(l || {});
+const g = (t) => {
+  const {
+    keyPath: e,
+    section: o,
+    onFocusKeyPath: s,
+    focusedKeyPath: i = []
+  } = t;
+  return o.map((r, a) => {
+    const c = {
+      key: a,
+      type: "ArrayExpression"
+    }, p = [...e, c];
+    return /* @__PURE__ */ n.jsx(f, { level: e.length, title: `${a}`, description: "", isSelected: d(p, i), onClick: (P) => {
+      P.stopPropagation(), s(p);
+    }, children: /* @__PURE__ */ u(y, { ...t, key: a, keyPath: p, section: r }) }, a);
+  });
+}, E = h.div({
+  marginLeft: "0.5rem",
+  display: "grid",
+  gridTemplateColumns: "auto 1fr",
+  gap: "0.5rem"
+}), K = h.span({
+  display: "flex",
+  alignItems: "center",
+  fontWeight: "700"
+}), w = (t) => {
+  const {
+    keyPath: e,
+    section: o
+  } = t;
+  return /* @__PURE__ */ n.jsx(E, { children: Object.keys(o).filter((s) => !m.includes(s)).map((s) => {
+    const i = {
+      type: l.Enumeration,
+      key: s
+    }, r = [...e, i], a = o.enumeration[s];
+    return /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+      /* @__PURE__ */ n.jsx(K, { children: s }),
+      /* @__PURE__ */ u(y, { ...t, key: s, keyPath: r, section: a })
+    ] });
+  }) });
+}, b = (t) => {
+  const {
+    keyPath: e,
+    section: o,
+    focusedKeyPath: s = [],
+    onFocusKeyPath: i
+  } = t;
+  return Object.keys(o).filter((r) => !m.includes(r)).map((r) => {
+    const a = {
+      key: r,
+      type: "ObjectExpression"
+    }, c = [...e, a];
+    return /* @__PURE__ */ n.jsx(f, { level: e.length, title: r, description: "", isSelected: d(c, s), onClick: (p) => {
+      p.stopPropagation(), i(c);
+    }, children: /* @__PURE__ */ n.jsx(y, { ...t, keyPath: c, section: o[r] }) }, r);
+  });
+}, S = (t) => {
+  const {
+    keyPath: e,
+    section: o,
+    locale: s
+  } = t, i = {
+    type: l.Translation,
+    key: s
+  }, r = [...e, i], a = o.translation[s];
+  return /* @__PURE__ */ n.jsx(y, { ...t, keyPath: r, section: a });
+}, m = ["filePath", "id", "nodeType"], v = (t) => typeof (t == null ? void 0 : t.key) < "u" && typeof (t == null ? void 0 : t.props) < "u", A = h.span({
+  fontSize: "0.75rem",
+  lineHeight: "1rem",
+  "--tw-text-opacity": "1",
+  color: "rgba(93, 93, 93, var(--tw-text-opacity))",
+  '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+    "--tw-text-opacity": "1",
+    color: "rgba(136, 136, 136, var(--tw-text-opacity))"
+  }
+}), x = (t) => {
+  if (typeof t == "string")
+    return t;
+  const o = ((r) => {
+    if (r != null && r.props && typeof r.props.children == "object") {
+      const a = [], {
+        children: c
+      } = r.props;
+      return Object.keys(c).forEach((p) => {
+        a.push(x(c[p]));
+      }), {
+        ...r,
+        props: {
+          ...r.props,
+          children: a
+        }
+      };
+    }
+    return {
+      ...r,
+      props: {
+        ...r.props,
+        children: r.props.children
+      }
+    };
+  })(t), {
+    type: s,
+    props: i
+  } = o;
+  return u(s ?? "div", i, ...i.children);
+}, y = (t) => {
+  const {
+    section: e
+  } = t;
+  if (typeof e == "object")
+    return v(e) ? /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+      x(e),
+      /* @__PURE__ */ n.jsx(A, { children: "React node not editable" })
+    ] }) : e.nodeType === l.Translation ? /* @__PURE__ */ n.jsx(S, { ...t, section: e }) : e.nodeType === l.Enumeration ? /* @__PURE__ */ n.jsx(w, { ...t, section: e }) : Array.isArray(e) ? /* @__PURE__ */ n.jsx(g, { ...t, section: e }) : /* @__PURE__ */ n.jsx(b, { ...t, section: e });
+  if (typeof e == "string")
+    return /* @__PURE__ */ n.jsx(j, { ...t, section: e });
+};
+export {
+  g as A,
+  w as E,
+  y as N,
+  S as T,
+  b as a,
+  m as t
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intlayer/design-system",
-  "version": "2.0.11",
+  "version": "2.0.13",
   "private": false,
   "type": "module",
   "exports": {
@@ -26,13 +26,15 @@
   "dependencies": {
     "@emotion/is-prop-valid": "^1.2.2",
     "@tailwindcss/aspect-ratio": "^0.4.2",
+    "clsx": "^2.1.1",
     "framer-motion": "^11.2.12",
     "markdown-to-jsx": "^7.4.7",
     "react-copy-to-clipboard": "^5.1.0",
     "react-markdown": "^9.0.1",
+    "react-syntax-highlighter": "^15.5.0",
     "tailwindcss-animate": "^1.0.7",
-    "@intlayer/config": "^2.0.11",
-    "@intlayer/core": "^2.0.11"
+    "@intlayer/config": "^2.0.13",
+    "@intlayer/core": "^2.0.13"
   },
   "devDependencies": {
     "@types/react": "^18.3.3",
@@ -42,15 +44,11 @@
     "@typescript-eslint/eslint-plugin": "^7.14.1",
     "@typescript-eslint/parser": "^7.14.1",
     "@vitejs/plugin-react": "^4.3.1",
-    "clsx": "^2.1.1",
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.7",
     "glob": "^10.4.2",
     "lucide-react": "^0.376.0",
-    "react-syntax-highlighter": "^15.5.0",
-    "rehype-raw": "^7.0.0",
-    "remark-gfm": "^4.0.0",
     "rollup-plugin-preserve-directives": "^0.4.0",
     "styled-components": "^6.1.11",
     "tailwind-merge": "^2.3.0",
@@ -65,7 +63,6 @@
   "peerDependencies": {
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-syntax-highlighter": "^15.5.0",
     "rehype-raw": "^7.0.0",
     "remark-gfm": "^4.0.0",
     "zustand": "^4.5.2"

package/dist/index-B2ncVbtX.cjs

@@ -1 +0,0 @@
-"use client";"use strict";const r=require("./jsx-runtime-D6agescH.cjs");require("./localeList-DlUgKn8J.cjs");const y=require("react"),m=require("./StringWrapper-DUDqtkwz.cjs"),j=require("./components/DictionaryEditor/ItemLayout.cjs.js"),d=require("./styled-components.browser.esm-GqWwDlfY.cjs");var p=(e=>(e.Translation="translation",e.Enumeration="enumeration",e))(p||{});const h=e=>{const{keyPath:t,section:i,onFocusKeyPath:n,focusedKeyPath:a=[]}=e;return i.map((s,o)=>{const c={key:o,type:"ArrayExpression"},u=[...t,c];return r.jsxRuntimeExports.jsx(j.ItemLayout,{level:t.length,title:`${o}`,description:"",isSelected:m.isSameKeyPath(u,a),onClick:f=>{f.stopPropagation(),n(u)},children:y.createElement(l,{...e,key:o,keyPath:u,section:s})},o)})},W=d.pt.div({marginLeft:"0.5rem",display:"grid",gridTemplateColumns:"auto 1fr",gap:"0.5rem"}),g=d.pt.span({display:"flex",alignItems:"center",fontWeight:"700"}),E=e=>{const{keyPath:t,section:i}=e;return r.jsxRuntimeExports.jsx(W,{children:Object.keys(i).filter(n=>!x.includes(n)).map(n=>{const a={type:p.Enumeration,key:n},s=[...t,a],o=i.enumeration[n];return r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx(g,{children:n}),y.createElement(l,{...e,key:n,keyPath:s,section:o})]})})})},P=e=>{const{keyPath:t,section:i,focusedKeyPath:n=[],onFocusKeyPath:a}=e;return Object.keys(i).filter(s=>!x.includes(s)).map(s=>{const o={key:s,type:"ObjectExpression"},c=[...t,o];return r.jsxRuntimeExports.jsx(j.ItemLayout,{level:t.length,title:s,description:"",isSelected:m.isSameKeyPath(c,n),onClick:u=>{u.stopPropagation(),a(c)},children:r.jsxRuntimeExports.jsx(l,{...e,keyPath:c,section:i[s]})},s)})},K=e=>{const{keyPath:t,section:i,locale:n}=e,a={type:p.Translation,key:n},s=[...t,a],o=i.translation[n];return r.jsxRuntimeExports.jsx(l,{...e,keyPath:s,section:o})},x=["filePath","id","nodeType"],l=e=>{const{section:t}=e;if(typeof t=="object")return t.nodeType===p.Translation?r.jsxRuntimeExports.jsx(K,{...e,section:t}):t.nodeType===p.Enumeration?r.jsxRuntimeExports.jsx(E,{...e,section:t}):Array.isArray(t)?r.jsxRuntimeExports.jsx(h,{...e,section:t}):r.jsxRuntimeExports.jsx(P,{...e,section:t});if(typeof t=="string")return r.jsxRuntimeExports.jsx(m.StringWrapper,{...e,section:t})};exports.ArrayWrapper=h;exports.EnumerationWrapper=E;exports.NestedObjectWrapper=P;exports.NodeWrapper=l;exports.TranslationWrapper=K;exports.traceKeys=x;

package/dist/index-D-PWvdb-.js

@@ -1,91 +0,0 @@
-"use client";
-import { j as r } from "./jsx-runtime-Tw_Kw2GZ.js";
-import "./localeList-CaRF-907.js";
-import { createElement as m } from "react";
-import { i as h, S as j } from "./StringWrapper-CW70GPXq.js";
-import { ItemLayout as p } from "./components/DictionaryEditor/ItemLayout.es.js";
-import { p as d } from "./styled-components.browser.esm-D6kkzXl4.js";
-var y = /* @__PURE__ */ ((t) => (t.Translation = "translation", t.Enumeration = "enumeration", t))(y || {});
-const x = (t) => {
-  const {
-    keyPath: e,
-    section: o,
-    onFocusKeyPath: n,
-    focusedKeyPath: i = []
-  } = t;
-  return o.map((a, s) => {
-    const c = {
-      key: s,
-      type: "ArrayExpression"
-    }, l = [...e, c];
-    return /* @__PURE__ */ r.jsx(p, { level: e.length, title: `${s}`, description: "", isSelected: h(l, i), onClick: (f) => {
-      f.stopPropagation(), n(l);
-    }, children: /* @__PURE__ */ m(u, { ...t, key: s, keyPath: l, section: a }) }, s);
-  });
-}, K = d.div({
-  marginLeft: "0.5rem",
-  display: "grid",
-  gridTemplateColumns: "auto 1fr",
-  gap: "0.5rem"
-}), E = d.span({
-  display: "flex",
-  alignItems: "center",
-  fontWeight: "700"
-}), g = (t) => {
-  const {
-    keyPath: e,
-    section: o
-  } = t;
-  return /* @__PURE__ */ r.jsx(K, { children: Object.keys(o).filter((n) => !P.includes(n)).map((n) => {
-    const i = {
-      type: y.Enumeration,
-      key: n
-    }, a = [...e, i], s = o.enumeration[n];
-    return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-      /* @__PURE__ */ r.jsx(E, { children: n }),
-      /* @__PURE__ */ m(u, { ...t, key: n, keyPath: a, section: s })
-    ] });
-  }) });
-}, S = (t) => {
-  const {
-    keyPath: e,
-    section: o,
-    focusedKeyPath: n = [],
-    onFocusKeyPath: i
-  } = t;
-  return Object.keys(o).filter((a) => !P.includes(a)).map((a) => {
-    const s = {
-      key: a,
-      type: "ObjectExpression"
-    }, c = [...e, s];
-    return /* @__PURE__ */ r.jsx(p, { level: e.length, title: a, description: "", isSelected: h(c, n), onClick: (l) => {
-      l.stopPropagation(), i(c);
-    }, children: /* @__PURE__ */ r.jsx(u, { ...t, keyPath: c, section: o[a] }) }, a);
-  });
-}, w = (t) => {
-  const {
-    keyPath: e,
-    section: o,
-    locale: n
-  } = t, i = {
-    type: y.Translation,
-    key: n
-  }, a = [...e, i], s = o.translation[n];
-  return /* @__PURE__ */ r.jsx(u, { ...t, keyPath: a, section: s });
-}, P = ["filePath", "id", "nodeType"], u = (t) => {
-  const {
-    section: e
-  } = t;
-  if (typeof e == "object")
-    return e.nodeType === y.Translation ? /* @__PURE__ */ r.jsx(w, { ...t, section: e }) : e.nodeType === y.Enumeration ? /* @__PURE__ */ r.jsx(g, { ...t, section: e }) : Array.isArray(e) ? /* @__PURE__ */ r.jsx(x, { ...t, section: e }) : /* @__PURE__ */ r.jsx(S, { ...t, section: e });
-  if (typeof e == "string")
-    return /* @__PURE__ */ r.jsx(j, { ...t, section: e });
-};
-export {
-  x as A,
-  g as E,
-  u as N,
-  w as T,
-  S as a,
-  P as t
-};