@shopify/app-bridge-types 0.0.1 → 0.0.2

package/CHANGELOG.md

@@ -0,0 +1,19 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [0.0.2] - 2023-07-19
+
+### Added
+
+- ResourcePicker types ([#97](https://github.com/Shopify/app-bridge-next/pull/97))
+- Custom element types for ui-title-bar and ui-nav-menu ([#108](https://github.com/Shopify/app-bridge-next/pull/108))
+- Custom attribute types for React buttons ([#108](https://github.com/Shopify/app-bridge-next/pull/108))
+- shopify global types for reference outside of window ([#108](https://github.com/Shopify/app-bridge-next/pull/108))
+
+### Removed
+
+- Unused titleBar setState type on ShopifyGlobal ([#108](https://github.com/Shopify/app-bridge-next/pull/108))

package/index.d.ts

@@ -1,9 +1,28 @@
-import {ShopifyGlobal} from './internal';
+import type {
+  ShopifyGlobal,
+  AugmentedElement,
+  AppBridgeElements,
+  AppBridgeAttributes,
+} from './shopify';
 
 export {ShopifyGlobal};
 
 declare global {
-  interface Window {
-    shopify: ShopifyGlobal;
+  var shopify: ShopifyGlobal;
+
+  // Install property augmentations onto DOM prototypes
+  interface HTMLButtonElement extends AugmentedElement<'button'> {}
+  interface HTMLAnchorElement extends AugmentedElement<'a'> {}
+
+  // Install property augmentations onto ReactElement prop definitions
+  namespace React {
+    interface ButtonHTMLAttributes<T> extends AugmentedElement<'button'> {}
+    interface LinkHTMLAttributes<T> extends AugmentedElement<'a'> {}
+  }
+
+  // Install Element/attribute augmentations into JSX definitions
+  namespace JSX {
+    interface IntrinsicElements extends AppBridgeElements {}
+    interface IntrinsicAttributes extends AppBridgeAttributes {}
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopify/app-bridge-types",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Companion types library for the Shopify App Bridge script",
   "license": "ISC",
   "main": "./index.js",
@@ -13,15 +13,14 @@
     "default": "./index.js"
   },
   "scripts": {
-    "build": "cjyes && yarn types",
-    "types": "cp ../../dist/app-bridge.d.ts ./internal.d.ts"
+    "build": "cjyes && node ./scripts/build.mjs"
   },
   "devDependencies": {
     "cjyes": "^0.3.1"
   },
   "files": [
     "index.d.ts",
-    "internal.d.ts",
+    "shopify.ts",
     "index.mjs",
     "index.js"
   ]

package/shopify.ts

@@ -0,0 +1,247 @@
+export interface AppBridgeAttributes {
+}
+
+interface AppBridgeConfig {
+    host: string;
+    apiKey: string;
+    shop: string;
+    locale: string;
+    disabledFeatures?: [string];
+}
+
+export interface AppBridgeElements {
+    'ui-nav-menu': {
+        children?: any;
+    };
+    'ui-title-bar': {
+        title?: string;
+        children?: any;
+    };
+}
+
+export type AugmentedElement<T extends keyof AugmentedElements> = AugmentedElements[T];
+
+export interface AugmentedElements {
+    button: MenuItemProperties;
+    a: MenuItemProperties;
+}
+
+interface BaseResource extends Resource {
+    variants?: Resource[];
+}
+
+interface Collection extends Resource {
+    availablePublicationCount: number;
+    description: string;
+    descriptionHtml: string;
+    handle: string;
+    id: string;
+    image?: Image_2 | null;
+    productsAutomaticallySortedCount: number;
+    productsCount: number;
+    productsManuallySortedCount: number;
+    publicationCount: number;
+    ruleSet?: RuleSet | null;
+    seo: {
+        description?: string | null;
+        title?: string | null;
+    };
+    sortOrder: CollectionSortOrder;
+    storefrontId: string;
+    templateSuffix?: string | null;
+    title: string;
+    updatedAt: string;
+}
+
+interface CollectionRule {
+    column: string;
+    condition: string;
+    relation: string;
+}
+
+enum CollectionSortOrder {
+    Manual = "MANUAL",
+    BestSelling = "BEST_SELLING",
+    AlphaAsc = "ALPHA_ASC",
+    AlphaDesc = "ALPHA_DESC",
+    PriceDesc = "PRICE_DESC",
+    PriceAsc = "PRICE_ASC",
+    CreatedDesc = "CREATED_DESC",
+    Created = "CREATED",
+    MostRelevant = "MOST_RELEVANT"
+}
+
+interface Environment {
+    mobile: boolean;
+    embedded: boolean;
+    pos: boolean;
+}
+
+enum FulfillmentServiceType {
+    GiftCard = "GIFT_CARD",
+    Manual = "MANUAL",
+    ThirdParty = "THIRD_PARTY"
+}
+
+interface Image_2 {
+    id: string;
+    altText?: string;
+    originalSrc: string;
+}
+
+export interface MenuItemProperties {
+    variant?: 'primary' | undefined;
+}
+
+type Money = string;
+
+interface Product extends Resource {
+    availablePublicationCount: number;
+    createdAt: string;
+    descriptionHtml: string;
+    handle: string;
+    hasOnlyDefaultVariant: boolean;
+    images: Image_2[];
+    options: {
+        id: string;
+        name: string;
+        position: number;
+        values: string[];
+    }[];
+    productType: string;
+    publishedAt?: string | null;
+    tags: string[];
+    templateSuffix?: string | null;
+    title: string;
+    totalInventory: number;
+    tracksInventory: boolean;
+    variants: Partial<ProductVariant>[];
+    vendor: string;
+    updatedAt: string;
+    status: ProductStatus;
+}
+
+enum ProductStatus {
+    Active = "ACTIVE",
+    Archived = "ARCHIVED",
+    Draft = "DRAFT"
+}
+
+interface ProductVariant extends Resource {
+    availableForSale: boolean;
+    barcode?: string | null;
+    compareAtPrice?: Money | null;
+    createdAt: string;
+    displayName: string;
+    fulfillmentService?: {
+        id: string;
+        inventoryManagement: boolean;
+        productBased: boolean;
+        serviceName: string;
+        type: FulfillmentServiceType;
+    };
+    image?: Image_2 | null;
+    inventoryItem: {
+        id: string;
+    };
+    inventoryManagement: ProductVariantInventoryManagement;
+    inventoryPolicy: ProductVariantInventoryPolicy;
+    inventoryQuantity?: number | null;
+    position: number;
+    price: Money;
+    product: Partial<Product>;
+    requiresShipping: boolean;
+    selectedOptions: {
+        value?: string | null;
+    }[];
+    sku?: string | null;
+    taxable: boolean;
+    title: string;
+    weight?: number | null;
+    weightUnit: WeightUnit;
+    updatedAt: string;
+}
+
+enum ProductVariantInventoryManagement {
+    Shopify = "SHOPIFY",
+    NotManaged = "NOT_MANAGED",
+    FulfillmentService = "FULFILLMENT_SERVICE"
+}
+
+enum ProductVariantInventoryPolicy {
+    Deny = "DENY",
+    Continue = "CONTINUE"
+}
+
+interface Resource {
+    /** in GraphQL id format, ie 'gid://shopify/Product/1' */
+    id: string;
+}
+
+interface ResourcePickerOptions {
+    type: 'product' | 'variant' | 'collection';
+    query?: string;
+    selectionIds?: BaseResource[];
+    action?: 'add' | 'select';
+    multiple?: boolean | number;
+    filter?: {
+        hidden?: boolean;
+        variants?: boolean;
+        draft?: boolean | undefined;
+        archived?: boolean | undefined;
+    };
+}
+
+type ResourceSelection = Product | ProductVariant | Collection;
+
+interface RuleSet {
+    appliedDisjunctively: boolean;
+    rules: CollectionRule[];
+}
+
+interface SelectPayload {
+    readonly id?: string;
+    selection: ResourceSelection[];
+}
+
+export interface ShopifyGlobal {
+    config: AppBridgeConfig;
+    origin: string;
+    ready: Promise<void>;
+    environment: Environment;
+    loading(isLoading?: boolean): void;
+    idToken(): Promise<string>;
+    user(): Promise<User>;
+    toast: {
+        show(message: string, opts?: Partial<ToastOptions>): string;
+        hide(id: string): void;
+    };
+    resourcePicker(options?: ResourcePickerOptions): Promise<SelectPayload | undefined>;
+}
+
+interface ToastOptions {
+    duration: number;
+    isError: boolean;
+    action: string;
+    onAction: () => void;
+    onDismiss: () => void;
+}
+
+interface User {
+    id: string;
+    name: string;
+    firstName?: string;
+    lastName?: string;
+    email: string;
+    accountAccess: string;
+    accountType: string;
+}
+
+enum WeightUnit {
+    Kilograms = "KILOGRAMS",
+    Grams = "GRAMS",
+    Pounds = "POUNDS",
+    Ounces = "OUNCES"
+}
+
+export { }

package/internal.d.ts

@@ -1,72 +0,0 @@
-declare interface AppBridgeConfig {
-    host: string;
-    apiKey: string;
-    shop: string;
-    locale: string;
-    disabledFeatures?: [string];
-}
-
-declare interface Button {
-    id: string;
-    label: string;
-    disabled?: boolean;
-}
-
-declare interface ButtonGroup {
-    id: string;
-    label: string;
-    disabled?: boolean;
-    buttons: Button[];
-}
-
-declare interface Environment {
-    mobile: boolean;
-    embedded: boolean;
-    pos: boolean;
-}
-
-export declare interface ShopifyGlobal {
-    config: AppBridgeConfig;
-    origin: string;
-    ready: Promise<void>;
-    environment: Environment;
-    loading(isLoading?: boolean): void;
-    idToken(): Promise<string>;
-    user(): Promise<User>;
-    titleBar: {
-        setState(state?: TitleBarState): void;
-    };
-    toast: {
-        show(message: string, opts?: Partial<ToastOptions>): string;
-        hide(id: string): void;
-    };
-}
-
-declare interface TitleBarState {
-    title?: string;
-    buttons?: {
-        primary?: Button;
-        secondary?: (Button | ButtonGroup)[];
-    };
-    breadcrumbs?: Button;
-}
-
-declare interface ToastOptions {
-    duration: number;
-    isError: boolean;
-    action: string;
-    onAction: () => void;
-    onDismiss: () => void;
-}
-
-declare interface User {
-    id: string;
-    name: string;
-    firstName?: string;
-    lastName?: string;
-    email: string;
-    accountAccess: string;
-    accountType: string;
-}
-
-export { }