cePropsDefinition -> ceProps

pull/8457/head
Simon Holthausen 3 years ago
parent a31d4a58c2
commit 931b7f556d

@ -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 };

@ -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': {
const error = () => component.error(attribute, compiler_errors.invalid_cePropsDefinition_attribute);
case 'ceProps': {
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;
}
}

@ -206,9 +206,9 @@ export default {
code: 'invalid-tag-attribute',
message: "'tag' must be a string literal"
},
invalid_cePropsDefinition_attribute: {
code: 'invalid-cePropsDefinition-attribute',
message: "'cePropsDefinition' must be a statically analyzable object literal of the form " +
invalid_ceProps_attribute: {
code: 'invalid-ceProps-attribute',
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) => ({

@ -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';
}

@ -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 },

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

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

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

Loading…
Cancel
Save