Component Configuration Options

fluid.defaults("component.name", {
    gradeNames: "fluid.modelComponent",
    // ...
});

fluid.defaults("component.name", {
    invokers: {
        inv1: {
            // ...
        },
        inv2: {
            // ...
        }
    }
    // ...
});

fluid.defaults("component.name", {
    members: {
        member1: "{that}.options.optionsValue",
        member2: "{theOther}.dom.otherSelector",
    },
    // ...
});

fluid.defaults("component.name", {
    events: {
        onSave: "preventable",
        onReady: null
    }
    //...
});

examples.myListener = function (number, condition) {
    console.log("Event listener received number " + number + " and condition " + condition);
};
<p>fluid.defaults("examples.eventedComponent", {
gradeNames: ["fluid.component"],
events: {
myEvent: null
},
listeners: {
"myEvent.myNamespace": "examples.myListener"
}
});

var myComp = examples.eventedComponent({
    listeners: {
        "myEvent.myNamespace": "examples.myOtherListener",
    }
});

1. the original defaults record,
2. the subcomponent record,
3. direct user options (supplied to a component creator function),
4. distributed options.

fluid.defaults("component.name", {
    components: {
        subcomponent1: {
            type: "component.subcomp1",
            options: {...}
        }
        // ...
    }
    // ...
});

fluid.defaults("component.name", {
    gradeNames: ["fluid.component"],
    distributeOptions: {
        namespace: "myDistribution",
        record: "another.grade.name",
        target: "{that target.grade.name}.options.gradeNames"
    }
    // ...
});

fluid.defaults("component.name", {
    mergePolicy: {
        option1: "noexpand",
        option2: "nomerge"
        // ...
    }
    // ...
});

fluid.defaults("component.name", {
    dynamicComponents: {
        dynamic1: {
            type: "component.subcomp1",
            source: "{context}.someArray",
            options: {
                // ...
            }
        }
        // ...
    }
    // ...
});

fluid.defaults("fluid.pager", {
    model: {
        pageIndex: undefined,
        pageSize: 10,
        totalRange: undefined
    }
    // ...
});

var myPager = fluid.pager(container, {
    model: {
        pageIndex: 1
    }
    // ...
});

fluid.defaults("fluid.tests.allChangeRecorder", {
    gradeNames: "fluid.tests.changeRecorder",
    modelListeners: {
        "": "{that}.record({change}.path, {change}.value, {change}.oldValue)"
    }
});

fluid.defaults("examples.volumeModelRelay", {
    gradeNames: ["fluid.modelComponent"],
    model: {
        volumeAsPercent: 95,
    },
    modelRelay: {
        source: "volumeAsPercent",
        target: "volumeAsFraction",
        singleTransform: {
            type: "fluid.transforms.linearScale",
            factor: 0.01
        }
    }
});

fluid.defaults("fluid.progress", {
    selectors: {
        displayElement: ".flc-progress",
        progressBar: ".flc-progress-bar",
        indicator: ".flc-progress-indicator",
        label: ".flc-progress-label",
        ariaElement: ".flc-progress-bar"
    }
    // ...
});

var myEdit = fluid.progress(container, {
    selectors: {
        indicator: "div.progress-indicator",
        label: "span.progress-label"
    }
    // ...
});

fluid.defaults("demo.initGridReorderer", {
    gradeNames: ["fluid.reorderGrid"],
    styles: {
        dragging: "demo-gridReorderer-dragging",
        avatar: "demo-gridReorderer-avatar",
        selected: "demo-gridReorderer-selected",
        dropMarker: "demo-gridReorderer-dropMarker"
    },
    disableWrap: true
});

fluid.defaults("cspace.header", {
    selectors: {
        menuItem: ".csc-header-menu-item",
        label: ".csc-header-link",
        searchBox: ".csc-header-searchBox",
        logout: ".csc-header-logout",
        user: ".csc-header-user",
        userName: ".csc-header-userName"
    },
    selectorsToIgnore: ["searchBox", "logout"]
    // ...
});

fluid.defaults("cspace.header", {
    selectors: {
        menuItem: ".csc-header-menu-item",
        label: ".csc-header-link",
        searchBox: ".csc-header-searchBox",
        logout: ".csc-header-logout",
        user: ".csc-header-user",
        userName: ".csc-header-userName"
    },
    repeatingSelectors: ["menuItem"]
    // ...
});

cspace.confirmationDialog.produceTree = function (that) {
    var tree = {
        // ...
    };
    return tree;
};
fluid.defaults("cspace.confirmationDialog", {
    produceTree: cspace.confirmationDialog.produceTree
    // ...
});

fluid.defaults("cspace.searchTips", {
    protoTree: {
        searchTips: {decorators: {"addClass": "{styles}.searchTips"}},
        title: {
            decorators: {"addClass": "{styles}.title"},
            messagekey: "searchTips-title"
        },
        expander: {
            repeatID: "instructions",
            type: "fluid.renderer.repeat",
            pathAs: "row",
            controlledBy: "messagekeys",
            tree: {
                messagekey: "${{row}}"
            }
        }
    }
    // ...
});

var searchTips = cspace.searchTips(container, {
    protoTree: {
        searchTips: {decorators: {"addClass": "{styles}.searchTips"}},
        title: {
            decorators: {"addClass": "{styles}.title"},
            messagekey: "searchTips-title"
        },
        expander: {
            repeatID: "instructions",
            type: "fluid.renderer.repeat",
            pathAs: "row",
            controlledBy: "messagekeys",
            tree: {
                messagekey: "${{row}}"
            }
        }
    },
    // ...
});

fluid.defaults("component.name", {
    resources: {
        headerTemplate: {
            href: "../templates/Header.html"
        },
        footerTemplate: {
            href: "../templates/Footer.html"
        }
    }
    // ...
});

var myComp = component.name(container, {
    resources: {
        footerTemplate: {
            href: "../templates/FrontPageFooter.html"
        }
    }
    // ...
});

fluid.defaults("cspace.searchToRelateDialog", {
    gradeNames: ["fluid.rendererComponent"],
    strings: {
        createNewButton: "Create",
        title: "Add Related %recordType Record",
        closeAlt: "close button",
        relationshipType: "Select relationship type:",
        createNew: "Create new record:",
        addButton: "Add to current record"
    }
    // ...
});

var myDialog = cspace.searchToRelateDialog(container, {
    strings: {
        relationshipType: "Select a relationship type from the list below:",
        createNew: "Create a new record:",
        addButton: "Add this record to the current record"
    }
    // ...
});

fluid.defaults("fluid.tableOfContents.levels", {
    rendererFnOptions: {
        noexpand: true
    }
    // ...
});

var recEditor = cspace.recordEditor(container, {
    rendererFnOptions: {
        rendererTargetSelector: "dialog"
    }
    // ...
});

fluid.defaults("cspace.searchBox", {
    rendererOptions: {
        autoBind: false
    }
    // ...
});

var search = cspace.searchBox(container, {
    rendererOptions: {
        autoBind: true
    }
    // ...
});

fluid.defaults("cspace.login", {
    gradeNames: ["fluid.rendererComponent"],
    renderOnInit: true
    // ...
});

var login = cspace.login(container, {
    renderOnInit: false
    // ...
});