cePropsDefinition -> ceProps

elements/index.d.ts

@@ -1591,7 +1591,7 @@ export interface SvelteHTMLElements {
 	'svelte:fragment': { slot?: string };
 	'svelte:options': {
 		tag?: string | null | undefined;
-		cePropsDefinition?: Record<string, { attribute?: string; reflect?: boolean; type?: 'String' | 'Boolean' | 'Number' | 'Array' | 'Object' }> | undefined,
+		ceProps?: Record<string, { attribute?: string; reflect?: boolean; type?: 'String' | 'Boolean' | 'Number' | 'Array' | 'Object' }> | undefined,
 		[name: string]: any
 	};
 	'svelte:head': { [name: string]: any };

src/compiler/compile/Component.ts

@@ -45,7 +45,7 @@ interface ComponentOptions {
 	immutable?: boolean;
 	accessors?: boolean;
 	preserveWhitespace?: boolean;
-	cePropsDefinition?: Record<string, { reflect?: boolean; type?: 'String' | 'Boolean' | 'Number' | 'Array' | 'Object', attribute?: string }>;
+	ceProps?: Record<string, { reflect?: boolean; type?: 'String' | 'Boolean' | 'Number' | 'Array' | 'Object', attribute?: string }>;
 }
 
 const regex_leading_directory_separator = /^[/\\]/;
@@ -1574,11 +1574,11 @@ function process_component_options(component: Component, nodes) {
 						break;
 					}
 
-					case 'cePropsDefinition': {
+					case 'ceProps': {
-						const error = () => component.error(attribute, compiler_errors.invalid_cePropsDefinition_attribute);
+						const error = () => component.error(attribute, compiler_errors.invalid_ceProps_attribute);
 						const { value } = attribute;
 						const chunk = value[0];
-						component_options.cePropsDefinition = {};
+						component_options.ceProps = {};
 
 						if (!chunk) {
 							break;
@@ -1593,7 +1593,7 @@ function process_component_options(component: Component, nodes) {
 							if (property.type !== 'Property' || property.computed || property.key.type !== 'Identifier' || property.value.type !== 'ObjectExpression') {
 								return error();
 							}
-							component_options.cePropsDefinition[property.key.name] = {};
+							component_options.ceProps[property.key.name] = {};
 							for (const prop of property.value.properties) {
 								if (prop.type !== 'Property' || prop.computed || prop.key.type !== 'Identifier' || prop.value.type !== 'Literal') {
 									return error();
@@ -1605,7 +1605,7 @@ function process_component_options(component: Component, nodes) {
 								) {
 									return error();
 								}
-								component_options.cePropsDefinition[property.key.name][prop.key.name] = prop.value.value;
+								component_options.ceProps[property.key.name][prop.key.name] = prop.value.value;
 							}
 						}
 

src/compiler/compile/compiler_errors.ts

@@ -206,9 +206,9 @@ export default {
 		code: 'invalid-tag-attribute',
 		message: "'tag' must be a string literal"
 	},
-	invalid_cePropsDefinition_attribute: {
+	invalid_ceProps_attribute: {
-		code: 'invalid-cePropsDefinition-attribute',
+		code: 'invalid-ceProps-attribute',
-		message: "'cePropsDefinition' must be a statically analyzable object literal of the form " +
+		message: "'ceProps' must be a statically analyzable object literal of the form " +
 			"'{ prop: { attribute?: string; type?: 'String' | 'Boolean' | 'Number' | 'Array' | 'Object', reflect?: boolean; } }'"
 	},
 	invalid_namespace_property: (namespace: string, suggestion?: string) => ({

src/compiler/compile/render_dom/index.ts

@@ -544,7 +544,7 @@ export default function dom(
 
 	if (options.customElement && component.tag != null) {
 		const props_str = writable_props.reduce((def, prop) => {
-			def[prop.export_name] = component.component_options.cePropsDefinition?.[prop.export_name] || {};
+			def[prop.export_name] = component.component_options.ceProps?.[prop.export_name] || {};
 			if (prop.is_boolean && !def[prop.export_name].type) {
 				def[prop.export_name].type = 'Boolean';
 			}

test/custom-elements/samples/camel-case-attribute/main.svelte

@@ -1,6 +1,6 @@
 <svelte:options
 	tag="custom-element"
-	cePropsDefinition={{
+	ceProps={{
 		camelCase: { attribute: "camel-case" },
 		camelCase2: { reflect: true },
 		anArray: { attribute: "an-array", type: "Array", reflect: true },

test/custom-elements/samples/ce-options-valid/main.svelte

@@ -1,6 +1,6 @@
 <svelte:options
 	tag="custom-element"
-	cePropsDefinition={{
+	ceProps={{
 		name: { reflect: false, type: "String", attribute: "name" },
 	}}
 />

test/custom-elements/samples/reflect-attributes/main.svelte

@@ -1,6 +1,6 @@
 <svelte:options
 	tag="custom-element"
-	cePropsDefinition={{ red: { reflect: true, type: "Boolean" } }}
+	ceProps={{ red: { reflect: true, type: "Boolean" } }}
 />
 
 <script>

test/custom-elements/samples/reflect-attributes/my-widget.svelte

@@ -1,7 +1,4 @@
-<svelte:options
+<svelte:options tag="my-widget" ceProps={{ red: { reflect: true } }} />
-	tag="my-widget"
-	cePropsDefinition={{ red: { reflect: true } }}
-/>
 
 <script>
 	export let red = false;