@lokalise/harmony 1.2.0 → 1.4.0-exp-sidebarComponent.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.
Files changed (69) hide show
  1. package/README.md +3 -0
  2. package/dist/harmony.cjs +1 -1
  3. package/dist/harmony.css +1 -0
  4. package/dist/harmony.mjs +388 -35
  5. package/dist/types/fixtures/sidebar/profileMenu.d.ts +2 -0
  6. package/dist/types/fixtures/sidebar/tasks.d.ts +2 -0
  7. package/dist/types/index.d.ts +1 -1
  8. package/dist/types/src/components/NavigationPanel/NavigationPanel.d.ts +10 -0
  9. package/dist/types/src/components/NavigationPanel/components/Breadcrumbs/Breadcrumbs.d.ts +9 -0
  10. package/dist/types/src/components/NavigationPanel/components/Breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  11. package/dist/types/src/components/NavigationPanel/components/DropdownContent/DropdownContent.d.ts +4 -0
  12. package/dist/types/src/components/NavigationPanel/components/DropdownContent/DropdownContent.test.d.ts +1 -0
  13. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/NavigationTabs.d.ts +7 -0
  14. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/NavigationTabs.test.d.ts +1 -0
  15. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/NavigationTabsItem/NavItemContents.d.ts +7 -0
  16. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/NavigationTabsItem/NavigationTabsItem.d.ts +11 -0
  17. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/NavigationTabsItem/NavigationTabsItem.test.d.ts +1 -0
  18. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/__fixtures__/navigationMock.d.ts +2 -0
  19. package/dist/types/src/components/NavigationPanel/components/NavigationTabs/helpers.d.ts +2 -0
  20. package/dist/types/src/components/NavigationPanel/stories/NavigationPanel.stories.d.ts +6 -0
  21. package/dist/types/src/components/NavigationPanel/types/navigation.d.ts +21 -0
  22. package/dist/types/src/components/Sidebar/Sidebar.d.ts +45 -0
  23. package/dist/types/src/components/Sidebar/Sidebar.stories.d.ts +7 -0
  24. package/dist/types/src/components/Sidebar/UpgradeIcon/UpgradeIcon.d.ts +5 -0
  25. package/dist/types/src/components/Sidebar/Widgets/Avatar/Avatar.d.ts +8 -0
  26. package/dist/types/src/components/Sidebar/Widgets/IconLink/IconLink.d.ts +8 -0
  27. package/dist/types/src/components/Sidebar/Widgets/Menu/Menu.d.ts +2 -0
  28. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/ProfileMenu.d.ts +8 -0
  29. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/ProfileMenuContent.d.ts +6 -0
  30. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/ProfileMenuContext.d.ts +3 -0
  31. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/ProfileMenuProvider.d.ts +7 -0
  32. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/ProfileSettingsMenuItem/ProfileSettingsMenuItem.d.ts +7 -0
  33. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/TeamMenuItem/TeamMenuItem.d.ts +8 -0
  34. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/TeamSwitch/TeamSwitch.d.ts +6 -0
  35. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/UpgradeMenuItem/UpgradeMenuItem.d.ts +5 -0
  36. package/dist/types/src/components/Sidebar/Widgets/ProfileMenu/types.d.ts +22 -0
  37. package/dist/types/src/components/Sidebar/Widgets/Tasks/TaskLanguage/TaskLanguage.d.ts +6 -0
  38. package/dist/types/src/components/Sidebar/Widgets/Tasks/TaskLanguageCompleted/TaskLanguageCompleted.d.ts +7 -0
  39. package/dist/types/src/components/Sidebar/Widgets/Tasks/TaskOverview/TaskOverview.d.ts +5 -0
  40. package/dist/types/src/components/Sidebar/Widgets/Tasks/Tasks.d.ts +3 -0
  41. package/dist/types/src/components/Sidebar/Widgets/Tasks/TasksContext.d.ts +2 -0
  42. package/dist/types/src/components/Sidebar/Widgets/Tasks/TasksPopover/TasksPopover.d.ts +1 -0
  43. package/dist/types/src/components/Sidebar/Widgets/Tasks/TasksProvider.d.ts +10 -0
  44. package/dist/types/src/components/Sidebar/Widgets/Tasks/index.d.ts +2 -0
  45. package/dist/types/src/components/Sidebar/Widgets/Tasks/types.d.ts +85 -0
  46. package/dist/types/src/components/Sidebar/Widgets/Tasks/utils/content.d.ts +16 -0
  47. package/dist/types/src/components/Sidebar/Widgets/Tasks/utils/taskEvents.d.ts +23 -0
  48. package/dist/types/src/components/Sidebar/Widgets/index.d.ts +5 -0
  49. package/dist/types/src/components/Sidebar/types.d.ts +14 -0
  50. package/dist/types/src/components/Sidebar/utils/index.d.ts +4 -0
  51. package/dist/types/src/node.d.ts +5 -0
  52. package/dist/types/src/utils/billing/plan/plan.test.d.ts +1 -0
  53. package/dist/types/src/utils/content/text/text.test.d.ts +1 -0
  54. package/dist/types/src/utils/content/url/url.test.d.ts +1 -0
  55. package/dist/types/src/utils/hooks/useEffectOnce.d.ts +5 -0
  56. package/dist/types/src/utils/i18n/date/date.test.d.ts +1 -0
  57. package/dist/types/src/utils/node.d.ts +6 -0
  58. package/dist/types/src/utils/typeUtils.d.ts +3 -0
  59. package/dist/types/tests/setup.d.ts +0 -0
  60. package/dist/types/tests/utils.d.ts +7 -0
  61. package/dist/types/vite.config.d.ts +2 -0
  62. package/package.json +9 -3
  63. package/dist/types/components/NavigationPanel/NavigationPanel.d.ts +0 -1
  64. package/dist/types/components/NavigationPanel/NavigationPanel.stories.d.ts +0 -5
  65. package/dist/types/node.d.ts +0 -11
  66. /package/dist/types/{utils → src/utils}/billing/plan/plan.d.ts +0 -0
  67. /package/dist/types/{utils → src/utils}/content/text/text.d.ts +0 -0
  68. /package/dist/types/{utils → src/utils}/content/url/url.d.ts +0 -0
  69. /package/dist/types/{utils → src/utils}/i18n/date/date.d.ts +0 -0
package/README.md CHANGED
@@ -1,2 +1,5 @@
1
1
  # harmony
2
2
  A temporary shared library designed to house reusable components, such as molecules and organisms, exclusively for the Expert and Flow platforms during the migration period. This library will be retired upon the completion of the migration and the establishment of the unified next-gen platform.
3
+
4
+ ## Storybook
5
+ https://lokalise.github.io/harmony/?path=/story/app-shell-navigationpanel--default&args=sticky:!true
package/dist/harmony.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),g=require("react"),_=require("date-fns"),p=require("date-fns-tz"),T=()=>o.jsx("div",{children:"Navigation Panel"}),a=0,f=9999,u=[150,151,250,251],S=[152,153,252,253],N=[154,155,157,158,254,255,258,354,355,358],A=[156,159,160,256,259,260],l=9998,R=n=>n===a,I=n=>n===f,L=n=>u.includes(n),D=n=>S.includes(n),h=n=>N.includes(n),d=n=>A.includes(n),y=n=>n>a&&n<l,O=n=>n===l,k=/\n/,c=(n,e,t)=>n.split(e).flatMap((r,s)=>s!==0?[g.cloneElement(t,{key:Math.random().toString(32).slice(0,10)}),r]:r),m=(n,e,t)=>typeof n=="string"?c(n,e,t):n.flatMap(r=>typeof r=="string"?c(r,e,t):r),b=n=>m(n,k,o.jsx("br",{})),v=/(\b(https?|):\/\/[-a-zA-Zа-яА-Я0-9+&@#/%?=~_|!:,.;]*[-a-zA-Zа-яА-Я0-9+&@#/%=~_|])/gi,j=n=>n.match(v)??[],P=(n,e,t)=>{const r=n.split(e);if(r.length===1)return n;const s=[];return r[0]!==""&&s.push(r[0]),r.shift(),r[r.length-1]===""&&r.pop(),s.push(o.jsx("a",{href:e,target:"_blank",rel:"noreferrer noopener",children:e},e+t)),s.push(r.join(e)),s.filter(i=>i!=="")},E=n=>{const e=j(n);return e!=null&&e.length?e.reduce((t,r,s)=>typeof t=="string"?P(t,r,s):t.flatMap(i=>typeof i=="string"?P(i,r,s):i),n):n},F=n=>typeof n=="string"?E(n):n.flatMap(e=>typeof e=="string"?E(e):e,n),M=(n,e="PP")=>_.format(n,e),z=(n,e,t="PP")=>_.format(p.toZonedTime(n,e),t);exports.ENTERPRISE_OPENSOURCE_PLAN_ID=l;exports.ENTERPRISE_PLAN_IDS=A;exports.ESSENTIAL_PLAN_IDS=S;exports.FREE_PLAN_ID=a;exports.NavigationPanel=T;exports.PRO_PLAN_IDS=N;exports.START_PLAN_IDS=u;exports.TRIAL_PLAN_ID=f;exports.convertNewLineToBreakTag=b;exports.formatDate=M;exports.formatDateTz=z;exports.isEnterpriseOpenSourcePlan=O;exports.isEnterprisePlan=d;exports.isEssentialPlan=D;exports.isFreePlan=R;exports.isPaidPlan=y;exports.isProPlan=h;exports.isStartPlan=L;exports.isTrialPlan=I;exports.makeUrlClickable=F;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react/jsx-runtime"),_=require("react"),Te=require("date-fns"),qe=require("date-fns-tz");function Le(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const O=Le(_);var x=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function Se(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var L,re;function Y(){if(re)return L;re=1;function e(r){var n=typeof r;return r!=null&&(n=="object"||n=="function")}return L=e,L}var A,te;function Ae(){if(te)return A;te=1;var e=typeof x=="object"&&x&&x.Object===Object&&x;return A=e,A}var D,ne;function Ee(){if(ne)return D;ne=1;var e=Ae(),r=typeof self=="object"&&self&&self.Object===Object&&self,n=e||r||Function("return this")();return D=n,D}var k,ie;function De(){if(ie)return k;ie=1;var e=Ee(),r=function(){return e.Date.now()};return k=r,k}var C,oe;function ke(){if(oe)return C;oe=1;var e=/\s/;function r(n){for(var t=n.length;t--&&e.test(n.charAt(t)););return t}return C=r,C}var z,ae;function Ce(){if(ae)return z;ae=1;var e=ke(),r=/^\s+/;function n(t){return t&&t.slice(0,e(t)+1).replace(r,"")}return z=n,z}var M,se;function ye(){if(se)return M;se=1;var e=Ee(),r=e.Symbol;return M=r,M}var F,ue;function ze(){if(ue)return F;ue=1;var e=ye(),r=Object.prototype,n=r.hasOwnProperty,t=r.toString,i=e?e.toStringTag:void 0;function a(s){var u=n.call(s,i),c=s[i];try{s[i]=void 0;var o=!0}catch{}var l=t.call(s);return o&&(u?s[i]=c:delete s[i]),l}return F=a,F}var G,ce;function Me(){if(ce)return G;ce=1;var e=Object.prototype,r=e.toString;function n(t){return r.call(t)}return G=n,G}var B,le;function Fe(){if(le)return B;le=1;var e=ye(),r=ze(),n=Me(),t="[object Null]",i="[object Undefined]",a=e?e.toStringTag:void 0;function s(u){return u==null?u===void 0?i:t:a&&a in Object(u)?r(u):n(u)}return B=s,B}var U,fe;function Ge(){if(fe)return U;fe=1;function e(r){return r!=null&&typeof r=="object"}return U=e,U}var H,de;function Be(){if(de)return H;de=1;var e=Fe(),r=Ge(),n="[object Symbol]";function t(i){return typeof i=="symbol"||r(i)&&e(i)==n}return H=t,H}var W,be;function Ue(){if(be)return W;be=1;var e=Ce(),r=Y(),n=Be(),t=NaN,i=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,s=/^0o[0-7]+$/i,u=parseInt;function c(o){if(typeof o=="number")return o;if(n(o))return t;if(r(o)){var l=typeof o.valueOf=="function"?o.valueOf():o;o=r(l)?l+"":l}if(typeof o!="string")return o===0?o:+o;o=e(o);var g=a.test(o);return g||s.test(o)?u(o.slice(2),g?2:8):i.test(o)?t:+o}return W=c,W}var $,ge;function Pe(){if(ge)return $;ge=1;var e=Y(),r=De(),n=Ue(),t="Expected a function",i=Math.max,a=Math.min;function s(u,c,o){var l,g,R,E,d,m,y=0,j=!1,b=!1,T=!0;if(typeof u!="function")throw new TypeError(t);c=n(c)||0,e(o)&&(j=!!o.leading,b="maxWait"in o,R=b?i(n(o.maxWait)||0,c):R,T="trailing"in o?!!o.trailing:T);function v(f){var P=l,p=g;return l=g=void 0,y=f,E=u.apply(p,P),E}function h(f){return y=f,d=setTimeout(N,c),j?v(f):E}function I(f){var P=f-m,p=f-y,ee=c-P;return b?a(ee,R-p):ee}function Q(f){var P=f-m,p=f-y;return m===void 0||P>=c||P<0||b&&p>=R}function N(){var f=r();if(Q(f))return V(f);d=setTimeout(N,I(f))}function V(f){return d=void 0,T&&l?v(f):(l=g=void 0,E)}function Ne(){d!==void 0&&clearTimeout(d),y=0,l=m=g=d=void 0}function xe(){return d===void 0?E:V(r())}function q(){var f=r(),P=Q(f);if(l=arguments,g=this,m=f,P){if(d===void 0)return h(m);if(b)return clearTimeout(d),d=setTimeout(N,c),v(m)}return d===void 0&&(d=setTimeout(N,c)),E}return q.cancel=Ne,q.flush=xe,q}return $=s,$}var He=Pe();const We=Se(He);var Z,he;function $e(){if(he)return Z;he=1;var e=Pe(),r=Y(),n="Expected a function";function t(i,a,s){var u=!0,c=!0;if(typeof i!="function")throw new TypeError(n);return r(s)&&(u="leading"in s?!!s.leading:u,c="trailing"in s?!!s.trailing:c),e(i,a,{leading:u,maxWait:a,trailing:c})}return Z=t,Z}var Ze=$e();const Xe=Se(Ze),Ye=(e,r,n,t)=>{switch(r){case"debounce":return We(e,n,t);case"throttle":return Xe(e,n,t);default:return e}},Je=e=>{const r=O.useRef(e);return O.useEffect(()=>{r.current=e}),O.useMemo(()=>(...n)=>{var t;return(t=r.current)===null||t===void 0?void 0:t.call(r,...n)},[])},Ke=e=>{const[r,n]=O.useState((e==null?void 0:e.current)||null);return e&&setTimeout(()=>{e.current!==r&&n(e.current)},0),{refProxy:O.useMemo(()=>new Proxy(i=>{i!==r&&n(i)},{get(i,a){return a==="current"?r:i[a]},set(i,a,s){return a==="current"?n(s):i[a]=s,!0}}),[r]),refElement:r,setRefElement:n}},Qe=(e,r)=>r==="border-box"?{width:e.borderBoxSize[0].inlineSize,height:e.borderBoxSize[0].blockSize}:r==="content-box"?{width:e.contentBoxSize[0].inlineSize,height:e.contentBoxSize[0].blockSize}:{width:e.contentRect.width,height:e.contentRect.height};function Ve({skipOnMount:e=!1,refreshMode:r,refreshRate:n=1e3,refreshOptions:t,handleWidth:i=!0,handleHeight:a=!0,targetRef:s,observerOptions:u,onResize:c}={}){const o=_.useRef(e),l=Je(c),[g,R]=_.useState({width:void 0,height:void 0}),{refProxy:E,refElement:d}=Ke(s),{box:m}=u||{},y=_.useCallback(b=>{if(!i&&!a)return;if(o.current){o.current=!1;return}const T=(v,h)=>i&&v.width!==h.width||a&&v.height!==h.height;b.forEach(v=>{const h=Qe(v,m);R(I=>T(I,h)?(l==null||l({width:h.width,height:h.height,entry:v}),h):I)})},[i,a,o,m]),j=_.useCallback(Ye(y,r,n,t),[y,r,n,t]);return _.useEffect(()=>{let b;return d?(b=new window.ResizeObserver(j),b.observe(d,u)):(g.width||g.height)&&(l==null||l({width:null,height:null,entry:null}),R({width:void 0,height:void 0})),()=>{var T,v,h;(T=b==null?void 0:b.disconnect)===null||T===void 0||T.call(b),(h=(v=j).cancel)===null||h===void 0||h.call(v)}},[j,d]),Object.assign({ref:E},g)}function Re(e){var r,n,t="";if(typeof e=="string"||typeof e=="number")t+=e;else if(typeof e=="object")if(Array.isArray(e)){var i=e.length;for(r=0;r<i;r++)e[r]&&(n=Re(e[r]))&&(t&&(t+=" "),t+=n)}else for(n in e)e[n]&&(t&&(t+=" "),t+=n);return t}function er(){for(var e,r,n=0,t="",i=arguments.length;n<i;n++)(e=arguments[n])&&(r=Re(e))&&(t&&(t+=" "),t+=r);return t}const rr="_headerContainer_1cubo_1",tr="_headerContent_1cubo_34",nr="_staticEnabled_1cubo_50",X={headerContainer:rr,headerContent:tr,staticEnabled:nr},ir=77,w=({sticky:e,children:r})=>{const{ref:n,height:t}=Ve({refreshMode:"debounce",refreshRate:0}),[i,a]=_.useState(!1),s=()=>i?!e:!0;_.useEffect(()=>{const c=()=>{a(window.scrollY>0)};return window.addEventListener("scroll",c),()=>window.removeEventListener("scroll",c)},[]);const u=`${t||ir}px`;return S.jsx("div",{style:{minHeight:u},children:S.jsx("div",{children:S.jsxs("div",{ref:n,className:er(X.headerContent,{[X.staticEnabled]:s()}),children:[S.jsx(w.Header,{}),S.jsx(w.Tabs,{}),r]})})})};w.Header=({children:e})=>S.jsx("div",{className:X.headerContainer,children:e});w.Tabs=({children:e})=>S.jsx("div",{className:"flex justify-between gap-2 nowrap",children:e});const J=0,je=9999,pe=[150,151,250,251],Oe=[152,153,252,253],we=[154,155,157,158,254,255,258,354,355,358],Ie=[156,159,160,256,259,260],K=9998,or=e=>e===J,ar=e=>e===je,sr=e=>pe.includes(e),ur=e=>Oe.includes(e),cr=e=>we.includes(e),lr=e=>Ie.includes(e),fr=e=>e>J&&e<K,dr=e=>e===K,br=/\n/,ve=(e,r,n)=>e.split(r).flatMap((t,i)=>i!==0?[_.cloneElement(n,{key:Math.random().toString(32).slice(0,10)}),t]:t),gr=(e,r,n)=>typeof e=="string"?ve(e,r,n):e.flatMap(t=>typeof t=="string"?ve(t,r,n):t),hr=e=>gr(e,br,S.jsx("br",{})),vr=/(\b(https?|):\/\/[-a-zA-Zа-яА-Я0-9+&@#/%?=~_|!:,.;]*[-a-zA-Zа-яА-Я0-9+&@#/%=~_|])/gi,mr=e=>e.match(vr)??[],me=(e,r,n)=>{const t=e.split(r);if(t.length===1)return e;const i=[];return t[0]!==""&&i.push(t[0]),t.shift(),t[t.length-1]===""&&t.pop(),i.push(S.jsx("a",{href:r,target:"_blank",rel:"noreferrer noopener",children:r},r+n)),i.push(t.join(r)),i.filter(a=>a!=="")},_e=e=>{const r=mr(e);return r!=null&&r.length?r.reduce((n,t,i)=>typeof n=="string"?me(n,t,i):n.flatMap(a=>typeof a=="string"?me(a,t,i):a),e):e},_r=e=>typeof e=="string"?_e(e):e.flatMap(r=>typeof r=="string"?_e(r):r,e),Tr=(e,r="PP")=>Te.format(e,r),Sr=(e,r,n="PP")=>Te.format(qe.toZonedTime(e,r),n),Er=e=>{_.useEffect(e,[])};exports.ENTERPRISE_OPENSOURCE_PLAN_ID=K;exports.ENTERPRISE_PLAN_IDS=Ie;exports.ESSENTIAL_PLAN_IDS=Oe;exports.FREE_PLAN_ID=J;exports.NavigationPanel=w;exports.PRO_PLAN_IDS=we;exports.START_PLAN_IDS=pe;exports.TRIAL_PLAN_ID=je;exports.convertNewLineToBreakTag=hr;exports.formatDate=Tr;exports.formatDateTz=Sr;exports.isEnterpriseOpenSourcePlan=dr;exports.isEnterprisePlan=lr;exports.isEssentialPlan=ur;exports.isFreePlan=or;exports.isPaidPlan=fr;exports.isProPlan=cr;exports.isStartPlan=sr;exports.isTrialPlan=ar;exports.makeUrlClickable=_r;exports.useEffectOnce=Er;
@@ -0,0 +1 @@
1
+ ._headerContainer_1cubo_1{display:flex;margin-bottom:var(--lok-spacing-1);width:100%;align-items:center}._navigationTabList_1cubo_8{display:flex;list-style:none;flex-wrap:wrap;margin:0 0 0 calc(-1 * var(--lok-spacing-6));padding:0}._navigationTab_1cubo_8{border:none;margin:0;border-bottom:2px solid transparent;background:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font:var(--lok-typography-body-small-default);color:var(--lok-color-text-default);margin:0 0 0 var(--lok-spacing-6)}._navigationTab_1cubo_8[aria-selected=true]{font-weight:500;color:var(--lok-color-text-active);border-bottom-color:var(--lok-color-text-active)}._headerContent_1cubo_34{position:fixed;background-color:var(--lok-color-background-surface-default);top:0;left:95px;right:32px;z-index:899;padding-top:var(--lok-spacing-5);padding-left:30px;padding-right:30px;margin-left:-30px;margin-right:-30px;border-bottom:1px solid var(--lok-color-border-default)}._staticEnabled_1cubo_50{z-index:var(--lok-z-index-auto);position:relative;top:inherit;left:0;right:0;padding-top:0;box-shadow:none}
package/dist/harmony.mjs CHANGED
@@ -1,38 +1,391 @@
1
- import { jsx as i } from "react/jsx-runtime";
2
- import { cloneElement as u } from "react";
3
- import { format as f } from "date-fns";
4
- import { toZonedTime as g } from "date-fns-tz";
5
- const y = () => /* @__PURE__ */ i("div", { children: "Navigation Panel" }), P = 0, E = 9999, _ = [150, 151, 250, 251], h = [152, 153, 252, 253], S = [154, 155, 157, 158, 254, 255, 258, 354, 355, 358], A = [156, 159, 160, 256, 259, 260], p = 9998, k = (n) => n === P, M = (n) => n === E, b = (n) => _.includes(n), v = (n) => h.includes(n), O = (n) => S.includes(n), z = (n) => A.includes(n), U = (n) => n > P && n < p, Z = (n) => n === p, N = /\n/, c = (n, r, e) => n.split(r).flatMap((t, o) => o !== 0 ? [u(e, { key: Math.random().toString(32).slice(0, 10) }), t] : t), R = (n, r, e) => typeof n == "string" ? c(n, r, e) : n.flatMap((t) => typeof t == "string" ? c(t, r, e) : t), j = (n) => R(n, N, /* @__PURE__ */ i("br", {})), L = /(\b(https?|):\/\/[-a-zA-Zа-яА-Я0-9+&@#/%?=~_|!:,.;]*[-a-zA-Zа-яА-Я0-9+&@#/%=~_|])/gi, T = (n) => n.match(L) ?? [], l = (n, r, e) => {
6
- const t = n.split(r);
1
+ import { jsx as E, jsxs as Ie } from "react/jsx-runtime";
2
+ import * as w from "react";
3
+ import { useRef as qe, useState as _e, useCallback as V, useEffect as X, cloneElement as xe } from "react";
4
+ import { format as Te } from "date-fns";
5
+ import { toZonedTime as Ne } from "date-fns-tz";
6
+ var I = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
7
+ function Se(e) {
8
+ return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
9
+ }
10
+ var N, ee;
11
+ function Y() {
12
+ if (ee) return N;
13
+ ee = 1;
14
+ function e(r) {
15
+ var n = typeof r;
16
+ return r != null && (n == "object" || n == "function");
17
+ }
18
+ return N = e, N;
19
+ }
20
+ var L, re;
21
+ function Le() {
22
+ if (re) return L;
23
+ re = 1;
24
+ var e = typeof I == "object" && I && I.Object === Object && I;
25
+ return L = e, L;
26
+ }
27
+ var A, te;
28
+ function ye() {
29
+ if (te) return A;
30
+ te = 1;
31
+ var e = Le(), r = typeof self == "object" && self && self.Object === Object && self, n = e || r || Function("return this")();
32
+ return A = n, A;
33
+ }
34
+ var k, ne;
35
+ function Ae() {
36
+ if (ne) return k;
37
+ ne = 1;
38
+ var e = ye(), r = function() {
39
+ return e.Date.now();
40
+ };
41
+ return k = r, k;
42
+ }
43
+ var C, ie;
44
+ function ke() {
45
+ if (ie) return C;
46
+ ie = 1;
47
+ var e = /\s/;
48
+ function r(n) {
49
+ for (var t = n.length; t-- && e.test(n.charAt(t)); )
50
+ ;
51
+ return t;
52
+ }
53
+ return C = r, C;
54
+ }
55
+ var z, oe;
56
+ function Ce() {
57
+ if (oe) return z;
58
+ oe = 1;
59
+ var e = ke(), r = /^\s+/;
60
+ function n(t) {
61
+ return t && t.slice(0, e(t) + 1).replace(r, "");
62
+ }
63
+ return z = n, z;
64
+ }
65
+ var D, ae;
66
+ function Ee() {
67
+ if (ae) return D;
68
+ ae = 1;
69
+ var e = ye(), r = e.Symbol;
70
+ return D = r, D;
71
+ }
72
+ var G, ue;
73
+ function ze() {
74
+ if (ue) return G;
75
+ ue = 1;
76
+ var e = Ee(), r = Object.prototype, n = r.hasOwnProperty, t = r.toString, i = e ? e.toStringTag : void 0;
77
+ function a(u) {
78
+ var s = n.call(u, i), c = u[i];
79
+ try {
80
+ u[i] = void 0;
81
+ var o = !0;
82
+ } catch {
83
+ }
84
+ var f = t.call(u);
85
+ return o && (s ? u[i] = c : delete u[i]), f;
86
+ }
87
+ return G = a, G;
88
+ }
89
+ var M, se;
90
+ function De() {
91
+ if (se) return M;
92
+ se = 1;
93
+ var e = Object.prototype, r = e.toString;
94
+ function n(t) {
95
+ return r.call(t);
96
+ }
97
+ return M = n, M;
98
+ }
99
+ var B, ce;
100
+ function Ge() {
101
+ if (ce) return B;
102
+ ce = 1;
103
+ var e = Ee(), r = ze(), n = De(), t = "[object Null]", i = "[object Undefined]", a = e ? e.toStringTag : void 0;
104
+ function u(s) {
105
+ return s == null ? s === void 0 ? i : t : a && a in Object(s) ? r(s) : n(s);
106
+ }
107
+ return B = u, B;
108
+ }
109
+ var F, fe;
110
+ function Me() {
111
+ if (fe) return F;
112
+ fe = 1;
113
+ function e(r) {
114
+ return r != null && typeof r == "object";
115
+ }
116
+ return F = e, F;
117
+ }
118
+ var H, le;
119
+ function Be() {
120
+ if (le) return H;
121
+ le = 1;
122
+ var e = Ge(), r = Me(), n = "[object Symbol]";
123
+ function t(i) {
124
+ return typeof i == "symbol" || r(i) && e(i) == n;
125
+ }
126
+ return H = t, H;
127
+ }
128
+ var U, de;
129
+ function Fe() {
130
+ if (de) return U;
131
+ de = 1;
132
+ var e = Ce(), r = Y(), n = Be(), t = NaN, i = /^[-+]0x[0-9a-f]+$/i, a = /^0b[01]+$/i, u = /^0o[0-7]+$/i, s = parseInt;
133
+ function c(o) {
134
+ if (typeof o == "number")
135
+ return o;
136
+ if (n(o))
137
+ return t;
138
+ if (r(o)) {
139
+ var f = typeof o.valueOf == "function" ? o.valueOf() : o;
140
+ o = r(f) ? f + "" : f;
141
+ }
142
+ if (typeof o != "string")
143
+ return o === 0 ? o : +o;
144
+ o = e(o);
145
+ var h = a.test(o);
146
+ return h || u.test(o) ? s(o.slice(2), h ? 2 : 8) : i.test(o) ? t : +o;
147
+ }
148
+ return U = c, U;
149
+ }
150
+ var W, be;
151
+ function pe() {
152
+ if (be) return W;
153
+ be = 1;
154
+ var e = Y(), r = Ae(), n = Fe(), t = "Expected a function", i = Math.max, a = Math.min;
155
+ function u(s, c, o) {
156
+ var f, h, p, T, d, v, S = 0, R = !1, b = !1, _ = !0;
157
+ if (typeof s != "function")
158
+ throw new TypeError(t);
159
+ c = n(c) || 0, e(o) && (R = !!o.leading, b = "maxWait" in o, p = b ? i(n(o.maxWait) || 0, c) : p, _ = "trailing" in o ? !!o.trailing : _);
160
+ function m(l) {
161
+ var y = f, j = h;
162
+ return f = h = void 0, S = l, T = s.apply(j, y), T;
163
+ }
164
+ function g(l) {
165
+ return S = l, d = setTimeout(O, c), R ? m(l) : T;
166
+ }
167
+ function P(l) {
168
+ var y = l - v, j = l - S, Q = c - y;
169
+ return b ? a(Q, p - j) : Q;
170
+ }
171
+ function J(l) {
172
+ var y = l - v, j = l - S;
173
+ return v === void 0 || y >= c || y < 0 || b && j >= p;
174
+ }
175
+ function O() {
176
+ var l = r();
177
+ if (J(l))
178
+ return K(l);
179
+ d = setTimeout(O, P(l));
180
+ }
181
+ function K(l) {
182
+ return d = void 0, _ && f ? m(l) : (f = h = void 0, T);
183
+ }
184
+ function Pe() {
185
+ d !== void 0 && clearTimeout(d), S = 0, f = v = h = d = void 0;
186
+ }
187
+ function Oe() {
188
+ return d === void 0 ? T : K(r());
189
+ }
190
+ function x() {
191
+ var l = r(), y = J(l);
192
+ if (f = arguments, h = this, v = l, y) {
193
+ if (d === void 0)
194
+ return g(v);
195
+ if (b)
196
+ return clearTimeout(d), d = setTimeout(O, c), m(v);
197
+ }
198
+ return d === void 0 && (d = setTimeout(O, c)), T;
199
+ }
200
+ return x.cancel = Pe, x.flush = Oe, x;
201
+ }
202
+ return W = u, W;
203
+ }
204
+ var He = pe();
205
+ const Ue = /* @__PURE__ */ Se(He);
206
+ var $, he;
207
+ function We() {
208
+ if (he) return $;
209
+ he = 1;
210
+ var e = pe(), r = Y(), n = "Expected a function";
211
+ function t(i, a, u) {
212
+ var s = !0, c = !0;
213
+ if (typeof i != "function")
214
+ throw new TypeError(n);
215
+ return r(u) && (s = "leading" in u ? !!u.leading : s, c = "trailing" in u ? !!u.trailing : c), e(i, a, {
216
+ leading: s,
217
+ maxWait: a,
218
+ trailing: c
219
+ });
220
+ }
221
+ return $ = t, $;
222
+ }
223
+ var $e = We();
224
+ const Ze = /* @__PURE__ */ Se($e), Xe = (e, r, n, t) => {
225
+ switch (r) {
226
+ case "debounce":
227
+ return Ue(e, n, t);
228
+ case "throttle":
229
+ return Ze(e, n, t);
230
+ default:
231
+ return e;
232
+ }
233
+ }, Ye = (
234
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
235
+ (e) => {
236
+ const r = w.useRef(e);
237
+ return w.useEffect(() => {
238
+ r.current = e;
239
+ }), w.useMemo(() => (...n) => {
240
+ var t;
241
+ return (t = r.current) === null || t === void 0 ? void 0 : t.call(r, ...n);
242
+ }, []);
243
+ }
244
+ ), Je = (
245
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
246
+ (e) => {
247
+ const [r, n] = w.useState((e == null ? void 0 : e.current) || null);
248
+ return e && setTimeout(() => {
249
+ e.current !== r && n(e.current);
250
+ }, 0), { refProxy: w.useMemo(() => new Proxy((i) => {
251
+ i !== r && n(i);
252
+ }, {
253
+ get(i, a) {
254
+ return a === "current" ? r : i[a];
255
+ },
256
+ set(i, a, u) {
257
+ return a === "current" ? n(u) : i[a] = u, !0;
258
+ }
259
+ }), [r]), refElement: r, setRefElement: n };
260
+ }
261
+ ), Ke = (e, r) => r === "border-box" ? {
262
+ width: e.borderBoxSize[0].inlineSize,
263
+ height: e.borderBoxSize[0].blockSize
264
+ } : r === "content-box" ? {
265
+ width: e.contentBoxSize[0].inlineSize,
266
+ height: e.contentBoxSize[0].blockSize
267
+ } : {
268
+ width: e.contentRect.width,
269
+ height: e.contentRect.height
270
+ };
271
+ function Qe({ skipOnMount: e = !1, refreshMode: r, refreshRate: n = 1e3, refreshOptions: t, handleWidth: i = !0, handleHeight: a = !0, targetRef: u, observerOptions: s, onResize: c } = {}) {
272
+ const o = qe(e), f = Ye(c), [h, p] = _e({
273
+ width: void 0,
274
+ height: void 0
275
+ }), { refProxy: T, refElement: d } = Je(u), { box: v } = s || {}, S = V((b) => {
276
+ if (!i && !a)
277
+ return;
278
+ if (o.current) {
279
+ o.current = !1;
280
+ return;
281
+ }
282
+ const _ = (m, g) => i && m.width !== g.width || a && m.height !== g.height;
283
+ b.forEach((m) => {
284
+ const g = Ke(m, v);
285
+ p((P) => _(P, g) ? (f == null || f({
286
+ width: g.width,
287
+ height: g.height,
288
+ entry: m
289
+ }), g) : P);
290
+ });
291
+ }, [i, a, o, v]), R = V(Xe(S, r, n, t), [
292
+ S,
293
+ r,
294
+ n,
295
+ t
296
+ ]);
297
+ return X(() => {
298
+ let b;
299
+ return d ? (b = new window.ResizeObserver(R), b.observe(d, s)) : (h.width || h.height) && (f == null || f({
300
+ width: null,
301
+ height: null,
302
+ entry: null
303
+ }), p({ width: void 0, height: void 0 })), () => {
304
+ var _, m, g;
305
+ (_ = b == null ? void 0 : b.disconnect) === null || _ === void 0 || _.call(b), (g = (m = R).cancel) === null || g === void 0 || g.call(m);
306
+ };
307
+ }, [R, d]), Object.assign({ ref: T }, h);
308
+ }
309
+ function Re(e) {
310
+ var r, n, t = "";
311
+ if (typeof e == "string" || typeof e == "number") t += e;
312
+ else if (typeof e == "object") if (Array.isArray(e)) {
313
+ var i = e.length;
314
+ for (r = 0; r < i; r++) e[r] && (n = Re(e[r])) && (t && (t += " "), t += n);
315
+ } else for (n in e) e[n] && (t && (t += " "), t += n);
316
+ return t;
317
+ }
318
+ function Ve() {
319
+ for (var e, r, n = 0, t = "", i = arguments.length; n < i; n++) (e = arguments[n]) && (r = Re(e)) && (t && (t += " "), t += r);
320
+ return t;
321
+ }
322
+ const er = "_headerContainer_1cubo_1", rr = "_headerContent_1cubo_34", tr = "_staticEnabled_1cubo_50", Z = {
323
+ headerContainer: er,
324
+ headerContent: rr,
325
+ staticEnabled: tr
326
+ }, nr = 77, q = ({ sticky: e, children: r }) => {
327
+ const { ref: n, height: t } = Qe({
328
+ refreshMode: "debounce",
329
+ refreshRate: 0
330
+ }), [i, a] = _e(!1), u = () => i ? !e : !0;
331
+ X(() => {
332
+ const c = () => {
333
+ a(window.scrollY > 0);
334
+ };
335
+ return window.addEventListener("scroll", c), () => window.removeEventListener("scroll", c);
336
+ }, []);
337
+ const s = `${t || nr}px`;
338
+ return /* @__PURE__ */ E("div", { style: { minHeight: s }, children: /* @__PURE__ */ E("div", { children: /* @__PURE__ */ Ie(
339
+ "div",
340
+ {
341
+ ref: n,
342
+ className: Ve(Z.headerContent, {
343
+ [Z.staticEnabled]: u()
344
+ }),
345
+ children: [
346
+ /* @__PURE__ */ E(q.Header, {}),
347
+ /* @__PURE__ */ E(q.Tabs, {}),
348
+ r
349
+ ]
350
+ }
351
+ ) }) });
352
+ };
353
+ q.Header = ({ children: e }) => /* @__PURE__ */ E("div", { className: Z.headerContainer, children: e });
354
+ q.Tabs = ({ children: e }) => /* @__PURE__ */ E("div", { className: "flex justify-between gap-2 nowrap", children: e });
355
+ const je = 0, ir = 9999, or = [150, 151, 250, 251], ar = [152, 153, 252, 253], ur = [154, 155, 157, 158, 254, 255, 258, 354, 355, 358], sr = [156, 159, 160, 256, 259, 260], we = 9998, vr = (e) => e === je, _r = (e) => e === ir, Tr = (e) => or.includes(e), Sr = (e) => ar.includes(e), yr = (e) => ur.includes(e), Er = (e) => sr.includes(e), pr = (e) => e > je && e < we, Rr = (e) => e === we, cr = /\n/, ge = (e, r, n) => e.split(r).flatMap((t, i) => i !== 0 ? [xe(n, { key: Math.random().toString(32).slice(0, 10) }), t] : t), fr = (e, r, n) => typeof e == "string" ? ge(e, r, n) : e.flatMap((t) => typeof t == "string" ? ge(t, r, n) : t), jr = (e) => fr(e, cr, /* @__PURE__ */ E("br", {})), lr = /(\b(https?|):\/\/[-a-zA-Zа-яА-Я0-9+&@#/%?=~_|!:,.;]*[-a-zA-Zа-яА-Я0-9+&@#/%=~_|])/gi, dr = (e) => e.match(lr) ?? [], me = (e, r, n) => {
356
+ const t = e.split(r);
7
357
  if (t.length === 1)
8
- return n;
9
- const o = [];
10
- return t[0] !== "" && o.push(t[0]), t.shift(), t[t.length - 1] === "" && t.pop(), o.push(
11
- /* @__PURE__ */ i("a", { href: r, target: "_blank", rel: "noreferrer noopener", children: r }, r + e)
12
- ), o.push(t.join(r)), o.filter((s) => s !== "");
13
- }, a = (n) => {
14
- const r = T(n);
15
- return r != null && r.length ? r.reduce((e, t, o) => typeof e == "string" ? l(e, t, o) : e.flatMap((s) => typeof s == "string" ? l(s, t, o) : s), n) : n;
16
- }, w = (n) => typeof n == "string" ? a(n) : n.flatMap((r) => typeof r == "string" ? a(r) : r, n), C = (n, r = "PP") => f(n, r), F = (n, r, e = "PP") => f(g(n, r), e);
358
+ return e;
359
+ const i = [];
360
+ return t[0] !== "" && i.push(t[0]), t.shift(), t[t.length - 1] === "" && t.pop(), i.push(
361
+ /* @__PURE__ */ E("a", { href: r, target: "_blank", rel: "noreferrer noopener", children: r }, r + n)
362
+ ), i.push(t.join(r)), i.filter((a) => a !== "");
363
+ }, ve = (e) => {
364
+ const r = dr(e);
365
+ return r != null && r.length ? r.reduce((n, t, i) => typeof n == "string" ? me(n, t, i) : n.flatMap((a) => typeof a == "string" ? me(a, t, i) : a), e) : e;
366
+ }, wr = (e) => typeof e == "string" ? ve(e) : e.flatMap((r) => typeof r == "string" ? ve(r) : r, e), Pr = (e, r = "PP") => Te(e, r), Or = (e, r, n = "PP") => Te(Ne(e, r), n), Ir = (e) => {
367
+ X(e, []);
368
+ };
17
369
  export {
18
- p as ENTERPRISE_OPENSOURCE_PLAN_ID,
19
- A as ENTERPRISE_PLAN_IDS,
20
- h as ESSENTIAL_PLAN_IDS,
21
- P as FREE_PLAN_ID,
22
- y as NavigationPanel,
23
- S as PRO_PLAN_IDS,
24
- _ as START_PLAN_IDS,
25
- E as TRIAL_PLAN_ID,
26
- j as convertNewLineToBreakTag,
27
- C as formatDate,
28
- F as formatDateTz,
29
- Z as isEnterpriseOpenSourcePlan,
30
- z as isEnterprisePlan,
31
- v as isEssentialPlan,
32
- k as isFreePlan,
33
- U as isPaidPlan,
34
- O as isProPlan,
35
- b as isStartPlan,
36
- M as isTrialPlan,
37
- w as makeUrlClickable
370
+ we as ENTERPRISE_OPENSOURCE_PLAN_ID,
371
+ sr as ENTERPRISE_PLAN_IDS,
372
+ ar as ESSENTIAL_PLAN_IDS,
373
+ je as FREE_PLAN_ID,
374
+ q as NavigationPanel,
375
+ ur as PRO_PLAN_IDS,
376
+ or as START_PLAN_IDS,
377
+ ir as TRIAL_PLAN_ID,
378
+ jr as convertNewLineToBreakTag,
379
+ Pr as formatDate,
380
+ Or as formatDateTz,
381
+ Rr as isEnterpriseOpenSourcePlan,
382
+ Er as isEnterprisePlan,
383
+ Sr as isEssentialPlan,
384
+ vr as isFreePlan,
385
+ pr as isPaidPlan,
386
+ yr as isProPlan,
387
+ Tr as isStartPlan,
388
+ _r as isTrialPlan,
389
+ wr as makeUrlClickable,
390
+ Ir as useEffectOnce
38
391
  };
@@ -0,0 +1,2 @@
1
+ import { SidebarTeam } from '../../src/components/Sidebar/types';
2
+ export declare const createTeam: () => SidebarTeam;
@@ -0,0 +1,2 @@
1
+ import { SidebarTask } from '../../src/components/Sidebar/Widgets/Tasks/types';
2
+ export declare const createTask: () => SidebarTask;
@@ -1,2 +1,2 @@
1
- export * from './node'
1
+ export * from './src/node'
2
2
  export {}
@@ -0,0 +1,10 @@
1
+ import { PropsWithChildren } from 'react';
2
+ type NavigationPanelProps = {
3
+ sticky?: boolean;
4
+ } & PropsWithChildren;
5
+ export declare const NavigationPanel: {
6
+ ({ sticky, children }: NavigationPanelProps): import("react/jsx-runtime").JSX.Element;
7
+ Header({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
8
+ Tabs({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
9
+ };
10
+ export {};
@@ -0,0 +1,9 @@
1
+ type Item = {
2
+ name: string;
3
+ link: string;
4
+ };
5
+ type BreadcrumbsProps = {
6
+ items: Item[];
7
+ };
8
+ export declare const Breadcrumbs: ({ items }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
9
+ export {};
@@ -0,0 +1,4 @@
1
+ import { DropdownItem } from '../../types/navigation';
2
+ export declare const DropdownContent: ({ items }: {
3
+ items: DropdownItem[][];
4
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,7 @@
1
+ import { NavigationTabsItem as NavigationTabsItemTypes } from '../../types/navigation';
2
+ type NavigationTabsProps = {
3
+ navigation: NavigationTabsItemTypes[];
4
+ activeItem: string;
5
+ };
6
+ export declare const NavigationTabs: ({ navigation, activeItem }: NavigationTabsProps) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,7 @@
1
+ interface NavItemContentProps {
2
+ label: string;
3
+ badge?: number;
4
+ novel?: string;
5
+ }
6
+ export declare const NavItemContents: ({ label, badge, novel }: NavItemContentProps) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,11 @@
1
+ type NavigationTabsItemProps = {
2
+ label: string;
3
+ badge?: number;
4
+ disabled?: boolean;
5
+ active?: boolean;
6
+ onClick?: () => void;
7
+ href?: string;
8
+ novel?: string;
9
+ };
10
+ export declare const NavigationTabsItem: import('react').ForwardRefExoticComponent<NavigationTabsItemProps & import('react').RefAttributes<HTMLButtonElement>>;
11
+ export {};
@@ -0,0 +1,2 @@
1
+ import { NavigationTabsItem } from '../../../types/navigation';
2
+ export declare const navigation: NavigationTabsItem[];
@@ -0,0 +1,2 @@
1
+ import { NavigationTabsItem } from '../../types/navigation';
2
+ export declare const isNavigationItemVisible: (item: NavigationTabsItem) => boolean;
@@ -0,0 +1,6 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { NavigationPanel } from '../NavigationPanel';
3
+ declare const meta: Meta<typeof NavigationPanel>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof NavigationPanel>;
6
+ export declare const Default: Story;
@@ -0,0 +1,21 @@
1
+ export type NavIsActiveFunction = (input: string) => boolean;
2
+ export type NavItemIcon = 'tasks' | 'contributors' | 'download' | 'more' | 'files';
3
+ export type NavigationTabsItem = {
4
+ key: string;
5
+ label: string;
6
+ visible: boolean;
7
+ isActive?: NavIsActiveFunction;
8
+ disabled?: boolean;
9
+ badge?: number;
10
+ link?: string;
11
+ onClick?: () => void;
12
+ dropdown?: DropdownItem[][];
13
+ novel?: string;
14
+ icon?: NavItemIcon;
15
+ };
16
+ export type DropdownItem = {
17
+ label: string;
18
+ visible?: boolean;
19
+ link?: string;
20
+ onClick?: () => void;
21
+ };
@@ -0,0 +1,45 @@
1
+ import { HTMLProps, PropsWithChildren, ReactNode } from 'react';
2
+ type SidebarProps = HTMLProps<HTMLElement> & {
3
+ children: ReactNode;
4
+ };
5
+ declare const Sidebar: {
6
+ ({ children, ...navProps }: SidebarProps): import("react/jsx-runtime").JSX.Element;
7
+ Top({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
8
+ Bottom({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
9
+ Avatar: ({ src, href, ariaLabel, alt }: {
10
+ src: string;
11
+ href?: string;
12
+ ariaLabel?: string;
13
+ alt?: string;
14
+ }) => import("react/jsx-runtime").JSX.Element;
15
+ IconLink: ({ label, to, icon }: {
16
+ to: string;
17
+ label: string;
18
+ icon: ReactNode;
19
+ }) => import("react/jsx-runtime").JSX.Element;
20
+ Menu: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
21
+ Tasks: (props: {
22
+ config: import('./Widgets/Tasks/types').SidebarTasksConfig;
23
+ }) => import("react/jsx-runtime").JSX.Element;
24
+ ProfileMenu: ({ config, children }: {
25
+ config: import('./Widgets/ProfileMenu/types').SidebarProfileMenuConfig;
26
+ children: import('./Widgets/ProfileMenu/ProfileMenuContent').ProfileMenuContentProps["children"];
27
+ }) => import("react/jsx-runtime").JSX.Element;
28
+ TeamSwitch: ({ onSwitchTeam }: {
29
+ onSwitchTeam: (team: import('./types').SidebarTeam) => void;
30
+ }) => import("react/jsx-runtime").JSX.Element | null;
31
+ TeamMenuItem: ({ team, onClick, hidePlanLabel }: {
32
+ team?: import('./types').SidebarTeam;
33
+ onClick?: (team: import('./types').SidebarTeam) => void;
34
+ hidePlanLabel?: boolean;
35
+ }) => import("react/jsx-runtime").JSX.Element | null;
36
+ UpgradeMenuItem: ({ upgradeOptionHref }: {
37
+ upgradeOptionHref: string;
38
+ }) => import("react/jsx-runtime").JSX.Element | null;
39
+ ProfileSettingsMenuItem: ({ href, onClick, userEmail }: {
40
+ href: string;
41
+ userEmail: string;
42
+ onClick?: () => void;
43
+ }) => import("react/jsx-runtime").JSX.Element | null;
44
+ };
45
+ export { Sidebar };
@@ -0,0 +1,7 @@
1
+ import { Meta, StoryObj } from '@storybook/react';
2
+ import { Sidebar } from './Sidebar';
3
+ declare const meta: Meta<typeof Sidebar>;
4
+ export default meta;
5
+ type Story = StoryObj<typeof Sidebar>;
6
+ export declare const TopSectionOnly: Story;
7
+ export declare const FullSidebar: Story;
@@ -0,0 +1,5 @@
1
+ type UpgradeIconProps = {
2
+ className?: string;
3
+ };
4
+ export declare const UpgradeIcon: ({ className }: UpgradeIconProps) => import("react/jsx-runtime").JSX.Element;
5
+ export {};
@@ -0,0 +1,8 @@
1
+ type AvatarProps = {
2
+ src: string;
3
+ href?: string;
4
+ ariaLabel?: string;
5
+ alt?: string;
6
+ };
7
+ export declare const Avatar: ({ src, href, ariaLabel, alt }: AvatarProps) => import("react/jsx-runtime").JSX.Element;
8
+ export {};
@@ -0,0 +1,8 @@
1
+ import { ReactNode } from 'react';
2
+ type IconLinkProps = {
3
+ to: string;
4
+ label: string;
5
+ icon: ReactNode;
6
+ };
7
+ export declare const IconLink: ({ label, to, icon }: IconLinkProps) => import("react/jsx-runtime").JSX.Element;
8
+ export {};
@@ -0,0 +1,2 @@
1
+ import { PropsWithChildren } from 'react';
2
+ export declare const Menu: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ import { SidebarProfileMenuConfig } from './types';
2
+ import { ProfileMenuContentProps } from './ProfileMenuContent';
3
+ type ProfileMenuProps = {
4
+ config: SidebarProfileMenuConfig;
5
+ children: ProfileMenuContentProps['children'];
6
+ };
7
+ export declare const ProfileMenu: ({ config, children }: ProfileMenuProps) => import("react/jsx-runtime").JSX.Element;
8
+ export {};
@@ -0,0 +1,6 @@
1
+ import { ReactNode } from 'react';
2
+ import { SidebarProfileMenuRenderProps } from './types';
3
+ export type ProfileMenuContentProps = {
4
+ children: (props: SidebarProfileMenuRenderProps) => ReactNode;
5
+ };
6
+ export declare const ProfileMenuContent: ({ children }: ProfileMenuContentProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ import { SidebarProfileMenuContextProps } from './types';
2
+ export declare const ProfileMenuContext: import('react').Context<SidebarProfileMenuContextProps>;
3
+ export declare const useProfileMenu: () => SidebarProfileMenuContextProps;
@@ -0,0 +1,7 @@
1
+ import { PropsWithChildren } from 'react';
2
+ import { SidebarProfileMenuConfig } from './types';
3
+ type ProfileMenuProviderProps = PropsWithChildren<{
4
+ config: SidebarProfileMenuConfig;
5
+ }>;
6
+ export declare const ProfileMenuProvider: ({ children, config }: ProfileMenuProviderProps) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,7 @@
1
+ type ProfileSettingsMenuItemProps = {
2
+ href: string;
3
+ userEmail: string;
4
+ onClick?: () => void;
5
+ };
6
+ export declare const ProfileSettingsMenuItem: ({ href, onClick, userEmail }: ProfileSettingsMenuItemProps) => import("react/jsx-runtime").JSX.Element | null;
7
+ export {};
@@ -0,0 +1,8 @@
1
+ import { SidebarTeam } from '../../../types';
2
+ type TeamMenuItemProps = {
3
+ team?: SidebarTeam;
4
+ onClick?: (team: SidebarTeam) => void;
5
+ hidePlanLabel?: boolean;
6
+ };
7
+ export declare const TeamMenuItem: ({ team, onClick, hidePlanLabel }: TeamMenuItemProps) => import("react/jsx-runtime").JSX.Element | null;
8
+ export {};
@@ -0,0 +1,6 @@
1
+ import { SidebarTeam } from '../../../types';
2
+ type TeamSwitchProps = {
3
+ onSwitchTeam: (team: SidebarTeam) => void;
4
+ };
5
+ export declare const TeamSwitch: ({ onSwitchTeam }: TeamSwitchProps) => import("react/jsx-runtime").JSX.Element | null;
6
+ export {};
@@ -0,0 +1,5 @@
1
+ type UpgradeMenuItemProps = {
2
+ upgradeOptionHref: string;
3
+ };
4
+ export declare const UpgradeMenuItem: ({ upgradeOptionHref }: UpgradeMenuItemProps) => import("react/jsx-runtime").JSX.Element | null;
5
+ export {};
@@ -0,0 +1,22 @@
1
+ import { SidebarTeam } from '../../types';
2
+ export type SidebarProfileMenuConfig = {
3
+ teams: SidebarTeam[];
4
+ currentTeamId: number;
5
+ planId: number;
6
+ isLimitedView: boolean;
7
+ isTeamSuspended: boolean;
8
+ canAccessTeamSettings: boolean;
9
+ isEndOfTrialActive: boolean;
10
+ trialDaysLeft: number;
11
+ isProviderAlpha: boolean;
12
+ };
13
+ export type SidebarProfileMenuContextProps = SidebarProfileMenuConfig & {
14
+ currentTeam?: SidebarTeam;
15
+ otherTeams: SidebarTeam[];
16
+ canChangeBilling: boolean;
17
+ isOnFreeOrTrialPlan: boolean;
18
+ showUpgradeCta: boolean;
19
+ showBillingButton: boolean;
20
+ allowTeamCreation: boolean;
21
+ };
22
+ export type SidebarProfileMenuRenderProps = Pick<SidebarProfileMenuContextProps, 'otherTeams' | 'allowTeamCreation' | 'isLimitedView' | 'canAccessTeamSettings' | 'isEndOfTrialActive' | 'isTeamSuspended' | 'showBillingButton' | 'isProviderAlpha'>;
@@ -0,0 +1,6 @@
1
+ import { SidebarLanguage, SidebarTask } from '../types';
2
+ export type TaskLanguageProps = {
3
+ task: SidebarTask;
4
+ language: SidebarLanguage;
5
+ };
6
+ export declare const TaskLanguage: ({ language, task }: TaskLanguageProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,7 @@
1
+ import { SidebarLanguage, SidebarTask } from '../types';
2
+ type TaskLanguageCompletedProps = {
3
+ task: SidebarTask;
4
+ language: SidebarLanguage;
5
+ };
6
+ export declare const TaskLanguageCompleted: ({ task, language }: TaskLanguageCompletedProps) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,5 @@
1
+ import { SidebarTask } from '../types';
2
+ export type TaskProps = {
3
+ task: SidebarTask;
4
+ };
5
+ export declare const TaskOverview: ({ task }: TaskProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -0,0 +1,3 @@
1
+ export declare const Tasks: (props: {
2
+ config: import('./types').SidebarTasksConfig;
3
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,2 @@
1
+ export declare const TasksContext: import('react').Context<TasksContextProps>;
2
+ export declare const useTasks: () => TasksContextProps;
@@ -0,0 +1 @@
1
+ export declare const TasksPopover: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ import { FC, PropsWithChildren } from 'react';
2
+ import { SidebarTasksConfig } from './types';
3
+ type TasksProviderProps = PropsWithChildren<{
4
+ config: SidebarTasksConfig;
5
+ }>;
6
+ export declare const TasksProvider: ({ children, config }: TasksProviderProps) => import("react/jsx-runtime").JSX.Element;
7
+ export declare const withTasksContext: <P extends {
8
+ config: SidebarTasksConfig;
9
+ }>(WrappedComponent: FC<Omit<P, "config">>) => (props: P) => import("react/jsx-runtime").JSX.Element;
10
+ export {};
@@ -0,0 +1,2 @@
1
+ export { Tasks } from './Tasks';
2
+ export { dispatchTaskEvent, TaskEvents } from './utils/taskEvents';
@@ -0,0 +1,85 @@
1
+ import { TypesFromMap } from '../../../../utils/node.ts/typeUtils';
2
+ export declare const SidebarTaskStatuses: {
3
+ readonly Completed: "completed";
4
+ readonly InProgress: "in_progress";
5
+ readonly Created: "created";
6
+ readonly Queued: "queued";
7
+ };
8
+ export type SidebarTaskStatus = TypesFromMap<typeof SidebarTaskStatuses>;
9
+ export declare const SidebarTaskLanguageStatuses: {
10
+ readonly Completed: "completed";
11
+ readonly InProgress: "in_progress";
12
+ readonly Created: "created";
13
+ readonly Queued: "queued";
14
+ };
15
+ export type SidebarTaskLanguageStatus = TypesFromMap<typeof SidebarTaskLanguageStatuses>;
16
+ export declare const SidebarTaskTypeOptions: {
17
+ readonly translation: "translation";
18
+ readonly review: "review";
19
+ readonly lqa_by_ai: "lqa_by_ai";
20
+ readonly automatic_translation: "automatic_translation";
21
+ };
22
+ export type SidebarTaskTypeOption = TypesFromMap<typeof SidebarTaskTypeOptions>;
23
+ export type SidebarTaskStyleGuide = {
24
+ id: string;
25
+ name: string;
26
+ };
27
+ export type SidebarTaskLanguage = {
28
+ lang_id: string;
29
+ name: string;
30
+ progress?: number;
31
+ status: SidebarTaskLanguageStatus;
32
+ base_words_total: `${number}`;
33
+ base_words_done: `${number}`;
34
+ };
35
+ export type SidebarTask = {
36
+ id: string;
37
+ title: string;
38
+ status: SidebarTaskStatus;
39
+ langs: SidebarTaskLanguage[];
40
+ team_id: number;
41
+ created_by_fullname: string;
42
+ source_lang_name: string;
43
+ task_type: SidebarTaskTypeOption;
44
+ style_guides: SidebarTaskStyleGuide[];
45
+ description?: string;
46
+ project_name: string;
47
+ master_branching_enabled: '0' | '1';
48
+ branch_name: string | null;
49
+ due_date: string | null;
50
+ };
51
+ export type SidebarDefaultFnArgs = {
52
+ task: SidebarTask;
53
+ language: SidebarTaskLanguage;
54
+ };
55
+ export type SidebarDefaultFn = (props: SidebarDefaultFnArgs) => void;
56
+ export type SidebarTasksGetProjectUrlFnArgs = {
57
+ task: SidebarTask;
58
+ language?: SidebarTaskLanguage;
59
+ view?: 'single' | 'multi';
60
+ taskUncompleted?: boolean;
61
+ };
62
+ export type SidebarTasksGetProjectUrlFn = (props: SidebarTasksGetProjectUrlFnArgs) => string;
63
+ export type SidebarTaskTitleOnClickFn = (props: Pick<SidebarDefaultFnArgs, 'task'>) => void;
64
+ export type SidebarOnLanguageCompleteConfirmFnArgs = SidebarDefaultFnArgs & {
65
+ closePrompt: () => void;
66
+ };
67
+ export type SidebarOnLanguageCompleteConfirmFn = (props: SidebarOnLanguageCompleteConfirmFnArgs) => Promise<void>;
68
+ export type SidebarTasksConfig = {
69
+ getTasksCount: () => Promise<number>;
70
+ getTasks: () => Promise<SidebarTask[]>;
71
+ getProjectUrl: SidebarTasksGetProjectUrlFn;
72
+ onLanguageCompleteConfirm: SidebarOnLanguageCompleteConfirmFn;
73
+ onTasksWidgetOpen?: ({ tasks }: {
74
+ tasks: SidebarTask[];
75
+ }) => void;
76
+ taskTitleOnClick?: SidebarTaskTitleOnClickFn;
77
+ langNameOnClick?: SidebarDefaultFn;
78
+ langProgressOnClick?: SidebarDefaultFn;
79
+ };
80
+ export type SidebarTasksContextProps = Pick<SidebarTasksConfig, 'onTasksWidgetOpen' | 'getProjectUrl' | 'taskTitleOnClick' | 'langNameOnClick' | 'langProgressOnClick' | 'onLanguageCompleteConfirm'> & {
81
+ fetchTasks: () => Promise<void>;
82
+ tasks: SidebarTask[];
83
+ tasksCount: number;
84
+ loadingTasks: boolean;
85
+ };
@@ -0,0 +1,16 @@
1
+ import { SidebarLanguage, SidebarLanguageStatus, SidebarTask, SidebarTaskTypeOption } from '../types';
2
+ export declare const getStatusText: (status: SidebarLanguageStatus, progressValue: number) => "Closed" | "Completed" | "In progress" | "Not started" | "Queued" | "-";
3
+ export declare const resolveStatus: (language: SidebarLanguage) => SidebarLanguageStatus;
4
+ export declare const statusSortOrder: string[];
5
+ /**
6
+ * TODO - these should be taken from louis
7
+ */
8
+ export declare const tagColor: Record<SidebarTaskTypeOption, string>;
9
+ export declare const getTaskLanguages: (langs: SidebarTask["langs"]) => {
10
+ status: SidebarLanguageStatus;
11
+ lang_id: string;
12
+ name: string;
13
+ progress?: number;
14
+ base_words_total: `${number}`;
15
+ base_words_done: `${number}`;
16
+ }[];
@@ -0,0 +1,23 @@
1
+ export declare const TaskEvents: {
2
+ readonly TaskCompleted: "task_completed";
3
+ readonly TaskClosed: "task_closed";
4
+ readonly Refresh: "refresh";
5
+ readonly ShowDialog: "show_dialog";
6
+ };
7
+ export type TaskEvent = (typeof TaskEvents)[keyof typeof TaskEvents];
8
+ type SingleTaskPayload = {
9
+ taskId: string | number;
10
+ };
11
+ type DispatchTaskEventPayload = {
12
+ name: typeof TaskEvents.TaskCompleted;
13
+ detail: SingleTaskPayload;
14
+ } | {
15
+ name: typeof TaskEvents.TaskClosed;
16
+ detail: SingleTaskPayload;
17
+ } | {
18
+ name: typeof TaskEvents.Refresh;
19
+ } | {
20
+ name: typeof TaskEvents.ShowDialog;
21
+ };
22
+ export declare const dispatchTaskEvent: (props: DispatchTaskEventPayload) => void;
23
+ export {};
@@ -0,0 +1,5 @@
1
+ export { Avatar } from './Avatar/Avatar';
2
+ export { IconLink } from './IconLink/IconLink';
3
+ export { Menu } from './Menu/Menu';
4
+ export { Tasks } from './Tasks';
5
+ export { ProfileMenu } from './ProfileMenu/ProfileMenu';
@@ -0,0 +1,14 @@
1
+ import { TypesFromMap } from '../../utils/node.ts';
2
+ export declare const SidebarTeamRoles: {
3
+ readonly member: "member";
4
+ readonly admin: "admin";
5
+ readonly biller: "biller";
6
+ readonly owner: "owner";
7
+ };
8
+ export type SidebarTeamRole = TypesFromMap<typeof SidebarTeamRoles>;
9
+ export type SidebarTeam = {
10
+ id: number;
11
+ name: string;
12
+ role: SidebarTeamRole;
13
+ logoUrl: string;
14
+ };
@@ -0,0 +1,4 @@
1
+ export declare const splitFileName: (fileName: string) => {
2
+ name: string;
3
+ extension: string;
4
+ };
@@ -0,0 +1,5 @@
1
+ /**
2
+ * COMPONENTS EXPORTS
3
+ */
4
+ export { NavigationPanel } from './components/NavigationPanel/NavigationPanel';
5
+ export * from './utils/node';
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,5 @@
1
+ import { EffectCallback } from 'react';
2
+ /**
3
+ * React hook that runs an effect only once.
4
+ */
5
+ export declare const useEffectOnce: (effect: EffectCallback) => void;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,6 @@
1
+ export { isPaidPlan, isProPlan, isEnterpriseOpenSourcePlan, isEnterprisePlan, isEssentialPlan, isStartPlan, isFreePlan, isTrialPlan, ENTERPRISE_PLAN_IDS, START_PLAN_IDS, ESSENTIAL_PLAN_IDS, PRO_PLAN_IDS, FREE_PLAN_ID, TRIAL_PLAN_ID, ENTERPRISE_OPENSOURCE_PLAN_ID, } from './billing/plan/plan';
2
+ export { convertNewLineToBreakTag } from './content/text/text';
3
+ export { makeUrlClickable } from './content/url/url';
4
+ export { formatDate, formatDateTz } from './i18n/date/date';
5
+ export { useEffectOnce } from './hooks/useEffectOnce';
6
+ export type { TypesFromMap } from './typeUtils';
@@ -0,0 +1,3 @@
1
+ export type TypesFromMap<T extends {
2
+ [key: string]: string | number;
3
+ }> = T[keyof T];
File without changes
@@ -0,0 +1,7 @@
1
+ import { RenderOptions } from '@testing-library/react';
2
+ import { ReactElement } from 'react';
3
+ interface ExtendedRenderOptions extends RenderOptions {
4
+ theme?: 'light' | 'dark';
5
+ }
6
+ export declare const renderWithProviders: (ui: ReactElement, { theme, ...options }?: ExtendedRenderOptions) => import('@testing-library/react').RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;
7
+ export {};
@@ -0,0 +1,2 @@
1
+ declare const _default: import('vite').UserConfig;
2
+ export default _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lokalise/harmony",
3
- "version": "1.2.0",
3
+ "version": "1.4.0-exp-sidebarComponent.1",
4
4
  "author": {
5
5
  "name": "Lokalise",
6
6
  "url": "https://lokalise.com/"
@@ -30,7 +30,8 @@
30
30
  "storybook:build": "storybook build"
31
31
  },
32
32
  "peerDependencies": {
33
- "@lokalise/louis": ">=26.0.0",
33
+ "@lokalise/louis": ">=26.1.1",
34
+ "@lokalise/styled": ">=3.0.0",
34
35
  "@lokalise/token-dictionary": ">=2.42.1",
35
36
  "date-fns": ">=4.1",
36
37
  "date-fns-tz": ">=3.2",
@@ -40,8 +41,8 @@
40
41
  "devDependencies": {
41
42
  "@biomejs/biome": "^1.9.4",
42
43
  "@chromatic-com/storybook": "^3.2.4",
44
+ "@faker-js/faker": "^9.5.0",
43
45
  "@lokalise/biome-config": "^1.6.1",
44
- "@lokalise/styled": "^3.0.0",
45
46
  "@semantic-release/changelog": "^6.0.3",
46
47
  "@semantic-release/commit-analyzer": "^13.0.1",
47
48
  "@semantic-release/git": "^10.0.1",
@@ -70,6 +71,7 @@
70
71
  "eslint-plugin-storybook": "^0.11.2",
71
72
  "eslint-plugin-testing-library": "^7.1.1",
72
73
  "jsdom": "26.0.0",
74
+ "rimraf": "^6.0.1",
73
75
  "semantic-release": "^24.2.1",
74
76
  "storybook": "^8.6.0-alpha.1",
75
77
  "typescript": "^5.7.3",
@@ -87,5 +89,9 @@
87
89
  "require": "./dist/harmony.cjs",
88
90
  "import": "./dist/harmony.mjs"
89
91
  }
92
+ },
93
+ "dependencies": {
94
+ "clsx": "^2.1.1",
95
+ "react-resize-detector": "^11.0.1"
90
96
  }
91
97
  }
@@ -1 +0,0 @@
1
- export declare const NavigationPanel: () => import("react/jsx-runtime").JSX.Element;
@@ -1,5 +0,0 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- declare const meta: Meta;
3
- export default meta;
4
- type Story = StoryObj;
5
- export declare const Basic: Story;
@@ -1,11 +0,0 @@
1
- /**
2
- * COMPONENTS EXPORTS
3
- */
4
- export { NavigationPanel } from './components/NavigationPanel/NavigationPanel';
5
- /**
6
- * UTILITIES EXPORTS
7
- */
8
- export { isPaidPlan, isProPlan, isEnterpriseOpenSourcePlan, isEnterprisePlan, isEssentialPlan, isStartPlan, isFreePlan, isTrialPlan, ENTERPRISE_PLAN_IDS, START_PLAN_IDS, ESSENTIAL_PLAN_IDS, PRO_PLAN_IDS, FREE_PLAN_ID, TRIAL_PLAN_ID, ENTERPRISE_OPENSOURCE_PLAN_ID, } from './utils/billing/plan/plan';
9
- export { convertNewLineToBreakTag } from './utils/content/text/text';
10
- export { makeUrlClickable } from './utils/content/url/url';
11
- export { formatDate, formatDateTz } from './utils/i18n/date/date';