@verdocs/web-sdk 1.2.0 → 1.4.0

package/dist/esm/verdocs-auth.entry.js

@@ -1,13 +1,205 @@
-import { r as registerInstance, c as createEvent, h } from './index-ade0ef1e.js';
-import { l as loadSession, a as authenticateUser, s as setSession } from './Auth-16761ea6.js';
-import { V as VerdocsEndpoint, g as getEndpoint, s as setActiveEndpoint } from './Token-b82a8ea3.js';
-import './index-2b1938ea.js';
+import { r as registerInstance, e as createEvent, h } from './index-ddbd60b5.js';
+import { l as loadSession, a as authenticateUser, s as setSession } from './Auth-4b21fced.js';
+import { g as getEndpoint, V as VerdocsEndpoint, s as setActiveEndpoint } from './Token-29eea56d.js';
+import './index-ef172650.js';
+import './index-97ec070b.js';
+import './buffer-es6-5cef4368.js';
 
-const verdocsAuthCss = "verdocs-auth{font-family:sans-serif;font-family:var(--verdocs-font);background-color:var(--verdocs-secondary-color);padding:40px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}verdocs-auth .login-form,verdocs-auth .signup-form{background:#f2f5fa;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:8px;-ms-flex-direction:column;flex-direction:column;display:-ms-flexbox;display:flex;padding:20px;width:300px;max-width:100%}verdocs-auth .logo{margin:20px 0 30px;width:128px;max-width:100%}verdocs-auth h3{text-align:center;font-weight:400;font-size:16px;line-height:1.75;margin:0}verdocs-auth h4{text-align:center;font-weight:400;font-size:14px;line-height:1.43;margin:0}verdocs-auth .status-result{display:none}verdocs-auth .status-result.debug{white-space:pre-wrap;font-size:14px;background:#fff;padding:10px;display:block;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}verdocs-auth form{width:100%}verdocs-auth verdocs-text-input{margin-bottom:10px}";
+// TODO
+
+var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (undefined && undefined.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var getNotifications = function () { return __awaiter(void 0, void 0, void 0, function () {
+    return __generator(this, function (_a) {
+        return [2 /*return*/, getEndpoint()
+                .api.get('/notifications')
+                .then(function (r) { return r.data; })];
+    });
+}); };
+
+/**
+ * Get the user's available profiles. The current profile will be marked with `current: true`.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const profiles = await Profiles.getProfiles()
+ * ```
+ */
+var getProfiles = function () {
+    return getEndpoint()
+        .api.get('/profiles')
+        .then(function (r) { return r.data; });
+};
+/**
+ * Get a list of system roles.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const roles = await Profiles.getRoles();
+ * ```
+ */
+var getRoles = function () {
+    return getEndpoint()
+        .api.get('/roles')
+        .then(function (r) { return r.data; });
+};
+/**
+ * Get a list of system roles.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const permissions = await Profiles.getPermissions();
+ * ```
+ */
+var getPermissions = function () {
+    return getEndpoint()
+        .api.get('/permissions')
+        .then(function (r) { return r.data; });
+};
+/**
+ * Create a profile. If the caller does not have a "current" profile set, the new profile will be made current.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const newProfile = await Profiles.createProfile({ first_name: 'FIRST', last_name: 'LAST', email: 'EMAIL' });
+ * ```
+ */
+var createProfile = function (params) {
+    return getEndpoint()
+        .api.post('/profiles', params)
+        .then(function (r) { return r.data; });
+};
+/**
+ * Get a profile. The caller must have admin access to the given profile.
+ * TODO: Add a "public" profile endpoint for public pages
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const profile = await Profiles.getProfile('PROFILEID');
+ * ```
+ */
+var getProfile = function (profileId) {
+    return getEndpoint()
+        .api.get("/profiles/".concat(profileId))
+        .then(function (r) { return r.data; });
+};
+/**
+ * Get a profile's permissions. The caller must have admin access to the given profile.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const permissions = await Profiles.getProfilePermissions('PROFILEID');
+ * ```
+ */
+var getProfilePermissions = function (profileId) {
+    return getEndpoint()
+        .api.get("/profiles/".concat(profileId, "/permissions"))
+        .then(function (r) { return r.data; });
+};
+/**
+ * Get a profile's groups.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const groups = await Profiles.getProfileGroups('PROFILEID');
+ * ```
+ */
+var getProfileGroups = function (profileId) {
+    return getEndpoint()
+        .api.get("/profiles/".concat(profileId, "/groups"))
+        .then(function (r) { return r.data; });
+};
+/**
+ * Switch the caller's "current" profile. The current profile is used for permissions checking and profile_id field settings
+ * for most operations in Verdocs. It is important to select the appropropriate profile before calling other API functions.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const newProfile = await Profiles.switchProfile('PROFILEID');
+ * ```
+ */
+var switchProfile = function (profileId) {
+    return getEndpoint()
+        .api.post("/profiles/".concat(profileId, "/switch"))
+        .then(function (r) { return r.data; });
+};
+/**
+ * Update a profile. For future expansion, the profile ID to update is required, but currently this must also be the
+ * "current" profile for the caller.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * const newProfile = await Profiles.updateProfile('PROFILEID');
+ * ```
+ */
+var updateProfile = function (profileId, params) {
+    return getEndpoint()
+        .api.put("/profiles/".concat(profileId), params)
+        .then(function (r) { return r.data; });
+};
+/**
+ * Delete a profile. If the requested profile is the caller's curent profile, the next available profile will be selected.
+ *
+ * ```typescript
+ * import {Profiles} from '@verdocs/js-sdk/Users';
+ *
+ * await Profiles.deleteProfile('PROFILEID');
+ * ```
+ */
+var deleteProfile = function (profileId) {
+    return getEndpoint()
+        .api.delete("/profiles/".concat(profileId))
+        .then(function (r) { return r.data; });
+};
+
+const verdocsAuthCss = "verdocs-auth{font-family:\"Barlow\", sans-serif;background-color:#4c56cb;padding:40px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}verdocs-auth .login-form,verdocs-auth .signup-form{background:#f5f5fa;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border-radius:8px;-ms-flex-direction:column;flex-direction:column;display:-ms-flexbox;display:flex;padding:20px;width:300px;max-width:100%}verdocs-auth .logo{margin:20px 0 30px;width:128px;max-width:100%}verdocs-auth h3{text-align:center;font-weight:400;font-size:16px;line-height:1.75;margin:0}verdocs-auth h4{text-align:center;font-weight:400;font-size:14px;line-height:1.43;margin:0}verdocs-auth .status-result{display:none}verdocs-auth .status-result.debug{white-space:pre-wrap;font-size:14px;background:#fff;padding:10px;display:block;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}verdocs-auth form{width:100%}verdocs-auth verdocs-text-input{margin-bottom:10px}";
 
 const BASE_URL = 'https://stage-api.verdocs.com/';
 const SOURCE = 'verdocs-stage';
-let VerdocsAuth = class {
+const VerdocsAuth = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.authenticated = createEvent(this, "authenticated", 7);

package/dist/esm/verdocs-button.entry.js

@@ -0,0 +1,45 @@
+import { r as registerInstance, e as createEvent, h } from './index-ddbd60b5.js';
+
+const verdocsButtonCss = "verdocs-button button{font-family:\"Barlow\", sans-serif;text-transform:uppercase;-ms-flex-pack:center;justify-content:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;font-weight:700;cursor:pointer;margin:0}verdocs-button button .icon{margin:0 12px}verdocs-button button .icon svg{fill:#fff;display:block}verdocs-button button .label{padding:0 12px}verdocs-button button:disabled{cursor:none}verdocs-button button.small{height:34px;font-size:13px}verdocs-button button.small .icon{margin:0 4px}verdocs-button button.small .icon svg{margin:2px 0 0 0;height:20px}verdocs-button button.small .label{padding:0 4px}verdocs-button button.normal{height:44px;font-size:14px}verdocs-button button.normal .icon.start{margin:0 4px 0 8px}verdocs-button button.normal .icon.end{margin:0 8px 0 4px}verdocs-button button.normal .icon svg{margin:2px 0 0 0;height:22px}verdocs-button button.normal .label{padding:0 10px}verdocs-button button.medium{height:52px;font-size:16px}verdocs-button button.medium .icon.start{margin:0 0 0 18px}verdocs-button button.medium .icon.end{margin:0 18px 0 0}verdocs-button button.medium .icon svg{margin:2px 0 0 0;height:26px}verdocs-button button.medium .label{padding:0 20px}verdocs-button button.large{height:60px;font-size:20px}verdocs-button button.large .icon.start{margin:0 0 0 24px}verdocs-button button.large .icon.end{margin:0 24px 0 0}verdocs-button button.large .icon svg{margin:2px 0 0 0;height:32px}verdocs-button button.large .label{padding:0 34px}verdocs-button button.standard{background:#55bc81;border-radius:4px;outline:none;border:none;color:white}verdocs-button button.standard:disabled{background-color:#999999;cursor:default}verdocs-button button.standard:active:not([disabled]){-webkit-filter:brightness(110%);filter:brightness(110%)}verdocs-button button.text{color:#4c56cb;background:transparent;font-weight:500;padding:0 4px;outline:none;border:none}verdocs-button button.text:disabled{color:#999999;cursor:none}verdocs-button button.text:active:not([disabled]){-webkit-filter:brightness(130%);filter:brightness(130%)}verdocs-button button.text .icon svg{fill:#4c56cb}verdocs-button button.outline{border:1px solid #4c56cb;color:#4c56cb;outline:none;background:transparent;border-radius:4px;padding:0 20px}verdocs-button button.outline:disabled{color:#999999;cursor:none;border:1px solid #999999}verdocs-button button.outline:active{background:#4c56cb;color:white}verdocs-button button.outline .icon svg{fill:#4c56cb}";
+
+const VerdocsButton = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.press = createEvent(this, "press", 7);
+    /**
+     * If desired, a prefix icon for the button
+     */
+    this.startIcon = null;
+    /**
+     * If desired, a suffix icon for the button
+     */
+    this.endIcon = null;
+    /**
+     * The size (height) of the button.
+     */
+    this.size = 'normal';
+    /**
+     * The type of the button.
+     */
+    this.type = 'button';
+    /**
+     * The display variant of the button.
+     */
+    this.variant = 'standard';
+    /**
+     * Whether the button should be disabled.
+     */
+    this.disabled = false;
+  }
+  handleClick(e) {
+    e.preventDefault();
+    this.press.emit();
+  }
+  render() {
+    console.log('Rendering button', this.startIcon);
+    return (h("button", { disabled: this.disabled, type: this.type, onClick: e => this.handleClick(e), class: `${this.variant} ${this.size} ${this.type}` }, this.startIcon ? h("span", { class: "icon start", innerHTML: this.startIcon }) : null, h("span", { class: "label" }, this.label), this.endIcon ? h("span", { class: "icon end", innerHTML: this.endIcon }) : null));
+  }
+};
+VerdocsButton.style = verdocsButtonCss;
+
+export { VerdocsButton as verdocs_button };

package/dist/esm/verdocs-dropdown.entry.js

@@ -0,0 +1,76 @@
+import { r as registerInstance, e as createEvent, h, f as Host } from './index-ddbd60b5.js';
+import { c as createPopper } from './index-432c65a6.js';
+import './index-97ec070b.js';
+
+const SortDown = `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#50BE80"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M7 10l5 5 5-5H7z"/></svg>
+`;
+
+const verdocsDropdownCss = "verdocs-dropdown{font-family:\"Barlow\", sans-serif;display:block}verdocs-dropdown .arrow{width:32px;height:26px;background:#fff;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;border:1px solid #cccccc;-ms-flex-pack:center;justify-content:center}verdocs-dropdown .arrow svg{fill:#55bc81;-webkit-transition:0.3s;transition:0.3s}verdocs-dropdown .items{width:200px;display:none;z-index:10000;border-radius:5px;background:#33354c;border:1px solid #654dcb}verdocs-dropdown .items[data-show]{display:block}verdocs-dropdown .option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}verdocs-dropdown .option:hover{cursor:pointer;background:#55bc81}verdocs-dropdown .option[disabled]{color:#aaaaaa}verdocs-dropdown .option[disabled]:hover{color:#aaaaaa;cursor:inherit;background:transparent}verdocs-dropdown.open .items{display:block}verdocs-dropdown.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}";
+
+const VerdocsDropdown = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.optionSelected = createEvent(this, "optionSelected", 7);
+    /**
+     * The menu options to display.
+     */
+    this.options = [];
+  }
+  componentWillLoad() {
+    this.isOpen = !!this.open;
+  }
+  componentDidLoad() {
+    this.popper = createPopper(this.dropdownButton, this.dropdownMenu, { placement: 'bottom-start', modifiers: [{ name: 'offset', options: { offset: [0, 6] } }] });
+  }
+  handleSelectOption(option) {
+    this.isOpen = false;
+    this.optionSelected.emit(option);
+    this.hide();
+  }
+  // See https://popper.js.org/docs/v2/tutorial/
+  // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists
+  showDropdown() {
+    var _a, _b;
+    this.isOpen = true;
+    this.dropdownMenu.setAttribute('data-show', '');
+    this.dropdownMenu.removeAttribute('aria-hidden');
+    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.setOptions(options => ({
+      ...options,
+      modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }],
+    }));
+    (_b = this.popper) === null || _b === void 0 ? void 0 : _b.update();
+  }
+  handleHideDropdown(e) {
+    var _a, _b;
+    if (((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.localName) === 'button' && ((_b = e === null || e === void 0 ? void 0 : e.target) === null || _b === void 0 ? void 0 : _b.className) === 'arrow') {
+      // This event is fired when a menu element is clicked because the button "loses focus" then too
+      return;
+    }
+    this.hide();
+  }
+  toggleDropdown() {
+    if (this.isOpen) {
+      this.hide();
+    }
+    else {
+      this.showDropdown();
+    }
+  }
+  hide() {
+    var _a;
+    this.isOpen = false;
+    this.dropdownMenu.removeAttribute('data-show');
+    this.dropdownMenu.setAttribute('aria-hidden', 'true');
+    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.setOptions(options => ({
+      ...options,
+      modifiers: [...options.modifiers, { name: 'eventListeners', enabled: false }],
+    }));
+  }
+  render() {
+    var _a;
+    return (h(Host, { class: { storybook: !!(window === null || window === void 0 ? void 0 : window['STORYBOOK_ENV']), open: !!this.isOpen } }, h("button", { class: "arrow", innerHTML: SortDown, "aria-label": "Open Menu", onClick: () => this.toggleDropdown(), onBlur: e => this.handleHideDropdown(e), ref: el => (this.dropdownButton = el) }), h("div", { class: "items", "aria-hidden": !this.open, ref: el => (this.dropdownMenu = el) }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("button", { onClick: () => this.handleSelectOption(option), class: "option", disabled: option.disabled }, option.label))))));
+  }
+};
+VerdocsDropdown.style = verdocsDropdownCss;
+
+export { VerdocsDropdown as verdocs_dropdown };

package/dist/esm/verdocs-field-attachment.entry.js

@@ -0,0 +1,55 @@
+import { r as registerInstance, e as createEvent, h, f as Host } from './index-ddbd60b5.js';
+
+const Paperclip = `<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" />
+</svg>
+`;
+
+const verdocsFieldAttachmentCss = "verdocs-field-attachment{font-family:sans-serif;font-family:var(--verdocs-font);width:24px;height:24px;display:block;font-size:11px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-attachment span{width:20px;cursor:pointer}verdocs-field-attachment.required span{border:1px solid var(--verdocs-required-color)}verdocs-field-attachment.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
+
+const VerdocsFieldAttachment = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.fieldChange = createEvent(this, "fieldChange", 7);
+    /**
+     * Sets the tabIndex of the input element.
+     */
+    this.order = 1;
+    /**
+     * Sets the value of the input element.
+     */
+    this.value = '';
+    /**
+     * If true, the field will be marked required.
+     */
+    this.required = false;
+    /**
+     * Sets the disabled attribute of the input element.
+     */
+    this.disabled = false;
+  }
+  async focusField() {
+    this.handleShow();
+  }
+  handleShow() {
+    this.dialog = document.createElement('verdocs-upload-dialog');
+    this.dialog.open = true;
+    this.dialog.addEventListener('cancel', () => {
+      var _a;
+      console.log('cancel');
+      (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.remove();
+    });
+    document.addEventListener('done', e => {
+      var _a;
+      console.log('done', e);
+      (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.remove();
+    });
+    document.body.append(this.dialog);
+  }
+  render() {
+    return (h(Host, { class: { required: this.required } }, h("span", { innerHTML: Paperclip, onClick: () => this.handleShow() })));
+  }
+};
+VerdocsFieldAttachment.style = verdocsFieldAttachmentCss;
+
+export { VerdocsFieldAttachment as verdocs_field_attachment };

package/dist/esm/verdocs-field-checkbox.entry.js

@@ -0,0 +1,35 @@
+import { r as registerInstance, e as createEvent, h, f as Host } from './index-ddbd60b5.js';
+
+const verdocsFieldCheckboxCss = "@charset \"UTF-8\";verdocs-field-checkbox{font-family:sans-serif;font-family:var(--verdocs-font);font-size:11px;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-checkbox label>input[type=checkbox]{display:none}verdocs-field-checkbox label>input[type=checkbox]+*::before{content:\"\";display:block;vertical-align:bottom;width:14px;height:14px;border-radius:2px;border:1px solid rgba(0, 0, 0, 0.2);-ms-flex-negative:0;flex-shrink:0}verdocs-field-checkbox label>input[type=checkbox]:checked+*{color:var(--verdocs-primary-color)}verdocs-field-checkbox label>input[type=checkbox]:checked+*::before{content:\"✓\";color:white;text-align:center;background:var(--verdocs-primary-color);border-color:var(--verdocs-primary-color)}verdocs-field-checkbox.required label>input[type=checkbox]+*::before{border:1px solid var(--verdocs-required-color)}verdocs-field-checkbox.hide{display:none}verdocs-field-checkbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}";
+
+const VerdocsFieldCheckbox = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.fieldChange = createEvent(this, "fieldChange", 7);
+    /**
+     * Sets the tabIndex of the input element.
+     */
+    this.order = 1;
+    /**
+     * Sets the value of the input element.
+     */
+    this.value = false;
+    /**
+     * If true, the field will be marked required.
+     */
+    this.required = false;
+    /**
+     * Sets the disabled attribute of the input element.
+     */
+    this.disabled = false;
+  }
+  handleChange(e) {
+    this.fieldChange.emit(e.target.checked);
+  }
+  render() {
+    return (h(Host, { class: { required: this.required } }, h("label", null, h("input", { type: "checkbox", tabIndex: this.order, checked: this.value, disabled: this.disabled, required: this.required, onChange: e => this.handleChange(e) }), h("span", null))));
+  }
+};
+VerdocsFieldCheckbox.style = verdocsFieldCheckboxCss;
+
+export { VerdocsFieldCheckbox as verdocs_field_checkbox };