tgui-core 4.3.0 → 4.3.2

package/dist/components/Floating.js

@@ -1 +1 @@
-import{Fragment as e,jsx as t,jsxs as n}from"react/jsx-runtime";import{classes as o}from"../common/react.js";import{FloatingPortal as i,autoUpdate as r,flip as a,offset as l,shift as s,size as c,useClick as d,useDismiss as m,useFloating as p,useHover as f,useInteractions as g,useTransitionStatus as h}from"@floating-ui/react";import{cloneElement as u,isValidElement as C,useEffect as v,useId as w,useState as F}from"react";function b(b){let x,{allowedOutsideClasses:y,animationDuration:O,children:R,closeAfterInteract:j,content:k,contentAutoWidth:z,contentClasses:E,contentOffset:M=6,contentStyles:P,disabled:S,hoverDelay:N,hoverOpen:$,handleOpen:q,onMounted:A,placement:B,preventPortal:D,stopChildPropagation:G,onOpenChange:H}=b,I=w(),[J,K]=F(!1),{refs:L,floatingStyles:Q,context:T}=p({middleware:[l(M),a({padding:6}),s(),z&&c({apply({rects:e,elements:t}){t.floating.style.width=`${e.reference.width}px`}})],onOpenChange(e){K(e),H?.(e)},open:J,placement:B||"bottom",transform:!1,whileElementsMounted:(e,t,n)=>(void 0!==A&&A(),r(e,t,n,{ancestorResize:!1,ancestorScroll:!1,elementResize:!z}))}),{isMounted:U,status:V}=h(T,{duration:O||200}),W=m(T,{ancestorScroll:!0,outsidePress:e=>!y||e.target instanceof Element&&!e.target.closest(y)}),X=d(T,{enabled:!S}),Y=f(T,{enabled:!S,restMs:N||200}),Z=void 0!==q,{getReferenceProps:_,getFloatingProps:ee}=g(Z?[]:[W,$?Y:X]),et=_({ref:L.setReference,...G&&{onClick:e=>e.stopPropagation()}}),en=ee({onClick:()=>{j&&T.onOpenChange(!1)},ref:L.setFloating});v(()=>{Z&&T.onOpenChange(q)},[q]),x=C(R)?u(R,et):t("div",{...et,children:R});let eo=t("div",{className:o(["Floating",!O&&"Floating--animated",E]),"data-position":T.placement,"data-transition":V,style:{...Q,...P},...en,children:k});return n(e,{children:[x,U&&!!k&&(D?eo:t(i,{id:I,children:eo}))]})}export{b as Floating};
+import{Fragment as e,jsx as t,jsxs as n}from"react/jsx-runtime";import{classes as o}from"../common/react.js";import{FloatingPortal as i,autoUpdate as r,flip as a,offset as l,shift as s,size as c,useClick as d,useDismiss as m,useFloating as p,useHover as g,useInteractions as f,useTransitionStatus as h}from"@floating-ui/react";import{cloneElement as u,isValidElement as C,useEffect as v,useState as w}from"react";function F(F){let b,{allowedOutsideClasses:x,animationDuration:y,children:O,closeAfterInteract:R,content:j,contentAutoWidth:k,contentClasses:z,contentOffset:E=6,contentStyles:M,disabled:P,hoverDelay:S,hoverOpen:N,handleOpen:$,onMounted:q,placement:A,preventPortal:B,stopChildPropagation:D,onOpenChange:G}=F,[H,I]=w(!1),{refs:J,floatingStyles:K,context:L}=p({middleware:[l(E),a({padding:6}),s(),k&&c({apply({rects:e,elements:t}){t.floating.style.width=`${e.reference.width}px`}})],onOpenChange(e){I(e),G?.(e)},open:H,placement:A||"bottom",transform:!1,whileElementsMounted:(e,t,n)=>(void 0!==q&&q(),r(e,t,n,{ancestorResize:!1,ancestorScroll:!1,elementResize:!1}))}),{isMounted:Q,status:T}=h(L,{duration:y||200}),U=m(L,{ancestorScroll:!0,outsidePress:e=>!x||e.target instanceof Element&&!e.target.closest(x)}),V=d(L,{enabled:!P}),W=g(L,{enabled:!P,restMs:S||200}),X=void 0!==$,{getReferenceProps:Y,getFloatingProps:Z}=f(X?[]:[U,N?W:V]),_=Y({ref:J.setReference,...D&&{onClick:e=>e.stopPropagation()}}),ee=Z({onClick:()=>{R&&L.onOpenChange(!1)},ref:J.setFloating});v(()=>{X&&L.onOpenChange($)},[$]),b=C(O)?u(O,_):t("div",{..._,children:O});let et=t("div",{className:o(["Floating",!y&&"Floating--animated",z]),"data-position":L.placement,"data-transition":T,style:{...K,...M},...ee,children:j});return n(e,{children:[b,Q&&!!j&&(B?et:t(i,{id:"tgui-root",children:et}))]})}export{F as Floating};

package/dist/components/Icon.d.ts

@@ -12,7 +12,11 @@ type Props = {
     spin: BooleanLike;
 }> & Omit<BoxProps, 'children'>;
 export declare function Icon(props: Props): import("react/jsx-runtime").JSX.Element;
-declare function IconStack(props: BoxProps): import("react/jsx-runtime").JSX.Element;
+type IconStackProps = {
+    /** Works same as `Icon` size prop, but for all icons inside. */
+    size?: number;
+};
+declare function IconStack(props: BoxProps & IconStackProps): import("react/jsx-runtime").JSX.Element;
 /**
  * ## Icon
  *

package/dist/components/Icon.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{classes as e}from"../common/react.js";import{computeBoxClassName as o,computeBoxProps as r}from"../common/ui.js";let a=/-o$/;function s(s){let{name:n="",size:c,spin:i,className:m,rotation:f,...l}=s,p=l.style||{};c&&(p.fontSize=`${100*c}%`),f&&(p.transform=`rotate(${f}deg)`),l.style=p;let u=r(l),I="";if(n.startsWith("tg-"))I=n;else{let t=a.test(n),e=n.replace(a,""),o=!e.startsWith("fa-");I=t?"far ":"fas ",o&&(I+="fa-"),I+=e,i&&(I+=" fa-spin")}return t("i",{className:e(["Icon",I,m,o(l)]),...u})}(s||(s={})).Stack=function(a){let{className:s,children:n,...c}=a;return t("span",{className:e(["IconStack",s,o(c)]),...r(c),children:n})};export{s as Icon};
+import{jsx as t}from"react/jsx-runtime";import{classes as e}from"../common/react.js";import{computeBoxClassName as o,computeBoxProps as r}from"../common/ui.js";let s=/-o$/;function a(a){let{name:n="",size:c,spin:i,className:f,rotation:l,...m}=a,p=m.style||{};c&&(p.fontSize=`${100*c}%`),l&&(p.transform=`rotate(${l}deg)`),m.style=p;let u=r(m),I="";if(n.startsWith("tg-"))I=n;else{let t=s.test(n),e=n.replace(s,""),o=!e.startsWith("fa-");I=t?"far ":"fas ",o&&(I+="fa-"),I+=e,i&&(I+=" fa-spin")}return t("i",{className:e(["Icon",I,f,o(m)]),...u})}(a||(a={})).Stack=function(s){let{className:a,children:n,size:c,...i}=s,f=i.style||{};return c&&(f.fontSize=`${100*c}%`),i.style=f,t("span",{className:e(["IconStack",a,o(i)]),...r(i),children:n})};export{a as Icon};

package/dist/components/Tooltip.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{Floating as o}from"./Floating.js";function e(e){let{content:n,children:r,position:i}=e;return t(o,{content:n,contentAutoWidth:!1,contentClasses:"Tooltip",hoverOpen:!0,placement:i,children:r})}export{e as Tooltip};
+import{jsx as t}from"react/jsx-runtime";import{Floating as o}from"./Floating.js";function e(e){let{content:n,children:r,position:i}=e;return t(o,{content:n,contentClasses:"Tooltip",hoverOpen:!0,placement:i,children:r})}export{e as Tooltip};

package/package.json

@@ -6,18 +6,18 @@
   },
   "description": "TGUI core component library",
   "devDependencies": {
-    "@biomejs/biome": "^2.0.0-beta.6",
+    "@biomejs/biome": "^2.0.0",
     "@rsbuild/core": "^1.3.22",
     "@rsbuild/plugin-react": "^1.3.2",
     "@rsbuild/plugin-sass": "^1.3.2",
-    "@rslib/core": "^0.9.2",
-    "@storybook/addon-docs": "^9.0.9",
-    "@types/bun": "^1.2.15",
-    "@types/react": "^19.1.7",
+    "@rslib/core": "^0.10.0",
+    "@storybook/addon-docs": "^9.0.11",
+    "@types/bun": "^1.2.16",
+    "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "prettier": "^3.5.3",
     "sass": "^1.89.2",
-    "storybook": "^9.0.9",
+    "storybook": "^9.0.11",
     "storybook-addon-sass-postcss": "^0.3.2",
     "storybook-react-rsbuild": "^2.0.1",
     "typescript": "^5.8.3"
@@ -51,7 +51,7 @@
   ],
   "license": "MIT",
   "name": "tgui-core",
-  "packageManager": "bun@1.2.15",
+  "packageManager": "bun@1.2.16",
   "peerDependencies": {
     "react": "^19.1.0",
     "react-dom": "^19.1.0"
@@ -69,5 +69,5 @@
     "test": "bun test"
   },
   "type": "module",
-  "version": "4.3.0"
+  "version": "4.3.2"
 }

package/styles/components/Icon.scss

@@ -1,18 +1,16 @@
-.IconStack > .Icon {
-  position: absolute;
-  width: 100%;
-  text-align: center;
-}
-
 .IconStack {
   position: relative;
-  display: inline-block;
-  height: 1.2em;
-  line-height: 2em;
-  vertical-align: middle;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+
+  .Icon {
+    &:before {
+      vertical-align: middle;
+    }
 
-  &:after {
-    color: transparent;
-    content: ".";
+    &:not(:first-child) {
+      position: absolute;
+    }
   }
 }