component

package
v1.1.0 Latest Latest
Warning

This package is not in the latest version of its module.

Go to latest
Published: Apr 26, 2024 License: GPL-3.0 Imports: 7 Imported by: 1

Documentation

Overview

Server-side Go components

An easy way to create a server-side component in any programming language. Detailed description and documentation:: https://nervatura.github.io/component

Index

Constants

View Source
const (
	ThemeLight = "light"
	ThemeDark  = "dark"

	TextAlignLeft   = "align-left"
	TextAlignCenter = "center"
	TextAlignRight  = "align-right"

	VerticalAlignTop    = "top"
	VerticalAlignMiddle = "middle"
	VerticalAlignBottom = "bottom"
)

Common component constants

View Source
const (
	BaseEventValue = "value"

	// Replace the inner html of the target element
	SwapInnerHTML = "innerHTML"
	// Replace the entire target element with the response
	SwapOuterHTML = "outerHTML"
	// Insert the response before the target element
	SwapBeforeBegin = "beforebegin"
	// Insert the response before the first child of the target element
	SwapAfterBegin = "afterbegin"
	// Insert the response after the last child of the target element
	SwapBeforeEnd = "beforeend"
	// Insert the response after the target element
	SwapAfterEnd = "afterend"
	// Deletes the target element regardless of the response
	SwapDelete = "delete"
	// Does not append content from response
	SwapNone = "none"

	IndicatorNone    = ""
	IndicatorSpinner = "spinner"

	PaginationTypeTop    = "top"
	PaginationTypeBottom = "bottom"
	PaginationTypeAll    = "all"
	PaginationTypeNone   = "none"
)

BaseComponent constants

View Source
const (
	// Allows you to do a client-side redirect that does not do a full page reload
	HeaderLocation = "HX-Location"
	// Pushes a new url into the hidemo stack
	HeaderPushUrl = "HX-Push-Url"
	// Can be used to do a client-side redirect to a new location
	HeaderRedirect = "HX-Redirect"
	// If set to “true” the client-side will do a full refresh of the page
	HeaderRefresh = "HX-Refresh"
	// Replaces the current URL in the location bar
	HeaderReplaceUrl = "HX-Replace-Url"
	// Allows you to specify how the response will be swapped. See hx-swap for possible values
	HeaderReswap = "HX-Reswap"
	// A CSS selector that updates the target of the content update to a different element on the page
	HeaderRetarget = "HX-Retarget"
	/* A CSS selector that allows you to choose which part of the response is used to be swapped in.
	Overrides an existing hx-select on the triggering element */
	HeaderReselect = "HX-Reselect"
	// Allows you to trigger client-side events
	HeaderTrigger = "HX-Trigger"
	// Allows you to trigger client-side events after the settle step
	HeaderTriggerAfterSettle = "HX-Trigger-After-Settle"
	// Allows you to trigger client-side events after the swap step
	HeaderTriggerAfterSwap = "HX-Trigger-After-Swap"
)

ResponseEvent Header map key constants

View Source
const (
	ComponentTypeButton = "button"

	ButtonEventClick = "click"

	ButtonTypeDefault = ""
	ButtonTypePrimary = "primary"
	ButtonTypeBorder  = "border"
)

Button constants

View Source
const (
	ComponentTypeDateTime = "datetime"

	DateTimeEventChange = "change"

	DateTimeTypeDate     = "date"
	DateTimeTypeTime     = "time"
	DateTimeTypeDateTime = "datetime-local"
)

DateTime constants

View Source
const (
	ComponentTypeIcon = "icon"

	IconDefaultIcon = "ExclamationTriangle"
	IconEventClick  = "click"
)

Icon constants

View Source
const (
	ComponentTypeInput = "input"

	InputEventChange = "change"

	InputTypeText     = "text"
	InputTypeColor    = "color"
	InputTypeFile     = "file"
	InputTypePassword = "password"
)

Input constants

View Source
const (
	ComponentTypeLabel = "label"

	LabelEventClick = "click"
)

Label constants

View Source
const (
	ComponentTypeList = "list"

	ListEventCurrentPage  = "current_page"
	ListEventFilterChange = "filter_change"
	ListEventAddItem      = "add_item"
	ListEventEditItem     = "edit_item"
	ListEventDelete       = "delete_item"
)

List constants

View Source
const (
	ComponentTypeLocale = "locale"

	LocalesEventChange = "change"
	LocalesEventUndo   = "undo"
	LocalesEventSave   = "save"
	LocalesEventError  = "error"
)

Locale constants

View Source
const (
	ComponentTypeLogin = "login"

	LoginEventChange = "change"
	LoginEventLogin  = "login"
	LoginEventTheme  = "theme"
	LoginEventLang   = "lang"
)

Login constants

View Source
const (
	ComponentTypeMenuBar = "menubar"

	MenuBarEventSide  = "side"
	MenuBarEventValue = "value"

	SideVisibilityAuto = "auto"
	SideVisibilityShow = "show"
	SideVisibilityHide = "hide"
)

MenuBar constants

View Source
const (
	ComponentTypeNumberInput = "number"

	NumberEventChange = "change"
)

NumberInput constants

View Source
const (
	ComponentTypePagination = "pagination"

	PaginationEventValue    = "value"
	PaginationEventPageSize = "page_size"
)

Pagination constants

View Source
const (
	ComponentTypeSelect = "select"

	SelectEventChange = "change"
)

Select constants

View Source
const (
	ComponentTypeTable = "table"

	TableEventCurrentPage  = "current_page"
	TableEventFilterChange = "filter_change"
	TableEventAddItem      = "add_item"
	TableEventEditCell     = "edit_cell"
	TableEventRowSelected  = "row_selected"

	TableFieldTypeString   = "string"
	TableFieldTypeNumber   = "number"
	TableFieldTypeDateTime = "datetime"
	TableFieldTypeDate     = "date"
	TableFieldTypeTime     = "time"
	TableFieldTypeBool     = "bool"
	TableFieldTypeDeffield = "deffield"
	TableFieldTypeCustom   = "custom"
)

Table constants

View Source
const (
	ComponentTypeToast = "toast"

	ToastTypeInfo    = "info"
	ToastTypeError   = "error"
	ToastTypeSuccess = "success"
)

Toast constants

Variables

Button Type values

DateTime Type values

ResponseEvent Header map keys

View Source
var IconKey []string = []string{
	"ArrowDown", "ArrowLeft", "ArrowRight", "ArrowUp", "Barcode", "Bars", "Bold", "Bolt", "Book", "Briefcase",
	"Calendar", "CaretRight", "ChartBar", "Check", "CheckCircle", "CheckSquare", "CheckSquareEmpty", "Clock",
	"Close", "Code", "Cog", "Columns", "Comment", "Copy", "Database", "Desktop", "Dollar", "Download", "Edit",
	"Envelop", "ExclamationTriangle", "Exit", "Eye", "FileText", "Filter", "Flask", "Globe", "HandUp", "Hidemo",
	"Home", "Inbox", "InfoCircle", "Italic", "Key", "Keyboard", "Link", "ListOl", "ListUl", "Lock", "Magic",
	"Male", "Map", "Mobile", "Money", "Moon", "Phone", "Plus", "Print", "QuestionCircle", "Reply", "Retweet",
	"Search", "Share", "ShoppingCart", "Sitemap", "Square", "SquareEmpty", "Star", "Strikethrough", "Sun",
	"Tag", "Tags", "TextHeight", "Th", "Ticket", "Times", "ToggleOff", "ToggleOn", "Truck", "Underline", "Undo",
	"Upload", "User", "UserLock", "Wrench",
}

Icon Value values

BaseComponent Indicator values

Input Type values

Component PaginationType values

MenuBar SideVisibility values

BaseComponent Swap values

Table TableFieldType values

Component TextAlign values

Component Theme values

Toast ToastType values

View Source
var ValidPageSize []int64 = []int64{5, 10, 20, 50, 100}

Pagination PageSize values

Component VerticalAlign values

Functions

This section is empty.

Types

type Application

type Application struct {
	BaseComponent
	// The title value of the html document
	Title string `json:"title"`
	/*
		The theme of the application.
		[Theme] variable constants: [ThemeLight], [ThemeDark]. Default value: [ThemeLight]
	*/
	Theme string `json:"theme"`
	/*
		The htmx hx-headers attribute allows you to add to the headers that will be submitted with an AJAX request.
		Example: ut.SM{"X-CSRF-Token": "TOKEN0123456789"}
	*/
	Header ut.SM `json:"header"`
	// Any javascript libraries that the app still needs to load. The htmx javascript library is loaded automatically
	Script []string `json:"script"`
	/*
		Any additional stylesheets or resource files. The path to the style sheets of the components in the
		pkg/static/css package must be specified.
		Example: []ct.HeadLink{
			{Rel: "icon", Href: "/static/favicon.svg", Type: "image/svg+xml"},
			{Rel: "stylesheet", Href: "/public/demo.css"},
			{Rel: "stylesheet", Href: "/static/css/index.css"}}
	*/
	HeadLink []HeadLink `json:"head_link"`
	// The main component of the application, to which all other components belong.
	MainComponent ClientComponent `json:"main_component"`
}

The Application component is a top-level element to which all other components belong. This element is completely never replaced, only some of its parts can change. Its task is to load and manage all static elements required for the operation and display of the components, such as style sheets and the htmx package.

func (*Application) GetProperty

func (app *Application) GetProperty(propName string) interface{}

Returns the value of the property of the Application with the specified name.

func (*Application) OnRequest

func (app *Application) OnRequest(te TriggerEvent) (re ResponseEvent)

The TriggerEvent event of the user interface is forwarded to the child component registered in the RequestMap based on the component id. If there is no component associated with the received component ID, or the processing of the component returns an error, it returns the error message by creating a Toast component.

func (*Application) Properties

func (app *Application) Properties() ut.IM

Returns all properties of the Application

func (*Application) Render

func (app *Application) Render() (res string, err error)

Based on the values, it will generate the html code of the Application or return with an error message.

func (*Application) SetProperty

func (app *Application) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Application value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Application) Validation

func (app *Application) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Application and always returns a valid value

type BaseComponent

type BaseComponent struct {
	// Unique identifier of a component
	Id string `json:"id"`
	// The name attribute of the component
	Name string `json:"name"`
	// The htmx hx-post attribute can be sent form-data as an HTTP POST request to the EventURL value
	EventURL string `json:"event_url"`
	/*
		The htmx hx-target attribute allows you to target a different element for swapping than the one
		issuing the AJAX request. The value of this attribute can be:
		- "this" which indicates that the element that the hx-target attribute is on is the target
		- any [component ID]
		Default value: "this"
	*/
	Target string `json:"target"`
	/*
		The htmx hx-swap attribute allows you to specify how the response will be swapped in relative
		to the target of an AJAX request. If you do not specify the option,
		the default is [SwapOuterHTML]. See more [Swap] variable constants.
	*/
	Swap string `json:"swap"`
	/*
		The htmx hx-indicator can be used to show spinners or progress indicators while the request is in flight.
		[Indicator] variable constants: [IndicatorNone], [IndicatorSpinner]. Default value: [IndicatorNone]
	*/
	Indicator string `json:"indicator"`
	/*
		A list of custom class names for the component's HTML attribute. The names are added to the list of
		component class names
	*/
	Class []string `json:"class"`
	// The values of the style HTML attribute of the component. Example: ut.SM{"color":"red","padding":"8px"}
	Style ut.SM `json:"style"`
	/*
		Any additional data that can be associated with the component and must be stored with it.
		Example: ut.IM{"value":"value","number":12345}
	*/
	Data ut.IM `json:"data"`
	/*
		The current value of all properties of the component that will be set after the component is created.
		The saved session data is reloaded based on the map data.
	*/
	RequestValue map[string]ut.IM `json:"request_value"`
	/*
		A map in which all the components of the entire hierarchy can be found based on their ID, which have
		their own OnRequest function and can be called directly from the user interface.
	*/
	RequestMap map[string]ClientComponent `json:"-"`
	/*
		The control function of the component's parent component. If this is set, the component passes
		the [ResponseEvent] of its event to this function.
	*/
	OnResponse func(evt ResponseEvent) (re ResponseEvent) `json:"-"`
	// contains filtered or unexported fields
}

A component whose properties and functions are contained in all other components.

func (*BaseComponent) CheckEnumValue

func (bcc *BaseComponent) CheckEnumValue(value, defaultValue string, enums []string) string

Checking the value of an enum type. In case of an invalid value, the function returns the value specified in defaultValue

func (*BaseComponent) GetProperty

func (bcc *BaseComponent) GetProperty(propName string) interface{}

Returns the value of the property of the BaseComponent with the specified name.

func (*BaseComponent) InitProps

func (bcc *BaseComponent) InitProps(cc ClientComponent)

Checks the value of all properties of the BaseComponent. If a value is missing or invalid, it will set the default value. With the help of the RequestValue map, the function can also restore the saved session data of the component. The Render function calls it automatically.

func (*BaseComponent) OnRequest

func (bcc *BaseComponent) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the BaseComponent is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*BaseComponent) Properties

func (bcc *BaseComponent) Properties() ut.IM

Returns all properties of the BaseComponent

func (*BaseComponent) Render

func (bcc *BaseComponent) Render() (res string, err error)

Based on the values, it will generate the html code of the BaseComponent or return with an error message. The BaseComponent.InitProps function is automatically called at the beginning of the function.

func (*BaseComponent) SetProperty

func (bcc *BaseComponent) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the BaseComponent value safely. Checks the entered value. In case of an invalid value, the default value will be set. The function automatically calls the BaseComponent.SetRequestValue function with the value.

func (*BaseComponent) SetRequestValue

func (bcc *BaseComponent) SetRequestValue(propName string, propValue interface{}, staticFields []string) interface{}

The function sets the value of a changed property of the component in the RequestValue map. BaseComponent.SetProperty calls this function as well at the end of processing.

func (*BaseComponent) Validation

func (bcc *BaseComponent) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the BaseComponent and always returns a valid value

type Button

type Button struct {
	BaseComponent
	/* [ButtonType] variable constants: [ButtonTypeDefault], [ButtonTypePrimary], [ButtonTypeBorder].
	Default value: [ButtonTypeDefault] */
	Type string `json:"type"`
	/* [TextAlign] variable constants: [TextAlignLeft], [TextAlignCenter], [TextAlignRight].
	Default value: [TextAlignCenter] */
	Align string `json:"align"`
	// The HTML title, aria-label attribute and button caption of the component
	Label string `json:"label"`
	// Any component to be displayed (e.g. [Label] component) instead of the label text
	LabelComponent ClientComponent `json:"label_component"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	Icon string `json:"icon"`
	// Specifies that the button should be disabled
	Disabled bool `json:"disabled"`
	// Specifies that the button should automatically get focus when the page loads
	AutoFocus bool `json:"auto_focus"`
	// Full width button (100%)
	Full bool `json:"full"`
	// Sets the values of the small-button class style
	Small bool `json:"small"`
	// Sets the values of the selected class style
	Selected bool `json:"selected"`
	// The button label is visible or invisible
	HideLabel bool `json:"hide_label"`
	// The badge value of the button
	Badge int64 `json:"badge"`
	// The button badge is visible or invisible
	ShowBadge bool `json:"show_badge"`
}

Creates an HTML button control

For example:

&Button{
  BaseComponent: BaseComponent{
    Id:           "id_button_primary",
    EventURL:     "/event",
    OnResponse:   func(evt ResponseEvent) (re ResponseEvent) {
      // return parent_component response
      return evt
    },
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent)
  },
  Type:     ButtonTypePrimary,
  Align:    TextAlignCenter,
  Label:    "Primary",
  Icon:     "Check",
  Selected: true
}

func (*Button) GetProperty

func (btn *Button) GetProperty(propName string) interface{}

Returns the value of the property of the Button with the specified name.

func (*Button) OnRequest

func (btn *Button) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the Button is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*Button) Properties

func (btn *Button) Properties() ut.IM

Returns all properties of the Button

func (*Button) Render

func (btn *Button) Render() (res string, err error)

Based on the values, it will generate the html code of the Button or return with an error message.

func (*Button) SetProperty

func (btn *Button) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Button value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Button) Validation

func (btn *Button) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Button and always returns a valid value

type ClientComponent

type ClientComponent interface {
	Properties() ut.IM /*
		Returns all properties of the component
	*/
	Validation(propName string, propValue interface{}) interface{} /*
		It checks the value given to the property and always returns a valid value
	*/
	GetProperty(propName string) interface{} /*
		Returns the value of the property with the specified name.
	*/
	SetProperty(propName string, propValue interface{}) interface{} /*
		Setting a property value safely. Checks the entered value.
		In case of an invalid value, the default value will be set.
	*/
	InitProps(cc ClientComponent) /*
		Checks the value of all properties of the component.
		If a value is missing or invalid, it will set the default value. The Render function calls it automatically.
	*/
	Render() (res string, err error) /*
		Based on the values, it will generate the component's html code or return with an error message.
		The InitProps function is automatically called at the beginning of the function.
	*/
	OnRequest(te TriggerEvent) (re ResponseEvent) /*
		This function is called in the event that the component also receives user interface events directly.
		As a rule, it is used by the basic components (button, input, etc.).
		Composite components receive these events not directly, but through their child components.
		If the component's OnResponse function is implemented, the function calls it after the [TriggerEvent] is processed,
		otherwise the function's return [ResponseEvent] is the processed [TriggerEvent].
	*/
}

Generic server-side component type. All components must implement these functions.

type DateTime

type DateTime struct {
	BaseComponent
	/* [DateTimeType] variable constants: [DateTimeTypeDate], [DateTimeTypeTime], [DateTimeTypeDateTime].
	Default value: [DateTimeTypeDate] */
	Type string `json:"type"`
	// Any valid value based on control type
	Value string `json:"value"`
	// The HTML aria-label attribute of the component
	Label string `json:"label"`
	// Allows entry of an empty value
	IsNull bool `json:"is_null"`
	// Show value picker when input
	Picker bool `json:"picker"`
	// Specifies that the input should be disabled
	Disabled bool `json:"disabled"`
	// Specifies that the input field is read-only
	ReadOnly bool `json:"read_only"`
	// Specifies that the input element should automatically get focus when the page loads
	AutoFocus bool `json:"auto_focus"`
	// Full width input (100%)
	Full bool `json:"full"`
}

Creates an HTML date, datetime or time input control

For example:

&DateTime{
  BaseComponent: BaseComponent{
    Id: "id_datetime_picker",
  },
  Type:   DateTimeTypeDateTime,
  Picker: true,
}

func (*DateTime) GetProperty

func (dti *DateTime) GetProperty(propName string) interface{}

Returns the value of the property of the DateTime with the specified name.

func (*DateTime) OnRequest

func (dti *DateTime) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the DateTime is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*DateTime) Properties

func (dti *DateTime) Properties() ut.IM

Returns all properties of the DateTime

func (*DateTime) Render

func (dti *DateTime) Render() (res string, err error)

Based on the values, it will generate the html code of the DateTime or return with an error message.

func (*DateTime) SetProperty

func (dti *DateTime) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the DateTime value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*DateTime) Validation

func (dti *DateTime) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the DateTime and always returns a valid value

type HeadLink struct {
	Rel  string `json:"rel"`
	Href string `json:"href"`
	Type string `json:"type"`
}

Application HeadLink data

type Icon

type Icon struct {
	BaseComponent
	// See more [IconKey] variable values.
	Value  string  `json:"value"`
	Width  float64 `json:"width"`
	Height float64 `json:"height"`
	// The HTML fill attribute of the component
	Color string `json:"color"`
}

Creates an HTML clickable container for SVG graphics

For example:

&Icon{
  BaseComponent: BaseComponent{
    Id: "id_icon_custom",
    Style: ut.SM{
      "cursor": "pointer",
    },
  },
  Value:  "Copy",
  Width:  42,
  Height: 48,
  Color:  "red",
}

func (*Icon) GetProperty

func (ico *Icon) GetProperty(propName string) interface{}

Returns the value of the property of the Icon with the specified name.

func (*Icon) OnRequest

func (ico *Icon) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the Icon is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*Icon) Properties

func (ico *Icon) Properties() ut.IM

Returns all properties of the Icon

func (*Icon) Render

func (ico *Icon) Render() (res string, err error)

Based on the values, it will generate the html code of the Icon or return with an error message.

func (*Icon) SetProperty

func (ico *Icon) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Icon value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Icon) Validation

func (ico *Icon) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Icon and always returns a valid value

type Input

type Input struct {
	BaseComponent
	/* [InputType] variable constants:
	[InputTypeText], [InputTypeColor], [InputTypeFile], [InputTypePassword].
	Default value: [InputTypeText] */
	Type string `json:"type"`
	// Any valid value based on control type
	Value string `json:"value"`
	// Specifies a short hint that describes the expected value of the input element
	Placeholder string `json:"placeholder"`
	// The HTML aria-label attribute of the component
	Label string `json:"label"`
	// Specifies that the input should be disabled
	Disabled bool `json:"disabled"`
	// Specifies that the input field is read-only
	ReadOnly bool `json:"read_only"`
	// Specifies that the input element should automatically get focus when the page loads
	AutoFocus bool `json:"auto_focus"`
	// Sets the values of the invalid class style
	Invalid bool `json:"invalid"`
	/* Specifies a filter for what file types the user can pick from the file input dialog box
	(only for type=[InputTypeFile]) */
	Accept string `json:"accept"`
	// Specifies the maximum number of characters allowed in the input element
	MaxLength int64 `json:"max_length"`
	// Specifies the width, in characters, of the input element
	Size int64 `json:"size"`
	// Full width input (100%)
	Full bool `json:"full"`
}

Creates an HTML text, color, file or password type input control

For example:

&Input{
  BaseComponent: BaseComponent{
    Id: "id_input_default",
  },
  Type:        InputTypeText,
  Placeholder: "placeholder text",
  AutoFocus:   true,
}

func (*Input) GetProperty

func (inp *Input) GetProperty(propName string) interface{}

Returns the value of the property of the Input with the specified name.

func (*Input) OnRequest

func (inp *Input) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the Input is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*Input) Properties

func (inp *Input) Properties() ut.IM

Returns all properties of the Input

func (*Input) Render

func (inp *Input) Render() (res string, err error)

Based on the values, it will generate the html code of the Input or return with an error message.

func (*Input) SetProperty

func (inp *Input) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Input value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Input) Validation

func (inp *Input) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Input and always returns a valid value

type Label

type Label struct {
	BaseComponent
	// Any text value
	Value string `json:"value"`
	// If the entire space is filled, the text is centered or aligned to the left
	Centered bool `json:"centered"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	LeftIcon string `json:"left_icon"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	RightIcon string `json:"right_icon"`
	// Icon component style settings. Example: ut.SM{"fill": "orange"}
	IconStyle ut.SM `json:"icon_style"`
}

Creates an HTML clickable static text control

For example:

&Label{
  BaseComponent: BaseComponent{
    Id:    "id_label_style",
    Style: ut.SM{"color": "red"},
  },
  Value:     "Label",
  LeftIcon:  "InfoCircle",
  IconStyle: ut.SM{"fill": "orange"},
}

func (*Label) GetProperty

func (lbl *Label) GetProperty(propName string) interface{}

Returns the value of the property of the Label with the specified name.

func (*Label) OnRequest

func (lbl *Label) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the Label is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*Label) Properties

func (lbl *Label) Properties() ut.IM

Returns all properties of the Label

func (*Label) Render

func (lbl *Label) Render() (res string, err error)

Based on the values, it will generate the html code of the Label or return with an error message.

func (*Label) SetProperty

func (lbl *Label) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Label value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Label) Validation

func (lbl *Label) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Label and always returns a valid value

type List added in v1.1.0

type List struct {
	BaseComponent
	// Data source of the list
	Rows []ut.IM `json:"rows"`
	/* [PaginationType] variable constants:
	[PaginationTypeTop], [PaginationTypeBottom], [PaginationTypeAll], [PaginationTypeNone].
	Default value: [PaginationTypeTop] */
	Pagination string `json:"pagination"`
	// Pagination start value
	CurrentPage int64 `json:"current_page"`
	// Pagination component [PageSize] variable constants: 5, 10, 20, 50, 100. Default value: 10
	PageSize int64 `json:"page_size"`
	// [Pagination] component show/hide page size selector
	HidePaginatonSize bool `json:"hide_paginaton_size"`
	// Show/hide list value filter input row
	ListFilter bool `json:"list_filter"`
	// Show/hide list add item button
	AddItem bool `json:"add_item"`
	// Enable edit event
	EditItem bool `json:"edit_item"`
	// Enable delete event
	DeleteItem bool `json:"delete_item"`
	// Specifies a short hint that describes the expected value of the input element
	FilterPlaceholder string `json:"filter_placeholder"`
	// Filter input value
	FilterValue string `json:"filter_value"`
	// Add item button caption Default empty string
	LabelAdd string `json:"label_add"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	AddIcon string `json:"add_icon"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	EditIcon string `json:"edit_icon"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	DeleteIcon string `json:"delete_icon"`
	// The field name containing the list label of the data source. Default: lslabel
	LabelField string `json:"label_field"`
	// The field name containing the list value of the data source. Default: lsvalue
	LabelValue string `json:"label_value"`
}

Creates an interactive list control

func (*List) GetProperty added in v1.1.0

func (lst *List) GetProperty(propName string) interface{}

Returns the value of the property of the List with the specified name.

func (*List) Properties added in v1.1.0

func (lst *List) Properties() ut.IM

Returns all properties of the List

func (*List) Render added in v1.1.0

func (lst *List) Render() (res string, err error)

Based on the values, it will generate the html code of the List or return with an error message.

func (*List) SetProperty added in v1.1.0

func (lst *List) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the List value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*List) Validation added in v1.1.0

func (lst *List) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the List and always returns a valid value

type Locale

type Locale struct {
	BaseComponent
	// The languages that can be selected from the data source
	Locales []SelectOption `json:"locales"`
	// The groups of localization texts
	TagKeys []SelectOption `json:"tag_keys"`
	// The filter condition of the displayed data
	FilterValue string `json:"filter_value"`
	// Data changed from user input
	Dirty bool `json:"dirty"`
	// Show/hide Add a new language section
	AddItem bool `json:"add_item"`
	// The texts of the labels of the controls
	Labels ut.SM `json:"labels"`
}

Creates an translation helper tool

Example component with the following main features:

  • server-side state management
  • Input, Select, Label, Button and Table components
  • customized table cells: link field and input control
  • data filtering
  • state-bound control visibility
  • dynamic data sources for the Select and Table controls

For example:

&Locale{
  BaseComponent: BaseComponent{
    Id:           "id_locale_default",
    EventURL:     "/event",
    OnResponse:   func(evt ResponseEvent) (re ResponseEvent) {
      // return parent_component response
      return evt
    },
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
    Data: ut.IM{
      "deflang": ut.IM{
        "key": "en", "en": "English", "address_view": "Address Data",
      },
      "locales":  "default",
      "tag_keys": "address",
      "tag_values": map[string][]string{
        "address": { "address_view", "address_country" },
        "login": { "login_username", "login_password", "login_database" },
      },
      "locfile": ut.IM{
        "locales": ut.IM{
          "de": ut.IM{ "de": "Deutsche", "key": "de", "login_database": "Datenbank" }
        },
      },
    },
  },
  Locales: []SelectOption{
    {Value: "default", Text: "Default"}, {Value: "de", Text: "Deutsch"},
  },
  TagKeys: []SelectOption{
    {Value: "address", Text: "address"}, {Value: "login", Text: "login"},
  },
}

func (*Locale) GetProperty

func (loc *Locale) GetProperty(propName string) interface{}

Returns the value of the property of the Locale with the specified name.

func (*Locale) Properties

func (loc *Locale) Properties() ut.IM

Returns all properties of the Locale

func (*Locale) Render

func (loc *Locale) Render() (res string, err error)

Based on the values, it will generate the html code of the Locale or return with an error message.

func (*Locale) SetProperty

func (loc *Locale) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Locale value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Locale) Validation

func (loc *Locale) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Locale and always returns a valid value

type Login

type Login struct {
	BaseComponent
	// Application version value
	Version string `json:"version"`
	// Current ui language
	Lang string `json:"lang"`
	/*
		The theme of the control.
		[Theme] variable constants: [ThemeLight], [ThemeDark]. Default value: [ThemeLight]
	*/
	Theme string `json:"theme"`
	// The texts of the labels of the controls
	Labels ut.SM `json:"labels"`
	// Selectable languages
	Locales []SelectOption `json:"locales"`
}

Creates an application login control

Example component with the following main features:

  • server-side state management
  • selectable label languages
  • light and dark theme
  • modal appearance
  • Input, Select, Label and Button components

For example:

&Login{
  BaseComponent: BaseComponent{
    Id:           "id_login_default",
    EventURL:     "/event",
    OnResponse:   func(evt ResponseEvent) (re ResponseEvent) {
      // return parent_component response
      return evt
    },
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
    Data: ut.IM{ "username": "admin", "database": "demo" },
  },
  Version: "6.0.0",
  Lang:    "en",
  Locales: []SelectOption{{Value: "en", Text: "English"}},
  Theme:  ThemeLight,
}

func (*Login) GetProperty

func (lgn *Login) GetProperty(propName string) interface{}

Returns the value of the property of the Login with the specified name.

func (*Login) Properties

func (lgn *Login) Properties() ut.IM

Returns all properties of the Login

func (*Login) Render

func (lgn *Login) Render() (res string, err error)

Based on the values, it will generate the html code of the Login or return with an error message.

func (*Login) SetProperty

func (lgn *Login) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Login value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Login) Validation

func (lgn *Login) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Login and always returns a valid value

type MenuBar struct {
	BaseComponent
	// Value of a selected/active menu item
	Value string `json:"value"`
	// Show/hide sidebar button in mobile view
	SideBar bool `json:"side_bar"`
	/* [SideVisibility] variable constants:
	[SideVisibilityAuto], [SideVisibilityShow], [SideVisibilityHide].
	Default value: [SideVisibilityAuto] */
	SideVisibility string `json:"side_visibility"`
	// Sidebar button caption. Default: Hide
	LabelHide string `json:"label_hide"`
	// Sidebar button caption. Default: Menu
	LabelMenu string `json:"label_menu"`
	// Menu items data
	Items []MenuBarItem `json:"items"`
}

Creates a clickable menu control

For example:

&MenuBar{
  BaseComponent: BaseComponent{
    Id:           "id_menubar_default",
    EventURL:     "/event",
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
  },
  Items: []MenuBarItem{
    {Value: "search", Label: "Search", Icon: "Search"},
    {Value: "edit", Label: "Edit", Icon: "Edit"},
    {Value: "setting", Label: "Setting", Icon: "Cog"},
  },
  Value:          "search",
  SideBar:        true,
  SideVisibility: SideVisibilityAuto,
}
func (mnb *MenuBar) GetProperty(propName string) interface{}

Returns the value of the property of the MenuBar with the specified name.

func (mnb *MenuBar) Properties() ut.IM

Returns all properties of the MenuBar

func (mnb *MenuBar) Render() (res string, err error)

Based on the values, it will generate the html code of the MenuBar or return with an error message.

func (mnb *MenuBar) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the MenuBar value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (mnb *MenuBar) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the MenuBar and always returns a valid value

type MenuBarItem struct {
	// Menu key/id value
	Value string `json:"value"`
	// Menu caption
	Label string `json:"label"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	Icon string `json:"icon"`
}

MenuBar item data

type NumberInput

type NumberInput struct {
	BaseComponent
	// Any valid value based on control type (float64 or integer)
	Value float64 `json:"value"`
	// Integer type input
	Integer bool `json:"integer"`
	// The HTML aria-label attribute of the component
	Label string `json:"label"`
	// Enable maximum value monitoring
	SetMax bool `json:"set_max"`
	// Maximum value that can be entered
	MaxValue float64 `json:"max_value"`
	// Enable minimum value monitoring
	SetMin bool `json:"set_min"`
	// Minimum value that can be entered
	MinValue float64 `json:"min_value"`
	// Specifies that the input should be disabled
	Disabled bool `json:"disabled"`
	// Specifies that the input field is read-only
	ReadOnly bool `json:"read_only"`
	// Specifies that the input element should automatically get focus when the page loads
	AutoFocus bool `json:"auto_focus"`
	// Full width input (100%)
	Full bool `json:"full"`
}

Creates an HTML number input control

For example:

&NumberInput{
  BaseComponent: BaseComponent{
    Id:           "id_number_min_max",
    EventURL:     "/event",
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
  },
  Value:    150,
  SetMax:   true,
  MaxValue: 100,
  SetMin:   true,
  MinValue: 50,
  Full:     true,
}

func (*NumberInput) GetProperty

func (inp *NumberInput) GetProperty(propName string) interface{}

Returns the value of the property of the NumberInput with the specified name.

func (*NumberInput) OnRequest

func (inp *NumberInput) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the NumberInput is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*NumberInput) Properties

func (inp *NumberInput) Properties() ut.IM

Returns all properties of the NumberInput

func (*NumberInput) Render

func (inp *NumberInput) Render() (res string, err error)

Based on the values, it will generate the html code of the NumberInput or return with an error message.

func (*NumberInput) SetProperty

func (inp *NumberInput) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the NumberInput value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*NumberInput) Validation

func (inp *NumberInput) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the NumberInput and always returns a valid value

type Pagination

type Pagination struct {
	BaseComponent
	// Current page value
	Value int64 `json:"value"`
	// [PageSize] variable constants: 5, 10, 20, 50, 100. Default value: 10
	PageSize int64 `json:"page_size"`
	// The maximum value of the pagination
	PageCount int64 `json:"page_count"`
	// Show/hide page size selector
	HidePageSize bool `json:"hide_pageSize"`
}

Creates a pagination control

For example:

&Pagination{
  BaseComponent: BaseComponent{
    Id:           "id_table_page_size",
    EventURL:     "/event",
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
  },
  Value:        2,
  PageSize:     10,
  PageCount:    3,
  HidePageSize: false,
}

func (*Pagination) GetProperty

func (pgn *Pagination) GetProperty(propName string) interface{}

Returns the value of the property of the Pagination with the specified name.

func (*Pagination) Properties

func (pgn *Pagination) Properties() ut.IM

Returns all properties of the Pagination

func (*Pagination) Render

func (pgn *Pagination) Render() (res string, err error)

Based on the values, it will generate the html code of the Pagination or return with an error message.

func (*Pagination) SetProperty

func (pgn *Pagination) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Pagination value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Pagination) Validation

func (pgn *Pagination) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Pagination and always returns a valid value

type ResponseEvent

type ResponseEvent struct {
	// The data processing and responding component
	Trigger ClientComponent `json:"trigger"`
	// The name of the component
	TriggerName string `json:"trigger_name"`
	// The name of the event. Example: [InputEventChange]
	Name string `json:"name"`
	// The value of the event.
	Value interface{} `json:"value"`
	/* htmx supports some htmx-specific response headers. See more [ResponseEvent] Header map key constants
	Example: Header: ut.SM{HeaderRetarget: "#toast-msg", HeaderReswap: SwapInnerHTML} */
	Header ut.SM `json:"header"`
}

Response data for a user event

type Select

type Select struct {
	BaseComponent
	// Value of the selected item in options
	Value string `json:"value"`
	// Items of optional values
	Options []SelectOption `json:"options"`
	// An empty value can also be selected
	IsNull bool `json:"is_null"`
	// The HTML aria-label attribute of the component
	Label string `json:"label"`
	// Specifies that the input should be disabled
	Disabled bool `json:"disabled"`
	// Specifies that the input element should automatically get focus when the page loads
	AutoFocus bool `json:"auto_focus"`
	// Full width input (100%)
	Full bool `json:"full"`
}

Creates an HTML select control

For example:

&Select{
  BaseComponent: BaseComponent{
    Id:           "id_select_default",
    EventURL:     "/event",
    RequestValue: parent_component.GetProperty("request_value").(map[string]ut.IM),
    RequestMap:   parent_component.GetProperty("request_map").(map[string]ClientComponent),
  },
  Value: "value1",
  Options: []SelectOption{
    {Value: "value1", Text: "Text 1"},
    {Value: "value2", Text: "Text 2"},
    {Value: "value3", Text: "Text 3"},
  },
  IsNull: true,
}

func (*Select) GetProperty

func (sel *Select) GetProperty(propName string) interface{}

Returns the value of the property of the Select with the specified name.

func (*Select) OnRequest

func (sel *Select) OnRequest(te TriggerEvent) (re ResponseEvent)

If the OnResponse function of the Select is implemented, the function calls it after the TriggerEvent is processed, otherwise the function's return ResponseEvent is the processed TriggerEvent.

func (*Select) Properties

func (sel *Select) Properties() ut.IM

Returns all properties of the Select

func (*Select) Render

func (sel *Select) Render() (res string, err error)

Based on the values, it will generate the html code of the Select or return with an error message.

func (*Select) SetProperty

func (sel *Select) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Select value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Select) Validation

func (sel *Select) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Select and always returns a valid value

type SelectOption

type SelectOption struct {
	Value string `json:"value"`
	Text  string `json:"text"`
}

Select control item

type Spinner

type Spinner struct {
	Id string `json:"id"`
	// Modal appearance by default, other elements of the page are not available
	NoModal bool `json:"no_modal"`
}

The htmx AJAX request indicator.

func (*Spinner) Render

func (spn *Spinner) Render() (result string, err error)

Based on the values, it will generate the html code of the Spinner or return with an error message.

type Table

type Table struct {
	BaseComponent
	/* The field name containing the row ID of the data source. If not specified,
	the row index will be used
	*/
	RowKey string `json:"row_key"`
	// Data source of the table
	Rows []ut.IM `json:"rows"`
	// Table column definitions
	Fields []TableField `json:"fields"`
	/* [PaginationType] variable constants:
	[PaginationTypeTop], [PaginationTypeBottom], [PaginationTypeAll], [PaginationTypeNone].
	Default value: [PaginationTypeTop] */
	Pagination string `json:"pagination"`
	// Pagination start value
	CurrentPage int64 `json:"current_page"`
	// Pagination component [PageSize] variable constants: 5, 10, 20, 50, 100. Default value: 10
	PageSize int64 `json:"page_size"`
	// [Pagination] component show/hide page size selector
	HidePaginatonSize bool `json:"hide_paginaton_size"`
	// Show/hide table value filter input row
	TableFilter bool `json:"table_filter"`
	// Show/hide table add item button
	AddItem bool `json:"add_item"`
	// Specifies a short hint that describes the expected value of the input element
	FilterPlaceholder string `json:"filter_placeholder"`
	// Filter input value
	FilterValue string `json:"filter_value"`
	// A true value caption in the table cell. Default value: YES
	LabelYes string `json:"label_yes"`
	// A false value caption in the table cell. Default value: NO
	LabelNo string `json:"label_no"`
	// Add item button caption Default empty string
	LabelAdd string `json:"label_add"`
	// Valid [Icon] component value. See more [IconKey] variable values.
	AddIcon string `json:"add_icon"`
	// Table cell padding style value. Example: 8px
	TablePadding string `json:"table_padding"`
	// The order of the table is based on the field name
	SortCol string `json:"sort_col"`
	// Sort in ascending or descending order
	SortAsc bool `json:"sort_asc"`
	// Select an entire row or cell
	RowSelected bool `json:"row_selected"`
}

Creates an interactive and customizable table control

For example:

&Table{
  BaseComponent: BaseComponent{
    Id: "id_table_string_row_selected",
  },
  Rows: []ut.IM{
    {"name": "Fluffy", "age": 9, "breed": "calico", "gender": "male"},
    {"name": "Luna", "age": 10, "breed": "long hair", "gender": "female"},
    {"name": "Cracker", "age": 8, "breed": "fat", "gender": "male"},
    {"name": "Pig", "age": 6, "breed": "calico", "gender": "female"},
  },
  Pagination:  PaginationTypeTop,
  PageSize:    5,
  RowSelected: true,
  SortCol:     "name",
}

func (*Table) GetProperty

func (tbl *Table) GetProperty(propName string) interface{}

Returns the value of the property of the Table with the specified name.

func (*Table) Properties

func (tbl *Table) Properties() ut.IM

Returns all properties of the Table

func (*Table) Render

func (tbl *Table) Render() (res string, err error)

Based on the values, it will generate the html code of the Table or return with an error message.

func (*Table) SetProperty

func (tbl *Table) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Table value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Table) SortRows

func (tbl *Table) SortRows(fieldName, fieldType string, sortAsc bool)

func (*Table) Validation

func (tbl *Table) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Table and always returns a valid value

type TableColumn

type TableColumn struct {
	// The field name of the data source
	Id string `json:"id"`
	// The label of the column
	Header string `json:"header"`
	// Header cell style settings. Example: ut.SM{"padding": "4px"}
	HeaderStyle ut.SM `json:"header_style"`
	// Data cell style settings. Example: ut.SM{"color": "red"}
	CellStyle ut.SM `json:"cell_style"`
	// Original field definition
	Field TableField `json:"field"`
	// The cell generator function of the table
	Cell func(row ut.IM, col TableColumn, value interface{}) string `json:"-"`
}

Table column

type TableField

type TableField struct {
	// The field name of the data source
	Name string `json:"name"`
	/* [TableFieldType] variable constants:
	[TableFieldTypeString], [TableFieldTypeNumber], [TableFieldTypeDateTime],[TableFieldTypeDate],
	[TableFieldTypeTime], [TableFieldTypeBool], [TableFieldTypeDeffield], [TableFieldTypeCustom].
	Default value: [TableFieldTypeString] */
	FieldType string `json:"field_type"`
	// The label of the column
	Label string `json:"label"`
	/* [TextAlign] variable constants: [TextAlignLeft], [TextAlignCenter], [TextAlignRight].
	Default value: [TextAlignLeft] */
	TextAlign string `json:"text_align"`
	/* [VerticalAlign] variable constants:
	[VerticalAlignTop], [VerticalAlignMiddle], [VerticalAlignBottom].
	Default value: [VerticalAlignMiddle] */
	VerticalAlign string `json:"vertical_align"`
	/* Formatting of negative (red), positive (green) and zero (line-through) values
	in the case of a number field */
	Format bool `json:"format"`
	// Custom column definition
	Column *TableColumn `json:"column"`
}

Table column definitions

type TestComponent

type TestComponent struct {
	// The name of the test data
	Label string `json:"label"`
	// Type of tested component. Example: [ComponentTypeSelect]
	ComponentType string `json:"component_type"`
	// The tested component with the test data
	Component ClientComponent `json:"component"`
}

Test container for component test cases

func TestButton

func TestButton(cc ClientComponent) []TestComponent

Button test and demo data

func TestDateTime

func TestDateTime(cc ClientComponent) []TestComponent

DateTime test and demo data

func TestIcon

func TestIcon(cc ClientComponent) []TestComponent

Icon test and demo data

func TestInput

func TestInput(cc ClientComponent) []TestComponent

Input test and demo data

func TestLabel

func TestLabel(cc ClientComponent) []TestComponent

Label test and demo data

func TestList added in v1.1.0

func TestList(cc ClientComponent) []TestComponent

List test and demo data

func TestLocale

func TestLocale(cc ClientComponent) []TestComponent

Locale test and demo data

func TestLogin

func TestLogin(cc ClientComponent) []TestComponent

Login test and demo data

func TestMenuBar

func TestMenuBar(cc ClientComponent) []TestComponent

MenuBar test and demo data

func TestNumberInput

func TestNumberInput(cc ClientComponent) []TestComponent

NumberInput test and demo data

func TestPagination

func TestPagination(cc ClientComponent) []TestComponent

Pagination test and demo data

func TestSelect

func TestSelect(cc ClientComponent) []TestComponent

Select test and demo data

func TestTable

func TestTable(cc ClientComponent) []TestComponent

Table test and demo data

func TestToast

func TestToast(cc ClientComponent) []TestComponent

Toast test and demo data

type Toast

type Toast struct {
	BaseComponent
	/* [ToastType] variable constants: [ToastTypeInfo], [ToastTypeError], [ToastTypeSuccess].
	Default value: [ToastTypeInfo] */
	Type string `json:"type"`
	// Message text value
	Value string `json:"value"`
	/* Allows you to remove the element after a specified interval
	Its value must be given in seconds. Default value: 0*/
	Timeout int64 `json:"timeout"`
}

Creates a toast message control

For example:

&Toast{
  Type:    ToastTypeInfo,
  Value:   "Info text",
  Timeout: 4,
}

func (*Toast) GetProperty

func (tst *Toast) GetProperty(propName string) interface{}

Returns the value of the property of the Toast with the specified name.

func (*Toast) Properties

func (tst *Toast) Properties() ut.IM

Returns all properties of the Toast

func (*Toast) Render

func (tst *Toast) Render() (res string, err error)

Based on the values, it will generate the html code of the Toast or return with an error message.

func (*Toast) SetProperty

func (tst *Toast) SetProperty(propName string, propValue interface{}) interface{}

Setting a property of the Toast value safely. Checks the entered value. In case of an invalid value, the default value will be set.

func (*Toast) Validation

func (tst *Toast) Validation(propName string, propValue interface{}) interface{}

It checks the value given to the property of the Toast and always returns a valid value

type TriggerEvent

type TriggerEvent struct {
	// The id attribute of the component that receives the user event. htmx request header: HX-Trigger
	Id string `json:"id"`
	// The name attribute of the component that receives the user event. htmx request header: HX-Trigger-Name
	Name string `json:"name"`
	// The hx-target attribute of the component that receives the user event. htmx request header: HX-Target
	Target string `json:"target"`
	// The URL-encoded data of the request
	Values url.Values `json:"values"`
}

Event data sent by the user interface in the htmx request

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL