@cdx-ui/components 0.3.2 → 0.3.3

package/lib/commonjs/figma/InsightStack.figma.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _figma = _interopRequireDefault(require("figma"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// url=https://www.figma.com/design/0lEVMVlLj8ZS4fgItr3pmd/%E2%AD%90-Forge-DS--Components?node-id=13652-32306
+// source=packages/components/src/components/InsightStack/index.tsx
+// component=InsightStack
+
+const instance = _figma.default.selectedInstance;
+
+// Figma's `3+` bucket becomes the smallest count that draws both layers; code takes a number.
+const count = instance.getEnum('count', {
+  '1': 1,
+  '2': 2,
+  '3+': 3
+});
+const countProp = _figma.default.helpers.react.renderProp('count', count);
+
+// Found by Code Connect id, so the front card's layer name does not matter.
+const frontInsight = instance.findConnectedInstance('insight', {
+  traverseInstances: true
+});
+const frontSnippet = frontInsight?.type === 'INSTANCE' ? frontInsight.executeTemplate().example : _figma.default.code`<Insight layout="summary">
+    <Insight.Description>Description</Insight.Description>
+  </Insight>`;
+var _default = exports.default = {
+  id: 'insight-stack',
+  // Separate strings so the nested Insight template's identical import is deduped.
+  imports: ["import { InsightStack } from '@cdx-ui/components'", "import { Insight } from '@cdx-ui/components'"],
+  example: _figma.default.code`
+<InsightStack${countProp}>
+  ${frontSnippet}
+</InsightStack>`
+};
+//# sourceMappingURL=InsightStack.figma.js.map

package/lib/commonjs/figma/InsightStack.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_figma","_interopRequireDefault","require","e","__esModule","default","instance","figma","selectedInstance","count","getEnum","countProp","helpers","react","renderProp","frontInsight","findConnectedInstance","traverseInstances","frontSnippet","type","executeTemplate","example","code","_default","exports","id","imports"],"sourceRoot":"../../../src","sources":["figma/InsightStack.figma.ts"],"mappings":";;;;;;AAGA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAH1B;AACA;AACA;;AAGA,MAAMG,QAAQ,GAAGC,cAAK,CAACC,gBAAgB;;AAEvC;AACA,MAAMC,KAAK,GAAGH,QAAQ,CAACI,OAAO,CAAC,OAAO,EAAE;EACtC,GAAG,EAAE,CAAC;EACN,GAAG,EAAE,CAAC;EACN,IAAI,EAAE;AACR,CAAC,CAAC;AACF,MAAMC,SAAS,GAAGJ,cAAK,CAACK,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,OAAO,EAAEL,KAAK,CAAC;;AAEhE;AACA,MAAMM,YAAY,GAAGT,QAAQ,CAACU,qBAAqB,CAAC,SAAS,EAAE;EAAEC,iBAAiB,EAAE;AAAK,CAAC,CAAC;AAC3F,MAAMC,YAAY,GAChBH,YAAY,EAAEI,IAAI,KAAK,UAAU,GAC7BJ,YAAY,CAACK,eAAe,CAAC,CAAC,CAACC,OAAO,GACtCd,cAAK,CAACe,IAAI;AAChB;AACA,aAAa;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAnB,OAAA,GAEC;EACboB,EAAE,EAAE,eAAe;EACnB;EACAC,OAAO,EAAE,CACP,mDAAmD,EACnD,8CAA8C,CAC/C;EACDL,OAAO,EAAEd,cAAK,CAACe,IAAI;AACrB,eAAeX,SAAS;AACxB,IAAIO,YAAY;AAChB;AACA,CAAC","ignoreList":[]}

package/lib/module/components/Insight/index.js

@@ -0,0 +1,433 @@
+"use strict";
+
+import { cloneElement, forwardRef, isValidElement, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { Platform, Text, View } from 'react-native';
+import Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+import { useCSSVariable } from 'uniwind';
+import { InsightRoot, Slot, dataAttributes, mergeDataAttributes, useInsightContext } from '@cdx-ui/primitives';
+import { Close, Sparkle } from '@cdx-ui/icons';
+import { cn, createContext, ParentContext, useParentContext, useStyleContext } from '@cdx-ui/utils';
+import { Avatar } from '../Avatar';
+import { Chip } from '../Chip';
+import { IconButton } from '../IconButton';
+import { useCombinedAnimationDisabledState } from '../../animation';
+import { insetRadius } from './insetRadius';
+import { FRAME_WIDTH, insightCloseVariants, insightContentVariants, insightDescriptionVariants, insightFooterVariants, insightFrameVariants, insightHeaderVariants, insightIconVariants, insightPressRegionVariants, insightSummaryTextVariants, insightSurfaceVariants, insightTagIconVariants, insightTagVariants, insightTitleVariants } from './styles';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const SCOPE = 'INSIGHT';
+const useInsightStyleContext = () => useStyleContext(SCOPE);
+const [InsightTagRegistryProvider, useInsightTagRegistry] = createContext('InsightTagRegistry');
+let hasWarnedMissingTag = false;
+const PRESSED_SCALE = 0.98;
+const PRESS_SCALE_DURATION_MS = 120;
+
+// =============================================================================
+// ROOT
+// =============================================================================
+
+/**
+ * `className` and `style` style the outer frame (the border). `asChild` replaces the inner
+ * surface element. `onPress` exists only on `layout="summary"`.
+ *
+ * `ref` targets the element that takes focus: the press region of a summary with `onPress`
+ * (the surface, or the region beside the dismiss button when `onClose` is also set), so
+ * `ref.current?.focus()` moves focus to the card. A static Insight puts `ref` on its surface.
+ */
+
+/**
+ * Press state lives in InsightRoot's context, but the scaled element is the frame around it, so
+ * this child of the root writes the frame's shared value.
+ */
+function InsightPressScale({
+  scale
+}) {
+  const {
+    isPressed,
+    isPressable
+  } = useInsightContext();
+  const isAllAnimationsDisabled = useCombinedAnimationDisabledState(undefined);
+  useEffect(() => {
+    if (!isPressable || isAllAnimationsDisabled) {
+      scale.set(1);
+      return;
+    }
+    scale.set(withTiming(isPressed ? PRESSED_SCALE : 1, {
+      duration: PRESS_SCALE_DURATION_MS
+    }));
+  }, [scale, isPressed, isPressable, isAllAnimationsDisabled]);
+  return null;
+}
+function SummaryBody({
+  hasClose,
+  scale,
+  children
+}) {
+  const {
+    color
+  } = useInsightStyleContext();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(InsightPressScale, {
+      scale: scale
+    }), /*#__PURE__*/_jsx(View, {
+      "aria-hidden": true,
+      accessibilityElementsHidden: true,
+      importantForAccessibility: "no-hide-descendants",
+      ...dataAttributes({
+        slot: 'insight-icon'
+      }),
+      children: /*#__PURE__*/_jsx(Avatar, {
+        size: "md",
+        variant: "subtle",
+        color: color,
+        children: /*#__PURE__*/_jsx(Avatar.Icon, {
+          as: Sparkle,
+          className: insightIconVariants({
+            color
+          })
+        })
+      })
+    }), /*#__PURE__*/_jsx(View, {
+      className: insightSummaryTextVariants({
+        hasClose
+      }),
+      children: children
+    })]
+  });
+}
+const InsightRootStyled = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+    color = 'info',
+    aiGenerated = false,
+    onClose,
+    closeAccessibilityLabel = 'Dismiss insight',
+    asChild = false,
+    className,
+    style,
+    children,
+    ...rootProps
+  } = props;
+  const layout = props.layout ?? 'summary';
+  const onPress = props.layout !== 'detail' ? props.onPress : undefined;
+  const isDisabled = props.layout !== 'detail' && !!props.isDisabled;
+  const hasClose = !!onClose;
+  const asChildElement = asChild && /*#__PURE__*/isValidElement(children);
+  const isPressable = layout === 'summary' && !!onPress;
+  // Mirrors InsightRoot: an accessory splits a pressable or `asChild` root into a container
+  // and a press region.
+  const isSplit = hasClose && (isPressable || asChildElement);
+
+  // The frame scales, not the press region, so the border and the close button move with it.
+  const scale = useSharedValue(1);
+  // Explicit deps for Vite/web without the Reanimated Babel plugin.
+  const pressScaleStyle = useAnimatedStyle(() => ({
+    transform: [{
+      scale: scale.get()
+    }]
+  }), [scale]);
+  const [tag, setTag] = useState(null);
+  const tagOwnerRef = useRef(null);
+  const registerTag = useCallback((owner, next) => {
+    if (next) {
+      tagOwnerRef.current = owner;
+      setTag(next);
+    } else if (tagOwnerRef.current === owner) {
+      tagOwnerRef.current = null;
+      setTag(null);
+    }
+  }, []);
+  const registry = useMemo(() => ({
+    registerTag
+  }), [registerTag]);
+  useEffect(() => {
+    if (__DEV__ && layout === 'detail' && tagOwnerRef.current === null && !hasWarnedMissingTag) {
+      hasWarnedMissingTag = true;
+      console.warn('[Insight] A `layout="detail"` Insight needs an `Insight.Tag` child. The design has no tagless detail layout.');
+    }
+  }, [layout]);
+
+  // A runtime override reaches native as a `px` string, which a `calc()` class turns into NaN.
+  // Web keeps the `calc()` class, which tracks the root font size and scoped overrides.
+  const radiusVariable = useCSSVariable('--border-radius-default');
+  const surfaceRadius = Platform.OS === 'web' ? undefined : insetRadius(radiusVariable, FRAME_WIDTH);
+  const surfaceStyle = useMemo(() => surfaceRadius === undefined ? undefined : {
+    borderRadius: surfaceRadius
+  }, [surfaceRadius]);
+  const parent = useParentContext();
+  const ctx = useMemo(() => ({
+    ...parent,
+    [SCOPE]: {
+      layout,
+      color,
+      hasClose
+    }
+  }), [parent, layout, color, hasClose]);
+  let content = children;
+  if (layout === 'summary') {
+    content = asChildElement ? (/*#__PURE__*/cloneElement(children, undefined, /*#__PURE__*/_jsx(SummaryBody, {
+      hasClose: hasClose,
+      scale: scale,
+      children: children.props.children
+    }))) : /*#__PURE__*/_jsx(SummaryBody, {
+      hasClose: hasClose,
+      scale: scale,
+      children: children
+    });
+  }
+  const closeButton = onClose ? /*#__PURE__*/_jsx(IconButton, {
+    as: Close,
+    variant: "ghost",
+    size: "small",
+    color: "neutral",
+    onPress: onClose,
+    accessibilityLabel: closeAccessibilityLabel,
+    className: insightCloseVariants(),
+    ...dataAttributes({
+      slot: 'insight-close'
+    })
+  }) : undefined;
+  return /*#__PURE__*/_jsx(ParentContext.Provider, {
+    value: ctx,
+    children: /*#__PURE__*/_jsx(InsightTagRegistryProvider, {
+      value: registry,
+      children: /*#__PURE__*/_jsxs(Animated.View, {
+        className: cn(insightFrameVariants({
+          layout,
+          color,
+          aiGenerated
+        }), className),
+        style: isPressable ? [style, pressScaleStyle] : style,
+        ...dataAttributes({
+          slot: 'insight-frame',
+          ...(isPressable && {
+            disabled: isDisabled
+          })
+        }),
+        children: [layout === 'detail' && tag ? /*#__PURE__*/_jsx(InsightTagChip, {
+          ...tag
+        }) : null, /*#__PURE__*/_jsx(InsightRoot, {
+          ...rootProps,
+          ref: ref,
+          asChild: asChild,
+          style: surfaceStyle,
+          accessory: closeButton,
+          className: insightSurfaceVariants({
+            layout,
+            split: isSplit
+          }),
+          pressableClassName: isSplit && layout === 'summary' ? insightPressRegionVariants() : undefined,
+          ...mergeDataAttributes(rootProps, dataAttributes({
+            slot: 'insight'
+          })),
+          children: content
+        })]
+      })
+    })
+  });
+});
+InsightRootStyled.displayName = 'Insight';
+
+// =============================================================================
+// TAG
+// =============================================================================
+
+function InsightTagChip({
+  asChild,
+  className,
+  style,
+  children,
+  ref,
+  ...props
+}) {
+  const {
+    color
+  } = useInsightStyleContext();
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    className: cn(insightTagVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-tag'
+    })),
+    children: /*#__PURE__*/_jsxs(Chip, {
+      variant: "subtle",
+      size: "small",
+      color: color,
+      children: [/*#__PURE__*/_jsx(Chip.Icon, {
+        as: Sparkle,
+        position: "leading",
+        className: insightTagIconVariants({
+          color
+        })
+      }), /*#__PURE__*/_jsx(Chip.Label, {
+        asChild: asChild,
+        children: children
+      })]
+    })
+  });
+}
+
+/**
+ * The detail layout's category tag. Insight renders it as a Sparkle chip straddling the top
+ * border, ahead of the header in reading order, wherever it appears among the children.
+ */
+const InsightTag = /*#__PURE__*/forwardRef((props, ref) => {
+  const {
+    registerTag
+  } = useInsightTagRegistry();
+  const [owner] = useState(() => ({}));
+  useLayoutEffect(() => {
+    registerTag(owner, {
+      ...props,
+      ref
+    });
+  }, [registerTag, owner, props, ref]);
+  useLayoutEffect(() => () => registerTag(owner, null), [registerTag, owner]);
+  return null;
+});
+InsightTag.displayName = 'Insight.Tag';
+
+// =============================================================================
+// HEADER
+// =============================================================================
+
+const InsightHeader = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? Slot : View;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    className: cn(insightHeaderVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-header'
+    })),
+    children: children
+  });
+});
+InsightHeader.displayName = 'Insight.Header';
+
+// =============================================================================
+// TITLE
+// =============================================================================
+
+const InsightTitle = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const {
+    hasClose
+  } = useInsightStyleContext();
+  const Comp = asChild ? Slot : Text;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    role: "heading",
+    className: cn(insightTitleVariants({
+      hasClose
+    }), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-title'
+    })),
+    children: children
+  });
+});
+InsightTitle.displayName = 'Insight.Title';
+
+// =============================================================================
+// DESCRIPTION
+// =============================================================================
+
+const InsightDescription = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? Slot : Text;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    className: cn(insightDescriptionVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-description'
+    })),
+    children: children
+  });
+});
+InsightDescription.displayName = 'Insight.Description';
+
+// =============================================================================
+// CONTENT
+// =============================================================================
+
+const InsightContent = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? Slot : View;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    className: cn(insightContentVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-content'
+    })),
+    children: children
+  });
+});
+InsightContent.displayName = 'Insight.Content';
+
+// =============================================================================
+// FOOTER
+// =============================================================================
+
+const InsightFooter = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const Comp = asChild ? Slot : View;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    className: cn(insightFooterVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-footer'
+    })),
+    children: children
+  });
+});
+InsightFooter.displayName = 'Insight.Footer';
+
+// =============================================================================
+// COMPOUND COMPONENT
+// =============================================================================
+
+export const Insight = Object.assign(InsightRootStyled, {
+  Tag: InsightTag,
+  Header: InsightHeader,
+  Title: InsightTitle,
+  Description: InsightDescription,
+  Content: InsightContent,
+  Footer: InsightFooter
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/Insight/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cloneElement","forwardRef","isValidElement","useCallback","useEffect","useLayoutEffect","useMemo","useRef","useState","Platform","Text","View","Animated","useAnimatedStyle","useSharedValue","withTiming","useCSSVariable","InsightRoot","Slot","dataAttributes","mergeDataAttributes","useInsightContext","Close","Sparkle","cn","createContext","ParentContext","useParentContext","useStyleContext","Avatar","Chip","IconButton","useCombinedAnimationDisabledState","insetRadius","FRAME_WIDTH","insightCloseVariants","insightContentVariants","insightDescriptionVariants","insightFooterVariants","insightFrameVariants","insightHeaderVariants","insightIconVariants","insightPressRegionVariants","insightSummaryTextVariants","insightSurfaceVariants","insightTagIconVariants","insightTagVariants","insightTitleVariants","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","SCOPE","useInsightStyleContext","InsightTagRegistryProvider","useInsightTagRegistry","hasWarnedMissingTag","PRESSED_SCALE","PRESS_SCALE_DURATION_MS","InsightPressScale","scale","isPressed","isPressable","isAllAnimationsDisabled","undefined","set","duration","SummaryBody","hasClose","children","color","accessibilityElementsHidden","importantForAccessibility","slot","size","variant","Icon","as","className","InsightRootStyled","props","ref","aiGenerated","onClose","closeAccessibilityLabel","asChild","style","rootProps","layout","onPress","isDisabled","asChildElement","isSplit","pressScaleStyle","transform","get","tag","setTag","tagOwnerRef","registerTag","owner","next","current","registry","__DEV__","console","warn","radiusVariable","surfaceRadius","OS","surfaceStyle","borderRadius","parent","ctx","content","closeButton","accessibilityLabel","Provider","value","disabled","InsightTagChip","accessory","split","pressableClassName","displayName","position","Label","InsightTag","InsightHeader","Comp","InsightTitle","role","InsightDescription","InsightContent","InsightFooter","Insight","Object","assign","Tag","Header","Title","Description","Content","Footer"],"sourceRoot":"../../../../src","sources":["components/Insight/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Insight/insetRadius.js

@@ -0,0 +1,30 @@
+"use strict";
+
+const ROOT_FONT_SIZE_PX = 16;
+const LENGTH_PATTERN = /^(-?\d*\.?\d+)(px|rem)?$/;
+
+/**
+ * Converts a resolved CSS variable (a number, or a `px`/`rem` string) to pixels. Native resolves
+ * built-in tokens to numbers, while runtime theme overrides and the web resolve to strings.
+ */
+export function cssLengthToPx(value) {
+  if (typeof value === 'number') {
+    return Number.isFinite(value) ? value : undefined;
+  }
+  if (typeof value !== 'string') {
+    return undefined;
+  }
+  const match = LENGTH_PATTERN.exec(value.trim());
+  if (!match) {
+    return undefined;
+  }
+  const amount = Number(match[1]);
+  return match[2] === 'rem' ? amount * ROOT_FONT_SIZE_PX : amount;
+}
+
+/** The radius of a surface inset `inset` px inside a frame with radius `outer`, or `undefined` when `outer` is not a length. */
+export function insetRadius(outer, inset) {
+  const px = cssLengthToPx(outer);
+  return px === undefined ? undefined : Math.max(0, px - inset);
+}
+//# sourceMappingURL=insetRadius.js.map

package/lib/module/components/Insight/insetRadius.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ROOT_FONT_SIZE_PX","LENGTH_PATTERN","cssLengthToPx","value","Number","isFinite","undefined","match","exec","trim","amount","insetRadius","outer","inset","px","Math","max"],"sourceRoot":"../../../../src","sources":["components/Insight/insetRadius.ts"],"mappings":";;AAAA,MAAMA,iBAAiB,GAAG,EAAE;AAE5B,MAAMC,cAAc,GAAG,0BAA0B;;AAEjD;AACA;AACA;AACA;AACA,OAAO,SAASC,aAAaA,CAACC,KAAkC,EAAsB;EACpF,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAOC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,GAAGA,KAAK,GAAGG,SAAS;EACnD;EACA,IAAI,OAAOH,KAAK,KAAK,QAAQ,EAAE;IAC7B,OAAOG,SAAS;EAClB;EAEA,MAAMC,KAAK,GAAGN,cAAc,CAACO,IAAI,CAACL,KAAK,CAACM,IAAI,CAAC,CAAC,CAAC;EAC/C,IAAI,CAACF,KAAK,EAAE;IACV,OAAOD,SAAS;EAClB;EAEA,MAAMI,MAAM,GAAGN,MAAM,CAACG,KAAK,CAAC,CAAC,CAAC,CAAC;EAC/B,OAAOA,KAAK,CAAC,CAAC,CAAC,KAAK,KAAK,GAAGG,MAAM,GAAGV,iBAAiB,GAAGU,MAAM;AACjE;;AAEA;AACA,OAAO,SAASC,WAAWA,CAACC,KAAkC,EAAEC,KAAa,EAAsB;EACjG,MAAMC,EAAE,GAAGZ,aAAa,CAACU,KAAK,CAAC;EAC/B,OAAOE,EAAE,KAAKR,SAAS,GAAGA,SAAS,GAAGS,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEF,EAAE,GAAGD,KAAK,CAAC;AAC/D","ignoreList":[]}