@plasmicapp/host 2.0.0-alpha.0 → 2.0.0-alpha.1

package/registerToken/dist/types/primitive-types.d.ts

@@ -0,0 +1,123 @@
+/// <reference types="react" />
+import { CSSProperties } from "../element-types";
+import { StyleSection } from "../registerComponent";
+import { ContextDependentConfig } from "./shared-controls";
+export interface RichBooleanCore {
+    type: "boolean";
+}
+export interface NumberTypeBaseCore<Ctx extends any[]> {
+    type: "number";
+    min?: number | ContextDependentConfig<Ctx, number>;
+    max?: number | ContextDependentConfig<Ctx, number>;
+}
+export interface PlainNumberCore<Ctx extends any[]> extends NumberTypeBaseCore<Ctx> {
+    control?: "default";
+}
+export interface SliderNumberCore<Ctx extends any[]> extends NumberTypeBaseCore<Ctx> {
+    control: "slider";
+    step?: number | ContextDependentConfig<Ctx, number>;
+}
+export interface PlainStringCore {
+    type: "string";
+    control?: "default" | "large" | "multiLine";
+    isLocalizable?: boolean;
+}
+export interface CodeStringCore {
+    type: "code";
+    lang: "css" | "html" | "javascript" | "json";
+}
+export interface RichTextCore {
+    type: "richText";
+}
+export interface HrefCore {
+    type: "href";
+}
+export interface ColorCore {
+    type: "color";
+    /**
+     * If specified, and the user picks a color token in the Studio, then
+     * the value passed in as prop is a css variable reference, like
+     * `var(--TOKEN_ID)`, instead of the resolved hex value of the token.
+     * You should take care in using this in the proper css context --
+     * the css token is only defined if you are rendering under some
+     * Plasmic component in the DOM tree, which is usually the case,
+     * unless you are using a React portal.
+     */
+    keepCssVar?: boolean;
+    /**
+     * Prevent tokens from being selected.
+     */
+    disableTokens?: boolean;
+}
+export interface DateStringCore {
+    type: "dateString";
+}
+export interface DateRangeStringsCore {
+    type: "dateRangeStrings";
+}
+export interface ClassCore {
+    type: "class";
+    /**
+     * Additional css selectors that can change how this style should look.
+     * Some examples:
+     *
+     * * `:hover` -- on hover
+     * * `[data-something="blah"] -- when the element with this class has
+     *   an html attribute "data-something=blah"
+     * * :component[data-something="blah"] :self -- when the root of the
+     *   component has an html attribute "data-something=blah". Note that
+     *   the non-standard `:component` selector is used to select the
+     *   component root, and the non-standard `:self` selector is used
+     *   to select the element that this class is attached to.
+     */
+    selectors?: {
+        /**
+         * A css selector, like `:hover` or `[data-something="blah"]`.
+         */
+        selector: string;
+        /**
+         * An optional human-friendly label for the selector, so the studio user
+         * knows what this selector means.
+         */
+        label?: string;
+        /**
+         * Initial styles to be applied for this selector
+         */
+        defaultStyles?: CSSProperties;
+    }[];
+    /**
+     * If specified, then only shows these style sections for styling this class
+     */
+    styleSections?: StyleSection[];
+    /**
+     * Initial styles to be applied for this class
+     */
+    defaultStyles?: CSSProperties;
+}
+export interface ThemeResetClassCore {
+    type: "themeResetClass";
+    /**
+     * Normally, theme reset class will only target Plasmic-generated tags
+     * with the default tag styles. If you also want to target non-Plasmic-generated
+     * tags (say, rendered by your code components, or fetched as an HTML blob
+     * from somewhere), then specify `true` here.
+     */
+    targetAllTags?: boolean;
+}
+export interface CardPickerCore<Ctx extends any[]> {
+    type: "cardPicker";
+    modalTitle?: React.ReactNode | ContextDependentConfig<Ctx, React.ReactNode>;
+    options: {
+        value: string;
+        label?: string;
+        imgUrl: string;
+        footer?: React.ReactNode;
+    }[] | ContextDependentConfig<Ctx, {
+        value: string;
+        label?: string;
+        imgUrl: string;
+        footer?: React.ReactNode;
+    }[]>;
+    showInput?: boolean | ContextDependentConfig<Ctx, boolean>;
+    onSearch?: ContextDependentConfig<Ctx, ((value: string) => void) | undefined>;
+}

package/registerToken/dist/types/query-builder-types.d.ts

@@ -0,0 +1,51 @@
+import { ContextDependentConfig } from "./shared-controls";
+/**
+ * Control type for building a custom query format.
+ *
+ * This control is based on react-awesome-query-builder
+ * and returns data in JsonLogic format.
+ *
+ * If using this control type, it's recommended to install
+ * @react-awesome-query-builder/core and json-logic-js as devDependencies
+ * so that you can reference their types.
+ *
+ * References:
+ * - https://github.com/ukrbublik/react-awesome-query-builder
+ * - https://github.com/jwadhams/json-logic-js
+ * - https://jsonlogic.com/
+ */
+export interface QueryBuilderCore<Ctx extends any[]> {
+    type: "queryBuilder";
+    /**
+     * Return a @react-awesome-query-builder/core `Config` that will be merged
+     * with Plasmic's built-in config.
+     *
+     * https://github.com/plasmicapp/plasmic/blob/master/platform/wab/src/wab/client/components/QueryBuilder/QueryBuilderConfig.tsx
+     *
+     * At a minimum, this should return fields and their types.
+     * For configuration options, see react-awesome-query-builder docs.
+     */
+    config: ContextDependentConfig<Ctx, SimplifiedConfig>;
+}
+/**
+ * A simplified subset of @react-awesome-query-builder/core `Config`.
+ */
+interface SimplifiedConfig {
+    fields: SimplifiedFields;
+}
+/**
+ * A simplified subset of @react-awesome-query-builder/core `Fields`.
+ */
+interface SimplifiedFields {
+    [key: string]: SimplifiedField;
+}
+/**
+ * A simplified subset of @react-awesome-query-builder/core `FieldOrGroup`.
+ */
+interface SimplifiedField {
+    type: "text" | "number" | "boolean" | "date" | "time" | "datetime" | "select" | "multiselect" | "treeselect" | "treemultiselect" | string;
+    label?: string;
+    defaultValue?: unknown;
+    fieldSettings?: {};
+}
+export {};

package/registerToken/dist/types/shared-controls.d.ts

@@ -0,0 +1,50 @@
+export type GenericContext<Props, Data, Extra = unknown> = [Props, Data, Extra];
+/**
+ * Config option that takes the context (e.g., props) of the component instance
+ * or function to dynamically set its value.
+ */
+export type ContextDependentConfig<Ctx extends any[], R> = (...args: Ctx) => R;
+export type MaybeContextDependentConfig<Ctx extends any[], V> = V | ContextDependentConfig<Ctx, V>;
+export interface CanvasComponentProps<Data = any> {
+    /**
+     * This prop is only provided within the canvas of Plasmic Studio.
+     * Allows the component to set data to be consumed by the props' controls.
+     */
+    setControlContextData?: (data: Data) => void;
+}
+export type ControlExtras = {
+    path: (string | number)[];
+    item?: any;
+};
+export type InferDataType<P> = P extends CanvasComponentProps<infer Data> ? Data : any;
+export interface CommonTypeBase {
+    description?: string;
+    helpText?: string;
+    /**
+     * If true, will hide the prop in a collapsed section; good for props that
+     * should not usually be used.
+     */
+    advanced?: boolean;
+    /**
+     * If the user has chosen to use a dynamic expression for this prop, provide
+     * a hint as to the expected values that the expression should evaluate to.
+     * This hint will be displayed alongside the code editor.  You may use
+     * markdown in the text here.
+     */
+    exprHint?: string;
+    /**
+     * If true, does not allow the user to use a dynamic expression for this prop
+     */
+    disableDynamicValue?: boolean;
+}
+export interface Defaultable<Ctx extends any[], T> {
+    /**
+     * Default value to set for this prop when the component is instantiated
+     */
+    defaultValue?: T;
+    /**
+     * Specify that default when no prop/param is provided,
+     * so the Plasmic user can see it in the studio UI
+     */
+    defaultValueHint?: T | ContextDependentConfig<Ctx, T | undefined>;
+}

package/registerToken/dist/types/type-utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Converts a union type to a tuple type of the same members
+ */
+export type TupleUnion<U extends string, R extends string[] = []> = {
+    [S in U]: Exclude<U, S> extends never ? [...R, S] : TupleUnion<Exclude<U, S>, [...R, S]>;
+}[U] & string[];
+export type Nullish<T> = T | null | undefined;

package/registerToken/dist/version.d.ts

@@ -1 +1 @@
-export declare const hostVersion = "2.0.0-alpha.0";
+export declare const hostVersion = "2.0.0-alpha.1";

package/registerTrait/dist/data.d.ts

@@ -51,12 +51,8 @@ export interface PageParamsProviderProps {
      * Page query params (e.g. { q: "search term" })
      */
     query?: Record<string, string | string[] | undefined>;
-    /**
-     * @deprecated Use `route` instead.
-     */
-    path?: string;
 }
-export declare function PageParamsProvider({ children, route, path: deprecatedRoute, params, query, }: PageParamsProviderProps): React.JSX.Element;
+export declare function PageParamsProvider({ children, route, params, query, }: PageParamsProviderProps): React.JSX.Element;
 export declare function DataCtxReader({ children, }: {
     children: ($ctx: DataDict | undefined) => ReactNode;
 }): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;

package/registerTrait/dist/exports.d.ts

@@ -1,12 +1,11 @@
 export { PlasmicCanvasContext, PlasmicCanvasHost, usePlasmicCanvasComponentInfo, usePlasmicCanvasContext, } from "./canvas-host";
 export * from "./data";
 export { PlasmicElement } from "./element-types";
-export { registerFetcher as unstable_registerFetcher } from "./fetcher";
 export * from "./global-actions";
 export * from "./link";
-export { ContextDependentConfig, CustomControlProps, ProjectData, PropType, StudioOps, } from "./prop-types";
-export { Action, ActionProps, CodeComponentMeta, CodeComponentMode, ComponentHelpers, ComponentMeta, ComponentRegistration, ComponentTemplates, StateHelpers, StateSpec, default as registerComponent, stateHelpersKeys, } from "./registerComponent";
-export { CustomFunctionMeta, CustomFunctionRegistration, ParamType, default as registerFunction, } from "./registerFunction";
+export { ChoiceObject, ChoiceOptions, ChoiceValue, ComponentContextConfig, ComponentControlContext, ContextDependentConfig, ControlExtras, CustomControlProps, ProjectData, PropType, StudioOps, } from "./prop-types";
+export { Action, ActionProps, CodeComponentMeta, CodeComponentMode, ComponentHelpers, ComponentRegistration, ComponentTemplates, StateHelpers, StateSpec, default as registerComponent, stateHelpersKeys, } from "./registerComponent";
+export { CustomFunctionMeta, CustomFunctionRegistration, FunctionContextConfig, FunctionControlContext, ParamType, default as registerFunction, } from "./registerFunction";
 export { GlobalContextMeta, PropType as GlobalContextPropType, GlobalContextRegistration, default as registerGlobalContext, } from "./registerGlobalContext";
 export { TokenRegistration, TokenType, default as registerToken, } from "./registerToken";
 export { BasicTrait, ChoiceTrait, TraitMeta, TraitRegistration, default as registerTrait, } from "./registerTrait";