@contributte/datagrid 0.0.0-20250531-d4580b9

package/assets/types/ajax.d.ts

@@ -0,0 +1,143 @@
+import { EventDetail, EventListener, EventMap } from ".";
+import { Datagrid } from "..";
+
+export interface BaseRequestParams {
+	method: "GET" | "HEAD" | "POST" | "PUT" | "DELETE" | "CONNECT" | "OPTIONS" | "TRACE" | "PATCH" | string;
+	url: string;
+}
+
+export interface RequestParams<D = any> extends BaseRequestParams {
+	data: D;
+}
+
+export interface DatagridPayload {
+	_datagrid_name?: string;
+	_datagrid_toggle_detail?: string
+	_datagrid_inline_editing?: boolean;
+	_datagrid_inline_adding?: boolean;
+	_datagrid_inline_edited?: boolean;
+	_datagrid_inline_edit_cancel?: boolean;
+	_datagrid_url?: boolean;
+	_datagrid_sort?: Record<string, string>;
+	_datagrid_tree?: string;
+	_datagrid_editable_new_value?: string;
+	_datagrid_redraw_item_id?: string;
+	_datagrid_redraw_item_class?: string;
+	_datagrid_init?: boolean;
+	non_empty_filters?: string[];
+}
+
+export interface DatagridState {
+	"grid-page": number | null,
+	"grid-perPage": number,
+	// TODO
+	"grid-sort": any | null,
+	"grid-filter": any | null
+}
+
+export type Payload<P = DatagridPayload, S = DatagridState> = P & {
+	snippets?: Record<string, string>;
+	redirect?: string;
+	state: S;
+};
+
+export interface Response {
+	headers: Record<string, string | (string[])> | Headers;
+	status: number;
+}
+
+export interface BeforeEventDetail<D = {}> {
+	params: RequestParams<D>;
+}
+
+export interface InteractEventDetail<E extends HTMLElement = HTMLElement> {
+	element: E;
+}
+
+export interface SuccessEventDetail<P = DatagridPayload, R extends Response = Response> {
+	params: BaseRequestParams;
+	payload: Payload<P>;
+	response: Response;
+}
+
+export interface CompleteEventDetail<P = DatagridPayload, R extends Response = Response> {
+	params: BaseRequestParams;
+	payload: Payload<P>;
+	response: Response;
+}
+
+export interface ErrorEventDetail<E extends Error = Error, R extends Response = Response> {
+	params: BaseRequestParams;
+	response?: Response;
+	error?: E;
+}
+
+export interface AjaxEventMap extends EventMap {
+	before: CustomEvent<BeforeEventDetail>;
+	interact: CustomEvent<InteractEventDetail>;
+	snippetUpdate: CustomEvent<InteractEventDetail>;
+	success: CustomEvent<SuccessEventDetail>;
+	complete: CustomEvent<CompleteEventDetail>;
+	error: CustomEvent<ErrorEventDetail>;
+}
+
+export interface Ajax<C extends EventTarget = EventTarget, G extends Datagrid = Datagrid> extends EventTarget {
+	client: C;
+
+	/**
+	 * Initialization of the Ajax instance, called in createDatagrids().
+	 * @return this
+	 */
+	onInit(): this;
+
+	/**
+	 * Initializes a Datagrid instance.
+	 * @param grid The Datagrid instance
+	 */
+	onDatagridInit?(grid: G): void;
+
+	/**
+	 * Sends a request to the server.
+	 */
+	request<D = {}, P = DatagridPayload>(args: RequestParams<D>): Promise<P>;
+
+	/**
+	 * Submits a form
+	 */
+	submitForm<E extends HTMLFormElement = HTMLFormElement, P = Payload>(element: E): Promise<P>;
+
+	/**
+	 * Shortcut for dispatchEvent
+	 * @internal
+	 */
+	dispatch<K extends string, M extends AjaxEventMap = AjaxEventMap>(
+		type: K,
+		detail: K extends keyof M ? EventDetail<M[K]> : any,
+		options?: boolean
+	): boolean;
+
+	/**
+	 * Note: For events dispatched directly from the underlying client, {@see Ajax.client}}
+	 **/
+	addEventListener<K extends keyof M, M extends AjaxEventMap = AjaxEventMap>(
+		type: K,
+		listener: EventListener<this, M[K]>,
+		options?: boolean | AddEventListenerOptions
+	): void;
+
+	/**
+	 * Note: For events dispatched directly from the underlying client, {@see Ajax.client}}
+	 **/
+	removeEventListener<K extends keyof M, M extends AjaxEventMap = AjaxEventMap>(
+		type: K,
+		listener: EventListener<this, M[K]>,
+		options?: boolean | AddEventListenerOptions
+	): void;
+
+	/**
+	 * @internal
+	 */
+	dispatchEvent<K extends string, M extends AjaxEventMap = AjaxEventMap>(
+		event: K extends keyof M ? M[K] : CustomEvent
+	): boolean;
+}

package/assets/types/datagrid.d.ts

@@ -0,0 +1,31 @@
+import { Datagrid, Datagrids } from "..";
+import { EventMap } from ".";
+
+export interface DatagridEventDetail {
+	datagrid: Datagrid;
+}
+
+export interface DatagridEventMap extends EventMap {
+	beforeInit: CustomEvent<DatagridEventDetail>;
+	afterInit: CustomEvent<DatagridEventDetail>;
+}
+
+export interface DatagridPlugin {
+	onInit?(datagrids: Datagrids): void;
+
+	onDatagridInit?(datagrid: Datagrid): boolean;
+}
+
+export interface DatagridOptions {
+	confirm(this: Datagrid, message: string): boolean;
+
+	// Returning null will skip this datagrid
+	resolveDatagridName: (this: Datagrid, datagrid: HTMLElement) => string | null;
+	plugins: DatagridPlugin[];
+}
+
+export interface DatagridsOptions {
+	datagrid: Partial<DatagridOptions>;
+	selector: string;
+	root: HTMLElement | string;
+}

package/assets/types/index.d.ts

@@ -0,0 +1,41 @@
+import { Happy } from "../integrations";
+import TomSelect from "tom-select";
+
+export interface Nette {
+	initForm: (form: HTMLFormElement) => void;
+}
+
+export type Constructor<T> = new (...args: any[]) => T;
+
+export type KeysOf<T, TVal = any> = { [P in keyof T]: TVal; }
+
+export interface ExtendedWindow extends Window {
+	jQuery?: any;
+	Nette?: Nette;
+	TomSelect?: Constructor<TomSelect>;
+	happy?: Happy;
+}
+
+// https://github.com/naja-js/naja/blob/384d298a9199bf778985d1bcf5747fe8de305b22/src/utils.ts
+type EventListenerFunction<ET extends EventTarget, E extends Event> = (
+	this: ET,
+	event: E
+) => boolean | void | Promise<void>;
+
+interface EventListenerObject<E extends Event> {
+	handleEvent(event: E): void | Promise<void>;
+}
+
+export type EventListener<ET extends EventTarget, E extends Event> =
+	| EventListenerFunction<ET, E>
+	| EventListenerObject<E>
+	| null;
+
+export type EventDetail<E = CustomEvent> = E extends CustomEvent<infer D> ? D : never;
+
+export interface EventMap extends Record<string, CustomEvent> {
+}
+
+export * from "./datagrid";
+export * from "./integrations";
+export * from "./ajax";

package/assets/types/integrations.d.ts

@@ -0,0 +1,15 @@
+import { Datagrid } from "..";
+
+export interface Sortable {
+	initSortable(datagrid: Datagrid): void;
+
+	initSortableTree(datagrid: Datagrid): void;
+}
+
+export interface Selectpicker {
+	initSelectpickers(elements: HTMLElement[], datagrid: Datagrid): void;
+}
+
+export interface Datepicker {
+	initDatepickers(elements: HTMLInputElement[], datagrid: Datagrid): void;
+}

package/assets/utils.ts

@@ -0,0 +1,179 @@
+import { Datagrid } from "./datagrid";
+import { ExtendedWindow } from "./types";
+
+export function isPromise<T = any>(p: any): p is Promise<T> {
+	return typeof p === "object" && typeof p.then === "function";
+}
+
+export function isInKeyRange(e: KeyboardEvent, min: number, max: number): boolean {
+	const code = e.key.length === 1 ? e.key.charCodeAt(0) : 0;
+	return code >= min && code <= max;
+}
+
+export function isEnter(e: KeyboardEvent): boolean {
+	return e.key === "Enter";
+}
+
+export function isEsc(e: KeyboardEvent): boolean {
+	return e.key === "Escape";
+}
+
+export function isFunctionKey(e: KeyboardEvent): boolean {
+	return e.key.length === 2 && e.key.startsWith("F");
+}
+
+export function window(): ExtendedWindow {
+	return (window ?? {}) as unknown as ExtendedWindow;
+}
+
+export function slideDown(element: HTMLElement, cb?: (nextStateShown: boolean) => unknown) {
+	element.style.height = 'auto';
+
+	let height = element.clientHeight + "px";
+
+	element.style.height = '0px';
+
+	setTimeout(function () {
+		element.style.height = height;
+		cb?.(true);
+	}, 0);
+}
+
+export function slideUp(element: HTMLElement, cb?: (nextStateShown: boolean) => unknown) {
+	element.style.height = '0px';
+
+	setTimeout(() => {
+		cb?.(false);
+	}, 250); // TODO
+}
+
+export function slideToggle(element: HTMLElement, isVisible: boolean, cb?: (nextStateShown: boolean) => unknown) {
+	if (!isVisible) {
+		slideDown(element, cb);
+	} else {
+		slideUp(element, cb);
+	}
+}
+
+export function attachSlideToggle(element: HTMLElement, control: HTMLElement, cb?: (nextStateShown: boolean) => unknown) {
+	if (!control.classList.contains("datagrid--slide-toggle")) {
+		let sliding = false;
+		control.classList.add("datagrid--slide-toggle");
+
+		slideDown(element, cb);
+
+		control.addEventListener('click', () => {
+			if (sliding) return;
+			sliding = true;
+			slideToggle(element, control.classList.contains('is-active'), (active) => {
+				sliding = false
+				if (active) {
+					control.classList.add("is-active");
+				} else {
+					control.classList.remove("is-active");
+				}
+			});
+		});
+	}
+}
+
+export function qs(params: Record<string, any | any[]>, prefix: string = ""): string {
+	const encodedParams = [];
+
+	for (const _key in params) {
+		const value = params[_key];
+		// Cannot do !value as that would also exclude valid negative values such as 0 or false
+		if (value === null || value === undefined) continue;
+
+		const key = prefix ? `${prefix}[${_key}]` : _key;
+
+		// Skip empty strings
+		if (typeof value === "string" && value.trim().length < 1) continue;
+
+		if (typeof value === "object") {
+			const nestedParams = qs(value, key);
+			// Don't include if object is empty
+			if (nestedParams.length >= 1) {
+				encodedParams.push(nestedParams);
+			}
+
+			continue;
+		}
+
+		encodedParams.push(`${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
+	}
+
+	return encodedParams.join("&").replace(/&+$/gm, "").replace(/&*$/, "");
+}
+
+export function calculateCellLines(el: HTMLElement) {
+	const cellPadding = el.style.padding ? parseInt(el.style.padding.replace(/[^-\d\.]/g, ""), 10) : 0;
+	const cellHeight = el.getBoundingClientRect().height;
+	const lineHeight = Math.round(parseFloat(el.style.lineHeight ?? "0"));
+	const cellLines = Math.round((cellHeight - 2 * cellPadding) / lineHeight);
+
+	return cellLines;
+}
+
+// A little better debounce ;)
+export function debounce<TArgs, TFun extends (...args: TArgs[]) => unknown | Promise<unknown>>(
+	fn: TFun,
+	slowdown: number = 200
+): (...args: TArgs[]) => void {
+	let timeout: ReturnType<typeof setTimeout> | null = null;
+	let blockedByPromise: boolean = false;
+
+	return (...args) => {
+		if (blockedByPromise) return;
+
+		timeout && clearTimeout(timeout);
+		timeout = setTimeout(() => {
+			const result = fn(...args);
+
+			if (isPromise(result)) {
+				blockedByPromise = true;
+				result.finally(() => {
+					blockedByPromise = false;
+				});
+			}
+		}, slowdown);
+	};
+}
+
+export function defaultDatagridNameResolver(this: Datagrid, datagrid: HTMLElement) {
+	// This attribute is not present by default, though if you're going to use this library
+	// it's recommended to add it, because when not present, the fallback way is to parse the datagrid-<name> class,
+	// which is definitely far from reliable. Alternatively (mainly in case of a custom datagrid class),
+	// you can pass your own resolveDatagridName function to the option.
+	const attrName = datagrid.getAttribute("data-datagrid-name");
+	if (attrName) return attrName;
+
+	console.warn(
+		"Deprecated name resolution for datagrid",
+		datagrid,
+		": Please add a data-datagrid-name attribute instead!\n" +
+		"Currently, the Datagrid library relies on matching the name from the 'datagrid-[name]' class, which is unreliable " +
+		"and may cause bugs if the default class names are not used (eg. if you add a datagrid-xx class, or change the name class completely!)\n" +
+		"Alternatively, you can customize the name resolution with the `resolveDatagridName` option. See TBD for more info." // TODO
+	);
+
+	const classes = datagrid.classList.value.split(" ");
+
+	// Returns the first datagrid-XXX match
+	for (const className of classes) {
+		if (!className.startsWith("datagrid-")) continue;
+
+		const [, ...split] = className.split("-");
+		const name = split.join("-");
+
+		// In case nothing actually follows the prefix (className = "datagrid-")
+		if (name.length < 1) {
+			console.error(`Failed to resolve datagrid name - ambigious class name '${className}'`);
+			return null;
+		}
+
+		return name;
+	}
+
+	return null;
+}

package/dist/datagrid-full.css

@@ -0,0 +1 @@
+.datepicker{width:-moz-min-content;width:min-content}.datepicker:not(.active){display:none}.datepicker-dropdown{padding-top:4px;position:absolute;z-index:1000}.datepicker-dropdown.datepicker-orient-top{padding-bottom:4px;padding-top:0}.datepicker-picker{background-color:#fff;border-radius:.375rem;display:flex;flex-direction:column}.datepicker-dropdown .datepicker-picker{box-shadow:0 .5rem 1rem rgba(0,0,0,.15)}.datepicker-main{flex:auto;padding:2px}.datepicker-footer{background-color:#f8f9fa;box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}.datepicker-title{background-color:#f8f9fa;box-shadow:inset 0 -1px 1px rgba(0,0,0,.1);font-weight:700;padding:.375rem .75rem;text-align:center}.datepicker-controls{display:flex}.datepicker-header .datepicker-controls{padding:2px 2px 0}.datepicker-controls .btn{background-color:#fff;border-color:#f8f9fa}.datepicker-controls .btn:focus,.datepicker-controls .btn:hover{background-color:#e2e6ea;border-color:#dbe0e5;color:#000}.datepicker-controls .btn:focus{box-shadow:0 0 0 .25rem hsla(210,2%,83%,.5)}.datepicker-controls .btn:disabled{background-color:#f8f9fa;border-color:#f8f9fa;color:#000}.datepicker-controls .btn:not(:disabled):active{background-color:#dbe0e5;border-color:#d4dae0;color:#000}.datepicker-controls .btn:not(:disabled):active:focus{box-shadow:0 0 0 .25rem hsla(210,2%,83%,.5)}.datepicker-header .datepicker-controls .btn{border-color:transparent;font-weight:700}.datepicker-footer .datepicker-controls .btn{border-radius:.25rem;flex:auto;font-size:.875rem;margin:calc(.375rem - 1px) .375rem}.datepicker-controls .view-switch{flex:auto}.datepicker-controls .next-button,.datepicker-controls .prev-button{flex:0 0 14.2857142857%;padding-left:.375rem;padding-right:.375rem}.datepicker-controls .next-button.disabled,.datepicker-controls .prev-button.disabled{visibility:hidden}.datepicker-grid,.datepicker-view{display:flex}.datepicker-view{align-items:stretch;width:15.75rem}.datepicker-grid{flex:auto;flex-wrap:wrap}.datepicker .days{display:flex;flex:auto;flex-direction:column}.datepicker .days-of-week{display:flex}.datepicker .week-numbers{display:flex;flex:0 0 9.6774193548%;flex-direction:column}.datepicker .weeks{align-items:stretch;display:flex;flex:auto;flex-direction:column}.datepicker span{-webkit-touch-callout:none;align-items:center;border-radius:.375rem;cursor:default;display:flex;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.datepicker .dow{font-size:.9375rem;font-weight:700;height:1.5rem}.datepicker .week{color:#dee2e6;flex:auto;font-size:.875rem}.datepicker .days .dow,.datepicker-cell{flex-basis:14.2857142857%}.datepicker-cell{height:2.25rem}.datepicker-cell:not(.day){flex-basis:25%;height:4.5rem}.datepicker-cell:not(.disabled):hover{background-color:#f9f9f9;cursor:pointer}.datepicker-cell.focused:not(.selected){background-color:#e2e6ea}.datepicker-cell.selected,.datepicker-cell.selected:hover{background-color:#0d6efd;color:#fff;font-weight:600}.datepicker-cell.disabled{color:rgba(33,37,41,.5)}.datepicker-cell.next:not(.disabled),.datepicker-cell.prev:not(.disabled){color:#6c757d}.datepicker-cell.next.selected,.datepicker-cell.prev.selected{color:#e6e6e6}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today){background-color:#f8f9fa;border-radius:0}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover{background-color:#f1f3f5}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused{background-color:#e2e6ea}.datepicker-cell.today:not(.selected){background-color:#20c997}.datepicker-cell.today:not(.selected):not(.disabled){color:#fff}.datepicker-cell.today.focused:not(.selected){background-color:#1fc493}.datepicker-cell.range-end:not(.selected),.datepicker-cell.range-start:not(.selected){background-color:#6c757d;color:#fff}.datepicker-cell.range-end.focused:not(.selected),.datepicker-cell.range-start.focused:not(.selected){background-color:#69727a}.datepicker-cell.range-start:not(.range-end){border-radius:.375rem 0 0 .375rem}.datepicker-cell.range-end:not(.range-start){border-radius:0 .375rem .375rem 0}.datepicker-cell.range{background-color:#e9ecef;border-radius:0}.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover{background-color:#e2e6ea}.datepicker-cell.range.disabled{color:#ced4db}.datepicker-cell.range.focused{background-color:#dbe0e5}.datepicker-input.in-edit{border-color:#73acfe}.datepicker-input.in-edit:active,.datepicker-input.in-edit:focus{box-shadow:0 0 .25em .25em rgba(115,172,254,.2)}.ts-control{border:1px solid #d0d0d0;border-radius:3px;box-shadow:none;box-sizing:border-box;display:flex;flex-wrap:wrap;overflow:hidden;padding:8px;position:relative;width:100%;z-index:1}.ts-wrapper.multi.has-items .ts-control{padding:6px 8px 3px}.full .ts-control{background-color:#fff}.disabled .ts-control,.disabled .ts-control *{cursor:default!important}.focus .ts-control{box-shadow:none}.ts-control>*{display:inline-block;vertical-align:baseline}.ts-wrapper.multi .ts-control>div{background:#f2f2f2;border:0 solid #d0d0d0;color:#303030;cursor:pointer;margin:0 3px 3px 0;padding:2px 6px}.ts-wrapper.multi .ts-control>div.active{background:#e8e8e8;border:0 solid #cacaca;color:#303030}.ts-wrapper.multi.disabled .ts-control>div,.ts-wrapper.multi.disabled .ts-control>div.active{background:#fff;border:0 solid #fff;color:#7d7d7d}.ts-control>input{background:none!important;border:0!important;box-shadow:none!important;display:inline-block!important;flex:1 1 auto;line-height:inherit!important;margin:0!important;max-height:none!important;max-width:100%!important;min-height:0!important;min-width:7rem;padding:0!important;text-indent:0!important;-webkit-user-select:auto!important;-moz-user-select:auto!important;user-select:auto!important}.ts-control>input::-ms-clear{display:none}.ts-control>input:focus{outline:none!important}.has-items .ts-control>input{margin:0 4px!important}.ts-control.rtl{text-align:right}.ts-control.rtl.single .ts-control:after{left:15px;right:auto}.ts-control.rtl .ts-control>input{margin:0 4px 0 -2px!important}.disabled .ts-control{background-color:#fafafa;opacity:.5}.input-hidden .ts-control>input{left:-10000px;opacity:0;position:absolute}.ts-dropdown{background:#fff;border:1px solid #d0d0d0;border-radius:0 0 3px 3px;border-top:0;box-shadow:0 1px 3px rgba(0,0,0,.1);box-sizing:border-box;left:0;margin:.25rem 0 0;position:absolute;top:100%;width:100%;z-index:10}.ts-dropdown [data-selectable]{cursor:pointer;overflow:hidden}.ts-dropdown [data-selectable] .highlight{background:rgba(125,168,208,.2);border-radius:1px}.ts-dropdown .create,.ts-dropdown .no-results,.ts-dropdown .optgroup-header,.ts-dropdown .option{padding:5px 8px}.ts-dropdown .option,.ts-dropdown [data-disabled],.ts-dropdown [data-disabled] [data-selectable].option{cursor:inherit;opacity:.5}.ts-dropdown [data-selectable].option{cursor:pointer;opacity:1}.ts-dropdown .optgroup:first-child .optgroup-header{border-top:0}.ts-dropdown .optgroup-header{background:#fff;color:#303030;cursor:default}.ts-dropdown .active{background-color:#f5fafd;color:#495c68}.ts-dropdown .active.create{color:#495c68}.ts-dropdown .create{color:rgba(48,48,48,.5)}.ts-dropdown .spinner{display:inline-block;height:30px;margin:5px 8px;width:30px}.ts-dropdown .spinner:after{animation:lds-dual-ring 1.2s linear infinite;border-color:#d0d0d0 transparent;border-radius:50%;border-style:solid;border-width:5px;content:" ";display:block;height:24px;margin:3px;width:24px}@keyframes lds-dual-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ts-dropdown-content{max-height:200px;overflow:hidden auto;scroll-behavior:smooth}.ts-wrapper.plugin-drag_drop .ts-dragging{color:transparent!important}.ts-wrapper.plugin-drag_drop .ts-dragging>*{visibility:hidden!important}.plugin-checkbox_options:not(.rtl) .option input{margin-right:.5rem}.plugin-checkbox_options.rtl .option input{margin-left:.5rem}.plugin-clear_button{--ts-pr-clear-button:1em}.plugin-clear_button .clear-button{background:transparent!important;cursor:pointer;margin-right:0!important;opacity:0;position:absolute;right:2px;top:50%;transform:translateY(-50%);transition:opacity .5s}.plugin-clear_button.form-select .clear-button,.plugin-clear_button.single .clear-button{right:max(var(--ts-pr-caret),8px)}.plugin-clear_button.focus.has-items .clear-button,.plugin-clear_button:not(.disabled):hover.has-items .clear-button{opacity:1}.ts-wrapper .dropdown-header{background:color-mix(#fff,#d0d0d0,85%);border-bottom:1px solid #d0d0d0;border-radius:3px 3px 0 0;padding:10px 8px;position:relative}.ts-wrapper .dropdown-header-close{color:#303030;font-size:20px!important;line-height:20px;margin-top:-12px;opacity:.4;position:absolute;right:8px;top:50%}.ts-wrapper .dropdown-header-close:hover{color:#000}.plugin-dropdown_input.focus.dropdown-active .ts-control{border:1px solid #d0d0d0;box-shadow:none}.plugin-dropdown_input .dropdown-input{background:transparent;border:solid #d0d0d0;border-width:0 0 1px;box-shadow:none;display:block;padding:8px;width:100%}.plugin-dropdown_input .items-placeholder{border:0!important;box-shadow:none!important;width:100%}.plugin-dropdown_input.dropdown-active .items-placeholder,.plugin-dropdown_input.has-items .items-placeholder{display:none!important}.ts-wrapper.plugin-input_autogrow.has-items .ts-control>input{min-width:0}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input{flex:none;min-width:4px}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input::-moz-placeholder{color:transparent}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input::placeholder{color:transparent}.ts-dropdown.plugin-optgroup_columns .ts-dropdown-content{display:flex}.ts-dropdown.plugin-optgroup_columns .optgroup{border-right:1px solid #f2f2f2;border-top:0;flex-basis:0;flex-grow:1;min-width:0}.ts-dropdown.plugin-optgroup_columns .optgroup:last-child{border-right:0}.ts-dropdown.plugin-optgroup_columns .optgroup:before{display:none}.ts-dropdown.plugin-optgroup_columns .optgroup-header{border-top:0}.ts-wrapper.plugin-remove_button .item{align-items:center;display:inline-flex}.ts-wrapper.plugin-remove_button .item .remove{border-radius:0 2px 2px 0;box-sizing:border-box;color:inherit;display:inline-block;padding:0 6px;text-decoration:none;vertical-align:middle}.ts-wrapper.plugin-remove_button .item .remove:hover{background:rgba(0,0,0,.05)}.ts-wrapper.plugin-remove_button.disabled .item .remove:hover{background:none}.ts-wrapper.plugin-remove_button .remove-single{font-size:23px;position:absolute;right:0;top:0}.ts-wrapper.plugin-remove_button:not(.rtl) .item{padding-right:0!important}.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove{border-left:1px solid #d0d0d0;margin-left:6px}.ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove{border-left-color:#cacaca}.ts-wrapper.plugin-remove_button:not(.rtl).disabled .item .remove{border-left-color:#fff}.ts-wrapper.plugin-remove_button.rtl .item{padding-left:0!important}.ts-wrapper.plugin-remove_button.rtl .item .remove{border-right:1px solid #d0d0d0;margin-right:6px}.ts-wrapper.plugin-remove_button.rtl .item.active .remove{border-right-color:#cacaca}.ts-wrapper.plugin-remove_button.rtl.disabled .item .remove{border-right-color:#fff}:root{--ts-pr-clear-button:0px;--ts-pr-caret:0px;--ts-pr-min:.75rem}.ts-wrapper.single .ts-control,.ts-wrapper.single .ts-control input{cursor:pointer}.ts-control:not(.rtl){padding-right:max(var(--ts-pr-min),var(--ts-pr-clear-button) + var(--ts-pr-caret))!important}.ts-control.rtl{padding-left:max(var(--ts-pr-min),var(--ts-pr-clear-button) + var(--ts-pr-caret))!important}.ts-wrapper{position:relative}.ts-control,.ts-control input,.ts-dropdown{color:#303030;font-family:inherit;font-size:13px;line-height:18px}.ts-control,.ts-wrapper.single.input-active .ts-control{background:#fff;cursor:text}.ts-hidden-accessible{clip:rect(0 0 0 0)!important;border:0!important;clip-path:inset(50%)!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.happy-checkbox,.happy-color,.happy-radio{color:#333}.happy-checkbox>b,.happy-color>b,.happy-radio>b{background-color:#333}.active.happy-checkbox,.active.happy-radio,.happy-color.active{color:#333}.active.happy-checkbox>b,.active.happy-radio>b,.happy-color.active>b{background-color:#333}.happy-color.primary,.primary.happy-checkbox,.primary.happy-radio{color:#333}.happy-color.primary>b,.primary.happy-checkbox>b,.primary.happy-radio>b{background-color:#333}.happy-color.primary.active,.primary.active.happy-checkbox,.primary.active.happy-radio{color:#4c86bb}.happy-color.primary.active>b,.primary.active.happy-checkbox>b,.primary.active.happy-radio>b{background-color:#4c86bb}.happy-color.success,.success.happy-checkbox,.success.happy-radio{color:#333}.happy-color.success>b,.success.happy-checkbox>b,.success.happy-radio>b{background-color:#333}.happy-color.success.active,.success.active.happy-checkbox,.success.active.happy-radio{color:#72b889}.happy-color.success.active>b,.success.active.happy-checkbox>b,.success.active.happy-radio>b{background-color:#72b889}.happy-color.info,.info.happy-checkbox,.info.happy-radio{color:#333}.happy-color.info>b,.info.happy-checkbox>b,.info.happy-radio>b{background-color:#333}.happy-color.info.active,.info.active.happy-checkbox,.info.active.happy-radio{color:#5bc0de}.happy-color.info.active>b,.info.active.happy-checkbox>b,.info.active.happy-radio>b{background-color:#5bc0de}.happy-color.warning,.warning.happy-checkbox,.warning.happy-radio{color:#333}.happy-color.warning>b,.warning.happy-checkbox>b,.warning.happy-radio>b{background-color:#333}.happy-color.warning.active,.warning.active.happy-checkbox,.warning.active.happy-radio{color:#f0bb65}.happy-color.warning.active>b,.warning.active.happy-checkbox>b,.warning.active.happy-radio>b{background-color:#f0bb65}.danger.happy-checkbox,.danger.happy-radio,.happy-color.danger{color:#333}.danger.happy-checkbox>b,.danger.happy-radio>b,.happy-color.danger>b{background-color:#333}.danger.active.happy-checkbox,.danger.active.happy-radio,.happy-color.danger.active{color:#ed6b6b}.danger.active.happy-checkbox>b,.danger.active.happy-radio>b,.happy-color.danger.active>b{background-color:#ed6b6b}.happy-color.white,.white.happy-checkbox,.white.happy-radio{color:#333}.happy-color.white>b,.white.happy-checkbox>b,.white.happy-radio>b{background-color:#333}.happy-color.white.active,.white.active.happy-checkbox,.white.active.happy-radio{color:#fff}.happy-color.white.active>b,.white.active.happy-checkbox>b,.white.active.happy-radio>b{background-color:#fff}.happy-border-color,.happy-radio{border-color:rgba(51,51,51,.8)}.active.happy-radio,.happy-border-color.active{border-color:#333}.happy-border-color.primary,.primary.happy-radio{border-color:rgba(51,51,51,.8)}.happy-border-color.primary.active,.primary.active.happy-radio{border-color:#4c86bb}.happy-border-color.success,.success.happy-radio{border-color:rgba(51,51,51,.8)}.happy-border-color.success.active,.success.active.happy-radio{border-color:#72b889}.happy-border-color.info,.info.happy-radio{border-color:rgba(51,51,51,.8)}.happy-border-color.info.active,.info.active.happy-radio{border-color:#5bc0de}.happy-border-color.warning,.warning.happy-radio{border-color:rgba(51,51,51,.8)}.happy-border-color.warning.active,.warning.active.happy-radio{border-color:#f0bb65}.danger.happy-radio,.happy-border-color.danger{border-color:rgba(51,51,51,.8)}.danger.active.happy-radio,.happy-border-color.danger.active{border-color:#ed6b6b}.happy-border-color.white,.white.happy-radio{border-color:rgba(51,51,51,.8)}.happy-border-color.white.active,.white.active.happy-radio{border-color:#fff}input[type=checkbox].happy,input[type=radio].happy{left:-50%;opacity:0;position:absolute;top:-50%}.noselect,label:not(.selectable){-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}label{cursor:pointer;position:relative}.happy-checkbox{border:2px solid #333;box-sizing:border-box;cursor:pointer;display:inline-block;line-height:20px;margin-right:.2em;position:relative;vertical-align:middle}.happy-checkbox,.happy-checkbox svg{border-radius:2.66667px;height:16px;top:-2px;width:16px}.happy-checkbox svg{background-color:#333;display:block;left:-2px;opacity:0;position:absolute;transform:scale(.4);transition:all .18s}.happy-checkbox svg rect{fill:#fff}.happy-checkbox svg rect:first-child{transform:rotate(45deg)}.happy-checkbox svg rect:nth-child(2){transform:rotate(-45deg)}.happy-checkbox.thin{border-width:1px}.happy-checkbox.thin svg{left:-1px;top:-1px}.happy-checkbox.white{border-color:#fff}.happy-checkbox.gray-border{border-color:#858585}.happy-checkbox.primary-border{border-color:#4c86bb}.happy-checkbox.success-border{border-color:#72b889}.happy-checkbox.info-border{border-color:#5bc0de}.happy-checkbox.warning-border{border-color:#f0bb65}.happy-checkbox.danger-border{border-color:#ed6b6b}.happy-checkbox.primary svg{background-color:#4c86bb}.happy-checkbox.success svg{background-color:#72b889}.happy-checkbox.info svg{background-color:#5bc0de}.happy-checkbox.warning svg{background-color:#f0bb65}.happy-checkbox.danger svg{background-color:#ed6b6b}.happy-checkbox.white svg{background-color:#fff}.happy-checkbox.white svg rect{fill:#333}.happy-checkbox.active{border-color:transparent}.happy-checkbox.active svg{opacity:1;transform:scale(1)}.happy-radio{border-radius:16px;border-style:solid;border-width:2px;box-sizing:border-box;cursor:pointer;display:inline-block;height:16px;line-height:20px;position:relative;top:-2px;vertical-align:middle;width:16px}.happy-radio.thin{border-width:1.66667px}.happy-radio b{border-radius:10.66667px;bottom:2px;display:block;left:2px;opacity:0;position:absolute;right:2px;top:2px;transform:scale(.4);transition:all .18s}.happy-radio.active b{opacity:1;transform:scale(1)}.happy-radio.focus{box-shadow:0 0 5px 0 rgba(50,50,50,.75);outline:none}.datagrid--content-row:not(.is-active)>td{display:none}@keyframes edited{0%{background-color:#a6e2a9}to{background-color:transparent}}@keyframes edited-error{0%{background-color:#e8aaa4}to{background-color:transparent}}[data-datagrid-name]{background-color:#fff;box-sizing:border-box;padding:1em}[data-datagrid-name] .datagrid-input-group-full-width{width:100%}[data-datagrid-name] .hidden{display:none!important}[data-datagrid-name] .datagrid-collapse-filters-button-row{margin-bottom:.5em}[data-datagrid-name] .col-action .dropdown{display:inline-block}[data-datagrid-name] .datagrid-row-inline-add.datagrid-row-inline-add-hidden{display:none}[data-datagrid-name] .datagrid-row-columns-summary td{border-left:1px solid #eee;border-right:1px solid #eee;border-top:2px solid #bbb;font-weight:700}[data-datagrid-name] .datagrid-row-columns-summary td:first-child{border-left:1px solid #ddd}[data-datagrid-name] .datagrid-row-columns-summary td:last-child{border-right:1px solid #ddd}[data-datagrid-name] .datagrid-toolbar{display:inline-block;float:right;margin-top:.35em}[data-datagrid-name] .datagrid-toolbar>div>span{margin-left:1em}[data-datagrid-name] .datagrid-toolbar>div>span>a{margin-left:.5em}[data-datagrid-name] .datagrid-toolbar>div{display:inline-block}.datagrid-toolbar .fa-check-square,.datagrid-toolbar .fa-square{font-weight:400}[data-datagrid-name] .datagrid-exports .btn{margin-left:.5em}[data-datagrid-name] .datagrid-exports .btn:first-child{margin-left:0}[data-datagrid-name] .datagrid-settings{display:inline-block}[data-datagrid-name] .datagrid-settings .dropdown-menu--grid{font-size:12px}[data-datagrid-name] .datagrid-settings .dropdown-menu--grid li .fa{margin-right:.5em}[data-datagrid-name] .row-reset-filter{margin-bottom:.5em;text-align:right}[data-datagrid-name] .datagrid-manual-submit,[data-datagrid-name] .row-filters .datagrid-row-outer-filters-group{margin-bottom:.5em}[data-datagrid-name] .filter-range-delimiter{text-align:center}[data-datagrid-name] .bootstrap-select.input-sm>.btn{border-radius:3px;font-size:12px;line-height:1.5;padding:5px 25px 5px 10px}[data-datagrid-name] table{margin:0}[data-datagrid-name] table thead tr .bootstrap-select:not([class*=col-]):not(.input-group-btn),[data-datagrid-name] table thead tr .bootstrap-select:not([class*=col-]):not(.input-group-btn)>.btn{width:auto}[data-datagrid-name] table thead tr .bootstrap-select:not([class*=col-]):not(.input-group-btn) .dropdown-menu li{font-size:13px}[data-datagrid-name] table thead tr.row-group-actions th{background-color:#f9f9f9;border-bottom-width:0!important}[data-datagrid-name] table thead tr.row-group-actions .datagrid-selected-rows-count{margin-left:.3em}[data-datagrid-name] table thead tr th{font-size:90%;vertical-align:top}[data-datagrid-name] table thead tr th hr{margin:8px -8px}[data-datagrid-name] table thead tr th .datagrid-column-header-additions{float:right}[data-datagrid-name] table thead tr th .datagrid-column-header-additions a[data-datagrid-reset-filter-by-column]{color:#858585;margin-left:.3em}[data-datagrid-name] table thead tr th .datagrid-column-header-additions .column-settings-menu{cursor:pointer;display:inline-block;margin-left:.3em;opacity:0}[data-datagrid-name] .dropdown .dropdown-menu .dropdown-item,[data-datagrid-name] table thead tr th .datagrid-column-header-additions .column-settings-menu .dropdown-menu{font-size:12px}[data-datagrid-name] table thead tr th .datagrid-column-header-additions .column-settings-menu .dropdown-menu li .fa{margin-right:.5em}[data-datagrid-name] table thead tr th .datagrid-column-header-additions .column-settings-menu .dropdown-toggle:after{display:none!important}[data-datagrid-name] .datagrid-col-filter-date-range{align-items:stretch;display:flex;flex-wrap:wrap;position:relative;width:auto}[data-datagrid-name] .datagrid-col-filter-date-range>.input-group{flex:1 1 auto;margin-bottom:0;position:relative;width:1%}[data-datagrid-name] .datagrid-col-filter-datte-range-delimiter{background-color:inherit;border:none;padding:.25rem .5rem}[data-datagrid-name] table thead tr th .datagrid-col-filter-range .form-control{border-radius:3px}[data-datagrid-name] table thead tr th:hover .column-settings-menu{opacity:1}[data-datagrid-name] table tbody td{vertical-align:middle}[data-datagrid-name] table tbody tr.ui-sortable-helper{display:table}[data-datagrid-name] table tbody tr .datagrid-inline-edit .form-control{height:28px;margin:-3px;padding-bottom:4px;padding-top:4px}[data-datagrid-name] table tbody tr td[data-datagrid-editable-url].editing textarea{margin:-3px;padding:2px}[data-datagrid-name] table tbody tr td.edited{animation-delay:0ms;animation-duration:1.2s;animation-name:edited}[data-datagrid-name] table tbody tr td.edited-error{animation-delay:0ms;animation-duration:1.6s;animation-name:edited-error}[data-datagrid-name] table td.col-checkbox,[data-datagrid-name] table th.col-checkbox{padding:0;text-align:center;vertical-align:middle;width:2.1em}[data-datagrid-name] table td.col-checkbox .happy-checkbox,[data-datagrid-name] table th.col-checkbox .happy-checkbox{margin-right:0}[data-datagrid-name] table td.col-checkbox.col-checkbox-first,[data-datagrid-name] table th.col-checkbox.col-checkbox-first{border-top-color:transparent}[data-datagrid-name] table th.col-checkbox{background-color:#f9f9f9}[data-datagrid-name] table td.col-action,[data-datagrid-name] table th.col-action{white-space:nowrap;width:10px}[data-datagrid-name] table th.col-action{text-align:center}[data-datagrid-name] table td.col-action{text-align:right}[data-datagrid-name] table td.datagrid-fit-content,[data-datagrid-name] table th.datagrid-fit-content{white-space:nowrap;width:1%}[data-datagrid-name] .datagrid-tree>.datagrid-tree-header .datagrid-tree-item-right-actions-action{opacity:0}[data-datagrid-name] .datagrid-tree>.datagrid-tree-item{margin-left:20px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item{position:relative}[data-datagrid-name] .datagrid-tree .datagrid-tree-item.ui-sortable-placeholder{background-color:rgba(70,83,93,.1);visibility:visible!important}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content{box-shadow:inset 0 -1px 1px -1px #9b9b9b;box-sizing:border-box;display:flex;flex-direction:row;flex-wrap:nowrap;height:37px;justify-content:space-between;position:relative}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left,[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left{order:1}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left>.chevron{background-color:#fff;border-radius:11px;display:inline-block;height:22px;line-height:20px;margin:0 5px 0 -27px;position:relative;text-align:center;transition:transform .2s ease-in-out;vertical-align:middle;width:22px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left>.chevron:hover{box-shadow:0 0 3px 0 #b4b4b4}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left>.chevron.toggle-rotate{transform:rotate(90deg)}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-left>.chevron .fa{font-size:10px;transform:translate(1px)}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right{display:flex;flex-basis:50%;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;order:2;position:relative}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .btn{margin-top:-3px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-columns{display:flex;flex-basis:70%;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;white-space:nowrap}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-columns .datagrid-tree-item-right-columns-column{flex-basis:25%;margin-right:4px;padding:0 7px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-columns .datagrid-tree-item-right-columns-column:last-child{margin-right:0}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-actions{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;margin-left:7px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-actions .datagrid-tree-item-right-actions-action{margin-right:4px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-content .datagrid-tree-item-right .datagrid-tree-item-right-actions .datagrid-tree-item-right-actions-action:last-child{margin-right:0}[data-datagrid-name] .datagrid-tree .datagrid-tree-item .datagrid-tree-item-children:not(.datagrid-tree){margin-left:28px}[data-datagrid-name] .datagrid-tree .datagrid-tree-item:not(.has-children)>.datagrid-tree-item-children{box-sizing:border-box;margin-top:-9px;min-height:9px;position:relative;width:calc(100% - 28px)}[data-datagrid-name] .datagrid-tree .datagrid-tree-item.has-children>.datagrid-tree-item-children:not(.showed){display:none}[data-datagrid-name] .datagrid-tree .datagrid-tree-item.has-children>.datagrid-tree-item-children .datagrid-tree-item-right,[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 14px)}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 28px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 42px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 56px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 74px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 88px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 102px)!important}[data-datagrid-name] .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-children .datagrid-tree-item-right{flex-basis:calc(50% + 116px)!important}[data-datagrid-name] .btn{transition:all .1s ease-in-out;white-space:nowrap}[data-datagrid-name] select{text-transform:none}[data-datagrid-name] .row-grid-bottom{background-color:#f9f9f9;border:1px solid #ddd;font-size:0;padding:8px}[data-datagrid-name] .row-grid-bottom .col-items{display:inline-block;font-size:14px;margin-left:0;margin-right:0;width:25%}[data-datagrid-name] .row-grid-bottom .col-pagination{display:inline-block;font-size:14px;margin-left:0;margin-right:0;width:50%}[data-datagrid-name] .row-grid-bottom .col-per-page{align-items:center;display:inline-flex;font-size:14px;justify-content:end;margin-left:0;margin-right:0;text-align:right;text-align:-webkit-right;width:25%}[data-datagrid-name] .row-grid-bottom .col-per-page form{display:inline-block}[data-datagrid-name] .row-grid-bottom .col-per-page .form-control{display:inline-block;width:auto}[data-datagrid-name] .row-grid-bottom .col-per-page .form-select{margin-left:.25rem;width:-moz-fit-content;width:fit-content}[data-datagrid-name] .row-grid-bottom .datagrid-per-page-submit{position:absolute;top:-200px;visibility:hidden;width:0}[data-datagrid-name] .pagination.active>span{color:#fff}[data-datagrid-name] .pagination>a.disabled{color:#989898;cursor:not-allowed}[data-datagrid-name] .pagination>a.active{cursor:default;pointer-events:none}[data-datagrid-name] .row-group-actions th{font-weight:400}[data-datagrid-name] .col-checkbox{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}[data-datagrid-name] .col-checkbox .happy-checkbox{margin-top:2px}[data-datagrid-name] .datagrid-column-status-option-icon{float:right}@media (min-width:768px){[data-datagrid-name] .ublaboo-datagrid-th-form-inline .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .form-control{display:inline-block;vertical-align:middle;width:auto}.ublaboo-datagrid-th-form-inline .form-control[hidden],[data-datagrid-name] .ublaboo-datagrid-th-form-inline .form-control[hidden]{display:none}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .input-group{display:inline-table;vertical-align:middle}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .input-group .form-control{width:auto}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .input-group>.form-control{width:100%}[data-datagrid-name] .input-group-text{height:calc(1.5em + .5rem + 2px)}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .control-label{margin-bottom:0;vertical-align:middle}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .checkbox,[data-datagrid-name] .ublaboo-datagrid-th-form-inline .radio{display:inline-block;margin-bottom:0;margin-top:0;vertical-align:middle}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .checkbox label,[data-datagrid-name] .ublaboo-datagrid-th-form-inline .radio label{padding-left:0}[data-datagrid-name] .ublaboo-datagrid-th-form-inline .checkbox input[type=checkbox],[data-datagrid-name] .ublaboo-datagrid-th-form-inline .radio input[type=radio]{margin-left:0;position:relative}}[data-datagrid-name] .btn-group-xs>.btn,[data-datagrid-name] .btn-xs{border-radius:.19rem;font-size:12px;line-height:1.5;padding:.063rem .313rem}[data-datagrid-name] .dropdown-item{font-size:12px;line-height:1.42857143;padding:.19rem 1.3rem}