@plasmicapp/react-web 0.2.200 → 0.2.202

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. package/dist/all.d.ts +1926 -1925
  2. package/dist/auth/PlasmicPageGuard.d.ts +11 -11
  3. package/dist/common.d.ts +10 -10
  4. package/dist/data-sources/index.d.ts +1 -1
  5. package/dist/host/index.d.ts +1 -1
  6. package/dist/index-common.d.ts +18 -18
  7. package/dist/index-skinny.d.ts +1 -1
  8. package/dist/index.cjs.js +3495 -3495
  9. package/dist/index.cjs.js.map +1 -1
  10. package/dist/index.d.ts +11 -11
  11. package/dist/plume/button/index.d.ts +36 -36
  12. package/dist/plume/checkbox/index.d.ts +47 -47
  13. package/dist/plume/collection-utils.d.ts +191 -191
  14. package/dist/plume/collection-utils.spec.d.ts +1 -1
  15. package/dist/plume/menu/context.d.ts +8 -8
  16. package/dist/plume/menu/index.d.ts +3 -3
  17. package/dist/plume/menu/menu-group.d.ts +23 -23
  18. package/dist/plume/menu/menu-item.d.ts +23 -23
  19. package/dist/plume/menu/menu.d.ts +39 -39
  20. package/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
  21. package/dist/plume/menu-button/index.d.ts +2 -2
  22. package/dist/plume/menu-button/menu-button.d.ts +72 -72
  23. package/dist/plume/menu-button/menu-trigger.d.ts +21 -21
  24. package/dist/plume/plume-utils.d.ts +41 -41
  25. package/dist/plume/props-utils.d.ts +15 -15
  26. package/dist/plume/select/context.d.ts +3 -3
  27. package/dist/plume/select/index.d.ts +4 -4
  28. package/dist/plume/select/select-option-group.d.ts +23 -23
  29. package/dist/plume/select/select-option.d.ts +23 -23
  30. package/dist/plume/select/select.d.ts +111 -111
  31. package/dist/plume/switch/index.d.ts +39 -39
  32. package/dist/plume/text-input/index.d.ts +36 -36
  33. package/dist/plume/triggered-overlay/context.d.ts +14 -14
  34. package/dist/plume/triggered-overlay/index.d.ts +2 -2
  35. package/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
  36. package/dist/query/index.d.ts +1 -1
  37. package/dist/react-utils.d.ts +21 -21
  38. package/dist/react-utils.spec.d.ts +1 -1
  39. package/dist/react-web.esm.js +3496 -3496
  40. package/dist/react-web.esm.js.map +1 -1
  41. package/dist/render/PlasmicHead/index.d.ts +37 -37
  42. package/dist/render/PlasmicIcon.d.ts +4 -4
  43. package/dist/render/PlasmicImg/index.d.ts +81 -81
  44. package/dist/render/PlasmicLink.d.ts +2 -2
  45. package/dist/render/PlasmicSlot.d.ts +11 -11
  46. package/dist/render/Stack.d.ts +51 -51
  47. package/dist/render/elements.d.ts +74 -74
  48. package/dist/render/global-variants.d.ts +1 -1
  49. package/dist/render/screen-variants.d.ts +5 -5
  50. package/dist/render/ssr.d.ts +21 -21
  51. package/dist/render/translation.d.ts +19 -19
  52. package/dist/render/triggers.d.ts +39 -39
  53. package/dist/states/errors.d.ts +13 -13
  54. package/dist/states/graph.d.ts +25 -25
  55. package/dist/states/helpers.d.ts +43 -43
  56. package/dist/states/index.d.ts +4 -4
  57. package/dist/states/types.d.ts +66 -66
  58. package/dist/states/valtio.d.ts +10 -10
  59. package/dist/states/vanilla.d.ts +3 -3
  60. package/dist/stories/PlasmicImg.stories.d.ts +6 -6
  61. package/dist/stories/UseDollarState.stories.d.ts +78 -78
  62. package/lib/data-sources/index.d.ts +1 -1
  63. package/lib/host/index.d.ts +1 -1
  64. package/lib/query/index.d.ts +1 -1
  65. package/package.json +9 -10
  66. package/skinny/dist/auth/PlasmicPageGuard.d.ts +11 -11
  67. package/skinny/dist/{collection-utils-0967eaf0.js → collection-utils-2f28e4eb.js} +297 -297
  68. package/skinny/dist/{collection-utils-0967eaf0.js.map → collection-utils-2f28e4eb.js.map} +1 -1
  69. package/skinny/dist/{common-9d6d348d.js → common-ed411407.js} +130 -130
  70. package/skinny/dist/{common-9d6d348d.js.map → common-ed411407.js.map} +1 -1
  71. package/skinny/dist/common.d.ts +10 -10
  72. package/skinny/dist/data-sources/index.d.ts +1 -1
  73. package/skinny/dist/host/index.d.ts +1 -1
  74. package/skinny/dist/index-common.d.ts +18 -18
  75. package/skinny/dist/index-skinny.d.ts +1 -1
  76. package/skinny/dist/index.d.ts +11 -11
  77. package/skinny/dist/index.js +1559 -1559
  78. package/skinny/dist/index.js.map +1 -1
  79. package/skinny/dist/plume/button/index.d.ts +36 -36
  80. package/skinny/dist/plume/button/index.js +21 -21
  81. package/skinny/dist/plume/checkbox/index.d.ts +47 -47
  82. package/skinny/dist/plume/checkbox/index.js +64 -64
  83. package/skinny/dist/plume/collection-utils.d.ts +191 -191
  84. package/skinny/dist/plume/collection-utils.spec.d.ts +1 -1
  85. package/skinny/dist/plume/menu/context.d.ts +8 -8
  86. package/skinny/dist/plume/menu/index.d.ts +3 -3
  87. package/skinny/dist/plume/menu/index.js +165 -165
  88. package/skinny/dist/plume/menu/menu-group.d.ts +23 -23
  89. package/skinny/dist/plume/menu/menu-item.d.ts +23 -23
  90. package/skinny/dist/plume/menu/menu.d.ts +39 -39
  91. package/skinny/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
  92. package/skinny/dist/plume/menu-button/index.d.ts +2 -2
  93. package/skinny/dist/plume/menu-button/index.js +125 -125
  94. package/skinny/dist/plume/menu-button/index.js.map +1 -1
  95. package/skinny/dist/plume/menu-button/menu-button.d.ts +72 -72
  96. package/skinny/dist/plume/menu-button/menu-trigger.d.ts +21 -21
  97. package/skinny/dist/plume/plume-utils.d.ts +41 -41
  98. package/skinny/dist/plume/props-utils.d.ts +15 -15
  99. package/skinny/dist/plume/select/context.d.ts +3 -3
  100. package/skinny/dist/plume/select/index.d.ts +4 -4
  101. package/skinny/dist/plume/select/index.js +250 -250
  102. package/skinny/dist/plume/select/index.js.map +1 -1
  103. package/skinny/dist/plume/select/select-option-group.d.ts +23 -23
  104. package/skinny/dist/plume/select/select-option.d.ts +23 -23
  105. package/skinny/dist/plume/select/select.d.ts +111 -111
  106. package/skinny/dist/plume/switch/index.d.ts +39 -39
  107. package/skinny/dist/plume/switch/index.js +61 -61
  108. package/skinny/dist/plume/text-input/index.d.ts +36 -36
  109. package/skinny/dist/plume/text-input/index.js +45 -45
  110. package/skinny/dist/plume/triggered-overlay/context.d.ts +14 -14
  111. package/skinny/dist/plume/triggered-overlay/index.d.ts +2 -2
  112. package/skinny/dist/plume/triggered-overlay/index.js +100 -100
  113. package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
  114. package/skinny/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
  115. package/skinny/dist/{plume-utils-7d68bcc0.js → plume-utils-e699cd08.js} +30 -30
  116. package/skinny/dist/{plume-utils-7d68bcc0.js.map → plume-utils-e699cd08.js.map} +1 -1
  117. package/skinny/dist/{props-utils-9f9c761a.js → props-utils-9d74371f.js} +4 -4
  118. package/skinny/dist/{props-utils-9f9c761a.js.map → props-utils-9d74371f.js.map} +1 -1
  119. package/skinny/dist/query/index.d.ts +1 -1
  120. package/skinny/dist/{react-utils-ee4e03ba.js → react-utils-5ff031c2.js} +195 -195
  121. package/skinny/dist/{react-utils-ee4e03ba.js.map → react-utils-5ff031c2.js.map} +1 -1
  122. package/skinny/dist/react-utils.d.ts +21 -21
  123. package/skinny/dist/react-utils.spec.d.ts +1 -1
  124. package/skinny/dist/render/PlasmicHead/index.d.ts +37 -37
  125. package/skinny/dist/render/PlasmicHead/index.js +54 -54
  126. package/skinny/dist/render/PlasmicIcon.d.ts +4 -4
  127. package/skinny/dist/render/PlasmicImg/index.d.ts +81 -81
  128. package/skinny/dist/render/PlasmicImg/index.js +297 -297
  129. package/skinny/dist/render/PlasmicLink.d.ts +2 -2
  130. package/skinny/dist/render/PlasmicSlot.d.ts +11 -11
  131. package/skinny/dist/render/Stack.d.ts +51 -51
  132. package/skinny/dist/render/elements.d.ts +74 -74
  133. package/skinny/dist/render/global-variants.d.ts +1 -1
  134. package/skinny/dist/render/screen-variants.d.ts +5 -5
  135. package/skinny/dist/render/ssr.d.ts +21 -21
  136. package/skinny/dist/render/translation.d.ts +19 -19
  137. package/skinny/dist/render/triggers.d.ts +39 -39
  138. package/skinny/dist/{ssr-c9834f50.js → ssr-8625df04.js} +107 -107
  139. package/skinny/dist/{ssr-c9834f50.js.map → ssr-8625df04.js.map} +1 -1
  140. package/skinny/dist/states/errors.d.ts +13 -13
  141. package/skinny/dist/states/graph.d.ts +25 -25
  142. package/skinny/dist/states/helpers.d.ts +43 -43
  143. package/skinny/dist/states/index.d.ts +4 -4
  144. package/skinny/dist/states/types.d.ts +66 -66
  145. package/skinny/dist/states/valtio.d.ts +10 -10
  146. package/skinny/dist/states/vanilla.d.ts +3 -3
  147. package/skinny/dist/stories/PlasmicImg.stories.d.ts +6 -6
  148. package/skinny/dist/stories/UseDollarState.stories.d.ts +78 -78
package/dist/all.d.ts CHANGED
@@ -18,62 +18,62 @@ type Argument = Value | Mapping | Argument[];
18
18
 
19
19
  declare function classNames$1(...args: Argument[]): string;
20
20
 
21
- interface PlasmicPageGuardProps {
22
- appId: string;
23
- authorizeEndpoint: string;
24
- minRole?: string;
25
- canTriggerLogin: boolean;
26
- children: React__default.ReactNode;
27
- }
28
- declare function PlasmicPageGuard(props: PlasmicPageGuardProps): JSX.Element | null;
21
+ interface PlasmicPageGuardProps {
22
+ appId: string;
23
+ authorizeEndpoint: string;
24
+ minRole?: string;
25
+ canTriggerLogin: boolean;
26
+ children: React__default.ReactNode;
27
+ }
28
+ declare function PlasmicPageGuard(props: PlasmicPageGuardProps): JSX.Element | null;
29
29
  declare function withPlasmicPageGuard<P extends object>(WrappedComponent: React__default.ComponentType<P>, options: Omit<PlasmicPageGuardProps, "children">): React__default.FC<P>;
30
30
 
31
- declare function pick<T extends {}>(obj: T, ...keys: (string | number | symbol)[]): Partial<T>;
31
+ declare function pick<T extends {}>(obj: T, ...keys: (string | number | symbol)[]): Partial<T>;
32
32
  declare function omit<T extends {}>(obj: T, ...keys: (keyof T)[]): Partial<T>;
33
33
 
34
- type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : Partial<"Unexpected extraneous props">;
34
+ type StrictProps<T, TExpected> = Exclude<keyof T, keyof TExpected> extends never ? {} : Partial<"Unexpected extraneous props">;
35
35
  type HTMLElementRefOf<T extends keyof JSX.IntrinsicElements> = Exclude<React__default.ComponentProps<T>["ref"], string>;
36
36
 
37
37
  // Type definitions for dlv 1.1
38
38
 
39
39
  declare function dlv(object: object, key: string | Array<string | number>, defaultValue?: any): any;
40
40
 
41
- type InitFuncEnv = {
42
- $props: Record<string, any>;
43
- $state: Record<string, any>;
44
- $queries?: Record<string, any>;
45
- $ctx?: Record<string, any>;
46
- };
47
- type DollarStateEnv = Omit<InitFuncEnv, "$state">;
48
- type NoUndefinedField<T> = {
49
- [P in keyof T]-?: T[P];
50
- };
51
- type InitFunc<T> = (env: NoUndefinedField<InitFuncEnv>) => T;
52
- type ObjectPath = (string | number)[];
53
- interface $StateSpec<T> {
54
- path: string;
55
- initFunc?: InitFunc<T>;
56
- initVal?: T;
57
- type: "private" | "readonly" | "writable";
58
- valueProp?: string;
59
- onChangeProp?: string;
60
- isImmutable?: boolean;
61
- variableType: "text" | "number" | "boolean" | "array" | "object" | "variant";
62
- initFuncHash?: string;
63
- }
64
- interface $State {
65
- [key: string]: any;
66
- registerInitFunc?: (path: string, f: InitFunc<any>, repetitonIndex?: number[], overrideEnv?: DollarStateEnv) => any;
67
- }
68
- interface Internal$StateSpec<T> extends $StateSpec<T> {
69
- isRepeated: boolean;
70
- pathObj: (string | symbol)[];
41
+ type InitFuncEnv = {
42
+ $props: Record<string, any>;
43
+ $state: Record<string, any>;
44
+ $queries?: Record<string, any>;
45
+ $ctx?: Record<string, any>;
46
+ };
47
+ type DollarStateEnv = Omit<InitFuncEnv, "$state">;
48
+ type NoUndefinedField<T> = {
49
+ [P in keyof T]-?: T[P];
50
+ };
51
+ type InitFunc<T> = (env: NoUndefinedField<InitFuncEnv>) => T;
52
+ type ObjectPath = (string | number)[];
53
+ interface $StateSpec<T> {
54
+ path: string;
55
+ initFunc?: InitFunc<T>;
56
+ initVal?: T;
57
+ type: "private" | "readonly" | "writable";
58
+ valueProp?: string;
59
+ onChangeProp?: string;
60
+ isImmutable?: boolean;
61
+ variableType: "text" | "number" | "boolean" | "array" | "object" | "variant";
62
+ initFuncHash?: string;
63
+ }
64
+ interface $State {
65
+ [key: string]: any;
66
+ registerInitFunc?: (path: string, f: InitFunc<any>, repetitonIndex?: number[], overrideEnv?: DollarStateEnv) => any;
67
+ }
68
+ interface Internal$StateSpec<T> extends $StateSpec<T> {
69
+ isRepeated: boolean;
70
+ pathObj: (string | symbol)[];
71
71
  }
72
72
 
73
- declare global {
74
- interface Window {
75
- __PlasmicHostVersion: string;
76
- }
73
+ declare global {
74
+ interface Window {
75
+ __PlasmicHostVersion: string;
76
+ }
77
77
  }
78
78
 
79
79
  interface StandardLonghandProperties<TLength = (string & {}) | 0, TTime = string & {}> {
@@ -10878,1249 +10878,1250 @@ declare namespace DataType {
10878
10878
  type VisualBox = "border-box" | "content-box" | "padding-box";
10879
10879
  }
10880
10880
 
10881
- declare type CSSProperties = Properties<string | number> & {
10882
- layout?: "vbox" | "hbox" | "box" | "page-section";
10883
- };
10884
- declare type ContainerTags = "a" | "address" | "article" | "aside" | "blockquote" | "button" | "code" | "dd" | "div" | "dl" | "dt" | "form" | "footer" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "header" | "hgroup" | "label" | "li" | "main" | "nav" | "ol" | "p" | "pre" | "section" | "span" | "ul";
10885
- declare type CommonAttrKeys = "title" | "tabIndex" | "className" | "id" | "aria-label" | "aria-hidden" | "aria-labelledby" | "aria-describedby" | "role";
10886
- declare type PictureAttrKeys = "alt" | "loading" | CommonAttrKeys;
10887
- declare type LinkAttrKeys = "href" | "target" | CommonAttrKeys;
10888
- declare type TextAreaAttrKeys = "disabled" | "value" | "cols" | "rows" | "placeholder" | CommonAttrKeys;
10889
- declare type InputAttrKeys = "disabled" | "value" | "defaultValue" | "name" | "autoComplete" | "checked" | "placeholder" | CommonAttrKeys;
10890
- declare type ButtonAttrKeys = "disabled" | CommonAttrKeys;
10891
- declare type Attrs<Keys extends string> = Partial<Record<Keys, string>>;
10892
- interface PictureElement {
10893
- type: "img";
10894
- src: string;
10895
- styles?: CSSProperties;
10896
- attrs?: Attrs<PictureAttrKeys>;
10897
- }
10898
- declare type ImageElement = PictureElement;
10899
- interface LinkTextElement {
10900
- type: "text";
10901
- tag: "a";
10902
- value: string;
10903
- styles?: CSSProperties;
10904
- attrs?: Attrs<LinkAttrKeys>;
10905
- }
10906
- interface ButtonTextElement {
10907
- type: "text";
10908
- tag: "button";
10909
- value: string;
10910
- styles?: CSSProperties;
10911
- attrs?: Attrs<ButtonAttrKeys>;
10912
- }
10913
- interface GenericTextElement {
10914
- type: "text";
10915
- /**
10916
- * Default: "div"
10917
- */
10918
- tag?: Exclude<ContainerTags, "a" | "button">;
10919
- value: string;
10920
- styles?: CSSProperties;
10921
- attrs?: Attrs<CommonAttrKeys>;
10922
- }
10923
- declare type TextElement = string | LinkTextElement | ButtonTextElement | GenericTextElement;
10924
- interface LinkContainerElement {
10925
- type: "box" | "vbox" | "hbox";
10926
- tag: "a";
10927
- children?: PlasmicElement | PlasmicElement[];
10928
- styles?: CSSProperties;
10929
- attrs?: Attrs<LinkAttrKeys>;
10930
- }
10931
- interface ButtonContainerElement {
10932
- type: "box" | "vbox" | "hbox";
10933
- tag: "button";
10934
- children?: PlasmicElement | PlasmicElement[];
10935
- styles?: CSSProperties;
10936
- attrs?: Attrs<ButtonAttrKeys>;
10937
- }
10938
- interface GenericContainerElement {
10939
- type: "box" | "vbox" | "hbox" | "page-section";
10940
- /**
10941
- * Default: "div"
10942
- */
10943
- tag?: Exclude<ContainerTags, "a" | "button">;
10944
- children?: PlasmicElement | PlasmicElement[];
10945
- styles?: CSSProperties;
10946
- attrs?: Attrs<CommonAttrKeys>;
10947
- }
10948
- declare type ContainerElement = LinkContainerElement | ButtonContainerElement | GenericContainerElement;
10949
- interface ButtonElement {
10950
- type: "button";
10951
- value: string;
10952
- styles?: CSSProperties;
10953
- attrs?: Attrs<ButtonAttrKeys>;
10954
- }
10955
- interface InputElement {
10956
- type: "input" | "password";
10957
- styles?: CSSProperties;
10958
- attrs?: Attrs<InputAttrKeys>;
10959
- }
10960
- interface TextAreaElement {
10961
- type: "textarea";
10962
- styles?: CSSProperties;
10963
- attrs?: Attrs<TextAreaAttrKeys>;
10964
- }
10965
- declare type TextInputElement = InputElement | TextAreaElement;
10966
- interface JsonElement {
10967
- type: "json";
10968
- value: any;
10969
- }
10970
- interface DefaultComponentElement<P> {
10971
- type: "default-component";
10972
- kind: "button" | "text-input";
10973
- props?: {
10974
- [prop in keyof Partial<P>]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10975
- } & {
10976
- [prop: string]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10977
- };
10978
- styles?: CSSProperties;
10979
- }
10980
- interface CodeComponentElement<P> {
10981
- type: "component";
10982
- /**
10983
- * The registered component name
10984
- */
10985
- name: string;
10986
- styles?: CSSProperties;
10987
- props?: {
10988
- [prop in keyof Partial<P>]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10989
- } & {
10990
- [prop: string]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10991
- };
10992
- }
10993
- declare type PlasmicElement = ImageElement | TextElement | ContainerElement | ButtonElement | TextInputElement | CodeComponentElement<{}> | DefaultComponentElement<{}>;
10994
-
10995
- interface CanvasComponentProps<Data = any> {
10996
- /**
10997
- * This prop is only provided within the canvas of Plasmic Studio.
10998
- * Allows the component to set data to be consumed by the props' controls.
10999
- */
11000
- setControlContextData?: (data: Data) => void;
11001
- }
11002
- declare type InferDataType<P> = P extends CanvasComponentProps<infer Data> ? Data : any;
11003
- declare type ControlExtras = {
11004
- path: (string | number)[];
11005
- };
11006
- /**
11007
- * Context that we pass back to control functions.
11008
- */
11009
- declare type ControlContext<P> = [
11010
- /**
11011
- * props
11012
- */
11013
- P,
11014
- /**
11015
- * `contextData` can be `null` if the prop controls are rendering before
11016
- * the component instance itself (it will re-render once the component
11017
- * calls `setControlContextData`)
11018
- */
11019
- InferDataType<P> | null,
11020
- /**
11021
- * Extra information for the control to use
11022
- */
11023
- ControlExtras];
11024
- /**
11025
- * Config option that takes the context (e.g., props) of the component instance
11026
- * to dynamically set its value.
11027
- */
11028
- declare type ContextDependentConfig<P, R> = (...args: ControlContext<P>) => R;
11029
- interface PropTypeBase<P> {
11030
- displayName?: string;
11031
- description?: string;
11032
- helpText?: string;
11033
- /**
11034
- * If the user has chosen to use a dynamic expression for this prop, provide
11035
- * a hint as to the expected values that the expression should evaluate to.
11036
- * This hint will be displayed alongside the code editor. You may use
11037
- * markdown in the text here.
11038
- */
11039
- exprHint?: string;
11040
- /**
11041
- * Function for whether this prop should be hidden in the right panel,
11042
- * given the current props for this component
11043
- */
11044
- hidden?: ContextDependentConfig<P, boolean>;
11045
- readOnly?: boolean | ContextDependentConfig<P, boolean>;
11046
- /**
11047
- * If true, will hide the prop in a collapsed section; good for props that
11048
- * should not usually be used.
11049
- */
11050
- advanced?: boolean;
11051
- /**
11052
- * If true, does not allow the user to use a dynamic expression for this prop
11053
- */
11054
- disableDynamicValue?: boolean;
11055
- /**
11056
- * If set to true, the component will be remounted when the prop value is updated.
11057
- * (This behavior only appliees to canvas)
11058
- */
11059
- forceRemount?: boolean;
11060
- }
11061
- declare type DefaultValueOrExpr<P, T> = {
11062
- defaultExpr?: undefined;
11063
- defaultExprHint?: undefined;
11064
- defaultValue?: T;
11065
- defaultValueHint?: T | ContextDependentConfig<P, T | undefined>;
11066
- } | {
11067
- defaultValue?: undefined;
11068
- defaultValueHint?: undefined;
11069
- defaultExpr?: string;
11070
- defaultExprHint?: string;
11071
- };
11072
- declare type StringTypeBase<P> = PropTypeBase<P> & DefaultValueOrExpr<P, string>;
11073
- declare type StringType<P> = "string" | (({
11074
- type: "string";
11075
- control?: "default" | "large";
11076
- } | {
11077
- type: "code";
11078
- lang: "css" | "html" | "javascript" | "json";
11079
- } | {
11080
- type: "richText";
11081
- } | {
11082
- type: "color";
11083
- /**
11084
- * If specified, and the user picks a color token in the Studio, then
11085
- * the value passed in as prop is a css variable reference, like
11086
- * `var(--TOKEN_ID)`, instead of the resolved hex value of the token.
11087
- * You should take care in using this in the proper css context --
11088
- * the css token is only defined if you are rendering under some
11089
- * Plasmic component in the DOM tree, which is usually the case,
11090
- * unless you are using a React portal.
11091
- */
11092
- keepCssVar?: boolean;
11093
- } | {
11094
- type: "class";
11095
- /**
11096
- * Additional css selectors that can change how this style should look.
11097
- * Some examples:
11098
- *
11099
- * * `:hover` -- on hover
11100
- * * `[data-something="blah"] -- when the element with this class has
11101
- * an html attribute "data-something=blah"
11102
- * * :component[data-something="blah"] :self -- when the root of the
11103
- * component has an html attribute "data-something=blah". Note that
11104
- * the non-standard `:component` selector is used to select the
11105
- * component root, and the non-standard `:self` selector is used
11106
- * to select the element that this class is attached to.
11107
- */
11108
- selectors?: {
11109
- /**
11110
- * A css selector, like `:hover` or `[data-something="blah"]`.
11111
- */
11112
- selector: string;
11113
- /**
11114
- * An optional human-friendly label for the selector, so the studio user
11115
- * knows what this selector means.
11116
- */
11117
- label?: string;
11118
- }[];
11119
- /**
11120
- * If specified, then only shows these style sections for styling this class
11121
- */
11122
- styleSections?: StyleSection[];
11123
- } | {
11124
- type: "themeResetClass";
11125
- /**
11126
- * Normally, theme reset class will only target Plasmic-generated tags
11127
- * with the default tag styles. If you also want to target non-Plasmic-generated
11128
- * tags (say, rendered by your code components, or fetched as an HTML blob
11129
- * from somewhere), then specify `true` here.
11130
- */
11131
- targetAllTags?: boolean;
11132
- } | {
11133
- type: "cardPicker";
11134
- modalTitle?: React.ReactNode | ContextDependentConfig<P, React.ReactNode>;
11135
- options: {
11136
- value: string;
11137
- label?: string;
11138
- imgUrl: string;
11139
- footer?: React.ReactNode;
11140
- }[] | ContextDependentConfig<P, {
11141
- value: string;
11142
- label?: string;
11143
- imgUrl: string;
11144
- footer?: React.ReactNode;
11145
- }[]>;
11146
- showInput?: boolean | ContextDependentConfig<P, boolean>;
11147
- onSearch?: ContextDependentConfig<P, ((value: string) => void) | undefined>;
11148
- }) & StringTypeBase<P>);
11149
- declare type BooleanType<P> = "boolean" | ({
11150
- type: "boolean";
11151
- } & DefaultValueOrExpr<P, boolean> & PropTypeBase<P>);
11152
- declare type GraphQLValue = {
11153
- query: string;
11154
- variables?: Record<string, any>;
11155
- };
11156
- declare type GraphQLType<P> = {
11157
- type: "code";
11158
- lang: "graphql";
11159
- endpoint: string | ContextDependentConfig<P, string>;
11160
- method?: string | ContextDependentConfig<P, string>;
11161
- headers?: object | ContextDependentConfig<P, object>;
11162
- } & DefaultValueOrExpr<P, GraphQLValue> & PropTypeBase<P>;
11163
- declare type NumberTypeBase<P> = PropTypeBase<P> & DefaultValueOrExpr<P, number> & {
11164
- type: "number";
11165
- };
11166
- declare type NumberType<P> = "number" | (({
11167
- control?: "default";
11168
- min?: number | ContextDependentConfig<P, number>;
11169
- max?: number | ContextDependentConfig<P, number>;
11170
- } | {
11171
- control: "slider";
11172
- min: number | ContextDependentConfig<P, number>;
11173
- max: number | ContextDependentConfig<P, number>;
11174
- step?: number | ContextDependentConfig<P, number>;
11175
- }) & NumberTypeBase<P>);
11176
- /**
11177
- * Expects defaultValue to be a JSON-compatible value
11178
- */
11179
- declare type JSONLikeType<P> = "object" | ({
11180
- type: "object";
11181
- fields?: {
11182
- [p: string]: PropType$1<P>;
11183
- };
11184
- /**
11185
- * Optional function that generates a name for this item in the array
11186
- */
11187
- nameFunc?: (item: any, ...args: ControlContext<P>) => string | undefined;
11188
- } & DefaultValueOrExpr<P, any> & PropTypeBase<P>) | ({
11189
- type: "array";
11190
- itemType?: {
11191
- type: "object";
11192
- fields: {
11193
- [p: string]: PropType$1<P>;
11194
- };
11195
- /**
11196
- * Optional function that generates a name for this item in the array
11197
- */
11198
- nameFunc?: (item: any, ...args: ControlContext<P>) => string | undefined;
11199
- };
11200
- /**
11201
- * Optional function that determines whether the user can delete a given item.
11202
- */
11203
- unstable__canDelete?: (item: any, ...args: ControlContext<P>) => boolean;
11204
- /**
11205
- * Specify how to let Plasmic know how to update its own internal representation of the data when the value has
11206
- * changed, or when issuing a minimalValue or shownValue that is different.
11207
- *
11208
- * Important to specify this if you are expecting any nested expression values in this data type!
11209
- */
11210
- unstable__keyFunc?: (item: any) => any;
11211
- /**
11212
- * Specify what would be the tentative new value that is set if the user makes any changes.
11213
- *
11214
- * Useful for field mappings.
11215
- *
11216
- * For instance, consider a Table where we have a `fields` prop:
11217
- *
11218
- * - Initially, the value is undefined. But if the user makes any changes, we would want to save an array of at
11219
- * least three items (corresponding to, say, three columns inferred from a schema).
11220
- *
11221
- * - Let's say there are 5 columns in the value. The data schema changes, removing a column and adding two new
11222
- * ones. Now we would want a different minimal value, containing 6 items.
11223
- */
11224
- unstable__minimalValue?: ContextDependentConfig<P, any>;
11225
- } & DefaultValueOrExpr<P, any[]> & PropTypeBase<P>) | ({
11226
- type: "dataSource";
11227
- dataSource: "airtable" | "cms";
11228
- } & PropTypeBase<P>);
11229
- declare type DataPickerValueType = string | number | (string | number)[];
11230
- declare type DataPickerType<P> = ({
11231
- type: "dataSelector";
11232
- data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
11233
- alwaysShowValuePathAsLabel?: boolean;
11234
- } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>) | ({
11235
- type: "exprEditor";
11236
- data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
11237
- } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>);
11238
- declare type FormValidationRulesType<P> = {
11239
- type: "formValidationRules";
11240
- } & DefaultValueOrExpr<P, any> & PropTypeBase<P>;
11241
- declare type EventHandlerType<P> = {
11242
- type: "eventHandler";
11243
- argTypes: {
11244
- name: string;
11245
- type: PropType$1<any>;
11246
- }[];
11247
- } & DefaultValueOrExpr<P, (...args: any) => any> & PropTypeBase<P>;
11248
- interface ChoiceTypeBase<P> extends PropTypeBase<P> {
11249
- type: "choice";
11250
- options: string[] | {
11251
- label: string;
11252
- value: string | number | boolean;
11253
- }[] | ContextDependentConfig<P, string[] | {
11254
- label: string;
11255
- value: string | number | boolean;
11256
- }[]>;
11257
- allowSearch?: boolean;
11258
- filterOption?: boolean;
11259
- onSearch?: ContextDependentConfig<P, ((value: string) => void) | undefined>;
11260
- }
11261
- declare type ChoiceType<P> = (({
11262
- multiSelect?: false;
11263
- } & DefaultValueOrExpr<P, string | number | boolean>) | ({
11264
- multiSelect: true;
11265
- } & DefaultValueOrExpr<P, (string | number | boolean)[]>) | ({
11266
- multiSelect: ContextDependentConfig<P, boolean>;
11267
- } & DefaultValueOrExpr<P, string | number | boolean | (string | number | boolean)[]>)) & ChoiceTypeBase<P>;
11268
- interface ModalProps {
11269
- show?: boolean;
11270
- children?: React.ReactNode;
11271
- onClose: () => void;
11272
- style?: CSSProperties;
11273
- }
11274
- interface CustomControlProps<P> {
11275
- componentProps: P;
11276
- /**
11277
- * `contextData` can be `null` if the prop controls are rendering before
11278
- * the component instance itself (it will re-render once the component
11279
- * calls `setControlContextData`)
11280
- */
11281
- contextData: InferDataType<P> | null;
11282
- value: any;
11283
- /**
11284
- * Sets the value to be passed to the prop. Expects a JSON-compatible value.
11285
- */
11286
- updateValue: (newVal: any) => void;
11287
- /**
11288
- * Full screen modal component
11289
- */
11290
- FullscreenModal: React.ComponentType<ModalProps>;
11291
- /**
11292
- * Modal component for the side pane
11293
- */
11294
- SideModal: React.ComponentType<ModalProps>;
11295
- /**
11296
- * The document that the component will be rendered into; instead of using
11297
- * `document` directly (for, say, `document.querySelector()` etc.), you
11298
- * should use this instead.
11299
- */
11300
- studioDocument: typeof document;
11301
- }
11302
- declare type CustomControl<P> = React.ComponentType<CustomControlProps<P>>;
11303
- /**
11304
- * Expects defaultValue to be a JSON-compatible value
11305
- */
11306
- declare type CustomType<P> = CustomControl<P> | ({
11307
- type: "custom";
11308
- control: CustomControl<P>;
11309
- } & PropTypeBase<P> & DefaultValueOrExpr<P, any>);
11310
- declare type SlotType<P> = "slot" | ({
11311
- type: "slot";
11312
- /**
11313
- * The unique names of all code components that can be placed in the slot
11314
- */
11315
- allowedComponents?: string[];
11316
- /**
11317
- * Whether the "empty slot" placeholder should be hidden in the canvas.
11318
- */
11319
- hidePlaceholder?: boolean;
11320
- /**
11321
- * Whether the slot is repeated, i.e., is rendered multiple times using
11322
- * repeatedElement().
11323
- */
11324
- isRepeated?: boolean;
11325
- /**
11326
- * A nicer, human-readable display name for your slot prop
11327
- */
11328
- displayName?: string;
11329
- /**
11330
- * Function for whether this slot should be hidden from the left tree,
11331
- * given the current props for this component
11332
- */
11333
- hidden?: ContextDependentConfig<P, boolean>;
11334
- /**
11335
- * If slot is a render prop (accepts a function that takes in some
11336
- * arguments and returns some JSX), then specify the names of the
11337
- * arguments expected by the render prop function.
11338
- */
11339
- renderPropParams?: string[];
11340
- } & Omit<DefaultValueOrExpr<P, PlasmicElement | PlasmicElement[]>, "defaultValueHint" | "defaultExpr" | "defaultExprHint">);
11341
- declare type ImageUrlType<P> = "imageUrl" | ({
11342
- type: "imageUrl";
11343
- } & DefaultValueOrExpr<P, string> & PropTypeBase<P>);
11344
- declare type PrimitiveType<P = any> = Extract<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P>, String>;
11345
- declare type ControlTypeBase = {
11346
- editOnly?: false;
11347
- } | {
11348
- editOnly: true;
11349
- /**
11350
- * The prop where the values should be mapped to
11351
- */
11352
- uncontrolledProp?: string;
11353
- };
11354
- declare type SupportControlled<T> = Extract<T, String | CustomControl<any>> | (Exclude<T, String | CustomControl<any>> & ControlTypeBase);
11355
- declare type PropType$1<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P> | FormValidationRulesType<P> | EventHandlerType<P>> | SlotType<P>;
11356
- declare type RestrictPropType$1<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | ImageUrlType<P> | CustomType<P> | DataPickerType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : PropType$1<P>;
11357
- interface ActionProps<P> {
11358
- componentProps: P;
11359
- /**
11360
- * `contextData` can be `null` if the prop controls are rendering before
11361
- * the component instance itself (it will re-render once the component
11362
- * calls `setControlContextData`)
11363
- */
11364
- contextData: InferDataType<P> | null;
11365
- studioOps: {
11366
- showModal: (modalProps: Omit<ModalProps, "onClose"> & {
11367
- onClose?: () => void;
11368
- }) => void;
11369
- refreshQueryData: () => void;
11370
- appendToSlot: (element: PlasmicElement, slotName: string) => void;
11371
- removeFromSlotAt: (pos: number, slotName: string) => void;
11372
- updateProps: (newValues: any) => void;
11373
- };
11374
- /**
11375
- * The document that the component will be rendered into; instead of using
11376
- * `document` directly (for, say, `document.querySelector()` etc.), you
11377
- * should use this instead.
11378
- */
11379
- studioDocument: typeof document;
11380
- }
11381
- declare type Action<P> = {
11382
- type: "button-action";
11383
- label: string;
11384
- onClick: (props: ActionProps<P>) => void;
11385
- } | {
11386
- type: "custom-action";
11387
- control: React.ComponentType<ActionProps<P>>;
11388
- };
11389
- declare type DistributedKeyOf$1<T> = T extends any ? keyof T : never;
11390
- interface ComponentTemplate<P> extends Omit<CodeComponentElement<P>, "type" | "name"> {
11391
- /**
11392
- * A preview picture for the template.
11393
- */
11394
- previewImg?: string;
11395
- }
11396
- interface ComponentTemplates<P> {
11397
- [name: string]: ComponentTemplate<P>;
11398
- }
11399
- declare type StateSpec = {
11400
- onChangeProp: string;
11401
- } & ({
11402
- type: "readonly";
11403
- variableType: "text";
11404
- initVal?: string;
11405
- } | {
11406
- type: "readonly";
11407
- variableType: "number";
11408
- initVal?: number;
11409
- } | {
11410
- type: "readonly";
11411
- variableType: "boolean";
11412
- initVal?: boolean;
11413
- } | {
11414
- type: "readonly";
11415
- variableType: "array";
11416
- initVal?: any[];
11417
- } | {
11418
- type: "readonly";
11419
- variableType: "object";
11420
- initVal?: object;
11421
- } | {
11422
- type: "writable";
11423
- variableType: "text" | "number" | "boolean" | "array" | "object";
11424
- valueProp: string;
11425
- });
11426
- interface StateHelpers<P, T> {
11427
- initFunc?: ($props: P) => T;
11428
- onChangeArgsToValue?: (...args: any) => T;
11429
- }
11430
- declare type ComponentHelpers<P> = {
11431
- states: Record<string, StateHelpers<P, any>>;
11432
- };
11433
- declare type ExternalComponentHelpers<P> = {
11434
- helpers: ComponentHelpers<P>;
11435
- importPath: string;
11436
- } & ({
11437
- importName: string;
11438
- } | {
11439
- isDefaultExport: true;
11440
- });
11441
- declare type StyleSection = "visibility" | "typography" | "sizing" | "spacing" | "background" | "transform" | "transitions" | "layout" | "overflow" | "border" | "shadows" | "effects";
11442
- interface CodeComponentMeta<P> {
11443
- /**
11444
- * Any unique string name used to identify that component. Each component
11445
- * should be registered with a different `meta.name`, even if they have the
11446
- * same name in the code.
11447
- */
11448
- name: string;
11449
- /**
11450
- * The name to be displayed for the component in Studio. Optional: if not
11451
- * specified, `meta.name` is used.
11452
- */
11453
- displayName?: string;
11454
- /**
11455
- * The description of the component to be shown in Studio.
11456
- */
11457
- description?: string;
11458
- /**
11459
- * The javascript name to be used when generating code. Optional: if not
11460
- * provided, `meta.name` is used.
11461
- */
11462
- importName?: string;
11463
- /**
11464
- * An object describing the component properties to be used in Studio.
11465
- * For each `prop`, there should be an entry `meta.props[prop]` describing
11466
- * its type.
11467
- */
11468
- props: {
11469
- [prop in DistributedKeyOf$1<P>]?: RestrictPropType$1<P[prop], P>;
11470
- } & {
11471
- [prop: string]: PropType$1<P>;
11472
- };
11473
- /**
11474
- * An object describing the component states to be used in Studio.
11475
- */
11476
- states?: Record<string, StateSpec>;
11477
- /**
11478
- * An object describing the components helpers to be used in Studio.
11479
- * 1. states helpers: Each state can receive an "initFunc" prop to initialize
11480
- * the implicit state in Studio, and an "onChangeArgsToValue" prop to
11481
- * transform the event handler arguments into a value
11482
- */
11483
- componentHelpers?: ExternalComponentHelpers<P>;
11484
- /**
11485
- * An array describing the component actions to be used in Studio.
11486
- */
11487
- actions?: Action<P>[];
11488
- /**
11489
- * Whether style sections should be shown in Studio. For styles to work, the
11490
- * component must accept a `className` prop. If unset, defaults to all styles.
11491
- * Set to `false` if this component cannot be styled (for example, if it doesn't
11492
- * render any DOM elements).
11493
- */
11494
- styleSections?: StyleSection[] | boolean;
11495
- /**
11496
- * Whether the element can be repeated in Studio. If unset, defaults to true.
11497
- */
11498
- isRepeatable?: boolean;
11499
- /**
11500
- * The path to be used when importing the component in the generated code.
11501
- * It can be the name of the package that contains the component, or the path
11502
- * to the file in the project (relative to the root directory).
11503
- */
11504
- importPath: string;
11505
- /**
11506
- * Whether the component is the default export from that path. Optional: if
11507
- * not specified, it's considered `false`.
11508
- */
11509
- isDefaultExport?: boolean;
11510
- /**
11511
- * The prop that expects the CSS classes with styles to be applied to the
11512
- * component. Optional: if not specified, Plasmic will expect it to be
11513
- * `className`. Notice that if the component does not accept CSS classes, the
11514
- * component will not be able to receive styles from the Studio.
11515
- */
11516
- classNameProp?: string;
11517
- /**
11518
- * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`
11519
- * to interact with components, so it's not used in the generated code.
11520
- * Optional: If not provided, the usual `ref` is used.
11521
- */
11522
- refProp?: string;
11523
- /**
11524
- * Default styles to start with when instantiating the component in Plasmic.
11525
- */
11526
- defaultStyles?: CSSProperties;
11527
- /**
11528
- * Component templates to start with on Plasmic.
11529
- */
11530
- templates?: ComponentTemplates<P>;
11531
- /**
11532
- * Registered name of parent component, used for grouping related components.
11533
- */
11534
- parentComponentName?: string;
11535
- /**
11536
- * Whether the component can be used as an attachment to an element.
11537
- */
11538
- isAttachment?: boolean;
11539
- /**
11540
- * Whether the component provides data to its slots using DataProvider.
11541
- */
11542
- providesData?: boolean;
11543
- /**
11544
- * If specified, then Figma components with the specified names will be mapped
11545
- * to this component when you paste Figma content into Plasmic
11546
- */
11547
- figmaMappings?: {
11548
- figmaComponentName: string;
11549
- }[];
11550
- /**
11551
- * If true, when an instance of this component is added, the element
11552
- * will always be named by the name of this component.
11553
- */
11554
- alwaysAutoName?: boolean;
11555
- unstable__refActions?: Record<string, RefActionRegistration<P>>;
11556
- }
11557
- interface FunctionParam<P> {
11558
- name: string;
11559
- displayName?: string;
11560
- type: PropType$1<P>;
11561
- }
11562
- interface RefActionRegistration<P> {
11563
- displayName?: string;
11564
- description?: string;
11565
- parameters: FunctionParam<P>[];
11566
- }
11567
- interface ComponentRegistration {
11568
- component: React.ComponentType<any>;
11569
- meta: CodeComponentMeta<any>;
11570
- }
11571
- declare global {
11572
- interface Window {
11573
- __PlasmicComponentRegistry: ComponentRegistration[];
11574
- }
11575
- }
11576
-
11577
- declare type Fetcher = (...args: any[]) => Promise<any>;
11578
- interface FetcherMeta {
11579
- /**
11580
- * Any unique identifying string for this fetcher.
11581
- */
11582
- name: string;
11583
- /**
11584
- * The Studio-user-friendly display name.
11585
- */
11586
- displayName?: string;
11587
- /**
11588
- * The symbol to import from the importPath.
11589
- */
11590
- importName?: string;
11591
- args: {
11592
- name: string;
11593
- type: PrimitiveType;
11594
- }[];
11595
- returns: PrimitiveType;
11596
- /**
11597
- * Either the path to the fetcher relative to `rootDir` or the npm
11598
- * package name
11599
- */
11600
- importPath: string;
11601
- /**
11602
- * Whether it's a default export or named export
11603
- */
11604
- isDefaultExport?: boolean;
11605
- }
11606
- interface FetcherRegistration {
11607
- fetcher: Fetcher;
11608
- meta: FetcherMeta;
11609
- }
11610
- declare global {
11611
- interface Window {
11612
- __PlasmicFetcherRegistry: FetcherRegistration[];
11613
- }
11614
- }
11615
-
11616
- declare type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | CustomType<P>>;
11617
- declare type RestrictPropType<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | CustomType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P>> : PropType<P>;
11618
- declare type DistributedKeyOf<T> = T extends any ? keyof T : never;
11619
- interface GlobalContextMeta<P> {
11620
- /**
11621
- * Any unique string name used to identify that context. Each context
11622
- * should be registered with a different `meta.name`, even if they have the
11623
- * same name in the code.
11624
- */
11625
- name: string;
11626
- /**
11627
- * The name to be displayed for the context in Studio. Optional: if not
11628
- * specified, `meta.name` is used.
11629
- */
11630
- displayName?: string;
11631
- /**
11632
- * The description of the context to be shown in Studio.
11633
- */
11634
- description?: string;
11635
- /**
11636
- * The javascript name to be used when generating code. Optional: if not
11637
- * provided, `meta.name` is used.
11638
- */
11639
- importName?: string;
11640
- /**
11641
- * An object describing the context properties to be used in Studio.
11642
- * For each `prop`, there should be an entry `meta.props[prop]` describing
11643
- * its type.
11644
- */
11645
- props: {
11646
- [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P>;
11647
- } & {
11648
- [prop: string]: PropType<P>;
11649
- };
11650
- /**
11651
- * The path to be used when importing the context in the generated code.
11652
- * It can be the name of the package that contains the context, or the path
11653
- * to the file in the project (relative to the root directory).
11654
- */
11655
- importPath: string;
11656
- /**
11657
- * Whether the context is the default export from that path. Optional: if
11658
- * not specified, it's considered `false`.
11659
- */
11660
- isDefaultExport?: boolean;
11661
- /**
11662
- * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`
11663
- * to interact with components, so it's not used in the generated code.
11664
- * Optional: If not provided, the usual `ref` is used.
11665
- */
11666
- refProp?: string;
11667
- /**
11668
- * Whether the global context provides data to its children using DataProvider.
11669
- */
11670
- providesData?: boolean;
11671
- unstable__globalActions?: Record<string, GlobalActionRegistration<P>>;
11672
- }
11673
- interface GlobalContextRegistration {
11674
- component: React.ComponentType<any>;
11675
- meta: GlobalContextMeta<any>;
11676
- }
11677
- interface GlobalActionRegistration<P> {
11678
- displayName?: string;
11679
- description?: string;
11680
- parameters: FunctionParam<P>[];
11681
- }
11682
- declare global {
11683
- interface Window {
11684
- __PlasmicContextRegistry: GlobalContextRegistration[];
11685
- }
11686
- }
11687
-
11688
- declare type TokenType = "color" | "spacing" | "font-family" | "font-size" | "line-height" | "opacity";
11689
- interface TokenRegistration {
11690
- name: string;
11691
- displayName: string;
11692
- value: string;
11693
- type: TokenType;
11694
- }
11695
- declare global {
11696
- interface Window {
11697
- __PlasmicTokenRegistry: TokenRegistration[];
11698
- }
11699
- }
11700
-
11701
- interface BasicTrait {
11702
- label?: string;
11703
- type: "text" | "number" | "boolean";
11704
- }
11705
- interface ChoiceTrait {
11706
- label?: string;
11707
- type: "choice";
11708
- options: string[];
11709
- }
11710
- declare type TraitMeta = BasicTrait | ChoiceTrait;
11711
- interface TraitRegistration {
11712
- trait: string;
11713
- meta: TraitMeta;
11714
- }
11715
- declare global {
11716
- interface Window {
11717
- __PlasmicTraitRegistry: TraitRegistration[];
11718
- }
11719
- }
11720
-
11721
- declare function initializeCodeComponentStates($state: $State, states: {
11722
- name: string;
11723
- plasmicStateName: string;
11724
- }[], repetitionIndex: number[], componentHelpers: ComponentHelpers<any>, child$Props: Record<string, any>): void;
11725
- declare function initializePlasmicStates($state: $State, states: {
11726
- name: string;
11727
- initFunc: InitFunc<any>;
11728
- }[], repetitionIndex: number[]): void;
11729
- declare function generateStateOnChangeProp($state: $State, path: ObjectPath): (val: any) => void;
11730
- declare function generateStateOnChangePropForCodeComponents($state: $State, stateName: string, plasmicStatePath: ObjectPath, componentHelpers: ComponentHelpers<any>): (val: any) => void;
11731
- declare function generateStateValueProp($state: $State, path: ObjectPath): any;
11732
- declare function isPlasmicStateProxy(obj: any): boolean;
11733
- declare function is$StateProxy(obj: any): number | boolean | undefined;
11734
- declare function getStateCellsInPlasmicProxy(obj: any): {
11735
- realPath: ObjectPath;
11736
- path: string;
11737
- }[];
11738
- declare function getStateSpecInPlasmicProxy(obj: any, path: ObjectPath): {
11739
- spec: Internal$StateSpec<any>;
11740
- isImplicitStateArray: boolean;
11741
- } | undefined;
11742
- declare function getCurrentInitialValue(obj: any, path: ObjectPath): any;
11743
- declare function resetToInitialValue(obj: any, path: ObjectPath): void;
11744
- /**
11745
- * Forked from https://github.com/lukeed/dset
11746
- * Changes: fixed setting a deep value to a proxy object
11747
- */
11748
- declare function set(obj: any, keys: any, val: any): void;
11749
-
11750
- declare function useDollarState(specs: $StateSpec<any>[], ...rest: any[]): $State;
11751
-
11752
- interface Variants {
11753
- [vg: string]: any;
11754
- }
11755
- type MultiChoiceArg<M extends string> = M | M[] | {
11756
- [v in M]?: boolean;
11757
- };
11758
- type SingleChoiceArg<M extends string> = M;
11759
- type SingleBooleanChoiceArg<M extends string> = M | boolean;
11760
- interface OverrideTwiddle {
11761
- wrapChildren?: (children: React$1.ReactNode) => React$1.ReactNode;
11762
- wrap?: (node: React$1.ReactNode) => React$1.ReactNode;
11763
- }
11764
- type DefaultOverride<C extends React$1.ElementType> = {
11765
- type: "default";
11766
- props?: Partial<React$1.ComponentProps<C>>;
11767
- } & OverrideTwiddle;
11768
- type AsOverride<C extends React$1.ElementType> = {
11769
- type: "as";
11770
- as: C;
11771
- props?: Partial<React$1.ComponentProps<C>>;
11772
- } & OverrideTwiddle;
11773
- type RenderOverride<C extends React$1.ElementType> = {
11774
- type: "render";
11775
- render: (props: React$1.ComponentProps<C>, Comp: C) => React$1.ReactNode;
11776
- props?: Partial<React$1.ComponentProps<C>>;
11777
- } & OverrideTwiddle;
11778
- type Flex<DefaultElementType extends React$1.ElementType> = (Omit<DefaultOverride<DefaultElementType>, "type"> & {
11779
- as?: never;
11780
- render?: never;
11781
- }) | Omit<AsOverride<any>, "type"> | (Omit<RenderOverride<DefaultElementType>, "type"> & {
11782
- as?: never;
11783
- }) | React$1.ReactChild | null | undefined | (Partial<React$1.ComponentProps<DefaultElementType>> & {
11784
- wrap?: never;
11785
- wrapChildren?: never;
11786
- props?: never;
11787
- as?: never;
11788
- render?: never;
11789
- }) | ((props: React$1.ComponentProps<DefaultElementType>) => React$1.ReactNode);
11790
- declare function hasVariant<V extends Variants>(variants: V | undefined, groupName: keyof V, variant: string): any;
11791
- declare function createPlasmicElementProxy<DefaultElementType extends React$1.ElementType>(defaultElement: DefaultElementType, props: Partial<React$1.ComponentProps<DefaultElementType>>, ...children: React$1.ReactNode[]): React$1.ReactNode;
11792
- declare function makeFragment(...children: React$1.ReactNode[]): React$1.FunctionComponentElement<{
11793
- children?: React$1.ReactNode;
11794
- }>;
11795
- declare function wrapWithClassName(element: React$1.ReactNode, className: string): React$1.DetailedReactHTMLElement<{
11796
- key: React$1.Key | undefined;
11797
- className: string;
11798
- style: {
11799
- display: "grid";
11800
- };
11801
- }, HTMLElement>;
11802
- declare function mergeVariantsWithStates(variants: Variants, $state: $State, linkedStates: {
11803
- variantGroup: string;
11804
- statePath: (string | number)[];
11805
- }[]): Variants;
11806
- declare function deriveRenderOpts(props: Record<string, any>, config: {
11807
- name: string;
11808
- descendantNames: string[];
11809
- internalVariantPropNames: string[];
11810
- internalArgPropNames: string[];
11811
- }): {
11812
- variants: Partial<Partial<Record<string, any>>>;
11813
- args: Partial<Partial<Record<string, any>>>;
11814
- overrides: Partial<Partial<Record<string, any>>>;
10881
+ type CSSProperties = Properties<string | number> & {
10882
+ layout?: "vbox" | "hbox" | "box" | "page-section";
11815
10883
  };
10884
+ type ContainerTags = "a" | "address" | "article" | "aside" | "blockquote" | "button" | "code" | "dd" | "div" | "dl" | "dt" | "form" | "footer" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "header" | "hgroup" | "label" | "li" | "main" | "nav" | "ol" | "p" | "pre" | "section" | "span" | "ul";
10885
+ type CommonAttrKeys = "title" | "tabIndex" | "className" | "id" | "aria-label" | "aria-hidden" | "aria-labelledby" | "aria-describedby" | "role";
10886
+ type PictureAttrKeys = "alt" | "loading" | CommonAttrKeys;
10887
+ type LinkAttrKeys = "href" | "target" | CommonAttrKeys;
10888
+ type TextAreaAttrKeys = "disabled" | "value" | "cols" | "rows" | "placeholder" | CommonAttrKeys;
10889
+ type InputAttrKeys = "disabled" | "value" | "defaultValue" | "name" | "autoComplete" | "checked" | "placeholder" | CommonAttrKeys;
10890
+ type ButtonAttrKeys = "disabled" | CommonAttrKeys;
10891
+ type Attrs<Keys extends string> = Partial<Record<Keys, string>>;
10892
+ interface PictureElement {
10893
+ type: "img";
10894
+ src: string;
10895
+ styles?: CSSProperties;
10896
+ attrs?: Attrs<PictureAttrKeys>;
10897
+ }
10898
+ type ImageElement = PictureElement;
10899
+ interface LinkTextElement {
10900
+ type: "text";
10901
+ tag: "a";
10902
+ value: string;
10903
+ styles?: CSSProperties;
10904
+ attrs?: Attrs<LinkAttrKeys>;
10905
+ }
10906
+ interface ButtonTextElement {
10907
+ type: "text";
10908
+ tag: "button";
10909
+ value: string;
10910
+ styles?: CSSProperties;
10911
+ attrs?: Attrs<ButtonAttrKeys>;
10912
+ }
10913
+ interface GenericTextElement {
10914
+ type: "text";
10915
+ /**
10916
+ * Default: "div"
10917
+ */
10918
+ tag?: Exclude<ContainerTags, "a" | "button">;
10919
+ value: string;
10920
+ styles?: CSSProperties;
10921
+ attrs?: Attrs<CommonAttrKeys>;
10922
+ }
10923
+ type TextElement = string | LinkTextElement | ButtonTextElement | GenericTextElement;
10924
+ interface LinkContainerElement {
10925
+ type: "box" | "vbox" | "hbox";
10926
+ tag: "a";
10927
+ children?: PlasmicElement | PlasmicElement[];
10928
+ styles?: CSSProperties;
10929
+ attrs?: Attrs<LinkAttrKeys>;
10930
+ }
10931
+ interface ButtonContainerElement {
10932
+ type: "box" | "vbox" | "hbox";
10933
+ tag: "button";
10934
+ children?: PlasmicElement | PlasmicElement[];
10935
+ styles?: CSSProperties;
10936
+ attrs?: Attrs<ButtonAttrKeys>;
10937
+ }
10938
+ interface GenericContainerElement {
10939
+ type: "box" | "vbox" | "hbox" | "page-section";
10940
+ /**
10941
+ * Default: "div"
10942
+ */
10943
+ tag?: Exclude<ContainerTags, "a" | "button">;
10944
+ children?: PlasmicElement | PlasmicElement[];
10945
+ styles?: CSSProperties;
10946
+ attrs?: Attrs<CommonAttrKeys>;
10947
+ }
10948
+ type ContainerElement = LinkContainerElement | ButtonContainerElement | GenericContainerElement;
10949
+ interface ButtonElement {
10950
+ type: "button";
10951
+ value: string;
10952
+ styles?: CSSProperties;
10953
+ attrs?: Attrs<ButtonAttrKeys>;
10954
+ }
10955
+ interface InputElement {
10956
+ type: "input" | "password";
10957
+ styles?: CSSProperties;
10958
+ attrs?: Attrs<InputAttrKeys>;
10959
+ }
10960
+ interface TextAreaElement {
10961
+ type: "textarea";
10962
+ styles?: CSSProperties;
10963
+ attrs?: Attrs<TextAreaAttrKeys>;
10964
+ }
10965
+ type TextInputElement = InputElement | TextAreaElement;
10966
+ interface JsonElement {
10967
+ type: "json";
10968
+ value: any;
10969
+ }
10970
+ interface DefaultComponentElement<P> {
10971
+ type: "default-component";
10972
+ kind: "button" | "text-input";
10973
+ props?: {
10974
+ [prop in keyof Partial<P>]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10975
+ } & {
10976
+ [prop: string]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10977
+ };
10978
+ styles?: CSSProperties;
10979
+ }
10980
+ interface CodeComponentElement<P> {
10981
+ type: "component";
10982
+ /**
10983
+ * The registered component name
10984
+ */
10985
+ name: string;
10986
+ styles?: CSSProperties;
10987
+ props?: {
10988
+ [prop in keyof Partial<P>]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10989
+ } & {
10990
+ [prop: string]: number | string | boolean | null | undefined | JsonElement | PlasmicElement | PlasmicElement[];
10991
+ };
10992
+ }
10993
+ type PlasmicElement = ImageElement | TextElement | ContainerElement | ButtonElement | TextInputElement | CodeComponentElement<{}> | DefaultComponentElement<{}>;
11816
10994
 
11817
- declare function ensureGlobalVariants<T extends Record<string, any>>(globalVariantValues: T): T;
11818
-
11819
- type PlasmicHeadProps = {
11820
- title?: string;
11821
- description?: string;
11822
- image?: string;
11823
- canonical?: string;
11824
- };
11825
- declare function PlasmicHead(props: PlasmicHeadProps): JSX.Element | null;
11826
- declare const plasmicHeadMeta: {
11827
- name: string;
11828
- displayName: string;
11829
- description: string;
11830
- importName: string;
11831
- importPath: string;
11832
- isRepeatable: boolean;
11833
- styleSections: boolean;
11834
- props: {
11835
- title: {
11836
- type: string;
11837
- displayName: string;
11838
- };
11839
- description: {
11840
- type: string;
11841
- displayName: string;
11842
- };
11843
- image: {
11844
- type: string;
11845
- displayName: string;
11846
- };
11847
- canonical: {
11848
- type: string;
11849
- displayName: string;
11850
- };
11851
- };
10995
+ interface CanvasComponentProps<Data = any> {
10996
+ /**
10997
+ * This prop is only provided within the canvas of Plasmic Studio.
10998
+ * Allows the component to set data to be consumed by the props' controls.
10999
+ */
11000
+ setControlContextData?: (data: Data) => void;
11001
+ }
11002
+ type InferDataType<P> = P extends CanvasComponentProps<infer Data> ? Data : any;
11003
+ type ControlExtras = {
11004
+ path: (string | number)[];
11852
11005
  };
11853
-
11854
- declare function PlasmicIcon(props: React$1.ComponentProps<"svg"> & {
11855
- PlasmicIconType: React$1.ComponentType;
11856
- }): JSX.Element;
11857
-
11858
- /**
11859
- * Responsive `<img/>` replacement, based on `next/image`
11860
- */
11861
-
11862
- interface ImageLoader {
11863
- supportsUrl: (url: string) => boolean;
11864
- transformUrl: (opts: {
11865
- src: string;
11866
- width?: number;
11867
- quality?: number;
11868
- format?: "webp";
11869
- }) => string;
11870
- }
11871
- type ImgTagProps = Omit<React__default.ComponentProps<"img">, "src" | "srcSet" | "ref" | "style">;
11872
- interface PlasmicImgProps extends ImgTagProps {
11873
- /**
11874
- * Either an object with the src string, and its full width and height,
11875
- * or just a src string with unknown intrinsic dimensions.
11876
- */
11877
- src?: string | {
11878
- src: string | {
11879
- src: string;
11880
- height: number;
11881
- width: number;
11882
- blurDataURL?: string;
11883
- };
11884
- fullHeight: number;
11885
- fullWidth: number;
11886
- aspectRatio?: number;
11887
- };
11888
- /**
11889
- * className applied to the wrapper element if one is used.
11890
- */
11891
- className?: string;
11892
- /**
11893
- * css width
11894
- */
11895
- displayWidth?: number | string;
11896
- /**
11897
- * css height
11898
- */
11899
- displayHeight?: number | string;
11900
- /**
11901
- * css min-width
11902
- */
11903
- displayMinWidth?: number | string;
11904
- /**
11905
- * css min-height
11906
- */
11907
- displayMinHeight?: number | string;
11908
- /**
11909
- * css max-width
11910
- */
11911
- displayMaxWidth?: number | string;
11912
- /**
11913
- * css max-height
11914
- */
11915
- displayMaxHeight?: number | string;
11916
- /**
11917
- * For variable quality formats like jpg, the quality from 0 to 100
11918
- */
11919
- quality?: number;
11920
- /**
11921
- * ImageLoader to use for loading different dimensions of the image.
11922
- * If none specified, will not attempt to load different dimensions.
11923
- */
11924
- loader?: "plasmic" | ImageLoader;
11925
- /**
11926
- * Style applied to the wrapper element. objectFit and objectPosition
11927
- * rules are applied to the img element.
11928
- */
11929
- style?: React__default.CSSProperties;
11930
- /**
11931
- * Ref for the img element. The normal <PlasmicImg ref={...} />
11932
- * prop gives the root element instead, which may be the img element
11933
- * or a wrapper element
11934
- */
11935
- imgRef?: React__default.Ref<HTMLImageElement>;
11936
- }
11937
- declare const PlasmicImg: React__default.ForwardRefExoticComponent<PlasmicImgProps & React__default.RefAttributes<HTMLElement>>;
11938
-
11939
- declare const PlasmicLink: React__default.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React__default.RefAttributes<any>>;
11940
-
11941
- declare function PlasmicSlot<T extends keyof JSX.IntrinsicElements = "div">(props: React$1.ComponentProps<T> & {
11942
- as?: T;
11943
- defaultContents?: React$1.ReactNode;
11944
- value?: React$1.ReactNode;
11945
- }): JSX.Element | null;
11946
- declare function renderPlasmicSlot<T extends keyof JSX.IntrinsicElements = "div">(opts: {
11947
- as?: T;
11948
- defaultContents?: React$1.ReactNode;
11949
- value?: React$1.ReactNode;
11950
- }): JSX.Element | null;
11951
-
11952
- type Queries = {
11953
- [name: string]: string;
11954
- };
11955
- declare function createUseScreenVariants(isMulti: boolean, screenQueries: Queries): () => string | string[] | undefined;
11956
-
11957
- interface PlasmicDataSourceContextValue {
11958
- userAuthToken?: string | null;
11959
- isUserLoading?: boolean;
11960
- authRedirectUri?: string;
11961
- user?: {
11962
- email: string;
11963
- properties: Record<string, unknown> | null;
11964
- roleId: string;
11965
- roleName: string;
11966
- roleIds: string[];
11967
- roleNames: string[];
11968
- } | null;
11969
- }
11970
- declare function useCurrentUser(): {
11971
- email: string;
11972
- properties: Record<string, unknown> | null;
11973
- roleId: string;
11974
- roleName: string;
11975
- roleIds: string[];
11976
- roleNames: string[];
11977
- } | {
11978
- isLoggedIn: boolean;
11979
- };
11980
- declare const PlasmicDataSourceContextProvider: React__default.Provider<PlasmicDataSourceContextValue | undefined>;
11981
-
11982
11006
  /**
11983
- * Returns whether the component is currently being server side rendered or
11984
- * hydrated on the client. Can be used to delay browser-specific rendering
11985
- * until after hydration.
11007
+ * Context that we pass back to control functions.
11986
11008
  */
11987
- declare function useIsSSR$1(): boolean;
11988
-
11989
- type PlasmicTranslator = (str: string, opts?: {
11990
- components?: {
11991
- [key: string]: React__default.ReactElement;
11992
- };
11993
- }) => React__default.ReactNode;
11994
- interface TransProps {
11995
- transKey?: string;
11996
- children?: React__default.ReactNode;
11997
- }
11998
- declare function genTranslatableString(elt: React__default.ReactNode): {
11999
- str: string;
12000
- components: {
12001
- [key: string]: React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>>;
12002
- };
12003
- componentsCount: number;
12004
- };
12005
- declare function Trans({ transKey, children }: TransProps): React__default.ReactNode;
12006
-
12007
- interface PlasmicRootProviderProps extends PlasmicDataSourceContextValue {
12008
- platform?: "nextjs" | "gatsby";
12009
- children?: React$1.ReactNode;
12010
- translator?: PlasmicTranslator;
12011
- Head?: React$1.ComponentType<any>;
12012
- }
12013
- declare function PlasmicRootProvider(props: PlasmicRootProviderProps): JSX.Element;
12014
- declare const useIsSSR: typeof useIsSSR$1;
12015
-
12016
- declare const Stack: (<T extends keyof JSX.IntrinsicElements = "div">(props: {
12017
- as?: T | undefined;
12018
- hasGap?: boolean | undefined;
12019
- } & React$1.ComponentProps<T>) => React$1.ReactElement) & {
12020
- div: React$1.FC<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
12021
- hasGap?: boolean | undefined;
12022
- }>;
12023
- a: React$1.FC<React$1.ClassAttributes<HTMLAnchorElement> & React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
12024
- hasGap?: boolean | undefined;
12025
- }>;
12026
- button: React$1.FC<React$1.ClassAttributes<HTMLButtonElement> & React$1.ButtonHTMLAttributes<HTMLButtonElement> & {
12027
- hasGap?: boolean | undefined;
12028
- }>;
12029
- h1: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12030
- hasGap?: boolean | undefined;
12031
- }>;
12032
- h2: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12033
- hasGap?: boolean | undefined;
12034
- }>;
12035
- h3: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12036
- hasGap?: boolean | undefined;
12037
- }>;
12038
- h4: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12039
- hasGap?: boolean | undefined;
12040
- }>;
12041
- h5: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12042
- hasGap?: boolean | undefined;
12043
- }>;
12044
- h6: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12045
- hasGap?: boolean | undefined;
12046
- }>;
12047
- label: React$1.FC<React$1.ClassAttributes<HTMLLabelElement> & React$1.LabelHTMLAttributes<HTMLLabelElement> & {
12048
- hasGap?: boolean | undefined;
12049
- }>;
12050
- form: React$1.FC<React$1.ClassAttributes<HTMLFormElement> & React$1.FormHTMLAttributes<HTMLFormElement> & {
12051
- hasGap?: boolean | undefined;
12052
- }>;
12053
- section: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12054
- hasGap?: boolean | undefined;
12055
- }>;
12056
- head: React$1.FC<React$1.ClassAttributes<HTMLHeadElement> & React$1.HTMLAttributes<HTMLHeadElement> & {
12057
- hasGap?: boolean | undefined;
12058
- }>;
12059
- main: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12060
- hasGap?: boolean | undefined;
12061
- }>;
12062
- nav: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12063
- hasGap?: boolean | undefined;
12064
- }>;
11009
+ type ControlContext<P> = [
11010
+ /**
11011
+ * props
11012
+ */
11013
+ P,
11014
+ /**
11015
+ * `contextData` can be `null` if the prop controls are rendering before
11016
+ * the component instance itself (it will re-render once the component
11017
+ * calls `setControlContextData`)
11018
+ */
11019
+ InferDataType<P> | null,
11020
+ /**
11021
+ * Extra information for the control to use
11022
+ */
11023
+ ControlExtras
11024
+ ];
11025
+ /**
11026
+ * Config option that takes the context (e.g., props) of the component instance
11027
+ * to dynamically set its value.
11028
+ */
11029
+ type ContextDependentConfig<P, R> = (...args: ControlContext<P>) => R;
11030
+ interface PropTypeBase<P> {
11031
+ displayName?: string;
11032
+ description?: string;
11033
+ helpText?: string;
11034
+ /**
11035
+ * If the user has chosen to use a dynamic expression for this prop, provide
11036
+ * a hint as to the expected values that the expression should evaluate to.
11037
+ * This hint will be displayed alongside the code editor. You may use
11038
+ * markdown in the text here.
11039
+ */
11040
+ exprHint?: string;
11041
+ /**
11042
+ * Function for whether this prop should be hidden in the right panel,
11043
+ * given the current props for this component
11044
+ */
11045
+ hidden?: ContextDependentConfig<P, boolean>;
11046
+ readOnly?: boolean | ContextDependentConfig<P, boolean>;
11047
+ /**
11048
+ * If true, will hide the prop in a collapsed section; good for props that
11049
+ * should not usually be used.
11050
+ */
11051
+ advanced?: boolean;
11052
+ /**
11053
+ * If true, does not allow the user to use a dynamic expression for this prop
11054
+ */
11055
+ disableDynamicValue?: boolean;
11056
+ /**
11057
+ * If set to true, the component will be remounted when the prop value is updated.
11058
+ * (This behavior only appliees to canvas)
11059
+ */
11060
+ forceRemount?: boolean;
11061
+ }
11062
+ type DefaultValueOrExpr<P, T> = {
11063
+ defaultExpr?: undefined;
11064
+ defaultExprHint?: undefined;
11065
+ defaultValue?: T;
11066
+ defaultValueHint?: T | ContextDependentConfig<P, T | undefined>;
11067
+ } | {
11068
+ defaultValue?: undefined;
11069
+ defaultValueHint?: undefined;
11070
+ defaultExpr?: string;
11071
+ defaultExprHint?: string;
12065
11072
  };
12066
-
12067
- /*
12068
- * Copyright 2020 Adobe. All rights reserved.
12069
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
12070
- * you may not use this file except in compliance with the License. You may obtain a copy
12071
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
12072
- *
12073
- * Unless required by applicable law or agreed to in writing, software distributed under
12074
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
12075
- * OF ANY KIND, either express or implied. See the License for the specific language
12076
- * governing permissions and limitations under the License.
11073
+ type StringTypeBase<P> = PropTypeBase<P> & DefaultValueOrExpr<P, string>;
11074
+ type StringType<P> = "string" | (({
11075
+ type: "string";
11076
+ control?: "default" | "large";
11077
+ } | {
11078
+ type: "code";
11079
+ lang: "css" | "html" | "javascript" | "json";
11080
+ } | {
11081
+ type: "richText";
11082
+ } | {
11083
+ type: "color";
11084
+ /**
11085
+ * If specified, and the user picks a color token in the Studio, then
11086
+ * the value passed in as prop is a css variable reference, like
11087
+ * `var(--TOKEN_ID)`, instead of the resolved hex value of the token.
11088
+ * You should take care in using this in the proper css context --
11089
+ * the css token is only defined if you are rendering under some
11090
+ * Plasmic component in the DOM tree, which is usually the case,
11091
+ * unless you are using a React portal.
11092
+ */
11093
+ keepCssVar?: boolean;
11094
+ } | {
11095
+ type: "class";
11096
+ /**
11097
+ * Additional css selectors that can change how this style should look.
11098
+ * Some examples:
11099
+ *
11100
+ * * `:hover` -- on hover
11101
+ * * `[data-something="blah"] -- when the element with this class has
11102
+ * an html attribute "data-something=blah"
11103
+ * * :component[data-something="blah"] :self -- when the root of the
11104
+ * component has an html attribute "data-something=blah". Note that
11105
+ * the non-standard `:component` selector is used to select the
11106
+ * component root, and the non-standard `:self` selector is used
11107
+ * to select the element that this class is attached to.
11108
+ */
11109
+ selectors?: {
11110
+ /**
11111
+ * A css selector, like `:hover` or `[data-something="blah"]`.
11112
+ */
11113
+ selector: string;
11114
+ /**
11115
+ * An optional human-friendly label for the selector, so the studio user
11116
+ * knows what this selector means.
11117
+ */
11118
+ label?: string;
11119
+ }[];
11120
+ /**
11121
+ * If specified, then only shows these style sections for styling this class
11122
+ */
11123
+ styleSections?: StyleSection[];
11124
+ } | {
11125
+ type: "themeResetClass";
11126
+ /**
11127
+ * Normally, theme reset class will only target Plasmic-generated tags
11128
+ * with the default tag styles. If you also want to target non-Plasmic-generated
11129
+ * tags (say, rendered by your code components, or fetched as an HTML blob
11130
+ * from somewhere), then specify `true` here.
11131
+ */
11132
+ targetAllTags?: boolean;
11133
+ } | {
11134
+ type: "cardPicker";
11135
+ modalTitle?: React.ReactNode | ContextDependentConfig<P, React.ReactNode>;
11136
+ options: {
11137
+ value: string;
11138
+ label?: string;
11139
+ imgUrl: string;
11140
+ footer?: React.ReactNode;
11141
+ }[] | ContextDependentConfig<P, {
11142
+ value: string;
11143
+ label?: string;
11144
+ imgUrl: string;
11145
+ footer?: React.ReactNode;
11146
+ }[]>;
11147
+ showInput?: boolean | ContextDependentConfig<P, boolean>;
11148
+ onSearch?: ContextDependentConfig<P, ((value: string) => void) | undefined>;
11149
+ }) & StringTypeBase<P>);
11150
+ type BooleanType<P> = "boolean" | ({
11151
+ type: "boolean";
11152
+ } & DefaultValueOrExpr<P, boolean> & PropTypeBase<P>);
11153
+ type GraphQLValue = {
11154
+ query: string;
11155
+ variables?: Record<string, any>;
11156
+ };
11157
+ type GraphQLType<P> = {
11158
+ type: "code";
11159
+ lang: "graphql";
11160
+ endpoint: string | ContextDependentConfig<P, string>;
11161
+ method?: string | ContextDependentConfig<P, string>;
11162
+ headers?: object | ContextDependentConfig<P, object>;
11163
+ } & DefaultValueOrExpr<P, GraphQLValue> & PropTypeBase<P>;
11164
+ type NumberTypeBase<P> = PropTypeBase<P> & DefaultValueOrExpr<P, number> & {
11165
+ type: "number";
11166
+ };
11167
+ type NumberType<P> = "number" | (({
11168
+ control?: "default";
11169
+ min?: number | ContextDependentConfig<P, number>;
11170
+ max?: number | ContextDependentConfig<P, number>;
11171
+ } | {
11172
+ control: "slider";
11173
+ min: number | ContextDependentConfig<P, number>;
11174
+ max: number | ContextDependentConfig<P, number>;
11175
+ step?: number | ContextDependentConfig<P, number>;
11176
+ }) & NumberTypeBase<P>);
11177
+ /**
11178
+ * Expects defaultValue to be a JSON-compatible value
12077
11179
  */
12078
-
12079
-
12080
- interface AriaLabelingProps {
12081
- /**
12082
- * Defines a string value that labels the current element.
12083
- */
12084
- 'aria-label'?: string,
12085
-
12086
- /**
12087
- * Identifies the element (or elements) that labels the current element.
12088
- */
12089
- 'aria-labelledby'?: string,
12090
-
12091
- /**
12092
- * Identifies the element (or elements) that describes the object.
12093
- */
12094
- 'aria-describedby'?: string,
12095
-
12096
- /**
12097
- * Identifies the element (or elements) that provide a detailed, extended description for the object.
12098
- */
12099
- 'aria-details'?: string
11180
+ type JSONLikeType<P> = "object" | ({
11181
+ type: "object";
11182
+ fields?: {
11183
+ [p: string]: PropType$1<P>;
11184
+ };
11185
+ /**
11186
+ * Optional function that generates a name for this item in the array
11187
+ */
11188
+ nameFunc?: (item: any, ...args: ControlContext<P>) => string | undefined;
11189
+ } & DefaultValueOrExpr<P, any> & PropTypeBase<P>) | ({
11190
+ type: "array";
11191
+ itemType?: {
11192
+ type: "object";
11193
+ fields: {
11194
+ [p: string]: PropType$1<P>;
11195
+ };
11196
+ /**
11197
+ * Optional function that generates a name for this item in the array
11198
+ */
11199
+ nameFunc?: (item: any, ...args: ControlContext<P>) => string | undefined;
11200
+ };
11201
+ /**
11202
+ * Optional function that determines whether the user can delete a given item.
11203
+ */
11204
+ unstable__canDelete?: (item: any, ...args: ControlContext<P>) => boolean;
11205
+ /**
11206
+ * Specify how to let Plasmic know how to update its own internal representation of the data when the value has
11207
+ * changed, or when issuing a minimalValue or shownValue that is different.
11208
+ *
11209
+ * Important to specify this if you are expecting any nested expression values in this data type!
11210
+ */
11211
+ unstable__keyFunc?: (item: any) => any;
11212
+ /**
11213
+ * Specify what would be the tentative new value that is set if the user makes any changes.
11214
+ *
11215
+ * Useful for field mappings.
11216
+ *
11217
+ * For instance, consider a Table where we have a `fields` prop:
11218
+ *
11219
+ * - Initially, the value is undefined. But if the user makes any changes, we would want to save an array of at
11220
+ * least three items (corresponding to, say, three columns inferred from a schema).
11221
+ *
11222
+ * - Let's say there are 5 columns in the value. The data schema changes, removing a column and adding two new
11223
+ * ones. Now we would want a different minimal value, containing 6 items.
11224
+ */
11225
+ unstable__minimalValue?: ContextDependentConfig<P, any>;
11226
+ } & DefaultValueOrExpr<P, any[]> & PropTypeBase<P>) | ({
11227
+ type: "dataSource";
11228
+ dataSource: "airtable" | "cms";
11229
+ } & PropTypeBase<P>);
11230
+ type DataPickerValueType = string | number | (string | number)[];
11231
+ type DataPickerType<P> = ({
11232
+ type: "dataSelector";
11233
+ data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
11234
+ alwaysShowValuePathAsLabel?: boolean;
11235
+ } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>) | ({
11236
+ type: "exprEditor";
11237
+ data: Record<string, any> | ContextDependentConfig<P, Record<string, any>>;
11238
+ } & DefaultValueOrExpr<P, DataPickerValueType> & PropTypeBase<P>);
11239
+ type FormValidationRulesType<P> = {
11240
+ type: "formValidationRules";
11241
+ } & DefaultValueOrExpr<P, any> & PropTypeBase<P>;
11242
+ type EventHandlerType<P> = {
11243
+ type: "eventHandler";
11244
+ argTypes: {
11245
+ name: string;
11246
+ type: PropType$1<any>;
11247
+ }[];
11248
+ } & DefaultValueOrExpr<P, (...args: any) => any> & PropTypeBase<P>;
11249
+ interface ChoiceTypeBase<P> extends PropTypeBase<P> {
11250
+ type: "choice";
11251
+ options: string[] | {
11252
+ label: string;
11253
+ value: string | number | boolean;
11254
+ }[] | ContextDependentConfig<P, string[] | {
11255
+ label: string;
11256
+ value: string | number | boolean;
11257
+ }[]>;
11258
+ allowSearch?: boolean;
11259
+ filterOption?: boolean;
11260
+ onSearch?: ContextDependentConfig<P, ((value: string) => void) | undefined>;
12100
11261
  }
12101
-
12102
- interface AriaValidationProps {
12103
- // https://www.w3.org/TR/wai-aria-1.2/#aria-errormessage
12104
- /**
12105
- * Identifies the element that provides an error message for the object.
12106
- */
12107
- 'aria-errormessage'?: string
11262
+ type ChoiceType<P> = (({
11263
+ multiSelect?: false;
11264
+ } & DefaultValueOrExpr<P, string | number | boolean>) | ({
11265
+ multiSelect: true;
11266
+ } & DefaultValueOrExpr<P, (string | number | boolean)[]>) | ({
11267
+ multiSelect: ContextDependentConfig<P, boolean>;
11268
+ } & DefaultValueOrExpr<P, string | number | boolean | (string | number | boolean)[]>)) & ChoiceTypeBase<P>;
11269
+ interface ModalProps {
11270
+ show?: boolean;
11271
+ children?: React.ReactNode;
11272
+ onClose: () => void;
11273
+ style?: CSSProperties;
12108
11274
  }
12109
-
12110
- // A set of common DOM props that are allowed on any component
12111
- // Ensure this is synced with DOMPropNames in filterDOMProps
12112
- interface DOMProps {
12113
- /**
12114
- * The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
12115
- */
12116
- id?: string
11275
+ interface CustomControlProps<P> {
11276
+ componentProps: P;
11277
+ /**
11278
+ * `contextData` can be `null` if the prop controls are rendering before
11279
+ * the component instance itself (it will re-render once the component
11280
+ * calls `setControlContextData`)
11281
+ */
11282
+ contextData: InferDataType<P> | null;
11283
+ value: any;
11284
+ /**
11285
+ * Sets the value to be passed to the prop. Expects a JSON-compatible value.
11286
+ */
11287
+ updateValue: (newVal: any) => void;
11288
+ /**
11289
+ * Full screen modal component
11290
+ */
11291
+ FullscreenModal: React.ComponentType<ModalProps>;
11292
+ /**
11293
+ * Modal component for the side pane
11294
+ */
11295
+ SideModal: React.ComponentType<ModalProps>;
11296
+ /**
11297
+ * The document that the component will be rendered into; instead of using
11298
+ * `document` directly (for, say, `document.querySelector()` etc.), you
11299
+ * should use this instead.
11300
+ */
11301
+ studioDocument: typeof document;
12117
11302
  }
12118
-
12119
- interface FocusableDOMProps extends DOMProps {
12120
- /**
12121
- * Whether to exclude the element from the sequential tab order. If true,
12122
- * the element will not be focusable via the keyboard by tabbing. This should
12123
- * be avoided except in rare scenarios where an alternative means of accessing
11303
+ type CustomControl<P> = React.ComponentType<CustomControlProps<P>>;
11304
+ /**
11305
+ * Expects defaultValue to be a JSON-compatible value
11306
+ */
11307
+ type CustomType<P> = CustomControl<P> | ({
11308
+ type: "custom";
11309
+ control: CustomControl<P>;
11310
+ } & PropTypeBase<P> & DefaultValueOrExpr<P, any>);
11311
+ type SlotType<P> = "slot" | ({
11312
+ type: "slot";
11313
+ /**
11314
+ * The unique names of all code components that can be placed in the slot
11315
+ */
11316
+ allowedComponents?: string[];
11317
+ /**
11318
+ * Whether the "empty slot" placeholder should be hidden in the canvas.
11319
+ */
11320
+ hidePlaceholder?: boolean;
11321
+ /**
11322
+ * Whether the slot is repeated, i.e., is rendered multiple times using
11323
+ * repeatedElement().
11324
+ */
11325
+ isRepeated?: boolean;
11326
+ /**
11327
+ * A nicer, human-readable display name for your slot prop
11328
+ */
11329
+ displayName?: string;
11330
+ /**
11331
+ * Function for whether this slot should be hidden from the left tree,
11332
+ * given the current props for this component
11333
+ */
11334
+ hidden?: ContextDependentConfig<P, boolean>;
11335
+ /**
11336
+ * If slot is a render prop (accepts a function that takes in some
11337
+ * arguments and returns some JSX), then specify the names of the
11338
+ * arguments expected by the render prop function.
11339
+ */
11340
+ renderPropParams?: string[];
11341
+ } & Omit<DefaultValueOrExpr<P, PlasmicElement | PlasmicElement[]>, "defaultValueHint" | "defaultExpr" | "defaultExprHint">);
11342
+ type ImageUrlType<P> = "imageUrl" | ({
11343
+ type: "imageUrl";
11344
+ } & DefaultValueOrExpr<P, string> & PropTypeBase<P>);
11345
+ type PrimitiveType<P = any> = Extract<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P>, String>;
11346
+ type ControlTypeBase = {
11347
+ editOnly?: false;
11348
+ } | {
11349
+ editOnly: true;
11350
+ /**
11351
+ * The prop where the values should be mapped to
11352
+ */
11353
+ uncontrolledProp?: string;
11354
+ };
11355
+ type SupportControlled<T> = Extract<T, String | CustomControl<any>> | (Exclude<T, String | CustomControl<any>> & ControlTypeBase);
11356
+ type PropType$1<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | ImageUrlType<P> | CustomType<P> | GraphQLType<P> | DataPickerType<P> | FormValidationRulesType<P> | EventHandlerType<P>> | SlotType<P>;
11357
+ type RestrictPropType$1<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | ImageUrlType<P> | CustomType<P> | DataPickerType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P> | DataPickerType<P>> : PropType$1<P>;
11358
+ interface ActionProps<P> {
11359
+ componentProps: P;
11360
+ /**
11361
+ * `contextData` can be `null` if the prop controls are rendering before
11362
+ * the component instance itself (it will re-render once the component
11363
+ * calls `setControlContextData`)
11364
+ */
11365
+ contextData: InferDataType<P> | null;
11366
+ studioOps: {
11367
+ showModal: (modalProps: Omit<ModalProps, "onClose"> & {
11368
+ onClose?: () => void;
11369
+ }) => void;
11370
+ refreshQueryData: () => void;
11371
+ appendToSlot: (element: PlasmicElement, slotName: string) => void;
11372
+ removeFromSlotAt: (pos: number, slotName: string) => void;
11373
+ updateProps: (newValues: any) => void;
11374
+ };
11375
+ /**
11376
+ * The document that the component will be rendered into; instead of using
11377
+ * `document` directly (for, say, `document.querySelector()` etc.), you
11378
+ * should use this instead.
11379
+ */
11380
+ studioDocument: typeof document;
11381
+ }
11382
+ type Action<P> = {
11383
+ type: "button-action";
11384
+ label: string;
11385
+ onClick: (props: ActionProps<P>) => void;
11386
+ } | {
11387
+ type: "custom-action";
11388
+ control: React.ComponentType<ActionProps<P>>;
11389
+ };
11390
+ type DistributedKeyOf$1<T> = T extends any ? keyof T : never;
11391
+ interface ComponentTemplate<P> extends Omit<CodeComponentElement<P>, "type" | "name"> {
11392
+ /**
11393
+ * A preview picture for the template.
11394
+ */
11395
+ previewImg?: string;
11396
+ }
11397
+ interface ComponentTemplates<P> {
11398
+ [name: string]: ComponentTemplate<P>;
11399
+ }
11400
+ type StateSpec = {
11401
+ onChangeProp: string;
11402
+ } & ({
11403
+ type: "readonly";
11404
+ variableType: "text";
11405
+ initVal?: string;
11406
+ } | {
11407
+ type: "readonly";
11408
+ variableType: "number";
11409
+ initVal?: number;
11410
+ } | {
11411
+ type: "readonly";
11412
+ variableType: "boolean";
11413
+ initVal?: boolean;
11414
+ } | {
11415
+ type: "readonly";
11416
+ variableType: "array";
11417
+ initVal?: any[];
11418
+ } | {
11419
+ type: "readonly";
11420
+ variableType: "object";
11421
+ initVal?: object;
11422
+ } | {
11423
+ type: "writable";
11424
+ variableType: "text" | "number" | "boolean" | "array" | "object";
11425
+ valueProp: string;
11426
+ });
11427
+ interface StateHelpers<P, T> {
11428
+ initFunc?: ($props: P) => T;
11429
+ onChangeArgsToValue?: (...args: any) => T;
11430
+ }
11431
+ type ComponentHelpers<P> = {
11432
+ states: Record<string, StateHelpers<P, any>>;
11433
+ };
11434
+ type ExternalComponentHelpers<P> = {
11435
+ helpers: ComponentHelpers<P>;
11436
+ importPath: string;
11437
+ } & ({
11438
+ importName: string;
11439
+ } | {
11440
+ isDefaultExport: true;
11441
+ });
11442
+ type StyleSection = "visibility" | "typography" | "sizing" | "spacing" | "background" | "transform" | "transitions" | "layout" | "overflow" | "border" | "shadows" | "effects";
11443
+ interface CodeComponentMeta<P> {
11444
+ /**
11445
+ * Any unique string name used to identify that component. Each component
11446
+ * should be registered with a different `meta.name`, even if they have the
11447
+ * same name in the code.
11448
+ */
11449
+ name: string;
11450
+ /**
11451
+ * The name to be displayed for the component in Studio. Optional: if not
11452
+ * specified, `meta.name` is used.
11453
+ */
11454
+ displayName?: string;
11455
+ /**
11456
+ * The description of the component to be shown in Studio.
11457
+ */
11458
+ description?: string;
11459
+ /**
11460
+ * The javascript name to be used when generating code. Optional: if not
11461
+ * provided, `meta.name` is used.
11462
+ */
11463
+ importName?: string;
11464
+ /**
11465
+ * An object describing the component properties to be used in Studio.
11466
+ * For each `prop`, there should be an entry `meta.props[prop]` describing
11467
+ * its type.
11468
+ */
11469
+ props: {
11470
+ [prop in DistributedKeyOf$1<P>]?: RestrictPropType$1<P[prop], P>;
11471
+ } & {
11472
+ [prop: string]: PropType$1<P>;
11473
+ };
11474
+ /**
11475
+ * An object describing the component states to be used in Studio.
11476
+ */
11477
+ states?: Record<string, StateSpec>;
11478
+ /**
11479
+ * An object describing the components helpers to be used in Studio.
11480
+ * 1. states helpers: Each state can receive an "initFunc" prop to initialize
11481
+ * the implicit state in Studio, and an "onChangeArgsToValue" prop to
11482
+ * transform the event handler arguments into a value
11483
+ */
11484
+ componentHelpers?: ExternalComponentHelpers<P>;
11485
+ /**
11486
+ * An array describing the component actions to be used in Studio.
11487
+ */
11488
+ actions?: Action<P>[];
11489
+ /**
11490
+ * Whether style sections should be shown in Studio. For styles to work, the
11491
+ * component must accept a `className` prop. If unset, defaults to all styles.
11492
+ * Set to `false` if this component cannot be styled (for example, if it doesn't
11493
+ * render any DOM elements).
11494
+ */
11495
+ styleSections?: StyleSection[] | boolean;
11496
+ /**
11497
+ * Whether the element can be repeated in Studio. If unset, defaults to true.
11498
+ */
11499
+ isRepeatable?: boolean;
11500
+ /**
11501
+ * The path to be used when importing the component in the generated code.
11502
+ * It can be the name of the package that contains the component, or the path
11503
+ * to the file in the project (relative to the root directory).
11504
+ */
11505
+ importPath: string;
11506
+ /**
11507
+ * Whether the component is the default export from that path. Optional: if
11508
+ * not specified, it's considered `false`.
11509
+ */
11510
+ isDefaultExport?: boolean;
11511
+ /**
11512
+ * The prop that expects the CSS classes with styles to be applied to the
11513
+ * component. Optional: if not specified, Plasmic will expect it to be
11514
+ * `className`. Notice that if the component does not accept CSS classes, the
11515
+ * component will not be able to receive styles from the Studio.
11516
+ */
11517
+ classNameProp?: string;
11518
+ /**
11519
+ * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`
11520
+ * to interact with components, so it's not used in the generated code.
11521
+ * Optional: If not provided, the usual `ref` is used.
11522
+ */
11523
+ refProp?: string;
11524
+ /**
11525
+ * Default styles to start with when instantiating the component in Plasmic.
11526
+ */
11527
+ defaultStyles?: CSSProperties;
11528
+ /**
11529
+ * Component templates to start with on Plasmic.
11530
+ */
11531
+ templates?: ComponentTemplates<P>;
11532
+ /**
11533
+ * Registered name of parent component, used for grouping related components.
11534
+ */
11535
+ parentComponentName?: string;
11536
+ /**
11537
+ * Whether the component can be used as an attachment to an element.
11538
+ */
11539
+ isAttachment?: boolean;
11540
+ /**
11541
+ * Whether the component provides data to its slots using DataProvider.
11542
+ */
11543
+ providesData?: boolean;
11544
+ /**
11545
+ * If specified, then Figma components with the specified names will be mapped
11546
+ * to this component when you paste Figma content into Plasmic
11547
+ */
11548
+ figmaMappings?: {
11549
+ figmaComponentName: string;
11550
+ }[];
11551
+ /**
11552
+ * If true, when an instance of this component is added, the element
11553
+ * will always be named by the name of this component.
11554
+ */
11555
+ alwaysAutoName?: boolean;
11556
+ unstable__refActions?: Record<string, RefActionRegistration<P>>;
11557
+ }
11558
+ interface FunctionParam<P> {
11559
+ name: string;
11560
+ displayName?: string;
11561
+ type: PropType$1<P>;
11562
+ }
11563
+ interface RefActionRegistration<P> {
11564
+ displayName?: string;
11565
+ description?: string;
11566
+ parameters: FunctionParam<P>[];
11567
+ }
11568
+ interface ComponentRegistration {
11569
+ component: React.ComponentType<any>;
11570
+ meta: CodeComponentMeta<any>;
11571
+ }
11572
+ declare global {
11573
+ interface Window {
11574
+ __PlasmicComponentRegistry: ComponentRegistration[];
11575
+ }
11576
+ }
11577
+
11578
+ type Fetcher = (...args: any[]) => Promise<any>;
11579
+ interface FetcherMeta {
11580
+ /**
11581
+ * Any unique identifying string for this fetcher.
11582
+ */
11583
+ name: string;
11584
+ /**
11585
+ * The Studio-user-friendly display name.
11586
+ */
11587
+ displayName?: string;
11588
+ /**
11589
+ * The symbol to import from the importPath.
11590
+ */
11591
+ importName?: string;
11592
+ args: {
11593
+ name: string;
11594
+ type: PrimitiveType;
11595
+ }[];
11596
+ returns: PrimitiveType;
11597
+ /**
11598
+ * Either the path to the fetcher relative to `rootDir` or the npm
11599
+ * package name
11600
+ */
11601
+ importPath: string;
11602
+ /**
11603
+ * Whether it's a default export or named export
11604
+ */
11605
+ isDefaultExport?: boolean;
11606
+ }
11607
+ interface FetcherRegistration {
11608
+ fetcher: Fetcher;
11609
+ meta: FetcherMeta;
11610
+ }
11611
+ declare global {
11612
+ interface Window {
11613
+ __PlasmicFetcherRegistry: FetcherRegistration[];
11614
+ }
11615
+ }
11616
+
11617
+ type PropType<P> = SupportControlled<StringType<P> | BooleanType<P> | NumberType<P> | JSONLikeType<P> | ChoiceType<P> | CustomType<P>>;
11618
+ type RestrictPropType<T, P> = T extends string ? SupportControlled<StringType<P> | ChoiceType<P> | JSONLikeType<P> | CustomType<P>> : T extends boolean ? SupportControlled<BooleanType<P> | JSONLikeType<P> | CustomType<P>> : T extends number ? SupportControlled<NumberType<P> | JSONLikeType<P> | CustomType<P>> : PropType<P>;
11619
+ type DistributedKeyOf<T> = T extends any ? keyof T : never;
11620
+ interface GlobalContextMeta<P> {
11621
+ /**
11622
+ * Any unique string name used to identify that context. Each context
11623
+ * should be registered with a different `meta.name`, even if they have the
11624
+ * same name in the code.
11625
+ */
11626
+ name: string;
11627
+ /**
11628
+ * The name to be displayed for the context in Studio. Optional: if not
11629
+ * specified, `meta.name` is used.
11630
+ */
11631
+ displayName?: string;
11632
+ /**
11633
+ * The description of the context to be shown in Studio.
11634
+ */
11635
+ description?: string;
11636
+ /**
11637
+ * The javascript name to be used when generating code. Optional: if not
11638
+ * provided, `meta.name` is used.
11639
+ */
11640
+ importName?: string;
11641
+ /**
11642
+ * An object describing the context properties to be used in Studio.
11643
+ * For each `prop`, there should be an entry `meta.props[prop]` describing
11644
+ * its type.
11645
+ */
11646
+ props: {
11647
+ [prop in DistributedKeyOf<P>]?: RestrictPropType<P[prop], P>;
11648
+ } & {
11649
+ [prop: string]: PropType<P>;
11650
+ };
11651
+ /**
11652
+ * The path to be used when importing the context in the generated code.
11653
+ * It can be the name of the package that contains the context, or the path
11654
+ * to the file in the project (relative to the root directory).
11655
+ */
11656
+ importPath: string;
11657
+ /**
11658
+ * Whether the context is the default export from that path. Optional: if
11659
+ * not specified, it's considered `false`.
11660
+ */
11661
+ isDefaultExport?: boolean;
11662
+ /**
11663
+ * The prop that receives and forwards a React `ref`. Plasmic only uses `ref`
11664
+ * to interact with components, so it's not used in the generated code.
11665
+ * Optional: If not provided, the usual `ref` is used.
11666
+ */
11667
+ refProp?: string;
11668
+ /**
11669
+ * Whether the global context provides data to its children using DataProvider.
11670
+ */
11671
+ providesData?: boolean;
11672
+ unstable__globalActions?: Record<string, GlobalActionRegistration<P>>;
11673
+ }
11674
+ interface GlobalContextRegistration {
11675
+ component: React.ComponentType<any>;
11676
+ meta: GlobalContextMeta<any>;
11677
+ }
11678
+ interface GlobalActionRegistration<P> {
11679
+ displayName?: string;
11680
+ description?: string;
11681
+ parameters: FunctionParam<P>[];
11682
+ }
11683
+ declare global {
11684
+ interface Window {
11685
+ __PlasmicContextRegistry: GlobalContextRegistration[];
11686
+ }
11687
+ }
11688
+
11689
+ type TokenType = "color" | "spacing" | "font-family" | "font-size" | "line-height" | "opacity";
11690
+ interface TokenRegistration {
11691
+ name: string;
11692
+ displayName: string;
11693
+ value: string;
11694
+ type: TokenType;
11695
+ }
11696
+ declare global {
11697
+ interface Window {
11698
+ __PlasmicTokenRegistry: TokenRegistration[];
11699
+ }
11700
+ }
11701
+
11702
+ interface BasicTrait {
11703
+ label?: string;
11704
+ type: "text" | "number" | "boolean";
11705
+ }
11706
+ interface ChoiceTrait {
11707
+ label?: string;
11708
+ type: "choice";
11709
+ options: string[];
11710
+ }
11711
+ type TraitMeta = BasicTrait | ChoiceTrait;
11712
+ interface TraitRegistration {
11713
+ trait: string;
11714
+ meta: TraitMeta;
11715
+ }
11716
+ declare global {
11717
+ interface Window {
11718
+ __PlasmicTraitRegistry: TraitRegistration[];
11719
+ }
11720
+ }
11721
+
11722
+ declare function initializeCodeComponentStates($state: $State, states: {
11723
+ name: string;
11724
+ plasmicStateName: string;
11725
+ }[], repetitionIndex: number[], componentHelpers: ComponentHelpers<any>, child$Props: Record<string, any>): void;
11726
+ declare function initializePlasmicStates($state: $State, states: {
11727
+ name: string;
11728
+ initFunc: InitFunc<any>;
11729
+ }[], repetitionIndex: number[]): void;
11730
+ declare function generateStateOnChangeProp($state: $State, path: ObjectPath): (val: any) => void;
11731
+ declare function generateStateOnChangePropForCodeComponents($state: $State, stateName: string, plasmicStatePath: ObjectPath, componentHelpers: ComponentHelpers<any>): (val: any) => void;
11732
+ declare function generateStateValueProp($state: $State, path: ObjectPath): any;
11733
+ declare function isPlasmicStateProxy(obj: any): boolean;
11734
+ declare function is$StateProxy(obj: any): number | boolean | undefined;
11735
+ declare function getStateCellsInPlasmicProxy(obj: any): {
11736
+ realPath: ObjectPath;
11737
+ path: string;
11738
+ }[];
11739
+ declare function getStateSpecInPlasmicProxy(obj: any, path: ObjectPath): {
11740
+ spec: Internal$StateSpec<any>;
11741
+ isImplicitStateArray: boolean;
11742
+ } | undefined;
11743
+ declare function getCurrentInitialValue(obj: any, path: ObjectPath): any;
11744
+ declare function resetToInitialValue(obj: any, path: ObjectPath): void;
11745
+ /**
11746
+ * Forked from https://github.com/lukeed/dset
11747
+ * Changes: fixed setting a deep value to a proxy object
11748
+ */
11749
+ declare function set(obj: any, keys: any, val: any): void;
11750
+
11751
+ declare function useDollarState(specs: $StateSpec<any>[], ...rest: any[]): $State;
11752
+
11753
+ interface Variants {
11754
+ [vg: string]: any;
11755
+ }
11756
+ type MultiChoiceArg<M extends string> = M | M[] | {
11757
+ [v in M]?: boolean;
11758
+ };
11759
+ type SingleChoiceArg<M extends string> = M;
11760
+ type SingleBooleanChoiceArg<M extends string> = M | boolean;
11761
+ interface OverrideTwiddle {
11762
+ wrapChildren?: (children: React$1.ReactNode) => React$1.ReactNode;
11763
+ wrap?: (node: React$1.ReactNode) => React$1.ReactNode;
11764
+ }
11765
+ type DefaultOverride<C extends React$1.ElementType> = {
11766
+ type: "default";
11767
+ props?: Partial<React$1.ComponentProps<C>>;
11768
+ } & OverrideTwiddle;
11769
+ type AsOverride<C extends React$1.ElementType> = {
11770
+ type: "as";
11771
+ as: C;
11772
+ props?: Partial<React$1.ComponentProps<C>>;
11773
+ } & OverrideTwiddle;
11774
+ type RenderOverride<C extends React$1.ElementType> = {
11775
+ type: "render";
11776
+ render: (props: React$1.ComponentProps<C>, Comp: C) => React$1.ReactNode;
11777
+ props?: Partial<React$1.ComponentProps<C>>;
11778
+ } & OverrideTwiddle;
11779
+ type Flex<DefaultElementType extends React$1.ElementType> = (Omit<DefaultOverride<DefaultElementType>, "type"> & {
11780
+ as?: never;
11781
+ render?: never;
11782
+ }) | Omit<AsOverride<any>, "type"> | (Omit<RenderOverride<DefaultElementType>, "type"> & {
11783
+ as?: never;
11784
+ }) | React$1.ReactChild | null | undefined | (Partial<React$1.ComponentProps<DefaultElementType>> & {
11785
+ wrap?: never;
11786
+ wrapChildren?: never;
11787
+ props?: never;
11788
+ as?: never;
11789
+ render?: never;
11790
+ }) | ((props: React$1.ComponentProps<DefaultElementType>) => React$1.ReactNode);
11791
+ declare function hasVariant<V extends Variants>(variants: V | undefined, groupName: keyof V, variant: string): any;
11792
+ declare function createPlasmicElementProxy<DefaultElementType extends React$1.ElementType>(defaultElement: DefaultElementType, props: Partial<React$1.ComponentProps<DefaultElementType>>, ...children: React$1.ReactNode[]): React$1.ReactNode;
11793
+ declare function makeFragment(...children: React$1.ReactNode[]): React$1.FunctionComponentElement<{
11794
+ children?: React$1.ReactNode;
11795
+ }>;
11796
+ declare function wrapWithClassName(element: React$1.ReactNode, className: string): React$1.DetailedReactHTMLElement<{
11797
+ key: React$1.Key | undefined;
11798
+ className: string;
11799
+ style: {
11800
+ display: "grid";
11801
+ };
11802
+ }, HTMLElement>;
11803
+ declare function mergeVariantsWithStates(variants: Variants, $state: $State, linkedStates: {
11804
+ variantGroup: string;
11805
+ statePath: (string | number)[];
11806
+ }[]): Variants;
11807
+ declare function deriveRenderOpts(props: Record<string, any>, config: {
11808
+ name: string;
11809
+ descendantNames: string[];
11810
+ internalVariantPropNames: string[];
11811
+ internalArgPropNames: string[];
11812
+ }): {
11813
+ variants: Partial<Partial<Record<string, any>>>;
11814
+ args: Partial<Partial<Record<string, any>>>;
11815
+ overrides: Partial<Partial<Record<string, any>>>;
11816
+ };
11817
+
11818
+ declare function ensureGlobalVariants<T extends Record<string, any>>(globalVariantValues: T): T;
11819
+
11820
+ type PlasmicHeadProps = {
11821
+ title?: string;
11822
+ description?: string;
11823
+ image?: string;
11824
+ canonical?: string;
11825
+ };
11826
+ declare function PlasmicHead(props: PlasmicHeadProps): JSX.Element | null;
11827
+ declare const plasmicHeadMeta: {
11828
+ name: string;
11829
+ displayName: string;
11830
+ description: string;
11831
+ importName: string;
11832
+ importPath: string;
11833
+ isRepeatable: boolean;
11834
+ styleSections: boolean;
11835
+ props: {
11836
+ title: {
11837
+ type: string;
11838
+ displayName: string;
11839
+ };
11840
+ description: {
11841
+ type: string;
11842
+ displayName: string;
11843
+ };
11844
+ image: {
11845
+ type: string;
11846
+ displayName: string;
11847
+ };
11848
+ canonical: {
11849
+ type: string;
11850
+ displayName: string;
11851
+ };
11852
+ };
11853
+ };
11854
+
11855
+ declare function PlasmicIcon(props: React$1.ComponentProps<"svg"> & {
11856
+ PlasmicIconType: React$1.ComponentType;
11857
+ }): JSX.Element;
11858
+
11859
+ /**
11860
+ * Responsive `<img/>` replacement, based on `next/image`
11861
+ */
11862
+
11863
+ interface ImageLoader {
11864
+ supportsUrl: (url: string) => boolean;
11865
+ transformUrl: (opts: {
11866
+ src: string;
11867
+ width?: number;
11868
+ quality?: number;
11869
+ format?: "webp";
11870
+ }) => string;
11871
+ }
11872
+ type ImgTagProps = Omit<React__default.ComponentProps<"img">, "src" | "srcSet" | "ref" | "style">;
11873
+ interface PlasmicImgProps extends ImgTagProps {
11874
+ /**
11875
+ * Either an object with the src string, and its full width and height,
11876
+ * or just a src string with unknown intrinsic dimensions.
11877
+ */
11878
+ src?: string | {
11879
+ src: string | {
11880
+ src: string;
11881
+ height: number;
11882
+ width: number;
11883
+ blurDataURL?: string;
11884
+ };
11885
+ fullHeight: number;
11886
+ fullWidth: number;
11887
+ aspectRatio?: number;
11888
+ };
11889
+ /**
11890
+ * className applied to the wrapper element if one is used.
11891
+ */
11892
+ className?: string;
11893
+ /**
11894
+ * css width
11895
+ */
11896
+ displayWidth?: number | string;
11897
+ /**
11898
+ * css height
11899
+ */
11900
+ displayHeight?: number | string;
11901
+ /**
11902
+ * css min-width
11903
+ */
11904
+ displayMinWidth?: number | string;
11905
+ /**
11906
+ * css min-height
11907
+ */
11908
+ displayMinHeight?: number | string;
11909
+ /**
11910
+ * css max-width
11911
+ */
11912
+ displayMaxWidth?: number | string;
11913
+ /**
11914
+ * css max-height
11915
+ */
11916
+ displayMaxHeight?: number | string;
11917
+ /**
11918
+ * For variable quality formats like jpg, the quality from 0 to 100
11919
+ */
11920
+ quality?: number;
11921
+ /**
11922
+ * ImageLoader to use for loading different dimensions of the image.
11923
+ * If none specified, will not attempt to load different dimensions.
11924
+ */
11925
+ loader?: "plasmic" | ImageLoader;
11926
+ /**
11927
+ * Style applied to the wrapper element. objectFit and objectPosition
11928
+ * rules are applied to the img element.
11929
+ */
11930
+ style?: React__default.CSSProperties;
11931
+ /**
11932
+ * Ref for the img element. The normal <PlasmicImg ref={...} />
11933
+ * prop gives the root element instead, which may be the img element
11934
+ * or a wrapper element
11935
+ */
11936
+ imgRef?: React__default.Ref<HTMLImageElement>;
11937
+ }
11938
+ declare const PlasmicImg: React__default.ForwardRefExoticComponent<PlasmicImgProps & React__default.RefAttributes<HTMLElement>>;
11939
+
11940
+ declare const PlasmicLink: React__default.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React__default.RefAttributes<any>>;
11941
+
11942
+ declare function PlasmicSlot<T extends keyof JSX.IntrinsicElements = "div">(props: React$1.ComponentProps<T> & {
11943
+ as?: T;
11944
+ defaultContents?: React$1.ReactNode;
11945
+ value?: React$1.ReactNode;
11946
+ }): JSX.Element | null;
11947
+ declare function renderPlasmicSlot<T extends keyof JSX.IntrinsicElements = "div">(opts: {
11948
+ as?: T;
11949
+ defaultContents?: React$1.ReactNode;
11950
+ value?: React$1.ReactNode;
11951
+ }): JSX.Element | null;
11952
+
11953
+ type Queries = {
11954
+ [name: string]: string;
11955
+ };
11956
+ declare function createUseScreenVariants(isMulti: boolean, screenQueries: Queries): () => string | string[] | undefined;
11957
+
11958
+ interface PlasmicDataSourceContextValue {
11959
+ userAuthToken?: string | null;
11960
+ isUserLoading?: boolean;
11961
+ authRedirectUri?: string;
11962
+ user?: {
11963
+ email: string;
11964
+ properties: Record<string, unknown> | null;
11965
+ roleId: string;
11966
+ roleName: string;
11967
+ roleIds: string[];
11968
+ roleNames: string[];
11969
+ } | null;
11970
+ }
11971
+ declare function useCurrentUser(): {
11972
+ email: string;
11973
+ properties: Record<string, unknown> | null;
11974
+ roleId: string;
11975
+ roleName: string;
11976
+ roleIds: string[];
11977
+ roleNames: string[];
11978
+ } | {
11979
+ isLoggedIn: boolean;
11980
+ };
11981
+ declare const PlasmicDataSourceContextProvider: React__default.Provider<PlasmicDataSourceContextValue | undefined>;
11982
+
11983
+ /**
11984
+ * Returns whether the component is currently being server side rendered or
11985
+ * hydrated on the client. Can be used to delay browser-specific rendering
11986
+ * until after hydration.
11987
+ */
11988
+ declare function useIsSSR$1(): boolean;
11989
+
11990
+ type PlasmicTranslator = (str: string, opts?: {
11991
+ components?: {
11992
+ [key: string]: React__default.ReactElement;
11993
+ };
11994
+ }) => React__default.ReactNode;
11995
+ interface TransProps {
11996
+ transKey?: string;
11997
+ children?: React__default.ReactNode;
11998
+ }
11999
+ declare function genTranslatableString(elt: React__default.ReactNode): {
12000
+ str: string;
12001
+ components: {
12002
+ [key: string]: React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>>;
12003
+ };
12004
+ componentsCount: number;
12005
+ };
12006
+ declare function Trans({ transKey, children }: TransProps): React__default.ReactNode;
12007
+
12008
+ interface PlasmicRootProviderProps extends PlasmicDataSourceContextValue {
12009
+ platform?: "nextjs" | "gatsby";
12010
+ children?: React$1.ReactNode;
12011
+ translator?: PlasmicTranslator;
12012
+ Head?: React$1.ComponentType<any>;
12013
+ }
12014
+ declare function PlasmicRootProvider(props: PlasmicRootProviderProps): JSX.Element;
12015
+ declare const useIsSSR: typeof useIsSSR$1;
12016
+
12017
+ declare const Stack: (<T extends keyof JSX.IntrinsicElements = "div">(props: {
12018
+ as?: T | undefined;
12019
+ hasGap?: boolean | undefined;
12020
+ } & React$1.ComponentProps<T>) => React$1.ReactElement) & {
12021
+ div: React$1.FC<React$1.ClassAttributes<HTMLDivElement> & React$1.HTMLAttributes<HTMLDivElement> & {
12022
+ hasGap?: boolean | undefined;
12023
+ }>;
12024
+ a: React$1.FC<React$1.ClassAttributes<HTMLAnchorElement> & React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
12025
+ hasGap?: boolean | undefined;
12026
+ }>;
12027
+ button: React$1.FC<React$1.ClassAttributes<HTMLButtonElement> & React$1.ButtonHTMLAttributes<HTMLButtonElement> & {
12028
+ hasGap?: boolean | undefined;
12029
+ }>;
12030
+ h1: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12031
+ hasGap?: boolean | undefined;
12032
+ }>;
12033
+ h2: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12034
+ hasGap?: boolean | undefined;
12035
+ }>;
12036
+ h3: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12037
+ hasGap?: boolean | undefined;
12038
+ }>;
12039
+ h4: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12040
+ hasGap?: boolean | undefined;
12041
+ }>;
12042
+ h5: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12043
+ hasGap?: boolean | undefined;
12044
+ }>;
12045
+ h6: React$1.FC<React$1.ClassAttributes<HTMLHeadingElement> & React$1.HTMLAttributes<HTMLHeadingElement> & {
12046
+ hasGap?: boolean | undefined;
12047
+ }>;
12048
+ label: React$1.FC<React$1.ClassAttributes<HTMLLabelElement> & React$1.LabelHTMLAttributes<HTMLLabelElement> & {
12049
+ hasGap?: boolean | undefined;
12050
+ }>;
12051
+ form: React$1.FC<React$1.ClassAttributes<HTMLFormElement> & React$1.FormHTMLAttributes<HTMLFormElement> & {
12052
+ hasGap?: boolean | undefined;
12053
+ }>;
12054
+ section: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12055
+ hasGap?: boolean | undefined;
12056
+ }>;
12057
+ head: React$1.FC<React$1.ClassAttributes<HTMLHeadElement> & React$1.HTMLAttributes<HTMLHeadElement> & {
12058
+ hasGap?: boolean | undefined;
12059
+ }>;
12060
+ main: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12061
+ hasGap?: boolean | undefined;
12062
+ }>;
12063
+ nav: React$1.FC<React$1.ClassAttributes<HTMLElement> & React$1.HTMLAttributes<HTMLElement> & {
12064
+ hasGap?: boolean | undefined;
12065
+ }>;
12066
+ };
12067
+
12068
+ /*
12069
+ * Copyright 2020 Adobe. All rights reserved.
12070
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
12071
+ * you may not use this file except in compliance with the License. You may obtain a copy
12072
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
12073
+ *
12074
+ * Unless required by applicable law or agreed to in writing, software distributed under
12075
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
12076
+ * OF ANY KIND, either express or implied. See the License for the specific language
12077
+ * governing permissions and limitations under the License.
12078
+ */
12079
+
12080
+
12081
+ interface AriaLabelingProps {
12082
+ /**
12083
+ * Defines a string value that labels the current element.
12084
+ */
12085
+ 'aria-label'?: string,
12086
+
12087
+ /**
12088
+ * Identifies the element (or elements) that labels the current element.
12089
+ */
12090
+ 'aria-labelledby'?: string,
12091
+
12092
+ /**
12093
+ * Identifies the element (or elements) that describes the object.
12094
+ */
12095
+ 'aria-describedby'?: string,
12096
+
12097
+ /**
12098
+ * Identifies the element (or elements) that provide a detailed, extended description for the object.
12099
+ */
12100
+ 'aria-details'?: string
12101
+ }
12102
+
12103
+ interface AriaValidationProps {
12104
+ // https://www.w3.org/TR/wai-aria-1.2/#aria-errormessage
12105
+ /**
12106
+ * Identifies the element that provides an error message for the object.
12107
+ */
12108
+ 'aria-errormessage'?: string
12109
+ }
12110
+
12111
+ // A set of common DOM props that are allowed on any component
12112
+ // Ensure this is synced with DOMPropNames in filterDOMProps
12113
+ interface DOMProps {
12114
+ /**
12115
+ * The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
12116
+ */
12117
+ id?: string
12118
+ }
12119
+
12120
+ interface FocusableDOMProps extends DOMProps {
12121
+ /**
12122
+ * Whether to exclude the element from the sequential tab order. If true,
12123
+ * the element will not be focusable via the keyboard by tabbing. This should
12124
+ * be avoided except in rare scenarios where an alternative means of accessing
12124
12125
  * the element or its functionality via the keyboard is available.
12125
12126
  */
12126
12127
  excludeFromTabOrder?: boolean
@@ -12336,107 +12337,107 @@ interface FocusableProps extends FocusEvents, KeyboardEvents {
12336
12337
  autoFocus?: boolean
12337
12338
  }
12338
12339
 
12339
- declare function useFocused(opts: {
12340
- isTextInput?: boolean;
12341
- }): (boolean | DOMAttributes<FocusableElement>)[];
12342
- declare function useFocusVisible(opts: {
12343
- isTextInput?: boolean;
12344
- }): (boolean | DOMAttributes<FocusableElement>)[];
12345
- declare function useFocusedWithin(opts: {
12346
- isTextInput?: boolean;
12347
- }): (boolean | DOMAttributes<FocusableElement>)[];
12348
- declare function useFocusVisibleWithin(opts: {
12349
- isTextInput?: boolean;
12350
- }): (boolean | DOMAttributes<FocusableElement>)[];
12351
- declare function useHover(): (boolean | {
12352
- onMouseEnter: () => void;
12353
- onMouseLeave: () => void;
12354
- })[];
12355
- declare function usePressed(): (boolean | {
12356
- onMouseDown: () => void;
12357
- onMouseUp: () => void;
12358
- })[];
12359
- declare const TRIGGER_TO_HOOK: {
12360
- readonly useHover: typeof useHover;
12361
- readonly useFocused: typeof useFocused;
12362
- readonly useFocusVisible: typeof useFocusVisible;
12363
- readonly useFocusedWithin: typeof useFocusedWithin;
12364
- readonly useFocusVisibleWithin: typeof useFocusVisibleWithin;
12365
- readonly usePressed: typeof usePressed;
12366
- };
12367
- type TriggerType = keyof typeof TRIGGER_TO_HOOK;
12368
- interface TriggerOpts {
12369
- isTextInput?: boolean;
12370
- }
12371
- /**
12372
- * Installs argment trigger. All the useTrigger calls must use hardcoded `trigger` arg,
12373
- * as it's not valid to install variable React hooks!
12374
- */
12340
+ declare function useFocused(opts: {
12341
+ isTextInput?: boolean;
12342
+ }): (boolean | DOMAttributes<FocusableElement>)[];
12343
+ declare function useFocusVisible(opts: {
12344
+ isTextInput?: boolean;
12345
+ }): (boolean | DOMAttributes<FocusableElement>)[];
12346
+ declare function useFocusedWithin(opts: {
12347
+ isTextInput?: boolean;
12348
+ }): (boolean | DOMAttributes<FocusableElement>)[];
12349
+ declare function useFocusVisibleWithin(opts: {
12350
+ isTextInput?: boolean;
12351
+ }): (boolean | DOMAttributes<FocusableElement>)[];
12352
+ declare function useHover(): (boolean | {
12353
+ onMouseEnter: () => void;
12354
+ onMouseLeave: () => void;
12355
+ })[];
12356
+ declare function usePressed(): (boolean | {
12357
+ onMouseDown: () => void;
12358
+ onMouseUp: () => void;
12359
+ })[];
12360
+ declare const TRIGGER_TO_HOOK: {
12361
+ readonly useHover: typeof useHover;
12362
+ readonly useFocused: typeof useFocused;
12363
+ readonly useFocusVisible: typeof useFocusVisible;
12364
+ readonly useFocusedWithin: typeof useFocusedWithin;
12365
+ readonly useFocusVisibleWithin: typeof useFocusVisibleWithin;
12366
+ readonly usePressed: typeof usePressed;
12367
+ };
12368
+ type TriggerType = keyof typeof TRIGGER_TO_HOOK;
12369
+ interface TriggerOpts {
12370
+ isTextInput?: boolean;
12371
+ }
12372
+ /**
12373
+ * Installs argment trigger. All the useTrigger calls must use hardcoded `trigger` arg,
12374
+ * as it's not valid to install variable React hooks!
12375
+ */
12375
12376
  declare function useTrigger(trigger: TriggerType, opts: TriggerOpts): [boolean, React$1.HTMLAttributes<HTMLElement>];
12376
12377
 
12377
12378
  declare const classNames: typeof classNames$1;
12378
12379
 
12379
- declare function setPlumeStrictMode(mode: boolean): void;
12380
- type VariantArgChoices<T> = T extends (infer M)[] ? M : T extends SingleChoiceArg<infer M> ? M : never;
12381
- type VariantArgsChoices<V> = {
12382
- [k in keyof V]-?: VariantArgChoices<V[k]>;
12383
- };
12384
- type DictValues<V extends Record<string, any>> = V[keyof V];
12385
- type DictTuples<V extends Record<string, any>> = DictValues<{
12386
- [K in keyof V]: [K, V[K]];
12387
- }>;
12388
- type VariantDefTuple<V> = DictTuples<VariantArgsChoices<V>>;
12389
- type DistributeTuple<T> = T extends [infer T1, infer T2] ? {
12390
- group: T1;
12391
- variant: T2;
12392
- } : never;
12393
- type VariantDef<V> = DistributeTuple<VariantDefTuple<V>>;
12394
- type PlasmicClass<V extends Record<string, any>, A extends Record<string, any>, O extends Record<string, any>> = {
12395
- (props: {
12396
- variants?: V;
12397
- args?: A;
12398
- overrides?: O;
12399
- }): React$1.ReactElement | null;
12400
- internalVariantProps: (keyof V)[];
12401
- internalArgProps: (keyof A)[];
12402
- };
12403
- type AnyPlasmicClass = PlasmicClass<any, any, any>;
12404
- type PlasmicClassVariants<C extends AnyPlasmicClass> = C extends PlasmicClass<infer V, any, any> ? V : unknown;
12405
- type PlasmicClassArgs<C extends AnyPlasmicClass> = C extends PlasmicClass<any, infer A, any> ? A : unknown;
12380
+ declare function setPlumeStrictMode(mode: boolean): void;
12381
+ type VariantArgChoices<T> = T extends (infer M)[] ? M : T extends SingleChoiceArg<infer M> ? M : never;
12382
+ type VariantArgsChoices<V> = {
12383
+ [k in keyof V]-?: VariantArgChoices<V[k]>;
12384
+ };
12385
+ type DictValues<V extends Record<string, any>> = V[keyof V];
12386
+ type DictTuples<V extends Record<string, any>> = DictValues<{
12387
+ [K in keyof V]: [K, V[K]];
12388
+ }>;
12389
+ type VariantDefTuple<V> = DictTuples<VariantArgsChoices<V>>;
12390
+ type DistributeTuple<T> = T extends [infer T1, infer T2] ? {
12391
+ group: T1;
12392
+ variant: T2;
12393
+ } : never;
12394
+ type VariantDef<V> = DistributeTuple<VariantDefTuple<V>>;
12395
+ type PlasmicClass<V extends Record<string, any>, A extends Record<string, any>, O extends Record<string, any>> = {
12396
+ (props: {
12397
+ variants?: V;
12398
+ args?: A;
12399
+ overrides?: O;
12400
+ }): React$1.ReactElement | null;
12401
+ internalVariantProps: (keyof V)[];
12402
+ internalArgProps: (keyof A)[];
12403
+ };
12404
+ type AnyPlasmicClass = PlasmicClass<any, any, any>;
12405
+ type PlasmicClassVariants<C extends AnyPlasmicClass> = C extends PlasmicClass<infer V, any, any> ? V : unknown;
12406
+ type PlasmicClassArgs<C extends AnyPlasmicClass> = C extends PlasmicClass<any, infer A, any> ? A : unknown;
12406
12407
  type PlasmicClassOverrides<C extends AnyPlasmicClass> = C extends PlasmicClass<any, any, infer O> ? O : unknown;
12407
12408
 
12408
- interface CommonProps {
12409
- showStartIcon?: boolean;
12410
- showEndIcon?: boolean;
12411
- startIcon?: React$1.ReactNode;
12412
- endIcon?: React$1.ReactNode;
12413
- children?: React$1.ReactNode;
12414
- isDisabled?: boolean;
12415
- }
12416
- interface HtmlButtonProps extends Omit<React$1.ComponentProps<"button">, "ref" | "disabled"> {
12417
- }
12418
- interface HtmlAnchorProps extends Omit<React$1.ComponentProps<"a">, "ref" | "href"> {
12419
- link?: string;
12420
- }
12421
- type BaseButtonProps = CommonProps & HtmlButtonProps & HtmlAnchorProps;
12422
- type HtmlAnchorOnlyProps = Exclude<keyof HtmlAnchorProps, keyof HtmlButtonProps>;
12423
- type HtmlButtonOnlyProps = Exclude<keyof HtmlButtonProps, keyof HtmlAnchorProps>;
12424
- type ButtonRef = React$1.Ref<HTMLButtonElement | HTMLAnchorElement>;
12425
- interface ButtonConfig<C extends AnyPlasmicClass> {
12426
- showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
12427
- showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
12428
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12429
- startIconSlot?: keyof PlasmicClassArgs<C>;
12430
- endIconSlot?: keyof PlasmicClassArgs<C>;
12431
- contentSlot: keyof PlasmicClassArgs<C>;
12432
- root: keyof PlasmicClassOverrides<C>;
12433
- }
12434
- declare function useButton<P extends BaseButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
12435
- plasmicProps: {
12436
- variants: PlasmicClassVariants<C>;
12437
- args: PlasmicClassArgs<C>;
12438
- overrides: PlasmicClassOverrides<C>;
12439
- };
12409
+ interface CommonProps {
12410
+ showStartIcon?: boolean;
12411
+ showEndIcon?: boolean;
12412
+ startIcon?: React$1.ReactNode;
12413
+ endIcon?: React$1.ReactNode;
12414
+ children?: React$1.ReactNode;
12415
+ isDisabled?: boolean;
12416
+ }
12417
+ interface HtmlButtonProps extends Omit<React$1.ComponentProps<"button">, "ref" | "disabled"> {
12418
+ }
12419
+ interface HtmlAnchorProps extends Omit<React$1.ComponentProps<"a">, "ref" | "href"> {
12420
+ link?: string;
12421
+ }
12422
+ type BaseButtonProps = CommonProps & HtmlButtonProps & HtmlAnchorProps;
12423
+ type HtmlAnchorOnlyProps = Exclude<keyof HtmlAnchorProps, keyof HtmlButtonProps>;
12424
+ type HtmlButtonOnlyProps = Exclude<keyof HtmlButtonProps, keyof HtmlAnchorProps>;
12425
+ type ButtonRef = React$1.Ref<HTMLButtonElement | HTMLAnchorElement>;
12426
+ interface ButtonConfig<C extends AnyPlasmicClass> {
12427
+ showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
12428
+ showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
12429
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12430
+ startIconSlot?: keyof PlasmicClassArgs<C>;
12431
+ endIconSlot?: keyof PlasmicClassArgs<C>;
12432
+ contentSlot: keyof PlasmicClassArgs<C>;
12433
+ root: keyof PlasmicClassOverrides<C>;
12434
+ }
12435
+ declare function useButton<P extends BaseButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
12436
+ plasmicProps: {
12437
+ variants: PlasmicClassVariants<C>;
12438
+ args: PlasmicClassArgs<C>;
12439
+ overrides: PlasmicClassOverrides<C>;
12440
+ };
12440
12441
  };
12441
12442
 
12442
12443
  /*
@@ -12496,244 +12497,244 @@ interface CheckboxProps$1 extends ToggleProps {
12496
12497
 
12497
12498
  interface AriaCheckboxProps extends CheckboxProps$1, AriaToggleProps {}
12498
12499
 
12499
- interface StyleProps {
12500
- className?: string;
12501
- style?: React$1.CSSProperties;
12502
- }
12500
+ interface StyleProps {
12501
+ className?: string;
12502
+ style?: React$1.CSSProperties;
12503
+ }
12503
12504
  declare function getDataProps(props: Record<string, any>): Partial<Record<string, any>>;
12504
12505
 
12505
- type CheckboxRef = React$1.Ref<CheckboxRefValue>;
12506
- interface CheckboxRefValue extends CheckboxState {
12507
- getRoot: () => HTMLElement | null;
12508
- focus: () => void;
12509
- blur: () => void;
12510
- }
12511
- interface CheckboxState {
12512
- setChecked: (checked: boolean) => void;
12513
- }
12514
- interface CheckboxProps extends Omit<AriaCheckboxProps, "isSelected" | "defaultSelected">, StyleProps {
12515
- /**
12516
- * Whether the Checkbox is checked or not; controlled
12517
- */
12518
- isChecked?: boolean;
12519
- /**
12520
- * Whether the Checkbox is checked by default; uncontrolled
12521
- */
12522
- defaultChecked?: boolean;
12523
- /**
12524
- * Whether the Checkbox is in an "indeterminate" state; this usually
12525
- * refers to a "check all" that is used to check / uncheck many other
12526
- * checkboxes, and is visually indeterminate if some of its controlled
12527
- * checkboxes are checked and some are not.
12528
- */
12529
- isIndeterminate?: boolean;
12530
- }
12531
- interface CheckboxConfig<C extends AnyPlasmicClass> {
12532
- isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
12533
- isIndeterminateVariant?: VariantDef<PlasmicClassVariants<C>>;
12534
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12535
- noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
12536
- labelSlot?: keyof PlasmicClassArgs<C>;
12537
- root: keyof PlasmicClassOverrides<C>;
12538
- }
12539
- declare function useCheckbox<P extends CheckboxProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: CheckboxConfig<C>, ref?: CheckboxRef): {
12540
- plasmicProps: {
12541
- variants: PlasmicClassVariants<C>;
12542
- overrides: PlasmicClassOverrides<C>;
12543
- args: PlasmicClassArgs<C>;
12544
- };
12545
- state: CheckboxState;
12506
+ type CheckboxRef = React$1.Ref<CheckboxRefValue>;
12507
+ interface CheckboxRefValue extends CheckboxState {
12508
+ getRoot: () => HTMLElement | null;
12509
+ focus: () => void;
12510
+ blur: () => void;
12511
+ }
12512
+ interface CheckboxState {
12513
+ setChecked: (checked: boolean) => void;
12514
+ }
12515
+ interface CheckboxProps extends Omit<AriaCheckboxProps, "isSelected" | "defaultSelected">, StyleProps {
12516
+ /**
12517
+ * Whether the Checkbox is checked or not; controlled
12518
+ */
12519
+ isChecked?: boolean;
12520
+ /**
12521
+ * Whether the Checkbox is checked by default; uncontrolled
12522
+ */
12523
+ defaultChecked?: boolean;
12524
+ /**
12525
+ * Whether the Checkbox is in an "indeterminate" state; this usually
12526
+ * refers to a "check all" that is used to check / uncheck many other
12527
+ * checkboxes, and is visually indeterminate if some of its controlled
12528
+ * checkboxes are checked and some are not.
12529
+ */
12530
+ isIndeterminate?: boolean;
12531
+ }
12532
+ interface CheckboxConfig<C extends AnyPlasmicClass> {
12533
+ isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
12534
+ isIndeterminateVariant?: VariantDef<PlasmicClassVariants<C>>;
12535
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12536
+ noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
12537
+ labelSlot?: keyof PlasmicClassArgs<C>;
12538
+ root: keyof PlasmicClassOverrides<C>;
12539
+ }
12540
+ declare function useCheckbox<P extends CheckboxProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: CheckboxConfig<C>, ref?: CheckboxRef): {
12541
+ plasmicProps: {
12542
+ variants: PlasmicClassVariants<C>;
12543
+ overrides: PlasmicClassOverrides<C>;
12544
+ args: PlasmicClassArgs<C>;
12545
+ };
12546
+ state: CheckboxState;
12546
12547
  };
12547
12548
 
12548
- interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {
12549
- /**
12550
- * List of `Menu.Item`s or `Menu.Group`s that make up the menu
12551
- */
12552
- children?: React$1.ReactNode;
12553
- /**
12554
- * Called with the value of a `Menu.Item` when it is selected.
12555
- */
12556
- onAction?: (value: string) => void;
12557
- }
12558
- type MenuRef = React$1.Ref<MenuRefValue>;
12559
- interface MenuRefValue extends MenuState {
12560
- getRoot: () => HTMLElement | null;
12561
- }
12562
- interface MenuConfig<C extends AnyPlasmicClass> {
12563
- isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
12564
- isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
12565
- isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
12566
- isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
12567
- itemsSlot: keyof PlasmicClassArgs<C>;
12568
- itemsContainer: keyof PlasmicClassOverrides<C>;
12569
- root: keyof PlasmicClassOverrides<C>;
12570
- }
12571
- interface MenuState {
12572
- getFocusedValue: () => string | null;
12573
- setFocusedValue: (value: string) => void;
12574
- }
12575
- declare function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuConfig<C>, ref?: MenuRef): {
12576
- plasmicProps: {
12577
- variants: PlasmicClassVariants<C>;
12578
- args: PlasmicClassArgs<C>;
12579
- overrides: PlasmicClassOverrides<C>;
12580
- };
12581
- state: MenuState;
12549
+ interface BaseMenuProps extends DOMProps, AriaLabelingProps, StyleProps {
12550
+ /**
12551
+ * List of `Menu.Item`s or `Menu.Group`s that make up the menu
12552
+ */
12553
+ children?: React$1.ReactNode;
12554
+ /**
12555
+ * Called with the value of a `Menu.Item` when it is selected.
12556
+ */
12557
+ onAction?: (value: string) => void;
12558
+ }
12559
+ type MenuRef = React$1.Ref<MenuRefValue>;
12560
+ interface MenuRefValue extends MenuState {
12561
+ getRoot: () => HTMLElement | null;
12562
+ }
12563
+ interface MenuConfig<C extends AnyPlasmicClass> {
12564
+ isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
12565
+ isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
12566
+ isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
12567
+ isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
12568
+ itemsSlot: keyof PlasmicClassArgs<C>;
12569
+ itemsContainer: keyof PlasmicClassOverrides<C>;
12570
+ root: keyof PlasmicClassOverrides<C>;
12571
+ }
12572
+ interface MenuState {
12573
+ getFocusedValue: () => string | null;
12574
+ setFocusedValue: (value: string) => void;
12575
+ }
12576
+ declare function useMenu<P extends BaseMenuProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuConfig<C>, ref?: MenuRef): {
12577
+ plasmicProps: {
12578
+ variants: PlasmicClassVariants<C>;
12579
+ args: PlasmicClassArgs<C>;
12580
+ overrides: PlasmicClassOverrides<C>;
12581
+ };
12582
+ state: MenuState;
12582
12583
  };
12583
12584
 
12584
- /**
12585
- * In general, we try not to expose react-aria's Collections API to Plume users.
12586
- * The Collections API is how react-aria users pass data about collections of
12587
- * things using the built-in Item and Section components, which are abstract,
12588
- * metadata-only components that don't render anything but only serve to specify
12589
- * data. For example, here's how you would use react-spectrum's Picker:
12590
- *
12591
- * <Picker>
12592
- * <Section title="Asia">
12593
- * <Item key="taiwan">Taiwan</Item>
12594
- * <Item key="japan">Japan</Item>
12595
- * <Item key="china">China</Item>
12596
- * </Section>
12597
- * <Section title="Europe">
12598
- * <Item key="germany">Germany</Item>
12599
- * <Item key="france">France</Item>
12600
- * </Section>
12601
- * </Picker>
12602
- *
12603
- * You would re-use this same Item/Section components to pass similar things to
12604
- * Menu, Tabs, etc.
12605
- *
12606
- * For Plasmic, this API is too abstract. The user has explicitly designed components
12607
- * like Select.Option and Select.OptionGroup, and it is weird that they don't actually
12608
- * use these components. It is more natural to do:
12609
- *
12610
- * <Select>
12611
- * <Select.OptionGroup title="Asia">
12612
- * <Select.Option key="taiwan">Taiwan</Select>
12613
- * </Select.OptionGroup>
12614
- * </Select>
12615
- *
12616
- * For Plume, we let users directly use the components they designed, both to collect
12617
- * information and to perform actual rendering. For example, for Plume,
12618
- * you'd use Select.Option instead of Item, and Select.OptionGroup instead of Section.
12619
- * This means that the Select.Option props will collect the same information Item
12620
- * does.
12621
- *
12622
- * A component like Select.Option then serves two purposes:
12623
- *
12624
- * 1. Allow users to specify the collection of data, like in the above example
12625
- * Here, we're mainly interested in the props in those ReactElements so
12626
- * we can pass the Item/Section data onto react-aria's APIs. We are not
12627
- * actually rendering these elements.
12628
- * 2. Once react-aria's Collections API has gone through them and built
12629
- * Collection "nodes", we then create cloned versions of these elements
12630
- * with the corresponding node passed in as a secret prop. These ReactElements
12631
- * are then actually used to _render_ the corresponding Option / OptionGroup.
12632
- *
12633
- * This file contains helper functions to help with implementing the above.
12634
- *
12635
- * Note also that most of the collections-based react-aria components expose
12636
- * a parallel API that accepts a list of "items" and a render prop, instead
12637
- * of list of Item/Section elements. This is for efficiency, but we are opting
12638
- * to only support the composite-component pattern for now for simplicity.
12639
- */
12640
-
12641
- /**
12642
- * Props for a Plume component that corresponds to an Item
12643
- */
12644
- interface ItemLikeProps {
12645
- /**
12646
- * value key corresponding to this item. Not required if you use the
12647
- * `key` prop instead.
12648
- */
12649
- value?: string | null;
12650
- /**
12651
- * The text string value corresponding to this item. Used to support
12652
- * keyboard type-ahead. If not specified, then will be derived from
12653
- * `children` if it is a string, or the `value` or `key`.
12654
- */
12655
- textValue?: string;
12656
- /**
12657
- * aria-label for this item.
12658
- */
12659
- "aria-label"?: string;
12660
- /**
12661
- * Primary content label for this item.
12662
- */
12663
- children?: React__default.ReactNode;
12664
- /**
12665
- * If true, this item will not be selectable.
12666
- */
12667
- isDisabled?: boolean;
12668
- }
12669
- /**
12670
- * Props for a Plume component that corresponds to a Section
12671
- */
12672
- interface SectionLikeProps {
12673
- /**
12674
- * Heading content of the title
12675
- */
12676
- title?: React__default.ReactNode;
12677
- /**
12678
- * aria-label for this section
12679
- */
12680
- "aria-label"?: string;
12681
- /**
12682
- * A list of items that belong in this group
12683
- */
12684
- children?: React__default.ReactNode;
12685
- }
12686
- type ItemJson = LeafItemJson | SectionJson;
12687
- type LeafItemJson = string | {
12688
- value: string;
12689
- label?: string;
12690
- textValue?: string;
12691
- isDisabled?: boolean;
12692
- };
12693
- interface SectionJson {
12694
- title: string;
12695
- children: ItemJson[];
12585
+ /**
12586
+ * In general, we try not to expose react-aria's Collections API to Plume users.
12587
+ * The Collections API is how react-aria users pass data about collections of
12588
+ * things using the built-in Item and Section components, which are abstract,
12589
+ * metadata-only components that don't render anything but only serve to specify
12590
+ * data. For example, here's how you would use react-spectrum's Picker:
12591
+ *
12592
+ * <Picker>
12593
+ * <Section title="Asia">
12594
+ * <Item key="taiwan">Taiwan</Item>
12595
+ * <Item key="japan">Japan</Item>
12596
+ * <Item key="china">China</Item>
12597
+ * </Section>
12598
+ * <Section title="Europe">
12599
+ * <Item key="germany">Germany</Item>
12600
+ * <Item key="france">France</Item>
12601
+ * </Section>
12602
+ * </Picker>
12603
+ *
12604
+ * You would re-use this same Item/Section components to pass similar things to
12605
+ * Menu, Tabs, etc.
12606
+ *
12607
+ * For Plasmic, this API is too abstract. The user has explicitly designed components
12608
+ * like Select.Option and Select.OptionGroup, and it is weird that they don't actually
12609
+ * use these components. It is more natural to do:
12610
+ *
12611
+ * <Select>
12612
+ * <Select.OptionGroup title="Asia">
12613
+ * <Select.Option key="taiwan">Taiwan</Select>
12614
+ * </Select.OptionGroup>
12615
+ * </Select>
12616
+ *
12617
+ * For Plume, we let users directly use the components they designed, both to collect
12618
+ * information and to perform actual rendering. For example, for Plume,
12619
+ * you'd use Select.Option instead of Item, and Select.OptionGroup instead of Section.
12620
+ * This means that the Select.Option props will collect the same information Item
12621
+ * does.
12622
+ *
12623
+ * A component like Select.Option then serves two purposes:
12624
+ *
12625
+ * 1. Allow users to specify the collection of data, like in the above example
12626
+ * Here, we're mainly interested in the props in those ReactElements so
12627
+ * we can pass the Item/Section data onto react-aria's APIs. We are not
12628
+ * actually rendering these elements.
12629
+ * 2. Once react-aria's Collections API has gone through them and built
12630
+ * Collection "nodes", we then create cloned versions of these elements
12631
+ * with the corresponding node passed in as a secret prop. These ReactElements
12632
+ * are then actually used to _render_ the corresponding Option / OptionGroup.
12633
+ *
12634
+ * This file contains helper functions to help with implementing the above.
12635
+ *
12636
+ * Note also that most of the collections-based react-aria components expose
12637
+ * a parallel API that accepts a list of "items" and a render prop, instead
12638
+ * of list of Item/Section elements. This is for efficiency, but we are opting
12639
+ * to only support the composite-component pattern for now for simplicity.
12640
+ */
12641
+
12642
+ /**
12643
+ * Props for a Plume component that corresponds to an Item
12644
+ */
12645
+ interface ItemLikeProps {
12646
+ /**
12647
+ * value key corresponding to this item. Not required if you use the
12648
+ * `key` prop instead.
12649
+ */
12650
+ value?: string | null;
12651
+ /**
12652
+ * The text string value corresponding to this item. Used to support
12653
+ * keyboard type-ahead. If not specified, then will be derived from
12654
+ * `children` if it is a string, or the `value` or `key`.
12655
+ */
12656
+ textValue?: string;
12657
+ /**
12658
+ * aria-label for this item.
12659
+ */
12660
+ "aria-label"?: string;
12661
+ /**
12662
+ * Primary content label for this item.
12663
+ */
12664
+ children?: React__default.ReactNode;
12665
+ /**
12666
+ * If true, this item will not be selectable.
12667
+ */
12668
+ isDisabled?: boolean;
12669
+ }
12670
+ /**
12671
+ * Props for a Plume component that corresponds to a Section
12672
+ */
12673
+ interface SectionLikeProps {
12674
+ /**
12675
+ * Heading content of the title
12676
+ */
12677
+ title?: React__default.ReactNode;
12678
+ /**
12679
+ * aria-label for this section
12680
+ */
12681
+ "aria-label"?: string;
12682
+ /**
12683
+ * A list of items that belong in this group
12684
+ */
12685
+ children?: React__default.ReactNode;
12686
+ }
12687
+ type ItemJson = LeafItemJson | SectionJson;
12688
+ type LeafItemJson = string | {
12689
+ value: string;
12690
+ label?: string;
12691
+ textValue?: string;
12692
+ isDisabled?: boolean;
12693
+ };
12694
+ interface SectionJson {
12695
+ title: string;
12696
+ children: ItemJson[];
12696
12697
  }
12697
12698
 
12698
- interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {
12699
- }
12700
- interface MenuGroupConfig<C extends AnyPlasmicClass> {
12701
- noTitleVariant: PlasmicClassVariants<C>;
12702
- isFirstVariant: PlasmicClassVariants<C>;
12703
- itemsSlot: keyof PlasmicClassArgs<C>;
12704
- titleSlot: keyof PlasmicClassArgs<C>;
12705
- root: keyof PlasmicClassOverrides<C>;
12706
- separator: keyof PlasmicClassOverrides<C>;
12707
- titleContainer: keyof PlasmicClassOverrides<C>;
12708
- itemsContainer: keyof PlasmicClassOverrides<C>;
12709
- }
12710
- declare function useMenuGroup<P extends BaseMenuGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuGroupConfig<C>): {
12711
- plasmicProps: {
12712
- variants: PlasmicClassVariants<C>;
12713
- args: PlasmicClassArgs<C>;
12714
- overrides: PlasmicClassOverrides<C>;
12715
- };
12699
+ interface BaseMenuGroupProps extends SectionLikeProps, StyleProps {
12700
+ }
12701
+ interface MenuGroupConfig<C extends AnyPlasmicClass> {
12702
+ noTitleVariant: PlasmicClassVariants<C>;
12703
+ isFirstVariant: PlasmicClassVariants<C>;
12704
+ itemsSlot: keyof PlasmicClassArgs<C>;
12705
+ titleSlot: keyof PlasmicClassArgs<C>;
12706
+ root: keyof PlasmicClassOverrides<C>;
12707
+ separator: keyof PlasmicClassOverrides<C>;
12708
+ titleContainer: keyof PlasmicClassOverrides<C>;
12709
+ itemsContainer: keyof PlasmicClassOverrides<C>;
12710
+ }
12711
+ declare function useMenuGroup<P extends BaseMenuGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuGroupConfig<C>): {
12712
+ plasmicProps: {
12713
+ variants: PlasmicClassVariants<C>;
12714
+ args: PlasmicClassArgs<C>;
12715
+ overrides: PlasmicClassOverrides<C>;
12716
+ };
12716
12717
  };
12717
12718
 
12718
- interface BaseMenuItemProps extends ItemLikeProps {
12719
- /**
12720
- * Called when this item is selected
12721
- */
12722
- onAction?: (key: string) => void;
12723
- }
12724
- interface MenuItemConfig<C extends AnyPlasmicClass> {
12725
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12726
- isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
12727
- labelSlot: keyof PlasmicClassArgs<C>;
12728
- root: keyof PlasmicClassOverrides<C>;
12729
- labelContainer: keyof PlasmicClassOverrides<C>;
12730
- }
12731
- declare function useMenuItem<P extends BaseMenuItemProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuItemConfig<C>): {
12732
- plasmicProps: {
12733
- variants: PlasmicClassVariants<C>;
12734
- args: PlasmicClassArgs<C>;
12735
- overrides: PlasmicClassOverrides<C>;
12736
- };
12719
+ interface BaseMenuItemProps extends ItemLikeProps {
12720
+ /**
12721
+ * Called when this item is selected
12722
+ */
12723
+ onAction?: (key: string) => void;
12724
+ }
12725
+ interface MenuItemConfig<C extends AnyPlasmicClass> {
12726
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12727
+ isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
12728
+ labelSlot: keyof PlasmicClassArgs<C>;
12729
+ root: keyof PlasmicClassOverrides<C>;
12730
+ labelContainer: keyof PlasmicClassOverrides<C>;
12731
+ }
12732
+ declare function useMenuItem<P extends BaseMenuItemProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuItemConfig<C>): {
12733
+ plasmicProps: {
12734
+ variants: PlasmicClassVariants<C>;
12735
+ args: PlasmicClassArgs<C>;
12736
+ overrides: PlasmicClassOverrides<C>;
12737
+ };
12737
12738
  };
12738
12739
 
12739
12740
  /*
@@ -12754,246 +12755,246 @@ type Placement = 'bottom' | 'bottom left' | 'bottom right' | 'bottom start' | 'b
12754
12755
  'left' | 'left top' | 'left bottom' | 'start' | 'start top' | 'start bottom' |
12755
12756
  'right' | 'right top' | 'right bottom' | 'end' | 'end top' | 'end bottom';
12756
12757
 
12757
- interface DropdownMenuProps {
12758
- /**
12759
- * A ReactElement that takes in a `ref` as well as the usual mouse and
12760
- * pointer events. The dropdown menu will be positioned relative to this
12761
- * trigger.
12762
- */
12763
- children: React$1.ReactElement;
12764
- /**
12765
- * The menu to show; must be either a ReactElement of Menu type, or
12766
- * a function that creates one if you prefer to delay creating it until
12767
- * the menu has been triggered.
12768
- */
12769
- menu: React$1.ReactElement<BaseMenuProps> | (() => React$1.ReactElement<BaseMenuProps>);
12770
- /**
12771
- * Where to place the menu relative to the trigger.
12772
- */
12773
- placement?: Placement;
12774
- /**
12775
- * Whether the menu is currently shown.
12776
- */
12777
- isOpen?: boolean;
12778
- /**
12779
- * Uncontrolled open state.
12780
- */
12781
- defaultOpen?: boolean;
12782
- /**
12783
- * Event handler fired when Menu's open state changes
12784
- */
12785
- onOpenChange?: (isOpen: boolean) => void;
12786
- }
12758
+ interface DropdownMenuProps {
12759
+ /**
12760
+ * A ReactElement that takes in a `ref` as well as the usual mouse and
12761
+ * pointer events. The dropdown menu will be positioned relative to this
12762
+ * trigger.
12763
+ */
12764
+ children: React$1.ReactElement;
12765
+ /**
12766
+ * The menu to show; must be either a ReactElement of Menu type, or
12767
+ * a function that creates one if you prefer to delay creating it until
12768
+ * the menu has been triggered.
12769
+ */
12770
+ menu: React$1.ReactElement<BaseMenuProps> | (() => React$1.ReactElement<BaseMenuProps>);
12771
+ /**
12772
+ * Where to place the menu relative to the trigger.
12773
+ */
12774
+ placement?: Placement;
12775
+ /**
12776
+ * Whether the menu is currently shown.
12777
+ */
12778
+ isOpen?: boolean;
12779
+ /**
12780
+ * Uncontrolled open state.
12781
+ */
12782
+ defaultOpen?: boolean;
12783
+ /**
12784
+ * Event handler fired when Menu's open state changes
12785
+ */
12786
+ onOpenChange?: (isOpen: boolean) => void;
12787
+ }
12787
12788
  declare function DropdownMenu(props: DropdownMenuProps): JSX.Element;
12788
12789
 
12789
- interface BaseMenuButtonProps extends DOMProps, FocusableProps, StyleProps, Pick<React$1.ComponentProps<"button">, "title"> {
12790
- /**
12791
- * The menu to show; can either be a Menu instance, or a function that returns a Menu
12792
- * instance if you want to defer creating the instance till when it's opened.
12793
- */
12794
- menu: React$1.ReactElement<BaseMenuProps> | (() => React$1.ReactElement<BaseMenuProps>);
12795
- /**
12796
- * Whether the button is disabled
12797
- */
12798
- isDisabled?: boolean;
12799
- /**
12800
- * Whether the menu is currently shown.
12801
- */
12802
- isOpen?: boolean;
12803
- /**
12804
- * Uncontrolled open state
12805
- */
12806
- defaultOpen?: boolean;
12807
- /**
12808
- * Event handler fired when Menu's open state changes
12809
- */
12810
- onOpenChange?: (isOpen: boolean) => void;
12811
- /**
12812
- * Desired placement location of the Select dropdown
12813
- */
12814
- placement?: Placement;
12815
- /**
12816
- * If true, menu width will always match the trigger button width.
12817
- * If false, then menu width will have min-width matching the
12818
- * trigger button width.
12819
- */
12820
- menuMatchTriggerWidth?: boolean;
12821
- /**
12822
- * If set, menu width will be exactly this width, overriding
12823
- * menuMatchTriggerWidth.
12824
- */
12825
- menuWidth?: number;
12826
- }
12827
- interface MenuButtonConfig<C extends AnyPlasmicClass> {
12828
- isOpenVariant: VariantDef<PlasmicClassVariants<C>>;
12829
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12830
- menuSlot: keyof PlasmicClassArgs<C>;
12831
- root: keyof PlasmicClassOverrides<C>;
12832
- trigger: keyof PlasmicClassOverrides<C>;
12833
- }
12834
- interface MenuButtonState {
12835
- open: () => void;
12836
- close: () => void;
12837
- isOpen: () => boolean;
12838
- }
12839
- type MenuButtonRef = React$1.Ref<MenuButtonRefValue>;
12840
- interface MenuButtonRefValue extends MenuButtonState {
12841
- getRoot: () => HTMLElement | null;
12842
- getTrigger: () => HTMLElement | null;
12843
- focus: () => void;
12844
- blur: () => void;
12845
- }
12846
- declare function useMenuButton<P extends BaseMenuButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuButtonConfig<C>, outerRef?: MenuButtonRef): {
12847
- plasmicProps: {
12848
- variants: PlasmicClassVariants<C>;
12849
- args: PlasmicClassArgs<C>;
12850
- overrides: PlasmicClassOverrides<C>;
12851
- };
12852
- state: MenuButtonState;
12790
+ interface BaseMenuButtonProps extends DOMProps, FocusableProps, StyleProps, Pick<React$1.ComponentProps<"button">, "title"> {
12791
+ /**
12792
+ * The menu to show; can either be a Menu instance, or a function that returns a Menu
12793
+ * instance if you want to defer creating the instance till when it's opened.
12794
+ */
12795
+ menu: React$1.ReactElement<BaseMenuProps> | (() => React$1.ReactElement<BaseMenuProps>);
12796
+ /**
12797
+ * Whether the button is disabled
12798
+ */
12799
+ isDisabled?: boolean;
12800
+ /**
12801
+ * Whether the menu is currently shown.
12802
+ */
12803
+ isOpen?: boolean;
12804
+ /**
12805
+ * Uncontrolled open state
12806
+ */
12807
+ defaultOpen?: boolean;
12808
+ /**
12809
+ * Event handler fired when Menu's open state changes
12810
+ */
12811
+ onOpenChange?: (isOpen: boolean) => void;
12812
+ /**
12813
+ * Desired placement location of the Select dropdown
12814
+ */
12815
+ placement?: Placement;
12816
+ /**
12817
+ * If true, menu width will always match the trigger button width.
12818
+ * If false, then menu width will have min-width matching the
12819
+ * trigger button width.
12820
+ */
12821
+ menuMatchTriggerWidth?: boolean;
12822
+ /**
12823
+ * If set, menu width will be exactly this width, overriding
12824
+ * menuMatchTriggerWidth.
12825
+ */
12826
+ menuWidth?: number;
12827
+ }
12828
+ interface MenuButtonConfig<C extends AnyPlasmicClass> {
12829
+ isOpenVariant: VariantDef<PlasmicClassVariants<C>>;
12830
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12831
+ menuSlot: keyof PlasmicClassArgs<C>;
12832
+ root: keyof PlasmicClassOverrides<C>;
12833
+ trigger: keyof PlasmicClassOverrides<C>;
12834
+ }
12835
+ interface MenuButtonState {
12836
+ open: () => void;
12837
+ close: () => void;
12838
+ isOpen: () => boolean;
12839
+ }
12840
+ type MenuButtonRef = React$1.Ref<MenuButtonRefValue>;
12841
+ interface MenuButtonRefValue extends MenuButtonState {
12842
+ getRoot: () => HTMLElement | null;
12843
+ getTrigger: () => HTMLElement | null;
12844
+ focus: () => void;
12845
+ blur: () => void;
12846
+ }
12847
+ declare function useMenuButton<P extends BaseMenuButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: MenuButtonConfig<C>, outerRef?: MenuButtonRef): {
12848
+ plasmicProps: {
12849
+ variants: PlasmicClassVariants<C>;
12850
+ args: PlasmicClassArgs<C>;
12851
+ overrides: PlasmicClassOverrides<C>;
12852
+ };
12853
+ state: MenuButtonState;
12853
12854
  };
12854
12855
 
12855
- interface BaseSelectProps extends DOMProps, AriaLabelingProps, FocusableDOMProps, InputBase, FocusableProps, StyleProps {
12856
- /**
12857
- * Key of the currently selected value
12858
- */
12859
- value?: string | null;
12860
- /**
12861
- * Event handler fired when currently selected value changes
12862
- */
12863
- onChange?: (value: string | null) => void;
12864
- /**
12865
- * Uncontrolled key of the default selected value
12866
- */
12867
- defaultValue?: string;
12868
- /**
12869
- * List of Select.Options
12870
- */
12871
- children?: React$1.ReactNode;
12872
- /**
12873
- * List of options as an array, instead of using `children` prop. If this
12874
- * is passed in, then `children` is ignored.
12875
- *
12876
- * The options can be a list of strings, or a list of objects with
12877
- * fields `value` (for the value of the option), `label` (for what's rendered
12878
- * in the option), and `isDisabled` (if the option should be disabled).
12879
- */
12880
- options?: ItemJson[];
12881
- /**
12882
- * Whether the Select is currently open
12883
- */
12884
- isOpen?: boolean;
12885
- /**
12886
- * Event handler fired when Select's open state changes
12887
- */
12888
- onOpenChange?: (isOpen: boolean) => void;
12889
- /**
12890
- * Uncontrolled default open state
12891
- */
12892
- defaultOpen?: boolean;
12893
- /**
12894
- * Form name of the select element
12895
- */
12896
- name?: string;
12897
- /**
12898
- * By default, Select will render whatever is in Select.Option as the
12899
- * content in the trigger button when it is selected. You can override
12900
- * what content by passing in `selectedContent` here.
12901
- */
12902
- selectedContent?: React$1.ReactNode;
12903
- /**
12904
- * Desired placement location of the Select dropdown
12905
- */
12906
- placement?: Placement;
12907
- /**
12908
- * If true, menu width will always match the trigger button width.
12909
- * If false, then menu width will have min-width matching the
12910
- * trigger button width.
12911
- */
12912
- menuMatchTriggerWidth?: boolean;
12913
- /**
12914
- * If set, menu width will be exactly this width, overriding
12915
- * menuMatchTriggerWidth.
12916
- */
12917
- menuWidth?: number;
12918
- /**
12919
- * Content to display when nothing is selected.
12920
- */
12921
- placeholder?: React$1.ReactNode;
12922
- }
12923
- type SelectRef = React$1.Ref<SelectRefValue>;
12924
- interface SelectRefValue extends SelectState {
12925
- getTrigger: () => HTMLElement | null;
12926
- getRoot: () => HTMLElement | null;
12927
- focus: () => void;
12928
- blur: () => void;
12929
- }
12930
- interface SelectConfig<C extends AnyPlasmicClass> {
12931
- placeholderVariant?: VariantDef<PlasmicClassVariants<C>>;
12932
- isOpenVariant: VariantDef<PlasmicClassVariants<C>>;
12933
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12934
- triggerContentSlot: keyof PlasmicClassArgs<C>;
12935
- optionsSlot: keyof PlasmicClassArgs<C>;
12936
- placeholderSlot: keyof PlasmicClassArgs<C>;
12937
- root: keyof PlasmicClassOverrides<C>;
12938
- trigger: keyof PlasmicClassOverrides<C>;
12939
- overlay: keyof PlasmicClassOverrides<C>;
12940
- optionsContainer: keyof PlasmicClassOverrides<C>;
12941
- OptionComponent?: React$1.ComponentType<ItemLikeProps>;
12942
- OptionGroupComponent?: React$1.ComponentType<SectionLikeProps>;
12943
- }
12944
- interface SelectState {
12945
- open: () => void;
12946
- close: () => void;
12947
- isOpen: () => boolean;
12948
- getSelectedValue: () => string | null;
12949
- setSelectedValue: (value: string | null) => void;
12950
- }
12951
- declare function useSelect<P extends BaseSelectProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectConfig<C>, ref?: React$1.Ref<SelectRefValue>): {
12952
- plasmicProps: {
12953
- variants: PlasmicClassVariants<C>;
12954
- args: PlasmicClassArgs<C>;
12955
- overrides: PlasmicClassOverrides<C>;
12956
- };
12957
- state: SelectState;
12856
+ interface BaseSelectProps extends DOMProps, AriaLabelingProps, FocusableDOMProps, InputBase, FocusableProps, StyleProps {
12857
+ /**
12858
+ * Key of the currently selected value
12859
+ */
12860
+ value?: string | null;
12861
+ /**
12862
+ * Event handler fired when currently selected value changes
12863
+ */
12864
+ onChange?: (value: string | null) => void;
12865
+ /**
12866
+ * Uncontrolled key of the default selected value
12867
+ */
12868
+ defaultValue?: string;
12869
+ /**
12870
+ * List of Select.Options
12871
+ */
12872
+ children?: React$1.ReactNode;
12873
+ /**
12874
+ * List of options as an array, instead of using `children` prop. If this
12875
+ * is passed in, then `children` is ignored.
12876
+ *
12877
+ * The options can be a list of strings, or a list of objects with
12878
+ * fields `value` (for the value of the option), `label` (for what's rendered
12879
+ * in the option), and `isDisabled` (if the option should be disabled).
12880
+ */
12881
+ options?: ItemJson[];
12882
+ /**
12883
+ * Whether the Select is currently open
12884
+ */
12885
+ isOpen?: boolean;
12886
+ /**
12887
+ * Event handler fired when Select's open state changes
12888
+ */
12889
+ onOpenChange?: (isOpen: boolean) => void;
12890
+ /**
12891
+ * Uncontrolled default open state
12892
+ */
12893
+ defaultOpen?: boolean;
12894
+ /**
12895
+ * Form name of the select element
12896
+ */
12897
+ name?: string;
12898
+ /**
12899
+ * By default, Select will render whatever is in Select.Option as the
12900
+ * content in the trigger button when it is selected. You can override
12901
+ * what content by passing in `selectedContent` here.
12902
+ */
12903
+ selectedContent?: React$1.ReactNode;
12904
+ /**
12905
+ * Desired placement location of the Select dropdown
12906
+ */
12907
+ placement?: Placement;
12908
+ /**
12909
+ * If true, menu width will always match the trigger button width.
12910
+ * If false, then menu width will have min-width matching the
12911
+ * trigger button width.
12912
+ */
12913
+ menuMatchTriggerWidth?: boolean;
12914
+ /**
12915
+ * If set, menu width will be exactly this width, overriding
12916
+ * menuMatchTriggerWidth.
12917
+ */
12918
+ menuWidth?: number;
12919
+ /**
12920
+ * Content to display when nothing is selected.
12921
+ */
12922
+ placeholder?: React$1.ReactNode;
12923
+ }
12924
+ type SelectRef = React$1.Ref<SelectRefValue>;
12925
+ interface SelectRefValue extends SelectState {
12926
+ getTrigger: () => HTMLElement | null;
12927
+ getRoot: () => HTMLElement | null;
12928
+ focus: () => void;
12929
+ blur: () => void;
12930
+ }
12931
+ interface SelectConfig<C extends AnyPlasmicClass> {
12932
+ placeholderVariant?: VariantDef<PlasmicClassVariants<C>>;
12933
+ isOpenVariant: VariantDef<PlasmicClassVariants<C>>;
12934
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12935
+ triggerContentSlot: keyof PlasmicClassArgs<C>;
12936
+ optionsSlot: keyof PlasmicClassArgs<C>;
12937
+ placeholderSlot: keyof PlasmicClassArgs<C>;
12938
+ root: keyof PlasmicClassOverrides<C>;
12939
+ trigger: keyof PlasmicClassOverrides<C>;
12940
+ overlay: keyof PlasmicClassOverrides<C>;
12941
+ optionsContainer: keyof PlasmicClassOverrides<C>;
12942
+ OptionComponent?: React$1.ComponentType<ItemLikeProps>;
12943
+ OptionGroupComponent?: React$1.ComponentType<SectionLikeProps>;
12944
+ }
12945
+ interface SelectState {
12946
+ open: () => void;
12947
+ close: () => void;
12948
+ isOpen: () => boolean;
12949
+ getSelectedValue: () => string | null;
12950
+ setSelectedValue: (value: string | null) => void;
12951
+ }
12952
+ declare function useSelect<P extends BaseSelectProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectConfig<C>, ref?: React$1.Ref<SelectRefValue>): {
12953
+ plasmicProps: {
12954
+ variants: PlasmicClassVariants<C>;
12955
+ args: PlasmicClassArgs<C>;
12956
+ overrides: PlasmicClassOverrides<C>;
12957
+ };
12958
+ state: SelectState;
12958
12959
  };
12959
12960
 
12960
- interface BaseSelectOptionProps extends ItemLikeProps, StyleProps {
12961
- }
12962
- interface SelectOptionConfig<C extends AnyPlasmicClass> {
12963
- isSelectedVariant: VariantDef<PlasmicClassVariants<C>>;
12964
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12965
- isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
12966
- labelSlot: keyof PlasmicClassArgs<C>;
12967
- root: keyof PlasmicClassOverrides<C>;
12968
- labelContainer: keyof PlasmicClassOverrides<C>;
12969
- }
12970
- type SelectOptionRef = React$1.Ref<HTMLElement>;
12971
- declare function useSelectOption<P extends BaseSelectOptionProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectOptionConfig<C>, outerRef?: SelectOptionRef): {
12972
- plasmicProps: {
12973
- variants: PlasmicClassVariants<C>;
12974
- args: PlasmicClassArgs<C>;
12975
- overrides: PlasmicClassOverrides<C>;
12976
- };
12961
+ interface BaseSelectOptionProps extends ItemLikeProps, StyleProps {
12962
+ }
12963
+ interface SelectOptionConfig<C extends AnyPlasmicClass> {
12964
+ isSelectedVariant: VariantDef<PlasmicClassVariants<C>>;
12965
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
12966
+ isHighlightedVariant?: VariantDef<PlasmicClassVariants<C>>;
12967
+ labelSlot: keyof PlasmicClassArgs<C>;
12968
+ root: keyof PlasmicClassOverrides<C>;
12969
+ labelContainer: keyof PlasmicClassOverrides<C>;
12970
+ }
12971
+ type SelectOptionRef = React$1.Ref<HTMLElement>;
12972
+ declare function useSelectOption<P extends BaseSelectOptionProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectOptionConfig<C>, outerRef?: SelectOptionRef): {
12973
+ plasmicProps: {
12974
+ variants: PlasmicClassVariants<C>;
12975
+ args: PlasmicClassArgs<C>;
12976
+ overrides: PlasmicClassOverrides<C>;
12977
+ };
12977
12978
  };
12978
12979
 
12979
- interface BaseSelectOptionGroupProps extends SectionLikeProps, StyleProps {
12980
- }
12981
- interface SelectOptionGroupConfig<C extends AnyPlasmicClass> {
12982
- noTitleVariant: PlasmicClassVariants<C>;
12983
- isFirstVariant: PlasmicClassVariants<C>;
12984
- optionsSlot: keyof PlasmicClassArgs<C>;
12985
- titleSlot: keyof PlasmicClassArgs<C>;
12986
- root: keyof PlasmicClassOverrides<C>;
12987
- separator: keyof PlasmicClassOverrides<C>;
12988
- titleContainer: keyof PlasmicClassOverrides<C>;
12989
- optionsContainer: keyof PlasmicClassOverrides<C>;
12990
- }
12991
- declare function useSelectOptionGroup<P extends BaseSelectOptionGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectOptionGroupConfig<C>): {
12992
- plasmicProps: {
12993
- variants: PlasmicClassVariants<C>;
12994
- args: PlasmicClassArgs<C>;
12995
- overrides: PlasmicClassOverrides<C>;
12996
- };
12980
+ interface BaseSelectOptionGroupProps extends SectionLikeProps, StyleProps {
12981
+ }
12982
+ interface SelectOptionGroupConfig<C extends AnyPlasmicClass> {
12983
+ noTitleVariant: PlasmicClassVariants<C>;
12984
+ isFirstVariant: PlasmicClassVariants<C>;
12985
+ optionsSlot: keyof PlasmicClassArgs<C>;
12986
+ titleSlot: keyof PlasmicClassArgs<C>;
12987
+ root: keyof PlasmicClassOverrides<C>;
12988
+ separator: keyof PlasmicClassOverrides<C>;
12989
+ titleContainer: keyof PlasmicClassOverrides<C>;
12990
+ optionsContainer: keyof PlasmicClassOverrides<C>;
12991
+ }
12992
+ declare function useSelectOptionGroup<P extends BaseSelectOptionGroupProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SelectOptionGroupConfig<C>): {
12993
+ plasmicProps: {
12994
+ variants: PlasmicClassVariants<C>;
12995
+ args: PlasmicClassArgs<C>;
12996
+ overrides: PlasmicClassOverrides<C>;
12997
+ };
12997
12998
  };
12998
12999
 
12999
13000
  interface FocusState {
@@ -13240,94 +13241,94 @@ interface AriaSwitchBase extends SwitchBase, FocusableDOMProps, AriaLabelingProp
13240
13241
  }
13241
13242
  interface AriaSwitchProps extends SwitchProps$1, AriaSwitchBase {}
13242
13243
 
13243
- type SwitchRef = React$1.Ref<SwitchRefValue>;
13244
- interface SwitchRefValue extends SwitchState {
13245
- getRoot: () => HTMLElement | null;
13246
- focus: () => void;
13247
- blur: () => void;
13248
- }
13249
- interface SwitchState {
13250
- setChecked: (checked: boolean) => void;
13251
- }
13252
- interface SwitchProps extends Omit<AriaSwitchProps, "isSelected" | "defaultSelected">, StyleProps {
13253
- /**
13254
- * Whether the Switch is checked or not; controlled
13255
- */
13256
- isChecked?: boolean;
13257
- /**
13258
- * Whether the Switch is checked by default; uncontrolled
13259
- */
13260
- defaultChecked?: boolean;
13261
- }
13262
- interface SwitchConfig<C extends AnyPlasmicClass> {
13263
- isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
13264
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
13265
- noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
13266
- labelSlot?: keyof PlasmicClassArgs<C>;
13267
- root: keyof PlasmicClassOverrides<C>;
13268
- }
13269
- declare function useSwitch<P extends SwitchProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SwitchConfig<C>, ref?: SwitchRef): {
13270
- plasmicProps: {
13271
- variants: PlasmicClassVariants<C>;
13272
- overrides: PlasmicClassOverrides<C>;
13273
- args: PlasmicClassArgs<C>;
13274
- };
13275
- state: SwitchState;
13244
+ type SwitchRef = React$1.Ref<SwitchRefValue>;
13245
+ interface SwitchRefValue extends SwitchState {
13246
+ getRoot: () => HTMLElement | null;
13247
+ focus: () => void;
13248
+ blur: () => void;
13249
+ }
13250
+ interface SwitchState {
13251
+ setChecked: (checked: boolean) => void;
13252
+ }
13253
+ interface SwitchProps extends Omit<AriaSwitchProps, "isSelected" | "defaultSelected">, StyleProps {
13254
+ /**
13255
+ * Whether the Switch is checked or not; controlled
13256
+ */
13257
+ isChecked?: boolean;
13258
+ /**
13259
+ * Whether the Switch is checked by default; uncontrolled
13260
+ */
13261
+ defaultChecked?: boolean;
13262
+ }
13263
+ interface SwitchConfig<C extends AnyPlasmicClass> {
13264
+ isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
13265
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
13266
+ noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
13267
+ labelSlot?: keyof PlasmicClassArgs<C>;
13268
+ root: keyof PlasmicClassOverrides<C>;
13269
+ }
13270
+ declare function useSwitch<P extends SwitchProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: SwitchConfig<C>, ref?: SwitchRef): {
13271
+ plasmicProps: {
13272
+ variants: PlasmicClassVariants<C>;
13273
+ overrides: PlasmicClassOverrides<C>;
13274
+ args: PlasmicClassArgs<C>;
13275
+ };
13276
+ state: SwitchState;
13276
13277
  };
13277
13278
 
13278
- interface BaseTextInputProps extends Omit<React$1.ComponentProps<"input">, "type" | "disabled"> {
13279
- showStartIcon?: boolean;
13280
- showEndIcon?: boolean;
13281
- startIcon?: React$1.ReactNode;
13282
- endIcon?: React$1.ReactNode;
13283
- isDisabled?: boolean;
13284
- type?: "text" | "password" | "email" | "url" | string;
13285
- inputClassName?: string;
13286
- inputStyle?: React$1.CSSProperties;
13287
- }
13288
- interface TextInputRefValue {
13289
- focus: () => void;
13290
- blur: () => void;
13291
- getRoot: () => HTMLElement | null;
13292
- getInput: () => HTMLInputElement | null;
13293
- }
13294
- type TextInputRef = React$1.Ref<TextInputRefValue>;
13295
- interface TextInputConfig<C extends AnyPlasmicClass> {
13296
- showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
13297
- showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
13298
- isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
13299
- startIconSlot?: keyof PlasmicClassArgs<C>;
13300
- endIconSlot?: keyof PlasmicClassArgs<C>;
13301
- root: keyof PlasmicClassOverrides<C>;
13302
- input: keyof PlasmicClassOverrides<C>;
13303
- }
13304
- declare function useTextInput<P extends BaseTextInputProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TextInputConfig<C>, ref?: TextInputRef): {
13305
- plasmicProps: {
13306
- variants: PlasmicClassVariants<C>;
13307
- args: PlasmicClassArgs<C>;
13308
- overrides: PlasmicClassOverrides<C>;
13309
- };
13279
+ interface BaseTextInputProps extends Omit<React$1.ComponentProps<"input">, "type" | "disabled"> {
13280
+ showStartIcon?: boolean;
13281
+ showEndIcon?: boolean;
13282
+ startIcon?: React$1.ReactNode;
13283
+ endIcon?: React$1.ReactNode;
13284
+ isDisabled?: boolean;
13285
+ type?: "text" | "password" | "email" | "url" | string;
13286
+ inputClassName?: string;
13287
+ inputStyle?: React$1.CSSProperties;
13288
+ }
13289
+ interface TextInputRefValue {
13290
+ focus: () => void;
13291
+ blur: () => void;
13292
+ getRoot: () => HTMLElement | null;
13293
+ getInput: () => HTMLInputElement | null;
13294
+ }
13295
+ type TextInputRef = React$1.Ref<TextInputRefValue>;
13296
+ interface TextInputConfig<C extends AnyPlasmicClass> {
13297
+ showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
13298
+ showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
13299
+ isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
13300
+ startIconSlot?: keyof PlasmicClassArgs<C>;
13301
+ endIconSlot?: keyof PlasmicClassArgs<C>;
13302
+ root: keyof PlasmicClassOverrides<C>;
13303
+ input: keyof PlasmicClassOverrides<C>;
13304
+ }
13305
+ declare function useTextInput<P extends BaseTextInputProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TextInputConfig<C>, ref?: TextInputRef): {
13306
+ plasmicProps: {
13307
+ variants: PlasmicClassVariants<C>;
13308
+ args: PlasmicClassArgs<C>;
13309
+ overrides: PlasmicClassOverrides<C>;
13310
+ };
13310
13311
  };
13311
13312
 
13312
- interface BaseTriggeredOverlayProps extends StyleProps, DOMProps {
13313
- children?: React$1.ReactNode;
13314
- }
13315
- interface TriggeredOverlayConfig<C extends AnyPlasmicClass> {
13316
- isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
13317
- isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
13318
- isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
13319
- isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
13320
- contentSlot: keyof PlasmicClassArgs<C>;
13321
- root: keyof PlasmicClassOverrides<C>;
13322
- contentContainer: keyof PlasmicClassOverrides<C>;
13323
- }
13324
- type TriggeredOverlayRef = React$1.Ref<HTMLElement>;
13325
- declare function useTriggeredOverlay<P extends BaseTriggeredOverlayProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TriggeredOverlayConfig<C>, outerRef?: TriggeredOverlayRef, isDismissable?: boolean): {
13326
- plasmicProps: {
13327
- variants: PlasmicClassVariants<C>;
13328
- args: PlasmicClassArgs<C>;
13329
- overrides: PlasmicClassOverrides<C>;
13330
- };
13313
+ interface BaseTriggeredOverlayProps extends StyleProps, DOMProps {
13314
+ children?: React$1.ReactNode;
13315
+ }
13316
+ interface TriggeredOverlayConfig<C extends AnyPlasmicClass> {
13317
+ isPlacedTopVariant?: VariantDef<PlasmicClassVariants<C>>;
13318
+ isPlacedBottomVariant?: VariantDef<PlasmicClassVariants<C>>;
13319
+ isPlacedLeftVariant?: VariantDef<PlasmicClassVariants<C>>;
13320
+ isPlacedRightVariant?: VariantDef<PlasmicClassVariants<C>>;
13321
+ contentSlot: keyof PlasmicClassArgs<C>;
13322
+ root: keyof PlasmicClassOverrides<C>;
13323
+ contentContainer: keyof PlasmicClassOverrides<C>;
13324
+ }
13325
+ type TriggeredOverlayRef = React$1.Ref<HTMLElement>;
13326
+ declare function useTriggeredOverlay<P extends BaseTriggeredOverlayProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: TriggeredOverlayConfig<C>, outerRef?: TriggeredOverlayRef, isDismissable?: boolean): {
13327
+ plasmicProps: {
13328
+ variants: PlasmicClassVariants<C>;
13329
+ args: PlasmicClassArgs<C>;
13330
+ overrides: PlasmicClassOverrides<C>;
13331
+ };
13331
13332
  };
13332
13333
 
13333
13334
  interface OverlayTriggerState {
@@ -13343,15 +13344,15 @@ interface OverlayTriggerState {
13343
13344
  toggle(): void;
13344
13345
  }
13345
13346
 
13346
- interface TriggeredOverlayContextValue {
13347
- triggerRef: React$1.RefObject<HTMLElement>;
13348
- state: OverlayTriggerState;
13349
- autoFocus?: boolean | FocusStrategy;
13350
- placement?: Placement;
13351
- overlayMatchTriggerWidth?: boolean;
13352
- overlayMinTriggerWidth?: boolean;
13353
- overlayWidth?: number;
13354
- }
13347
+ interface TriggeredOverlayContextValue {
13348
+ triggerRef: React$1.RefObject<HTMLElement>;
13349
+ state: OverlayTriggerState;
13350
+ autoFocus?: boolean | FocusStrategy;
13351
+ placement?: Placement;
13352
+ overlayMatchTriggerWidth?: boolean;
13353
+ overlayMinTriggerWidth?: boolean;
13354
+ overlayWidth?: number;
13355
+ }
13355
13356
  declare const TriggeredOverlayContext: React$1.Context<TriggeredOverlayContextValue | undefined>;
13356
13357
 
13357
13358
  export { $State, $StateSpec, BaseButtonProps, BaseMenuButtonProps, BaseMenuGroupProps, BaseMenuItemProps, BaseMenuProps, BaseSelectOptionGroupProps, BaseSelectOptionProps, BaseSelectProps, BaseTextInputProps, BaseTriggeredOverlayProps, ButtonRef, CheckboxProps, CheckboxRef, CheckboxRefValue, DropdownMenu, Flex, HTMLElementRefOf, HtmlAnchorOnlyProps, HtmlButtonOnlyProps, MenuButtonRef, MenuButtonRefValue, MenuRef, MenuRefValue, MultiChoiceArg, PlasmicDataSourceContextProvider, PlasmicHead, PlasmicIcon, PlasmicImg, PlasmicLink, PlasmicPageGuard, PlasmicRootProvider, PlasmicSlot, SelectContext, SelectOptionRef, SelectRef, SelectRefValue, SingleBooleanChoiceArg, SingleChoiceArg, Stack, StrictProps, SwitchProps, SwitchRef, SwitchRefValue, TextInputRef, TextInputRefValue, Trans, TriggeredOverlayConfig, TriggeredOverlayContext, TriggeredOverlayRef, classNames, createPlasmicElementProxy, createUseScreenVariants, deriveRenderOpts, ensureGlobalVariants, genTranslatableString, generateStateOnChangeProp, generateStateOnChangePropForCodeComponents, generateStateValueProp, dlv as get, getCurrentInitialValue, getDataProps, getStateCellsInPlasmicProxy, getStateSpecInPlasmicProxy, hasVariant, initializeCodeComponentStates, initializePlasmicStates, is$StateProxy, isPlasmicStateProxy, makeFragment, mergeVariantsWithStates, omit, pick, plasmicHeadMeta, renderPlasmicSlot, resetToInitialValue, set, setPlumeStrictMode, useButton, useCheckbox, useCurrentUser, useDollarState, useIsSSR, useMenu, useMenuButton, useMenuGroup, useMenuItem, useSelect, useSelectOption, useSelectOptionGroup, useSwitch, useTextInput, useTrigger, useTriggeredOverlay, withPlasmicPageGuard, wrapWithClassName };