@plaidev/karte-action-sdk 1.1.268 → 1.1.269-29151822.663827f4

package/dist/functions.d.ts

@@ -0,0 +1,71 @@
+import type { OnClickOperation, AnimationStyle } from "./prop.js";
+import type { CloseTrigger } from "./modal.js";
+/** @internal */
+export declare const none: () => () => void;
+/** @internal */
+export declare const moveTo: (to: string) => () => void;
+/** @internal */
+export declare const linkTo: (to: string, targetBlank?: boolean, decode?: boolean) => () => void;
+/** @internal */
+export declare const closeApp: (trigger: CloseTrigger) => () => void;
+/** @internal */
+export declare const runScript: (handlerName: string) => () => void;
+/** @internal */
+export declare const submitForm: (to: string) => () => void;
+/** @internal */
+export declare const bootChat: (hide_launcher: boolean, placement_pc: string, placement_mobile: string, horizontal_spacing_pc: number, horizontal_spacing_mobile: number, vertical_spacing_pc: number, vertical_spacing_mobile: number, theme_color: string, header_title: string, header_description: string, launcher_image: string) => () => void;
+/** @internal */
+export declare const execOnClickOperation: (onClickOperation: OnClickOperation) => void;
+/** @internal */
+export declare const haveFunction: (onClickOperation: OnClickOperation) => boolean;
+/**
+* An option for svelte custom animation
+*/
+interface CustomAnimationOptions {
+	/**
+	* A Transform value in percent of target element
+	*/
+	transforms: Array<{
+		query: string | null
+		x: number
+		y: number
+	}>;
+	/**
+	* A style of animation(e.g. fade, slide-in)
+	*/
+	animationStyle: AnimationStyle;
+	/**
+	* A waiting time in milliseconds before starting animation
+	*
+	* @defaultValue 0
+	*/
+	delay?: number;
+	/**
+	*  A total duration time in milliseconds of the animation
+	*
+	* @defaultValue 1000
+	*/
+	duration?: number;
+}
+/**
+* The function to activate svelte animation.
+*
+* @param node - A target node of animation. This argument is passed by svelte, by default.
+* @param customAnimationOptions - A custom animation option object
+*
+* @see {@link https://svelte.dev/docs#template-syntax-element-directives-transition-fn-custom-transition-functions| Custom transition functions} for detail documentation
+*
+* @internal
+*/
+export declare function customAnimation(node: Element, { transforms, animationStyle, delay, duration }: CustomAnimationOptions): {
+	delay?: undefined
+	duration?: undefined
+	easing?: undefined
+	css?: undefined
+} | {
+	delay: number
+	duration: number
+	easing: (t: any) => any
+	css: (progress: number) => string
+};
+export {};

package/dist/hooks/useClickable.d.ts

@@ -0,0 +1,7 @@
+import type { ClickableProps } from "../components-flex/props.js";
+declare const useClickable: ({ eventValue, eventName, onClick, element }: ClickableProps) => {
+	element: string
+	attributes: Record<string, any>
+	handleClick: (e: MouseEvent) => void
+};
+export default useClickable;

package/dist/hooks/useInjectCustomizeCss.d.ts

@@ -0,0 +1,2 @@
+import type { CustomizeCssProps } from "../components-flex/props.js";
+export declare const useInjectCustomizeCss: (props: CustomizeCssProps) => void;

package/dist/hooks/useText.d.ts

@@ -0,0 +1,5 @@
+import type { LayerTextProps } from "../components-flex/text/types.js";
+export declare const useText: (props: LayerTextProps) => {
+	escapedHTML: string
+	style: string
+};

package/dist/hydrate/action.d.ts

@@ -0,0 +1,63 @@
+import type { ActionVariables, ActionOptions, ActionHook } from "./types.js";
+import type { SvelteComponentTyped } from "svelte";
+import type { VariableQuery } from "./collection.js";
+import type { Props as ModalProps } from "./display-logic.js";
+/**
+* アクションを作成する
+*
+* @param App - Svelte コンポーネントのエントリポイント
+* @param options - {@link ActionOptions | オプション}
+*
+* @returns アクションを破棄する関数
+*
+* @public
+*/
+export declare function create<
+	Props extends ModalProps,
+	Variables,
+	VariablesQuery extends Array<VariableQuery>
+>(App: typeof SvelteComponentTyped, options?: ActionOptions<Props, Variables & ActionVariables, VariablesQuery>): () => void;
+/**
+* アクションの破棄する
+*
+* @public
+*/
+export declare function destroyAction(): void;
+/**
+* アクションが作成 (create) される前にフックする関数
+*
+* @param fn - 呼び出されるフック関数
+*
+* @public
+*/
+export declare function onCreate<
+	Props extends ModalProps,
+	Variables
+>(fn: ActionHook<Props, Variables & ActionVariables>): void;
+/**
+* アクションが破棄 (destroy) される前にフックする関数
+*
+* @param fn - 呼び出されるフック関数
+*
+* @public
+*/
+export declare function onDestroy<
+	Props extends ModalProps,
+	Variables
+>(fn: ActionHook<Props, Variables & ActionVariables>): void;
+/**
+* 非推奨
+*
+* @deprecated 非推奨
+*
+* @internal
+*/
+export declare const showModal: typeof create;
+/**
+* 非推奨
+*
+* @deprecated 非推奨
+*
+* @internal
+*/
+export declare function destroy(): void;

package/dist/hydrate/actionEvent.d.ts

@@ -0,0 +1,25 @@
+import type { ActionSetting } from "./types.js";
+/** @internal */
+export declare const actionId: string;
+/** @internal */
+export declare const ACTION_DESTROY_EVENT: string;
+/** @internal */
+export declare const ACTION_SHOW_EVENT: string;
+/** @internal */
+export declare const ACTION_CLOSE_EVENT: string;
+/** @internal */
+export declare const ACTION_CHANGE_STATE_EVENT: string;
+/** @internal */
+export declare const send_event: (event_name: string, values?: any) => void;
+/** @internal */
+export declare const publish_edge: (topic: string, values?: any) => void;
+/** @internal */
+export declare const initialize: (setting?: ActionSetting) => () => void;
+/** @internal */
+export declare const finalize: () => void;
+/**
+* Dispatch the event to destroy KARTE action
+*
+* @internal
+*/
+export declare function dispatchDestroyEvent(): void;

package/dist/hydrate/collection.d.ts

@@ -0,0 +1,121 @@
+type ActionTableResult = number | string | boolean | Date | null | undefined;
+type ActionTableQueryParam = string | number | boolean | Date;
+type ActionTableQueryParams = {
+	[key: string]: ActionTableQueryParam | ActionTableQueryParam[]
+};
+/**
+* アクションテーブルの設定情報
+*
+* @param api_key - API Key
+* @param table - テーブル名
+* @param endpoint - エンドポイント / 指定がない場合はデフォルトのエンドポイントを使用します。検証用途以外での通常利用では指定なしで大丈夫です。
+*/
+export type CollectionConfig = {
+	api_key: string
+	table: string
+	collection_endpoint?: string
+};
+/**
+* アクションテーブルを管理するメソッドを取得する
+*
+* @param config - アクションテーブル設定情報
+*
+* @returns メソッドを返します
+*
+* @public
+*/
+export declare function collection(config: CollectionConfig): {
+	/**
+	* キーを１つ、または複数指定して、対応するアクションテーブルの行を取得する
+	*
+	* @param key - 取得する行のキーを一つ、または複数配列で指定
+	* @param cb - テーブルの行を取得した後に実行するcallback関数
+	*
+	* @public
+	*/
+	get(key: string | Array<string>, cb: (err: Error | null, items?: ActionTableResult | Array<ActionTableResult>) => void): void
+	/**
+	* クエリーを指定して、アクションテーブルから行を取得する
+	* なお、クエリーは事前に管理画面で設定しておく必要があります。
+	*
+	* @param query_name - クエリー名
+	* @param params - クエリーに指定するパラメーター。 `{key: value}` の形式で指定
+	* @param cb - テーブルの行を取得した後に実行するcallback関数
+	*
+	* @public
+	*/
+	getByQuery(query_name: string, params: ActionTableQueryParams, options: {
+		ignore_fields?: string[]
+	} | null | undefined, cb: (err: Error | null, items?: Array<ActionTableResult>) => void): void
+	/** @internal */
+	set(key: string, value: string, cb: (err: Error | null) => void): void
+};
+/** @internal */
+export type VariableQuery = {
+	resolver: string
+	name: string
+	query: any
+	preview_value?: any
+};
+/** @internal */
+export type ActionTableRowRequestConfig = VariableQuery & {
+	resolver: "action-table-row"
+	query: {
+		table_name: string
+		key: string
+		default_value?: ActionTableResult
+	}
+	preview_value?: ActionTableResult
+};
+/** @internal */
+export type ActionTableRowsRequestConfig = VariableQuery & {
+	resolver: "action-table-rows"
+	query: {
+		table_name: string
+		keys: Array<string>
+		default_value?: Array<ActionTableResult>
+	}
+	preview_value?: Array<ActionTableResult>
+};
+/** @internal */
+export type ActionTableQueryRequestConfig = VariableQuery & {
+	resolver: "action-table-query"
+	query: {
+		table_name: string
+		query_name: string
+		params?: {
+			[key: string]: string
+		}
+		default_value?: Array<ActionTableResult>
+	}
+	preview_value?: Array<ActionTableResult>
+};
+/** @internal */
+export type ActionTableRequestConfig = ActionTableRowRequestConfig | ActionTableRowsRequestConfig | ActionTableQueryRequestConfig;
+/** @internal */
+export declare const loadActionTableRow: (config: ActionTableRowRequestConfig, data: {
+	[key: string]: any
+}, api_key: string, collection_endpoint?: string) => Promise<unknown>;
+/** @internal */
+export declare const loadActionTableRows: (config: ActionTableRowsRequestConfig, data: {
+	[key: string]: any
+}, api_key: string, collection_endpoint?: string) => Promise<unknown>;
+/** @internal */
+export declare const loadActionTableQuery: (config: ActionTableQueryRequestConfig, data: {
+	[key: string]: any
+}, api_key: string, collection_endpoint?: string) => Promise<unknown>;
+/** @internal */
+export declare const loadActionTable: (config: Array<VariableQuery>, data: {
+	[key: string]: any
+}, api_key: string, collection_endpoint?: string) => Promise<{
+	[key: string]: any
+}>;
+/** @internal */
+export declare function setupActionTable(localVariablesQuery: Array<VariableQuery>, data: {
+	[key: string]: any
+}, apiKey: string, collection_endpoint: string): Promise<{
+	success: boolean
+}>;
+/** @internal */
+export declare function initActionTable(localVariablesQuery: Array<VariableQuery> | undefined): void;
+export {};

package/dist/hydrate/components/index.d.ts

@@ -0,0 +1,32 @@
+import { onMount as onMountSvelte, onDestroy as onDestorySvelte, beforeUpdate as beforeUpdateSvelte, afterUpdate as afterUpdateSvelte, tick as tickSvelte } from "svelte";
+/**
+* エレメントをマウントしたときに実行される関数の登録
+*
+* @param fn - マウントしたときに実行される関数
+*/
+export declare const onMount: typeof onMountSvelte;
+/**
+* エレメントを破棄したときに実行される関数の登録
+*
+* @param fn - マウントしたときに実行される関数
+*/
+export declare const onDestory: typeof onDestorySvelte;
+/**
+* エレメントを更新する前に実行される関数の登録
+*
+* @param fn - マウントしたときに実行される関数
+*/
+export declare const beforeUpdate: typeof beforeUpdateSvelte;
+/**
+* エレメントを更新した後に実行される関数の登録
+*
+* @param fn - マウントしたときに実行される関数
+*/
+export declare const afterUpdate: typeof afterUpdateSvelte;
+/**
+* エレメントのライフサイクルを進める
+*
+* @returns Promise<void>
+*/
+export declare const tick: typeof tickSvelte;
+export declare const LAYOUT_COMPONENT_NAMES: string[];

package/dist/hydrate/components-flex/avatar/styles.d.ts

@@ -0,0 +1,3 @@
+import type { PropStyles } from "../shared/types.js";
+import type { AvatarProps } from "./types.js";
+export declare const AVATAR_SIZE_STYLES: PropStyles<AvatarProps, "size">;

package/dist/hydrate/components-flex/avatar/types.d.ts

@@ -0,0 +1,24 @@
+import type { BorderProps, ClickableProps, CommonProps, PaddingProps } from "../props.js";
+import type { Properties } from "csstype";
+export declare const AVATAR_SIZE: {
+	readonly extra_small: "XS（48 x 48）"
+	readonly small: "S（64 x 64）"
+	readonly medium: "M（88 x 88）"
+	readonly large: "L（108 x 108）"
+	readonly extra_large: "XL（128 x 128）"
+};
+export declare const AVATAR_SHAPE: {
+	readonly circle: "サークル"
+	readonly square: "スクエア"
+	readonly rounded: "ラウンド"
+};
+export type AvatarProps = CommonProps & ClickableProps & PaddingProps & BorderProps & {
+	size?: keyof typeof AVATAR_SIZE | number
+	width?: Properties["width"]
+	height?: Properties["height"]
+	shape?: keyof typeof AVATAR_SHAPE
+	image?: string
+	caption?: string
+	alt?: string
+};
+export declare const avatarPropsDefault: AvatarProps;

package/dist/hydrate/components-flex/brand-kit.d.ts

@@ -0,0 +1,16 @@
+export type BrandKit = {
+	font_family: string
+	color_text_primary: string
+	color_text_secondary: string
+	color_brand: string
+	color_link: string
+	color_danger: string
+	color_success: string
+	color_info: string
+	color_warning: string
+	color_white: string
+};
+export declare const getBrandKit: (customBrandKit?: Partial<BrandKit>) => BrandKit;
+export declare const useBrandKit: () => {
+	brandKit: BrandKit
+};

package/dist/hydrate/components-flex/button/styles.d.ts

@@ -0,0 +1,8 @@
+import type { ButtonProps } from "src/components-flex/button/types";
+import type { PropStyles } from "../shared/types.js";
+import type { BrandKit } from "../brand-kit.js";
+import type { BrandableStyles } from "../styles.js";
+export declare const getButtonThemeStyles: (customBrandKit?: Partial<BrandKit>) => BrandableStyles<ButtonProps>;
+export declare const BUTTON_SIZE_STYLES: PropStyles<ButtonProps, "size">;
+export declare const BUTTON_ROUND_STYLES: PropStyles<ButtonProps, "round">;
+export declare const BUTTON_WRAP_STYLES: PropStyles<ButtonProps, "wrap">;

package/dist/hydrate/components-flex/button/types.d.ts

@@ -0,0 +1,57 @@
+import type { Properties } from "csstype";
+import type { BorderProps, ClickableProps, CommonProps, LinkProps, ShadowProps, WithIconProps, RadiusProps } from "../props.js";
+export declare const BUTTON_SIZE: {
+	readonly extra_small: "エクストラ スモール"
+	readonly small: "スモール"
+	readonly medium: "ミディアム"
+	readonly large: "ラージ"
+	readonly extra_large: "エクストラ ラージ"
+};
+export declare const BUTTON_THEME: {
+	readonly default: "ノーマル / ブランド"
+	readonly general: "ノーマル / ジェネラル"
+	readonly danger: "ノーマル / アラート"
+	readonly white: "ノーマル / ホワイト"
+	readonly default_outline: "アウトライン / ブランド"
+	readonly general_outline: "アウトライン / ジェネラル"
+	readonly danger_outline: "アウトライン / アラート"
+	readonly default_text: "テキスト / ブランド"
+	readonly general_text: "テキスト / ジェネラル"
+	readonly danger_text: "テキスト / アラート"
+};
+export declare const BUTTON_VARIANT: {
+	readonly normal: "ノーマル"
+	readonly outline: "アウトライン"
+	readonly text: "テキスト"
+};
+export declare const BUTTON_ROUND: {
+	readonly default: "デフォルト"
+	readonly none: "なし"
+	readonly fulled: "円形"
+};
+export declare const BUTTON_LINK_TARGET: {
+	readonly _self: "画面内遷移"
+	readonly _blank: "別タブで開く"
+};
+export declare const BUTTON_ICON_ANGLE: {
+	readonly row: "左側"
+	readonly "row-reverse": "右側"
+};
+export type ButtonProps = CommonProps & ClickableProps & ShadowProps & LinkProps & WithIconProps & RadiusProps & BorderProps & {
+	label?: string
+	size?: keyof typeof BUTTON_SIZE | string
+	height?: Properties["height"]
+	paddingLeft?: Properties["paddingLeft"]
+	paddingRight?: Properties["paddingRight"]
+	fontSize?: Properties["fontSize"]
+	theme?: keyof typeof BUTTON_THEME | string
+	variant?: keyof typeof BUTTON_VARIANT | string
+	color?: Properties["color"]
+	backgroundColor?: Properties["backgroundColor"]
+	borderColor?: Properties["borderColor"]
+	fontWeight?: Properties["fontWeight"]
+	round?: keyof typeof BUTTON_ROUND
+	width?: Properties["width"]
+	wrap?: "wrap" | "nowrap"
+};
+export declare const buttonPropsDefault: ButtonProps;

package/dist/hydrate/components-flex/button-outlined/styles.d.ts

@@ -0,0 +1,8 @@
+import type { ButtonOutlinedProps } from "./types.js";
+import type { PropStyles } from "../shared/types.js";
+import type { BrandKit } from "../brand-kit.js";
+import type { BrandableStyles } from "../styles.js";
+export declare const BUTTON_OUTLINED_SIZE_STYLES: PropStyles<ButtonOutlinedProps, "size">;
+export declare const getButtonOutlinedThemeStyles: (customBrandKit?: Partial<BrandKit>) => BrandableStyles<ButtonOutlinedProps>;
+export declare const BUTTON_OUTLINED_ROUND_STYLES: PropStyles<ButtonOutlinedProps, "round">;
+export declare const BUTTON_OUTLINED_WRAP_STYLES: PropStyles<ButtonOutlinedProps, "wrap">;

package/dist/hydrate/components-flex/button-outlined/types.d.ts

@@ -0,0 +1,20 @@
+import type { Properties } from "csstype";
+import type { BorderProps, ClickableProps, CommonProps, LinkProps, ShadowProps, WithIconProps } from "../props.js";
+import type { BUTTON_THEME, BUTTON_ROUND, BUTTON_SIZE } from "../button/types.js";
+export type ButtonOutlinedProps = CommonProps & ClickableProps & ShadowProps & WithIconProps & LinkProps & BorderProps & {
+	label?: string
+	size?: keyof typeof BUTTON_SIZE
+	height?: Properties["height"]
+	paddingLeft?: Properties["paddingLeft"]
+	paddingRight?: Properties["paddingRight"]
+	fontSize?: Properties["fontSize"]
+	theme?: keyof typeof BUTTON_THEME
+	color?: Properties["color"]
+	backgroundColor?: Properties["backgroundColor"]
+	borderColor?: Properties["backgroundColor"]
+	width?: Properties["width"]
+	round?: keyof typeof BUTTON_ROUND
+	fontWeight?: Properties["fontWeight"]
+	wrap?: "wrap" | "nowrap"
+};
+export declare const buttonOutlinedPropsDefault: ButtonOutlinedProps;

package/dist/hydrate/components-flex/button-text/styles.d.ts

@@ -0,0 +1,6 @@
+import type { PropStyles } from "../shared/types.js";
+import type { ButtonTextProps } from "./types.js";
+import type { BrandKit } from "../brand-kit.js";
+import type { BrandableStyles } from "../styles.js";
+export declare const BUTTON_TEXT_SIZE_STYLES: PropStyles<ButtonTextProps, "size">;
+export declare const getButtonTextThemeStyles: (customBrandKit?: Partial<BrandKit>) => BrandableStyles<ButtonTextProps>;

package/dist/hydrate/components-flex/button-text/types.d.ts

@@ -0,0 +1,33 @@
+import type { Properties } from "csstype";
+import type { ClickableProps, CommonProps, LinkProps, WithIconProps } from "../props.js";
+import type { BUTTON_ROUND } from "../button/types.js";
+export declare const BUTTON_TEXT_SIZE: {
+	readonly small: "Small"
+	readonly medium: "Medium"
+	readonly large: "Large"
+};
+export declare const BUTTON_TEXT_THEME: {
+	readonly default: "Default"
+	readonly link: "Link"
+	readonly general: "General"
+	readonly success: "Success"
+	readonly warning: "Warning"
+	readonly danger: "Danger"
+	readonly info: "Info"
+	readonly white: "White"
+};
+export type ButtonTextProps = CommonProps & ClickableProps & LinkProps & WithIconProps & {
+	label?: string
+	size?: keyof typeof BUTTON_TEXT_SIZE
+	height?: Properties["height"]
+	paddingLeft?: Properties["paddingLeft"]
+	paddingRight?: Properties["paddingRight"]
+	fontSize?: Properties["fontSize"]
+	theme?: keyof typeof BUTTON_TEXT_THEME
+	color?: Properties["color"]
+	backgroundColor?: Properties["backgroundColor"]
+	fontWeight?: Properties["fontWeight"]
+	width?: Properties["width"]
+	round?: keyof typeof BUTTON_ROUND
+	wrap?: "wrap" | "nowrap"
+};

package/dist/hydrate/components-flex/clip-copy/types.d.ts

@@ -0,0 +1,6 @@
+import type { CommonProps } from "../props.js";
+export type ClipboardProps = CommonProps & {
+	content?: string
+	copiedEventName?: string
+	noneTooltip?: boolean
+};

package/dist/hydrate/components-flex/close-button/types.d.ts

@@ -0,0 +1,32 @@
+import type { BorderProps, ClickableProps, CommonProps, BackgroundColorProps, ColorProps, PaddingProps } from "../props.js";
+import type { Properties } from "csstype";
+import type { TEXT_THEME } from "../text/types.js";
+export declare const CLOSE_BUTTON_PLACEMENT: {
+	readonly topRight: "topRight"
+	readonly topLeft: "topLeft"
+	readonly bottomRight: "bottomRight"
+	readonly bottomLeft: "bottomLeft"
+};
+export declare const CLOSE_BUTTON_ROUND: {
+	readonly default: "デフォルト"
+	readonly none: "なし"
+	readonly fulled: "円形"
+};
+export declare const CLOSE_BUTTON_LABEL_PLACEMENT: {
+	readonly right: "right"
+	readonly left: "left"
+};
+export type CloseButtonProps = CommonProps & BackgroundColorProps & ClickableProps & ColorProps & PaddingProps & BorderProps & {
+	size?: number
+	placement?: keyof typeof CLOSE_BUTTON_PLACEMENT
+	round?: keyof typeof CLOSE_BUTTON_ROUND
+	bordered?: boolean
+	label?: string
+	labelColor?: Properties["color"]
+	labelColorVariant?: keyof typeof TEXT_THEME
+	labelPlacement?: keyof typeof CLOSE_BUTTON_LABEL_PLACEMENT
+	top?: Properties["top"]
+	right?: Properties["right"]
+	left?: Properties["left"]
+	bottom?: Properties["bottom"]
+};

package/dist/hydrate/components-flex/code/types.d.ts

@@ -0,0 +1,6 @@
+import type { CommonProps } from "../props.js";
+export type CodeProps = CommonProps & {
+	rawHtml?: string
+	rawCss?: string
+	rawScript?: string
+};

package/dist/hydrate/components-flex/count-down/types.d.ts

@@ -0,0 +1,17 @@
+import type { CommonProps } from "../props.js";
+import type { OnClickOperation } from "../../prop.js";
+import type { LayerTextProps } from "../text/types.js";
+export type CountDownProps = CommonProps & {
+	timeLimit?: string
+	onEnd?: OnClickOperation
+};
+export type CountDownValueType = "day" | "hour" | "minute" | "second";
+export type CountDownValueProps = LayerTextProps & {
+	type: CountDownValueType
+};
+export type CountDownValues = {
+	day: number
+	hour: number
+	min: number
+	sec: number
+};

package/dist/hydrate/components-flex/icon/styles.d.ts

@@ -0,0 +1,3 @@
+import type { PropStyles } from "../shared/types.js";
+import type { IconProps } from "./types.js";
+export declare const ICON_SIZE_STYLES: PropStyles<IconProps, "size">;

package/dist/hydrate/components-flex/icon/types.d.ts

@@ -0,0 +1,18 @@
+import type { ClickableProps, CommonProps } from "../props.js";
+import type { Properties } from "preact/src/jsx-csstype";
+export declare const ICON_SIZE: {
+	[key: string]: {
+		label: string
+		value: string
+	}
+};
+export declare const ICON_VARIANTS: {
+	[key: string]: any
+};
+export type IconProps = CommonProps & ClickableProps & {
+	variant: string
+	size?: keyof typeof ICON_SIZE
+	color?: Properties["color"]
+	width?: Properties["width"]
+	height?: Properties["height"]
+};

package/dist/hydrate/components-flex/image/styles.d.ts

@@ -0,0 +1,3 @@
+import type { PropStyles } from "../shared/types.js";
+import type { ImageProps } from "./types.js";
+export declare const IMAGE_ROUND_STYLES: PropStyles<ImageProps, "shape">;

package/dist/hydrate/components-flex/image/types.d.ts

@@ -0,0 +1,26 @@
+import type { Properties } from "csstype";
+import type { CommonProps, BorderProps, ClickableProps, AspectProps, RadiusProps, PaddingProps } from "../props.js";
+export declare const IMAGE_ROUND_SHAPE: {
+	readonly circle: "ラウンド / ミディアム"
+	readonly rounded: "ラウンド / スモール"
+	readonly square: "スクエア"
+};
+export declare const IMAGE_ASPECT_VARIANTS: {
+	"1/1": string
+	"2/1": string
+	"3/2": string
+	"4/3": string
+	"16/9": string
+	"16/5": string
+	"1/2": string
+	"2/3": string
+	"3/4": string
+	"9/16": string
+};
+export type ImageProps = CommonProps & ClickableProps & AspectProps & RadiusProps & PaddingProps & BorderProps & {
+	image?: string
+	width?: Properties["width"]
+	height?: Properties["height"]
+	alt?: string
+	shape?: keyof typeof IMAGE_ROUND_SHAPE
+};