The <fb-company-slug> Component Documentation // Awes.IO

It is a component for converting text into URL (It uses the urlify library).

It can be located within the <form-builder> component, or can be used with v-model directive. You may provide a string from other form-builder text field to transform to subdomain with an input property

This component visually looks like:

fb-company-slug

Components

Example of using the component

<form-builder url="/api-url">
    <template slot-scope="fields">
        <fb-input name="company" label="Enter company name"></fb-input>
        <fb-company-slug name="slug" input="fields['company']"></fb-company-slug>
    </template>
</form-builder>

@vue @endvue

Component properties

Name	Type	Default	Description
name	`String`	`undefined`	Field identifier in the data object
id	`Number`	`undefined`	Sequence number within the <fb-multi-block> component
label	`String`	`''`	Text in the <label> element
domain	`String`	`'awescrm.de'`	Main domain
input	`String`	`undefined`	String to transofm into subdomain
maxlength	`Number`	`32`	Maximum length of the subdomain
enter-skip	`Boolean`	`false`	Skip field when switching by the `enter` button
focus	`Boolean`	`false`	Set focus on this field when loading a page
debounce	`Number`	`0`	Timout before saving data to store on user input

Component features

Component configuration

To override the default settings, please override them in AWES_CONFIG.

// Here are the default settings
const AWES_CONFIG = {
    companySlug: {
        domain: 'awescrm.de',
        length: 32,
        // Settings of the urlify library, read more here https://github.com/Gottox/node-urlify#browser-1
        ulrifyOptions: {
            spaces: '-',
            toLower: true,
            trim: true,
            addEToUmlauts: true,
            nonPrintable: '',
            failureOutput: ''
        }
    }
}