@multiplatform.one/rich-text 6.1.0 → 6.4.0

package/dist/cjs/toolbar/ToolbarButton.cjs

@@ -32,38 +32,87 @@ var import_components = require("@multiplatform.one/components");
 var import_react = require("@phosphor-icons/react");
 var import_context = require("../context.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
-const BUTTON_SIZE = 30;
+const TARGET_SIZE = 44;
+const VISUAL_SIZE = 30;
+const ChromeBox = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "ToolbarButtonChrome",
+  alignItems: "center",
+  justifyContent: "center",
+  width: VISUAL_SIZE,
+  height: VISUAL_SIZE,
+  borderRadius: "$2",
+  hoverStyle: {
+    backgroundColor: "$color4"
+  },
+  variants: {
+    active: {
+      true: {
+        backgroundColor: "$color5"
+      }
+    },
+    stretch: {
+      true: {
+        width: "auto",
+        paddingHorizontal: "$2"
+      }
+    },
+    // An aria-disabled control must not light up on hover like a pressable
+    // one (DG-ST-03 / LC-40 washed chrome).
+    unavailable: {
+      true: {
+        hoverStyle: {
+          backgroundColor: "transparent"
+        }
+      }
+    }
+  }
+});
 function ToolbarButton({
   active,
   disabled,
   onPress,
   children,
   tooltip,
+  "aria-pressed": ariaPressed,
   ...props
 }) {
   const ctx = import_context.RichEditorContext.useStyledContext();
   const isDisabled = disabled ?? ctx.disabled;
+  const pressed = ariaPressed ?? (active !== void 0 ? !!active : void 0);
   const button = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
     chromeless: true,
-    disabled: isDisabled,
-    onPress,
-    width: BUTTON_SIZE,
-    height: BUTTON_SIZE,
+    "aria-disabled": isDisabled || void 0,
+    onPress: isDisabled ? void 0 : onPress,
+    cursor: isDisabled ? "not-allowed" : void 0,
+    opacity: isDisabled ? 0.5 : 1,
+    width: TARGET_SIZE,
+    height: TARGET_SIZE,
+    minWidth: TARGET_SIZE,
+    minHeight: TARGET_SIZE,
     padding: 0,
+    borderWidth: 0,
+    backgroundColor: "transparent",
+    hoverStyle: {
+      backgroundColor: "transparent"
+    },
+    pressStyle: {
+      backgroundColor: "transparent"
+    },
     borderRadius: "$2",
+    ...(pressed !== void 0 ? {
+      "aria-pressed": pressed
+    } : void 0),
     ...(active ? {
       theme: "active"
     } : void 0),
     ...props,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
-      alignItems: "center",
-      justifyContent: "center",
-      width: "100%",
-      height: "100%",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(ChromeBox, {
+      active: !!active,
+      unavailable: !!isDisabled,
       children
     })
   });
-  if (tooltip) {
+  if (tooltip && !isDisabled) {
     return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Tooltip, {
       content: tooltip,
       placement: "bottom",
@@ -84,22 +133,38 @@ function ToolbarDropdownButton({
   const isDisabled = disabled ?? ctx.disabled;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
     chromeless: true,
-    disabled: isDisabled,
-    onPress,
-    height: BUTTON_SIZE,
-    paddingHorizontal: "$2",
+    "aria-disabled": isDisabled || void 0,
+    onPress: isDisabled ? void 0 : onPress,
+    cursor: isDisabled ? "not-allowed" : void 0,
+    opacity: isDisabled ? 0.5 : 1,
+    height: TARGET_SIZE,
+    minHeight: TARGET_SIZE,
+    paddingHorizontal: 0,
     paddingVertical: 0,
+    borderWidth: 0,
+    backgroundColor: "transparent",
+    hoverStyle: {
+      backgroundColor: "transparent"
+    },
+    pressStyle: {
+      backgroundColor: "transparent"
+    },
     borderRadius: "$2",
     ...(active ? {
       theme: "active"
     } : void 0),
     ...props,
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
-      alignItems: "center",
-      gap: "$1",
-      children: [children, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.CaretDownIcon, {
-        size: 10
-      })]
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(ChromeBox, {
+      active: !!active,
+      stretch: true,
+      unavailable: !!isDisabled,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+        alignItems: "center",
+        gap: "$1",
+        children: [children, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.CaretDownIcon, {
+          size: 10
+        })]
+      })
     })
   });
 }

package/dist/cjs/toolbar/ToolbarButton.native.js

@@ -40,19 +40,27 @@ function ToolbarButton(param) {
     children,
     size: sizeProp,
     compact: compactProp,
+    "aria-pressed": ariaPressed,
     ...props
   } = param;
   var ctx = import_context.RichEditorContext.useStyledContext();
   var size = sizeProp !== null && sizeProp !== void 0 ? sizeProp : ctx.size;
   var compact = compactProp !== null && compactProp !== void 0 ? compactProp : ctx.compact;
   var isDisabled = disabled !== null && disabled !== void 0 ? disabled : ctx.disabled;
+  var pressed = ariaPressed !== null && ariaPressed !== void 0 ? ariaPressed : active !== void 0 ? !!active : void 0;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
     chromeless: true,
     size,
     compact,
-    disabled: isDisabled,
-    onPress,
+    // DG-ST-03: aria-disabled explain, mirroring ToolbarButton.tsx —
+    // focusable, state announced, press swallowed, chrome dimmed.
+    "aria-disabled": isDisabled || void 0,
+    onPress: isDisabled ? void 0 : onPress,
+    opacity: isDisabled ? 0.5 : 1,
     paddingHorizontal: "$2",
+    ...(pressed !== void 0 ? {
+      "aria-pressed": pressed
+    } : void 0),
     ...(active ? {
       theme: "active"
     } : void 0),
@@ -78,8 +86,10 @@ function ToolbarDropdownButton(param) {
     chromeless: true,
     size,
     compact,
-    disabled: isDisabled,
-    onPress,
+    // DG-ST-03: aria-disabled explain (see ToolbarButton above).
+    "aria-disabled": isDisabled || void 0,
+    onPress: isDisabled ? void 0 : onPress,
+    opacity: isDisabled ? 0.5 : 1,
     ...(active ? {
       theme: "active"
     } : void 0),

package/dist/cjs/toolbar/ToolbarButton.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["ToolbarButton_native_exports","__export","ToolbarButton","ToolbarDropdownButton","module","exports","__toCommonJS","import_jsx_runtime","require","import_tamagui","import_forms","import_context","param","active","disabled","onPress","children","size","sizeProp","compact","compactProp","props","ctx","RichEditorContext","useStyledContext","isDisabled","jsx","Button","chromeless","paddingHorizontal","theme","jsxs","XStack","alignItems","gap","Text","fontSize"],"sources":["../../../src/toolbar/ToolbarButton.native.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,4BAAA;AAAAC,QAAA,CAAAD,4BAAA;EAAAE,aAAA,EAAAA,CAAA,KAAAA,aAAA;EAAAC,qBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAC,YAAA,CAAAN,4BAAA;AAAA,IAAAO,kBAAA,GAA2CC,OAAA;AAIvC,IAAAC,cAAA,GAA6BD,OAAA;AACjC,IAAAE,YAAA,GAAuBF,OAAA;AACvB,IAAAG,cAAA,GAAkCH,OAAA;AAO3B,SAASN,cAAcU,KAAA,EAAO;EACjC,IAAI;IAAEC,MAAA;IAAQC,QAAA;IAAUC,OAAA;IAASC,QAAA;IAAUC,IAAA,EAAMC,QAAA;IAAUC,OAAA,EAASC,WAAA;IAAa,GAAGC;EAAM,IAAIT,KAAA;EAC9F,IAAIU,GAAA,GAAMX,cAAA,CAAAY,iBAAA,CAAkBC,gBAAA,CAAiB;EAC7C,IAAIP,IAAA,GAAOC,QAAA,KAAa,QAAQA,QAAA,KAAa,SAASA,QAAA,GAAWI,GAAA,CAAIL,IAAA;EACrE,IAAIE,OAAA,GAAUC,WAAA,KAAgB,QAAQA,WAAA,KAAgB,SAASA,WAAA,GAAcE,GAAA,CAAIH,OAAA;EACjF,IAAIM,UAAA,GAAaX,QAAA,KAAa,QAAQA,QAAA,KAAa,SAASA,QAAA,GAAWQ,GAAA,CAAIR,QAAA;EAC3E,OAAqB,mBAAAP,kBAAA,CAAAmB,GAAA,EAAKhB,YAAA,CAAAiB,MAAA,EAAQ;IAC9BC,UAAA,EAAY;IACZX,IAAA;IACAE,OAAA;IACAL,QAAA,EAAUW,UAAA;IACVV,OAAA;IACAc,iBAAA,EAAmB;IACnB,IAAGhB,MAAA,GAAS;MACRiB,KAAA,EAAO;IACX,IAAI;IACJ,GAAGT,KAAA;IACHL;EACJ,CAAC;AACL;AAIO,SAASb,sBAAsBS,KAAA,EAAO;EACzC,IAAI;IAAEC,MAAA;IAAQC,QAAA;IAAUC,OAAA;IAASC,QAAA;IAAUC,IAAA,EAAMC,QAAA;IAAUC,OAAA,EAASC,WAAA;IAAa,GAAGC;EAAM,IAAIT,KAAA;EAC9F,IAAIU,GAAA,GAAMX,cAAA,CAAAY,iBAAA,CAAkBC,gBAAA,CAAiB;EAC7C,IAAIP,IAAA,GAAOC,QAAA,KAAa,QAAQA,QAAA,KAAa,SAASA,QAAA,GAAWI,GAAA,CAAIL,IAAA;EACrE,IAAIE,OAAA,GAAUC,WAAA,KAAgB,QAAQA,WAAA,KAAgB,SAASA,WAAA,GAAcE,GAAA,CAAIH,OAAA;EACjF,IAAIM,UAAA,GAAaX,QAAA,KAAa,QAAQA,QAAA,KAAa,SAASA,QAAA,GAAWQ,GAAA,CAAIR,QAAA;EAC3E,OAAqB,mBAAAP,kBAAA,CAAAmB,GAAA,EAAKhB,YAAA,CAAAiB,MAAA,EAAQ;IAC9BC,UAAA,EAAY;IACZX,IAAA;IACAE,OAAA;IACAL,QAAA,EAAUW,UAAA;IACVV,OAAA;IACA,IAAGF,MAAA,GAAS;MACRiB,KAAA,EAAO;IACX,IAAI;IACJ,GAAGT,KAAA;IACHL,QAAA,EAAwB,mBAAAT,kBAAA,CAAAwB,IAAA,EAAMtB,cAAA,CAAAuB,MAAA,EAAQ;MAClCC,UAAA,EAAY;MACZC,GAAA,EAAK;MACLlB,QAAA,EAAU,CACNA,QAAA,EACc,mBAAAT,kBAAA,CAAAmB,GAAA,EAAKjB,cAAA,CAAA0B,IAAA,EAAM;QACrBC,QAAA,EAAU;QACVpB,QAAA,EAAU;MACd,CAAC;IAET,CAAC;EACL,CAAC;AACL","ignoreList":[]}
+{"version":3,"names":["ToolbarButton_native_exports","__export","ToolbarButton","ToolbarDropdownButton","module","exports","__toCommonJS","import_jsx_runtime","require","import_tamagui","import_forms","import_context","param","active","disabled","onPress","children","size","sizeProp","compact","compactProp","ariaPressed","props","ctx","RichEditorContext","useStyledContext","isDisabled","pressed","jsx","Button","chromeless","opacity","paddingHorizontal","theme","jsxs","XStack","alignItems","gap","Text","fontSize"],"sources":["../../../src/toolbar/ToolbarButton.native.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}