@pushwoosh/smart-components-kit 1.11.1 → 1.13.0

package/MediaStorage/styles.js

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-import { NativeInput } from '@pushwoosh/dumb-components';
+import { NativeInput, NativeTextarea } from '@pushwoosh/dumb-components';
 import { Color, FontSize, FontWeight } from '@pushwoosh/kit-constants';
 export const Grid = styled.div.withConfig({
   displayName: "Grid",
@@ -143,4 +143,48 @@ export const DropzoneRow = styled.div.withConfig({
 export const CanvaActions = styled.div.withConfig({
   displayName: "CanvaActions",
   componentId: "sc-uu3cbo-30"
-})(["display:flex;flex-direction:column;justify-content:center;gap:8px;& > *{width:100%;}"]);
+})(["display:flex;flex-direction:column;justify-content:center;gap:8px;& > *{width:100%;}"]);
+export const TabBody = styled.div.withConfig({
+  displayName: "TabBody",
+  componentId: "sc-uu3cbo-31"
+})(["padding-top:16px;"]);
+export const SearchRow = styled.div.withConfig({
+  displayName: "SearchRow",
+  componentId: "sc-uu3cbo-32"
+})(["display:flex;gap:8px;margin-bottom:16px;"]);
+export const StockTile = styled.button.withConfig({
+  displayName: "StockTile",
+  componentId: "sc-uu3cbo-33"
+})(["all:unset;background-color:", ";opacity:", ";display:block;width:100%;box-sizing:border-box;cursor:pointer;border-radius:6px;overflow:hidden;border:1px solid ", ";transition:border-color 0.15s,opacity 0.15s;&:hover{border-color:", ";}&:disabled{cursor:default;}"], ({
+  $avgColor
+}) => $avgColor || 'transparent', ({
+  $dimmed
+}) => $dimmed ? 0.6 : 1, Color.DIVIDER, Color.PRIMARY);
+export const StockCredit = styled.a.withConfig({
+  displayName: "StockCredit",
+  componentId: "sc-uu3cbo-34"
+})(["display:block;margin-top:2px;padding:0 4px 4px;font-size:11px;color:", ";text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;&:hover{text-decoration:underline;}"], Color.LOCKED);
+export const ProviderNote = styled.div.withConfig({
+  displayName: "ProviderNote",
+  componentId: "sc-uu3cbo-35"
+})(["margin-top:16px;text-align:center;font-size:12px;color:", ";a{color:", ";}"], Color.LOCKED, Color.MAIN);
+export const GenerateForm = styled.div.withConfig({
+  displayName: "GenerateForm",
+  componentId: "sc-uu3cbo-36"
+})(["display:flex;flex-direction:column;gap:12px;max-width:560px;"]);
+export const GenerateControls = styled.div.withConfig({
+  displayName: "GenerateControls",
+  componentId: "sc-uu3cbo-37"
+})(["display:flex;align-items:center;gap:8px;"]);
+export const GeneratedPreview = styled.img.withConfig({
+  displayName: "GeneratedPreview",
+  componentId: "sc-uu3cbo-38"
+})(["display:block;max-width:100%;max-height:420px;border-radius:8px;border:1px solid ", ";"], Color.DIVIDER);
+export const SearchField = styled(NativeInput).withConfig({
+  displayName: "SearchField",
+  componentId: "sc-uu3cbo-39"
+})(["flex:1;width:auto;max-width:none;"]);
+export const PromptField = styled(NativeTextarea).withConfig({
+  displayName: "PromptField",
+  componentId: "sc-uu3cbo-40"
+})(["font-family:inherit;resize:vertical;"]);

package/MediaStorage/types.d.ts

@@ -1,4 +1,6 @@
 import type { MediaFile } from '@pushwoosh/rpc-v2-http-api-data/media_files';
+/** Where the gallery can take an image from: the library itself, a stock-photo search or AI generation. */
+export type MediaSource = 'library' | 'stock' | 'generate';
 /** Per-channel options both gallery entry points accept; `MediaStoragePaginated` forwards them as-is. */
 type MediaFileChannelOptions = {
     /**
@@ -13,6 +15,17 @@ type MediaFileChannelOptions = {
      * the kit has no opinion on why a file is risky for a particular channel.
      */
     fileWarning?: (file: MediaFile) => string | undefined;
+    /**
+     * Tabs to offer; defaults to the library alone, so existing consumers see no change. A source
+     * whose output format the `extensions` filter rejects is hidden (Stock is JPEG, Generate PNG or JPEG).
+     */
+    sources?: MediaSource[];
+    /** Aspect ratios offered in the Generate tab; defaults to every ratio onyx accepts. */
+    aspectRatios?: string[];
+    /** Pre-selected aspect ratio in the Generate tab. */
+    defaultAspectRatio?: string;
+    /** Alt text suggested for a stock or generated pick (provider alt or the prompt). */
+    onSuggestAlt?: (file: MediaFile, alt: string) => void;
 };
 export type MediaStorageProps = MediaFileChannelOptions & {
     /** Application code whose media files are listed. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/smart-components-kit",
-  "version": "1.11.1",
+  "version": "1.13.0",
   "description": "Stateful, data-connected React components shared by Pushwoosh micro-frontends",
   "repository": {
     "type": "git",