@buoy-gg/ask-buoy 7.0.40 → 7.0.42

package/lib/commonjs/blocks/MediaBlocks.js

@@ -1,156 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ImageGrid = ImageGrid;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _agentCore = require("@buoy-gg/agent-core");
-var _primitives = require("./primitives");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Image grid — two columns up to six, a snapping horizontal carousel beyond
- * that. Tap a tile to see it full-width in place; tap again to shrink.
- *
- * `alt` is the picture's NAME: shown as the tile's heading and read by
- * VoiceOver. The schema no longer requires it — `normaliseImage` fills it from
- * `title`, the caption or the file name — so it is always a non-empty string
- * here.
- */
-
-function ImageGrid({
-  block
-}) {
-  const [open, setOpen] = (0, _react.useState)(null);
-  const {
-    width
-  } = (0, _reactNative.useWindowDimensions)();
-  const images = block.images.slice(0, _agentCore.CAPS.gridMax);
-  const carousel = images.length > _agentCore.CAPS.gridImages;
-  const tile = Math.min(150, Math.floor((width - 2 * _sharedUi.night.gutter - 24 - 8) / 2));
-  const Tile = ({
-    img,
-    i
-  }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-    testID: `buoy-block-image-${i}`,
-    accessibilityRole: "imagebutton",
-    accessibilityLabel: img.alt,
-    onPress: () => setOpen(open === i ? null : i),
-    style: [styles.tile, {
-      width: tile
-    }, carousel && styles.tileCarousel],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
-      source: {
-        uri: img.url
-      },
-      style: [styles.image, {
-        width: tile,
-        height: tile
-      }],
-      resizeMode: "contain",
-      accessibilityLabel: img.alt
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: styles.name,
-      numberOfLines: 1,
-      children: img.alt
-    }), img.caption ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: styles.caption,
-      numberOfLines: 1,
-      children: img.caption
-    }) : null]
-  }, `${img.url}-${i}`);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Card, {
-    title: block.title,
-    source: block.source,
-    testID: `buoy-block-imagegrid-${block.id}`,
-    children: [open !== null && images[open] ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
-      onPress: () => setOpen(null),
-      style: styles.hero,
-      accessibilityRole: "button",
-      accessibilityLabel: `Close ${images[open].alt}`,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
-        source: {
-          uri: images[open].url
-        },
-        style: styles.heroImage,
-        resizeMode: "contain",
-        accessibilityLabel: images[open].alt
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.heroCaption,
-        children: images[open].alt
-      }), images[open].caption ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.caption,
-        children: images[open].caption
-      }) : null]
-    }) : null, carousel ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
-      horizontal: true,
-      showsHorizontalScrollIndicator: false,
-      snapToInterval: tile + 8,
-      decelerationRate: "fast",
-      contentContainerStyle: styles.carousel,
-      children: images.map((img, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Tile, {
-        img: img,
-        i: i
-      }, i))
-    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.grid,
-      children: images.map((img, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Tile, {
-        img: img,
-        i: i
-      }, i))
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.MoreNote, {
-      shown: images.length,
-      total: block.total
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  grid: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 8,
-    padding: 12
-  },
-  carousel: {
-    gap: 8,
-    paddingHorizontal: 12,
-    paddingVertical: 12
-  },
-  tile: {
-    gap: 4
-  },
-  tileCarousel: {},
-  image: {
-    borderRadius: _sharedUi.night.radius.row,
-    backgroundColor: _sharedUi.night.color.fill
-  },
-  name: {
-    color: _sharedUi.night.color.text,
-    fontSize: _sharedUi.night.font.micro,
-    fontWeight: "600"
-  },
-  caption: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: _sharedUi.night.font.micro
-  },
-  hero: {
-    alignItems: "center",
-    padding: 12,
-    gap: 6,
-    borderBottomWidth: _reactNative.StyleSheet.hairlineWidth,
-    borderBottomColor: _sharedUi.night.color.separator
-  },
-  heroImage: {
-    width: "100%",
-    height: 240,
-    borderRadius: _sharedUi.night.radius.row,
-    backgroundColor: _sharedUi.night.color.fill
-  },
-  heroCaption: {
-    color: _sharedUi.night.color.text,
-    fontSize: _sharedUi.night.font.caption
-  }
-});
-//# sourceMappingURL=MediaBlocks.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ImageGrid=ImageGrid;var _react=require("react");var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _agentCore=require("@buoy-gg/agent-core");var _primitives=require("./primitives");var _jsxRuntime=require("react/jsx-runtime");function ImageGrid({block:o}){const[r,l]=(0,_react.useState)(null);const{width:c}=(0,_reactNative.useWindowDimensions)();const e=o.images.slice(0,_agentCore.CAPS.gridMax);const n=e.length>_agentCore.CAPS.gridImages;const a=Math.min(150,Math.floor((c-2*_sharedUi.night.gutter-24-8)/2));const s=({img:t,i})=>(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{testID:`buoy-block-image-${i}`,accessibilityRole:"imagebutton",accessibilityLabel:t.alt,onPress:()=>l(r===i?null:i),style:[styles.tile,{width:a},n&&styles.tileCarousel],children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{testID:"buoy-internal-chat-image",source:{uri:t.url},style:[styles.image,{width:a,height:a}],resizeMode:"contain",accessibilityLabel:t.alt}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.name,numberOfLines:1,children:t.alt}),t.caption?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.caption,numberOfLines:1,children:t.caption}):null]},`${t.url}-${i}`);return(0,_jsxRuntime.jsxs)(_primitives.Card,{title:o.title,source:o.source,testID:`buoy-block-imagegrid-${o.id}`,children:[r!==null&&e[r]?(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{onPress:()=>l(null),style:styles.hero,accessibilityRole:"button",accessibilityLabel:`Close ${e[r].alt}`,children:[(0,_jsxRuntime.jsx)(_reactNative.Image,{testID:"buoy-internal-chat-image",source:{uri:e[r].url},style:styles.heroImage,resizeMode:"contain",accessibilityLabel:e[r].alt}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.heroCaption,children:e[r].alt}),e[r].caption?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.caption,children:e[r].caption}):null]}):null,n?(0,_jsxRuntime.jsx)(_reactNative.ScrollView,{horizontal:true,showsHorizontalScrollIndicator:false,snapToInterval:a+8,decelerationRate:"fast",contentContainerStyle:styles.carousel,children:e.map((t,i)=>(0,_jsxRuntime.jsx)(s,{img:t,i},i))}):(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.grid,children:e.map((t,i)=>(0,_jsxRuntime.jsx)(s,{img:t,i},i))}),(0,_jsxRuntime.jsx)(_primitives.MoreNote,{shown:e.length,total:o.total})]})}const styles=_reactNative.StyleSheet.create({grid:{flexDirection:"row",flexWrap:"wrap",gap:8,padding:12},carousel:{gap:8,paddingHorizontal:12,paddingVertical:12},tile:{gap:4},tileCarousel:{},image:{borderRadius:_sharedUi.night.radius.row,backgroundColor:_sharedUi.night.color.fill},name:{color:_sharedUi.night.color.text,fontSize:_sharedUi.night.font.micro,fontWeight:"600"},caption:{color:_sharedUi.night.color.textSecondary,fontSize:_sharedUi.night.font.micro},hero:{alignItems:"center",padding:12,gap:6,borderBottomWidth:_reactNative.StyleSheet.hairlineWidth,borderBottomColor:_sharedUi.night.color.separator},heroImage:{width:"100%",height:240,borderRadius:_sharedUi.night.radius.row,backgroundColor:_sharedUi.night.color.fill},heroCaption:{color:_sharedUi.night.color.text,fontSize:_sharedUi.night.font.caption}});