{"version":3,"file":"index_html.js","sourceRoot":"","sources":["../../src/html/index_html.ts"],"names":[],"mappings":";AAAA,8EAA8E;AAC9E,uEAAuE;AACvE,yEAAyE;AACzE,qEAAqE;AACrE,uCAAuC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGvC,kDAAmC;AAEnC,yDAA6D;AAC7D,0DAAmD;AAGnD,MAAM,OAAO,GAAuB,IAAA,wBAAS,GAAE,CAAA;AA+EV,yBAAM;AA9E3C,MAAM,MAAM,GA2ER,KAAK,CAAA;AAGU,uBAAK;AAFxB,MAAM,KAAK,GAAG,uBAAI,CAAA;AAEoC,qBAAI;AAC1D,kBAAe,MAAM,CAAA","sourcesContent":["// IMPORTANT: be careful to ensure you don't accidentally add code which has a\n// dependency on Node.js-only modules here, as it will break co-located\n// components. We don't have a test for this yet. Any such code should be\n// conditionally required - see `client` for an example. Reach out in\n// #feat-code-connect if you're unsure.\n\nimport { EnumValue, FigmaConnectAPI, FigmaConnectMeta, ValueOf } from '../connect/api'\nimport * as figma from './external'\nimport { FigmaConnectClient } from '../client/figma_client'\nimport { html, HtmlTemplateString } from './template_literal'\nimport { getClient } from '../connect/index_common'\nimport { HtmlMeta } from './types'\n\nconst _client: FigmaConnectClient = getClient()\nconst _figma: FigmaConnectAPI<HtmlTemplateString, HtmlTemplateString> & {\n  /**\n   * Defines a code snippet that displays in Figma when a component is selected.\n   *\n   * @param figmaNodeUrl A link to the node in Figma, for example:`https://www.figma.com/file/123abc/My-Component?node-id=123:456`\n   * @param meta {@link FigmaConnectMeta}\n   */\n  connect<P = {}>(figmaNodeUrl: string, meta: HtmlMeta<P>): void\n\n  /**\n   * Maps a Figma property to a boolean value for the connected component. This prop is replaced\n   * with values from the Figma instance when viewed in Dev Mode. For example:\n   * ```ts\n   * props: {\n   *  disabled: figma.boolean('Disabled'),\n   * }\n   * ```\n   * Would show the `disabled` property if the Figma property \"Disabled\" is true.\n   *\n   * @param figmaPropName The name of the property on the Figma component\n   */\n  boolean(figmaPropName: string): boolean\n\n  /**\n   * Maps a Figma boolean property to a set of values for the connected\n   * component, providing a value mapping for `true` and `false`. This prop is\n   * replaced with values from the Figma instance when viewed in Dev Mode.\n   * Example:\n   * ```ts\n   * props: {\n   *  label: figma.boolean('Disabled', {\n   *    true: <my-label></my-label>,\n   *    false: <my-disabled-label></my-disabled-label>,\n   *  }),\n   * }\n   * ```\n   * Would replace `label` with `<my-label></my-label>` if the Figma property\n   * \"Disabled\" is true.\n   *\n   * @param figmaPropName The name of the property on the Figma component\n   * @param valueMapping A mapping of values for `true` and `false`\n   */\n  boolean<TrueT extends EnumValue, FalseT extends EnumValue>(\n    figmaPropName: string,\n    valueMapping?: {\n      true?: TrueT\n      false?: FalseT\n    },\n  ): ValueOf<Record<'true' | 'false', TrueT | FalseT>>\n\n  /**\n   * Maps nested properties from a Figma instance layer. The first argument\n   * should be the layer name of the nested instance. The mapping object passed\n   * in is in the same format as the `props` object in the `connect` function.\n   * For example:\n   * ```ts\n   * props: {\n   *   nested: figma.nestedProps('Nested', {\n   *     label: figma.string('Text'),\n   *     icon: figma.instance('Icon'),\n   *   }),\n   * }\n   * ```\n   *\n   * Which would then allow you to access the nested properties in the `example` function like so:\n   * ```ts\n   * (props) => html`<my-button label=${props.nested.label}>${props.nested.icon}</my-button>`\n   * ```\n   */\n  nestedProps<V>(layer: string, input: V): V\n\n  /**\n   * A list of import statements that will render in the Code Snippet in Figma.\n   */\n  imports?: string[]\n} = figma\nconst _html = html\n\nexport { _figma as figma, _client as client, _html as html }\nexport default _figma\n"]}