@estiva-app/ui 0.13.0 → 0.13.1

package/dist/Card.d.ts

@@ -34,6 +34,12 @@ export interface CardProps extends ComponentPropsWithRef<'div'> {
     hover?: CardHover;
     /** No hairline until it is pointed at — a row in a feed that shows its edge only when you are on it. */
     quietUntilHover?: boolean;
+    /**
+     * Draw the hover look now, whatever the pointer does. For a card whose own menu or picker is open: the menu
+     * opens outside the card, so the pointer on it leaves the card, and the card would go dark under its own menu.
+     * Ignored while `selected` or `active`, like the pointer.
+     */
+    hovered?: boolean;
     /** The one you are on: the selected fill, a subtle hairline, and no hover. */
     selected?: boolean;
     /** Being changed in place: the selected fill with the accent hairline, and no hover. */
@@ -44,5 +50,5 @@ export interface CardProps extends ComponentPropsWithRef<'div'> {
     unreadable?: boolean;
     children: ReactNode;
 }
-export declare function Card({ fill, href, hover, quietUntilHover, selected, active, attention, unreadable, className, children, ...props }: CardProps): import("react").JSX.Element;
+export declare function Card({ fill, href, hover, quietUntilHover, hovered, selected, active, attention, unreadable, className, children, ...props }: CardProps): import("react").JSX.Element;
 //# sourceMappingURL=Card.d.ts.map

package/dist/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../src/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAI7D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAA;AAChE,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAA;AACpD,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAA;AAsBhD,MAAM,WAAW,SAAU,SAAQ,qBAAqB,CAAC,KAAK,CAAC;IAC7D,gDAAgD;IAChD,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,6HAA6H;IAC7H,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,qFAAqF;IACrF,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,wGAAwG;IACxG,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wFAAwF;IACxF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,8FAA8F;IAC9F,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,IAAI,CAAC,EACnB,IAAgB,EAChB,IAAI,EACJ,KAAkC,EAClC,eAAuB,EACvB,QAAgB,EAChB,MAAc,EACd,SAAS,EACT,UAAkB,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,SAAS,+BA+BX"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../src/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAI7D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAA;AAChE,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAA;AACpD,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAA;AA8BhD,MAAM,WAAW,SAAU,SAAQ,qBAAqB,CAAC,KAAK,CAAC;IAC7D,gDAAgD;IAChD,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,6HAA6H;IAC7H,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,qFAAqF;IACrF,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,wGAAwG;IACxG,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wFAAwF;IACxF,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,8FAA8F;IAC9F,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,IAAI,CAAC,EACnB,IAAgB,EAChB,IAAI,EACJ,KAAkC,EAClC,eAAuB,EACvB,OAAe,EACf,QAAgB,EAChB,MAAc,EACd,SAAS,EACT,UAAkB,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,SAAS,+BAkCX"}

package/dist/index.js

@@ -189,6 +189,12 @@ var HAIRLINE_HOVER_CLASSES = {
   inset: "hover:border-border-default",
   none: "hover:border-border-default"
 };
+var HAIRLINE_HELD_CLASSES = {
+  surface: "border-border-strong",
+  elevated: "border-border-strong",
+  inset: "border-border-default",
+  none: "border-border-default"
+};
 var ATTENTION_CLASSES = {
   accent: "border-accent-muted hover:border-accent-muted",
   warning: "border-warning-muted hover:border-warning-muted"
@@ -198,6 +204,7 @@ function Card({
   href,
   hover = href ? "hairline" : "none",
   quietUntilHover = false,
+  hovered = false,
   selected = false,
   active = false,
   attention,
@@ -215,7 +222,10 @@ function Card({
     quietUntilHover && "border-transparent",
     !still && hover === "hairline" && HAIRLINE_HOVER_CLASSES[fill],
     !still && hover === "fill" && "hover:bg-bg-hover hover:border-border-default",
-    !still && hover !== "none" && !href && props.onClick && "cursor-pointer",
+    !still && hovered && hover === "hairline" && HAIRLINE_HELD_CLASSES[fill],
+    !still && hovered && hover === "fill" && "bg-bg-hover border-border-default",
+    // The one you are on can still be clicked (it opens again); the one being changed cannot.
+    !active && hover !== "none" && !href && props.onClick && "cursor-pointer",
     selected && "bg-bg-selected border-border-subtle",
     active && "bg-bg-selected border-accent-primary",
     !active && attention && ATTENTION_CLASSES[attention],