mirror of
https://github.com/rstudio/shiny.git
synced 2026-01-11 16:08:19 -05:00
Compare commits
21 Commits
rm-babel
...
internal/s
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
10c2398990 | ||
|
|
064da3a883 | ||
|
|
eddb0d9f22 | ||
|
|
4648423c54 | ||
|
|
0adeb4bd36 | ||
|
|
ce4961f5ef | ||
|
|
4f50796a3d | ||
|
|
08ced6badb | ||
|
|
a66ef6de01 | ||
|
|
b5c6561dc9 | ||
|
|
2740be168a | ||
|
|
922d16d387 | ||
|
|
651b768310 | ||
|
|
63427a7178 | ||
|
|
54fa8570a8 | ||
|
|
60f074daac | ||
|
|
e2d19b9392 | ||
|
|
0e2d040c54 | ||
|
|
8d12ae7351 | ||
|
|
90c052341f | ||
|
|
01fd8fac64 |
@@ -26,6 +26,7 @@
|
||||
^\.vscode$
|
||||
^\.madgerc$
|
||||
^\.prettierrc\.yml$
|
||||
^babel\.config\.json$
|
||||
^jest\.config\.js$
|
||||
^package\.json$
|
||||
^tsconfig\.json$
|
||||
|
||||
@@ -27,6 +27,7 @@ rules:
|
||||
- off
|
||||
"@typescript-eslint/explicit-module-boundary-types":
|
||||
- error
|
||||
- allowArgumentsExplicitlyTypedAsAny: true
|
||||
|
||||
default-case:
|
||||
- error
|
||||
|
||||
@@ -7,4 +7,3 @@ plugins:
|
||||
spec: "@yarnpkg/plugin-interactive-tools"
|
||||
|
||||
yarnPath: .yarn/releases/yarn-3.2.3.cjs
|
||||
checksumBehavior: update
|
||||
|
||||
23
DESCRIPTION
23
DESCRIPTION
@@ -1,19 +1,19 @@
|
||||
Package: shiny
|
||||
Type: Package
|
||||
Title: Web Application Framework for R
|
||||
Version: 1.7.5.9000
|
||||
Version: 1.7.4.9002
|
||||
Authors@R: c(
|
||||
person("Winston", "Chang", role = c("aut", "cre"), email = "winston@posit.co", comment = c(ORCID = "0000-0002-1576-2126")),
|
||||
person("Joe", "Cheng", role = "aut", email = "joe@posit.co"),
|
||||
person("JJ", "Allaire", role = "aut", email = "jj@posit.co"),
|
||||
person("Carson", "Sievert", role = "aut", email = "carson@posit.co", comment = c(ORCID = "0000-0002-4958-2844")),
|
||||
person("Barret", "Schloerke", role = "aut", email = "barret@posit.co", comment = c(ORCID = "0000-0001-9986-114X")),
|
||||
person("Yihui", "Xie", role = "aut", email = "yihui@posit.co"),
|
||||
person("Jeff", "Allen", role = "aut"),
|
||||
person("Jonathan", "McPherson", role = "aut", email = "jonathan@posit.co"),
|
||||
person("Winston", "Chang", role = c("aut", "cre"), email = "winston@rstudio.com", comment = c(ORCID = "0000-0002-1576-2126")),
|
||||
person("Joe", "Cheng", role = "aut", email = "joe@rstudio.com"),
|
||||
person("JJ", "Allaire", role = "aut", email = "jj@rstudio.com"),
|
||||
person("Carson", "Sievert", role = "aut", email = "carson@rstudio.com", comment = c(ORCID = "0000-0002-4958-2844")),
|
||||
person("Barret", "Schloerke", role = "aut", email = "barret@rstudio.com", comment = c(ORCID = "0000-0001-9986-114X")),
|
||||
person("Yihui", "Xie", role = "aut", email = "yihui@rstudio.com"),
|
||||
person("Jeff", "Allen", role = "aut", email = "jeff@rstudio.com"),
|
||||
person("Jonathan", "McPherson", role = "aut", email = "jonathan@rstudio.com"),
|
||||
person("Alan", "Dipert", role = "aut"),
|
||||
person("Barbara", "Borges", role = "aut"),
|
||||
person("Posit Software, PBC", role = c("cph", "fnd")),
|
||||
person(family = "RStudio", role = "cph"),
|
||||
person(family = "jQuery Foundation", role = "cph",
|
||||
comment = "jQuery library and jQuery UI library"),
|
||||
person(family = "jQuery contributors", role = c("ctb", "cph"),
|
||||
@@ -111,8 +111,7 @@ Suggests:
|
||||
ragg,
|
||||
showtext,
|
||||
sass
|
||||
URL: https://shiny.posit.co/,
|
||||
https://github.com/rstudio/shiny
|
||||
URL: https://shiny.rstudio.com/
|
||||
BugReports: https://github.com/rstudio/shiny/issues
|
||||
Collate:
|
||||
'globals.R'
|
||||
|
||||
58
NEWS.md
58
NEWS.md
@@ -1,48 +1,20 @@
|
||||
# shiny (development version)
|
||||
|
||||
## New features and improvements
|
||||
|
||||
* Updated `selectizeInput()`'s selectize.js dependency from v0.12.4 to v0.15.2. In addition to many bug fixes and improvements, this update also adds several new [plugin options](https://selectize.dev/docs/demos/plugins). (#3875)
|
||||
|
||||
* Shiny's CSS styling for things like `showNotification()`, `withProgress()`, `inputPanel()`, etc., now looks better with `{bslib}`'s upcoming CSS-only dark mode. (#3882)
|
||||
|
||||
## Bug fixes
|
||||
|
||||
* `fileInput()` no longer has unwanted round corners applied to the `buttonLabel`. (#3879)
|
||||
|
||||
# shiny 1.7.5
|
||||
|
||||
## Possibly breaking changes
|
||||
|
||||
* For `reactiveValues()` objects, whenever the `$names()` or `$values()` methods are called, the keys are now returned in the order that they were inserted. (#3774)
|
||||
|
||||
* The value provided to `options(shiny.json.digits)` is now interpreted as number of _digits after the decimal_ instead of _significant digits_. To treat the value as significant digits, wrap it in `I()` (e.g., `options(shiny.json.digits = I(4))`). This new default behavior not only helps with reducing digits in testing snapshots, but is also more consistent with `{jsonlite}`'s default behavior. (#3819)
|
||||
|
||||
## New features and improvements
|
||||
|
||||
* Closed #789: Dynamic UI is now rendered asynchronously, thanks in part to the newly exported `Shiny.renderDependenciesAsync()`, `Shiny.renderHtmlAsync()`, and `Shiny.renderContentAsync()`. Importantly, this means `<script>` tags are now loaded asynchronously (the old way used `XMLHttpRequest`, which is synchronous). In addition, `Shiny` now manages a queue of async tasks (exposed via `Shiny.shinyapp.taskQueue`) so that order of execution is preserved. (#3666)
|
||||
|
||||
* Fixes #3840: `updateSliderInput()` now warns when attempting to set invalid `min`, `max`, or `value` values. Sending an invalid update message to an input no longer causes other update messages to fail. (#3843)
|
||||
|
||||
* `sliderInput()` now has a larger target area for clicking or tapping on the slider handle or range. (#3859)
|
||||
|
||||
* Closed #2956: Component authors can now prevent Shiny from creating an input binding on specific elements by adding the `data-shiny-no-bind-input` attribute to the element. The attribute may have any or no value; its presence will prevent binding. This feature is primarily useful for input component authors who want to use standard HTML input elements without causing Shiny to create an input binding for them. Additionally, Shiny now adds custom classes to its inputs. For example, `checkboxInput()` now has a `shiny-input-checkbox` class. These custom classes may be utilized in future updates to Shiny's input binding logic. (#3861)
|
||||
|
||||
* `Map` objects are now initialized at load time instead of build time. This avoids potential problems that could arise from storing `fastmap` objects into the built Shiny package. (#3775)
|
||||
|
||||
## Bug fixes
|
||||
|
||||
* Fixed #3771: Sometimes the error `ion.rangeSlider.min.js: i.stopPropagation is not a function` would appear in the JavaScript console. (#3772)
|
||||
|
||||
* Fixed #3833: When `width` is provided to `textAreaInput()`, we now correctly set the width of the `<textarea>` element. (#3838)
|
||||
|
||||
|
||||
# shiny 1.7.4.1
|
||||
# shiny 1.7.4.9002
|
||||
|
||||
## Full changelog
|
||||
|
||||
* Closed #3849: In R-devel, a warning was raised when Shiny was loaded because `as.numeric_version()` was called with a number instead of a string. (#3850)
|
||||
### Breaking changes
|
||||
|
||||
### New features and improvements
|
||||
|
||||
* Closed #789: Dynamic UI is now rendered asynchronously, thanks in part to the newly exported `Shiny.renderDependenciesAsync()`, `Shiny.renderHtmlAsync()`, and `Shiny.renderContentAsync()`. Importantly, this means `<script>` tags are now loaded asynchronously (the old way used `XMLHttpRequest`, which is synchronous). In addition, `Shiny` now manages a queue of async tasks (exposed via `Shiny.shinyapp.taskQueue`) so that order of execution is preserved. (#3666)
|
||||
|
||||
* For `reactiveValues()` objects, whenever the `$names()` or `$values()` methods are called, the keys are now returned in the order that they were inserted. (#3774)
|
||||
|
||||
* `Map` objects are now initialized at load time instead of build time. This avoids potential problems that could arise from storing `fastmap` objects into the built Shiny package. (#3775)
|
||||
|
||||
### Bug fixes
|
||||
|
||||
* Fixed #3771: Sometimes the error `ion.rangeSlider.min.js: i.stopPropagation is not a function` would appear in the JavaScript console. (#3772)
|
||||
|
||||
# shiny 1.7.4
|
||||
|
||||
@@ -193,7 +165,7 @@ This release focuses on improvements in three main areas:
|
||||
|
||||
1. Better theming (and Bootstrap 4) support:
|
||||
* The `theme` argument of `fluidPage()`, `navbarPage()`, and `bootstrapPage()` all now understand `bslib::bs_theme()` objects, which can be used to opt-into Bootstrap 4, use any Bootswatch theme, and/or implement custom themes without writing any CSS.
|
||||
* The `session` object now includes `$setCurrentTheme()` and `$getCurrentTheme()` methods to dynamically update (or obtain) the page's `theme` after initial load, which is useful for things such as [adding a dark mode switch to an app](https://rstudio.github.io/bslib/articles/theming.html#dynamic) or some other "real-time" theming tool like `bslib::bs_themer()`.
|
||||
* The `session` object now includes `$setCurrentTheme()` and `$getCurrentTheme()` methods to dynamically update (or obtain) the page's `theme` after initial load, which is useful for things such as [adding a dark mode switch to an app](https://rstudio.github.io/bslib/articles/bslib.html#dynamic) or some other "real-time" theming tool like `bslib::bs_themer()`.
|
||||
* For more details, see [`{bslib}`'s website](https://rstudio.github.io/bslib/)
|
||||
|
||||
2. Caching of `reactive()` and `render*()` (e.g. `renderText()`, `renderTable()`, etc) expressions.
|
||||
@@ -586,7 +558,7 @@ This is a significant release for Shiny, with a major new feature that was nearl
|
||||
|
||||
* Fixed #1600: URL-encoded bookmarking did not work with sliders that had dates or date-times. (#1961)
|
||||
|
||||
* Fixed #1962: [File dragging and dropping](https://posit.co/blog/shiny-1-0-4/) broke in the presence of jQuery version 3.0 as introduced by the [rhandsontable](https://jrowen.github.io/rhandsontable/) [htmlwidget](https://www.htmlwidgets.org/). (#2005)
|
||||
* Fixed #1962: [File dragging and dropping](https://www.rstudio.com/blog/shiny-1-0-4/) broke in the presence of jQuery version 3.0 as introduced by the [rhandsontable](https://jrowen.github.io/rhandsontable/) [htmlwidget](https://www.htmlwidgets.org/). (#2005)
|
||||
|
||||
* Improved the error handling inside the `addResourcePath()` function, to give end users more informative error messages when the `directoryPath` argument cannot be normalized. This is especially useful for `runtime: shiny_prerendered` Rmd documents, like `learnr` tutorials. (#1968)
|
||||
|
||||
|
||||
@@ -159,8 +159,8 @@ utils::globalVariables(".GenericCallEnv", add = TRUE)
|
||||
#' ```
|
||||
#'
|
||||
#' To use different settings for a session-scoped cache, you can set
|
||||
#' `session$cache` at the top of your server function. By default, it will
|
||||
#' create a 200 MB memory cache for each session, but you can replace it with
|
||||
#' `self$cache` at the top of your server function. By default, it will create
|
||||
#' a 200 MB memory cache for each session, but you can replace it with
|
||||
#' something different. To use the session-scoped cache, you must also call
|
||||
#' `bindCache()` with `cache="session"`. This will create a 100 MB cache for
|
||||
#' the session:
|
||||
|
||||
@@ -374,7 +374,8 @@ collapseSizes <- function(padding) {
|
||||
#' @param inverse `TRUE` to use a dark background and light text for the
|
||||
#' navigation bar
|
||||
#' @param collapsible `TRUE` to automatically collapse the navigation
|
||||
#' elements into an expandable menu on mobile devices or narrow window widths.
|
||||
#' elements into a menu when the width of the browser is less than 940 pixels
|
||||
#' (useful for viewing on smaller touchscreen device)
|
||||
#' @param fluid `TRUE` to use a fluid layout. `FALSE` to use a fixed
|
||||
#' layout.
|
||||
#' @param windowTitle the browser window title (as a character string). The
|
||||
|
||||
@@ -16,6 +16,12 @@
|
||||
s3_register("knitr::knit_print", "reactive")
|
||||
s3_register("knitr::knit_print", "shiny.appobj")
|
||||
s3_register("knitr::knit_print", "shiny.render.function")
|
||||
|
||||
# Shiny 1.4.0 bumps jQuery 1.x to 3.x, which caused a problem
|
||||
# with static-rendering of htmlwidgets, and htmlwidgets 1.5
|
||||
# includes a fix for this problem
|
||||
# https://github.com/rstudio/shiny/issues/2630
|
||||
register_upgrade_message("htmlwidgets", 1.5)
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ checkboxInput <- function(inputId, label, value = FALSE, width = NULL) {
|
||||
|
||||
value <- restoreInput(id = inputId, default = value)
|
||||
|
||||
inputTag <- tags$input(id = inputId, type="checkbox", class = "shiny-input-checkbox")
|
||||
inputTag <- tags$input(id = inputId, type="checkbox")
|
||||
if (!is.null(value) && value)
|
||||
inputTag$attribs$checked <- "checked"
|
||||
|
||||
|
||||
@@ -2,13 +2,8 @@
|
||||
#'
|
||||
#' Create a file upload control that can be used to upload one or more files.
|
||||
#'
|
||||
#' Whenever a file upload completes, the corresponding input variable is set to
|
||||
#' a dataframe. See the `Server value` section.
|
||||
#'
|
||||
#' Each time files are uploaded, they are written to a new random subdirectory
|
||||
#' inside of R's process-level temporary directory. The Shiny user session keeps
|
||||
#' track of all uploads in the session, and when the session ends, Shiny deletes
|
||||
#' all of the subdirectories where files where uploaded to.
|
||||
#' Whenever a file upload completes, the corresponding input variable is set
|
||||
#' to a dataframe. See the `Server value` section.
|
||||
#'
|
||||
#' @family input elements
|
||||
#'
|
||||
@@ -16,21 +11,21 @@
|
||||
#' @param multiple Whether the user should be allowed to select and upload
|
||||
#' multiple files at once. **Does not work on older browsers, including
|
||||
#' Internet Explorer 9 and earlier.**
|
||||
#' @param accept A character vector of "unique file type specifiers" which gives
|
||||
#' the browser a hint as to the type of file the server expects. Many browsers
|
||||
#' use this prevent the user from selecting an invalid file.
|
||||
#' @param accept A character vector of "unique file type specifiers" which
|
||||
#' gives the browser a hint as to the type of file the server expects.
|
||||
#' Many browsers use this prevent the user from selecting an invalid file.
|
||||
#'
|
||||
#' A unique file type specifier can be:
|
||||
#' * A case insensitive extension like `.csv` or `.rds`.
|
||||
#' * A valid MIME type, like `text/plain` or `application/pdf`
|
||||
#' * One of `audio/*`, `video/*`, or `image/*` meaning any audio, video,
|
||||
#' or image type, respectively.
|
||||
#' or image type, respectively.
|
||||
#' @param buttonLabel The label used on the button. Can be text or an HTML tag
|
||||
#' object.
|
||||
#' @param placeholder The text to show before a file has been uploaded.
|
||||
#' @param capture What source to use for capturing image, audio or video data.
|
||||
#' This attribute facilitates user access to a device's media capture
|
||||
#' mechanism, such as a camera, or microphone, from within a file upload
|
||||
#' This attribute facilitates user access to a device's media capture
|
||||
#' mechanism, such as a camera, or microphone, from within a file upload
|
||||
#' control.
|
||||
#'
|
||||
#' A value of `user` indicates that the user-facing camera and/or microphone
|
||||
@@ -72,9 +67,7 @@
|
||||
#' }
|
||||
#'
|
||||
#' @section Server value:
|
||||
#'
|
||||
#' A `data.frame` that contains one row for each selected file, and following
|
||||
#' columns:
|
||||
#' A `data.frame` that contains one row for each selected file, and following columns:
|
||||
#' \describe{
|
||||
#' \item{`name`}{The filename provided by the web browser. This is
|
||||
#' **not** the path to read to get at the actual data that was uploaded
|
||||
@@ -108,7 +101,6 @@ fileInput <- function(inputId, label, multiple = FALSE, accept = NULL,
|
||||
|
||||
inputTag <- tags$input(
|
||||
id = inputId,
|
||||
class = "shiny-input-file",
|
||||
name = inputId,
|
||||
type = "file",
|
||||
# Don't use "display: none;" style, which causes keyboard accessibility issue; instead use the following workaround: https://css-tricks.com/places-its-tempting-to-use-display-none-but-dont/
|
||||
|
||||
@@ -35,7 +35,7 @@ numericInput <- function(inputId, label, value, min = NA, max = NA, step = NA,
|
||||
value <- restoreInput(id = inputId, default = value)
|
||||
|
||||
# build input tag
|
||||
inputTag <- tags$input(id = inputId, type = "number", class="shiny-input-number form-control",
|
||||
inputTag <- tags$input(id = inputId, type = "number", class="form-control",
|
||||
value = formatNoSci(value))
|
||||
if (!is.na(min))
|
||||
inputTag$attribs$min = min
|
||||
|
||||
@@ -35,7 +35,7 @@ passwordInput <- function(inputId, label, value = "", width = NULL,
|
||||
div(class = "form-group shiny-input-container",
|
||||
style = css(width = validateCssUnit(width)),
|
||||
shinyInputLabel(inputId, label),
|
||||
tags$input(id = inputId, type="password", class="shiny-input-password form-control", value=value,
|
||||
tags$input(id = inputId, type="password", class="form-control", value=value,
|
||||
placeholder = placeholder)
|
||||
)
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
#' from a list of values.
|
||||
#'
|
||||
#' By default, `selectInput()` and `selectizeInput()` use the JavaScript library
|
||||
#' \pkg{selectize.js} (<https://selectize.dev/>) instead of
|
||||
#' \pkg{selectize.js} (<https://github.com/selectize/selectize.js>) instead of
|
||||
#' the basic select input element. To use the standard HTML select input
|
||||
#' element, use `selectInput()` with `selectize=FALSE`.
|
||||
#'
|
||||
@@ -106,7 +106,6 @@ selectInput <- function(inputId, label, choices, selected = NULL,
|
||||
# create select tag and add options
|
||||
selectTag <- tags$select(
|
||||
id = inputId,
|
||||
class = "shiny-input-select",
|
||||
class = if (!selectize) "form-control",
|
||||
size = size,
|
||||
selectOptions(choices, selected, inputId, selectize)
|
||||
@@ -173,7 +172,7 @@ needOptgroup <- function(choices) {
|
||||
|
||||
#' @rdname selectInput
|
||||
#' @param ... Arguments passed to `selectInput()`.
|
||||
#' @param options A list of options. See the documentation of \pkg{selectize.js}(<https://selectize.dev/docs/usage>)
|
||||
#' @param options A list of options. See the documentation of \pkg{selectize.js}
|
||||
#' for possible options (character option values inside [base::I()] will
|
||||
#' be treated as literal JavaScript code; see [renderDataTable()]
|
||||
#' for details).
|
||||
@@ -288,7 +287,7 @@ selectizeStaticDependency <- function(version) {
|
||||
#'
|
||||
#' By default, `varSelectInput()` and `selectizeInput()` use the
|
||||
#' JavaScript library \pkg{selectize.js}
|
||||
#' (<https://selectize.dev/>) to instead of the basic
|
||||
#' (<https://github.com/selectize/selectize.js>) to instead of the basic
|
||||
#' select input element. To use the standard HTML select input element, use
|
||||
#' `selectInput()` with `selectize=FALSE`.
|
||||
#'
|
||||
@@ -384,7 +383,7 @@ varSelectInput <- function(
|
||||
|
||||
#' @rdname varSelectInput
|
||||
#' @param ... Arguments passed to `varSelectInput()`.
|
||||
#' @param options A list of options. See the documentation of \pkg{selectize.js}(<https://selectize.dev/docs/usage>)
|
||||
#' @param options A list of options. See the documentation of \pkg{selectize.js}
|
||||
#' for possible options (character option values inside [base::I()] will
|
||||
#' be treated as literal JavaScript code; see [renderDataTable()]
|
||||
#' for details).
|
||||
|
||||
@@ -42,7 +42,7 @@ textInput <- function(inputId, label, value = "", width = NULL,
|
||||
div(class = "form-group shiny-input-container",
|
||||
style = css(width = validateCssUnit(width)),
|
||||
shinyInputLabel(inputId, label),
|
||||
tags$input(id = inputId, type="text", class="shiny-input-text form-control", value=value,
|
||||
tags$input(id = inputId, type="text", class="form-control", value=value,
|
||||
placeholder = placeholder)
|
||||
)
|
||||
}
|
||||
|
||||
@@ -52,7 +52,7 @@ textAreaInput <- function(inputId, label, value = "", width = NULL, height = NUL
|
||||
|
||||
style <- css(
|
||||
# The width is specified on the parent div.
|
||||
width = if (!is.null(width)) "100%",
|
||||
width = if (!is.null(width)) "width: 100%;",
|
||||
height = validateCssUnit(height),
|
||||
resize = resize
|
||||
)
|
||||
@@ -62,7 +62,7 @@ textAreaInput <- function(inputId, label, value = "", width = NULL, height = NUL
|
||||
style = if (!is.null(width)) paste0("width: ", validateCssUnit(width), ";"),
|
||||
tags$textarea(
|
||||
id = inputId,
|
||||
class = "shiny-input-textarea form-control",
|
||||
class = "form-control",
|
||||
placeholder = placeholder,
|
||||
style = style,
|
||||
rows = rows,
|
||||
|
||||
8
R/map.R
8
R/map.R
@@ -48,9 +48,9 @@ Map <- R6Class(
|
||||
)
|
||||
)
|
||||
|
||||
as.list.Map <- function(x, ...) {
|
||||
x$values()
|
||||
as.list.Map <- function(map) {
|
||||
map$values()
|
||||
}
|
||||
length.Map <- function(x) {
|
||||
x$size()
|
||||
length.Map <- function(map) {
|
||||
map$size()
|
||||
}
|
||||
|
||||
@@ -2187,8 +2187,8 @@ maskReactiveContext <- function(expr) {
|
||||
#' @param autoDestroy If `TRUE` (the default), the observer will be
|
||||
#' automatically destroyed when its domain (if any) ends.
|
||||
#' @param ignoreNULL Whether the action should be triggered (or value
|
||||
#' calculated, in the case of `eventReactive`) when the input event expression
|
||||
#' is `NULL`. See Details.
|
||||
#' calculated, in the case of `eventReactive`) when the input is
|
||||
#' `NULL`. See Details.
|
||||
#' @param ignoreInit If `TRUE`, then, when this `observeEvent` is
|
||||
#' first created/initialized, ignore the `handlerExpr` (the second
|
||||
#' argument), whether it is otherwise supposed to run or not. The default is
|
||||
|
||||
@@ -90,9 +90,8 @@ getShinyOption <- function(name, default = NULL) {
|
||||
#' \item{shiny.jquery.version (defaults to `3`)}{The major version of jQuery to use.
|
||||
#' Currently only values of `3` or `1` are supported. If `1`, then jQuery 1.12.4 is used. If `3`,
|
||||
#' then jQuery `r version_jquery` is used.}
|
||||
#' \item{shiny.json.digits (defaults to `I(16)`)}{Max number of digits to use when converting
|
||||
#' numbers to JSON format to send to the client web browser. Use [I()] to specify significant digits.
|
||||
#' Use `NA` for max precision.}
|
||||
#' \item{shiny.json.digits (defaults to `16`)}{The number of digits to use when converting
|
||||
#' numbers to JSON format to send to the client web browser.}
|
||||
#' \item{shiny.launch.browser (defaults to `interactive()`)}{A boolean which controls the default behavior
|
||||
#' when an app is run. See [runApp()] for more information.}
|
||||
#' \item{shiny.mathjax.url (defaults to `"https://mathjax.rstudio.com/latest/MathJax.js"`)}{
|
||||
|
||||
@@ -34,11 +34,3 @@ NULL
|
||||
# since we call require(shiny) as part of loading the app.
|
||||
#' @import methods
|
||||
NULL
|
||||
|
||||
|
||||
# For usethis::use_release_issue()
|
||||
release_bullets <- function() {
|
||||
c(
|
||||
"Update static imports: `staticimports::import()`"
|
||||
)
|
||||
}
|
||||
|
||||
@@ -33,12 +33,8 @@ createUniqueId <- function(bytes, prefix = "", suffix = "") {
|
||||
}
|
||||
|
||||
toJSON <- function(x, ..., dataframe = "columns", null = "null", na = "null",
|
||||
auto_unbox = TRUE,
|
||||
# Shiny has had a legacy value of 16 significant digits
|
||||
# We can use `I(16)` mixed with the default behavior in jsonlite's `use_signif=`
|
||||
# https://github.com/jeroen/jsonlite/commit/728efa9
|
||||
digits = getOption("shiny.json.digits", I(16)), use_signif = is(digits, "AsIs"),
|
||||
force = TRUE, POSIXt = "ISO8601", UTC = TRUE,
|
||||
auto_unbox = TRUE, digits = getOption("shiny.json.digits", 16),
|
||||
use_signif = TRUE, force = TRUE, POSIXt = "ISO8601", UTC = TRUE,
|
||||
rownames = FALSE, keep_vec_names = TRUE, strict_atomic = TRUE) {
|
||||
|
||||
if (strict_atomic) {
|
||||
|
||||
@@ -42,20 +42,36 @@ get_package_version <- function(pkg) {
|
||||
|
||||
is_installed <- function(pkg, version = NULL) {
|
||||
installed <- isNamespaceLoaded(pkg) || nzchar(system_file_cached(package = pkg))
|
||||
|
||||
if (is.null(version)) {
|
||||
return(installed)
|
||||
}
|
||||
installed && isTRUE(get_package_version(pkg) >= version)
|
||||
}
|
||||
|
||||
if (!is.character(version) && !inherits(version, "numeric_version")) {
|
||||
# Avoid https://bugs.r-project.org/show_bug.cgi?id=18548
|
||||
alert <- if (identical(Sys.getenv("TESTTHAT"), "true")) stop else warning
|
||||
alert("`version` must be a character string or a `package_version` or `numeric_version` object.")
|
||||
register_upgrade_message <- function(pkg, version, error = FALSE) {
|
||||
|
||||
version <- numeric_version(sprintf("%0.9g", version))
|
||||
msg <- sprintf(
|
||||
"This version of '%s' is designed to work with '%s' >= %s.
|
||||
Please upgrade via install.packages('%s').",
|
||||
environmentName(environment(register_upgrade_message)),
|
||||
pkg, version, pkg
|
||||
)
|
||||
|
||||
cond <- if (error) stop else packageStartupMessage
|
||||
|
||||
if (pkg %in% loadedNamespaces() && !is_installed(pkg, version)) {
|
||||
cond(msg)
|
||||
}
|
||||
|
||||
installed && isTRUE(get_package_version(pkg) >= version)
|
||||
# Always register hook in case pkg is loaded at some
|
||||
# point the future (or, potentially, but less commonly,
|
||||
# unloaded & reloaded)
|
||||
setHook(
|
||||
packageEvent(pkg, "onLoad"),
|
||||
function(...) {
|
||||
if (!is_installed(pkg, version)) cond(msg)
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
# Simplified version rlang:::s3_register() that just uses
|
||||
@@ -174,9 +190,11 @@ system_file <- function(..., package = "base") {
|
||||
normalizePath(files, winslash = "/")
|
||||
}
|
||||
|
||||
# A wrapper for `system.file()`, which caches the package path because
|
||||
# `system.file()` can be slow. If a package is not installed, the result won't
|
||||
# be cached.
|
||||
# A wrapper for `system.file()`, which caches the results, because
|
||||
# `system.file()` can be slow. Note that because of caching, if
|
||||
# `system_file_cached()` is called on a package that isn't installed, then the
|
||||
# package is installed, and then `system_file_cached()` is called again, it will
|
||||
# still return "".
|
||||
system_file_cached <- local({
|
||||
pkg_dir_cache <- character()
|
||||
|
||||
@@ -188,9 +206,7 @@ system_file_cached <- local({
|
||||
not_cached <- is.na(match(package, names(pkg_dir_cache)))
|
||||
if (not_cached) {
|
||||
pkg_dir <- system.file(package = package)
|
||||
if (nzchar(pkg_dir)) {
|
||||
pkg_dir_cache[[package]] <<- pkg_dir
|
||||
}
|
||||
pkg_dir_cache[[package]] <<- pkg_dir
|
||||
} else {
|
||||
pkg_dir <- pkg_dir_cache[[package]]
|
||||
}
|
||||
|
||||
@@ -423,23 +423,6 @@ updateSliderInput <- function(session = getDefaultReactiveDomain(), inputId, lab
|
||||
{
|
||||
validate_session_object(session)
|
||||
|
||||
if (!is.null(value)) {
|
||||
if (!is.null(min) && !is.null(max)) {
|
||||
# Validate value/min/max together if all three are provided
|
||||
tryCatch(
|
||||
validate_slider_value(min, max, value, "updateSliderInput"),
|
||||
error = function(err) warning(conditionMessage(err), call. = FALSE)
|
||||
)
|
||||
} else if (length(value) < 1 || length(value) > 2 || any(is.na(value))) {
|
||||
# Otherwise ensure basic assumptions about value are met
|
||||
warning(
|
||||
"In updateSliderInput(): value must be a single value or a length-2 ",
|
||||
"vector and cannot contain NA values.",
|
||||
call. = FALSE
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
# If no min/max/value is provided, we won't know the
|
||||
# type, and this will return an empty string
|
||||
dataType <- getSliderType(min, max, value)
|
||||
|
||||
@@ -4,7 +4,7 @@ NULL
|
||||
|
||||
# @staticimports pkg:staticimports
|
||||
# is_installed get_package_version system_file
|
||||
# s3_register
|
||||
# s3_register register_upgrade_message
|
||||
# any_named any_unnamed
|
||||
|
||||
#' Make a random number generator repeatable
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
# Generated by tools/updateSelectize.R; do not edit by hand
|
||||
version_selectize <- "0.15.2"
|
||||
version_selectize <- "0.12.4"
|
||||
|
||||
@@ -16,7 +16,7 @@ Easily build rich and productive interactive web apps in R — no HTML/CSS/J
|
||||
* A prebuilt set of highly sophisticated, customizable, and easy-to-use widgets (e.g., plots, tables, sliders, dropdowns, date pickers, and more).
|
||||
* An attractive default look based on [Bootstrap](https://getbootstrap.com/) which can also be easily customized with the [bslib](https://github.com/rstudio/bslib) package or avoided entirely with more direct R bindings to HTML/CSS/JavaScript.
|
||||
* Seamless integration with [R Markdown](https://shiny.rstudio.com/articles/interactive-docs.html), making it easy to embed numerous applications natively within a larger dynamic document.
|
||||
* Tools for improving and monitoring performance, including native support for [async programming](https://posit.co/blog/shiny-1-1-0/), [caching](https://talks.cpsievert.me/20201117), [load testing](https://rstudio.github.io/shinyloadtest/), and more.
|
||||
* Tools for improving and monitoring performance, including native support for [async programming](https://www.rstudio.com/blog/shiny-1-1-0/), [caching](https://talks.cpsievert.me/20201117), [load testing](https://rstudio.github.io/shinyloadtest/), and more.
|
||||
* [Modules](https://shiny.rstudio.com/articles/modules.html): a framework for reducing code duplication and complexity.
|
||||
* An ability to [bookmark application state](https://shiny.rstudio.com/articles/bookmarking-state.html) and/or [generate code to reproduce output(s)](https://github.com/rstudio/shinymeta).
|
||||
* A rich ecosystem of extension packages for more [custom widgets](http://www.htmlwidgets.org/), [input validation](https://github.com/rstudio/shinyvalidate), [unit testing](https://github.com/rstudio/shinytest), and more.
|
||||
@@ -45,10 +45,6 @@ For more examples and inspiration, check out the [Shiny User Gallery](https://sh
|
||||
|
||||
For help with learning fundamental Shiny programming concepts, check out the [Mastering Shiny](https://mastering-shiny.org/) book and the [Shiny Tutorial](https://shiny.rstudio.com/tutorial/). The former is currently more up-to-date with modern Shiny features, whereas the latter takes a deeper, more visual, dive into fundamental concepts.
|
||||
|
||||
## Join the conversation
|
||||
|
||||
If you want to chat about Shiny, meet other developers, or help us decide what to work on next, [join us on Discord](https://discord.com/invite/yMGCamUMnS).
|
||||
|
||||
## Getting Help
|
||||
|
||||
To ask a question about Shiny, please use the [RStudio Community website](https://community.rstudio.com/new-topic?category=shiny&tags=shiny).
|
||||
|
||||
23
babel.config.json
Normal file
23
babel.config.json
Normal file
@@ -0,0 +1,23 @@
|
||||
{
|
||||
"plugins": [
|
||||
[
|
||||
"@babel/plugin-transform-typescript",
|
||||
{
|
||||
"allowDeclareFields": true
|
||||
}
|
||||
]
|
||||
],
|
||||
"presets": [
|
||||
"@babel/preset-typescript",
|
||||
[
|
||||
"@babel/preset-env",
|
||||
{
|
||||
"useBuiltIns": "usage",
|
||||
"corejs": "3.12"
|
||||
}
|
||||
]
|
||||
],
|
||||
"ignore": [
|
||||
"node_modules/core-js"
|
||||
]
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -1,6 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
/* 'shiny' skin for Ion.RangeSlider, largely based on the 'big' skin, but with smaller dimensions, grayscale grid text, and without gradients
|
||||
© Posit, PBC, 2023
|
||||
© RStudio, Inc, 2014
|
||||
© Denis Ineshin, 2014 https://github.com/IonDen
|
||||
© guybowden, 2014 https://github.com/guybowden
|
||||
@@ -175,18 +174,6 @@
|
||||
background-color: #ededed;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 8px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-line::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: relative;
|
||||
cursor: s-resize;
|
||||
width: 100%;
|
||||
height: 22px;
|
||||
top: -9px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-bar {
|
||||
@@ -195,24 +182,12 @@
|
||||
border-top: 1px solid #428bca;
|
||||
border-bottom: 1px solid #428bca;
|
||||
background: #428bca;
|
||||
cursor: s-resize;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-bar--single {
|
||||
border-radius: 8px 0 0 8px;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-bar::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 22px;
|
||||
top: -9px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-shadow {
|
||||
top: 38px;
|
||||
height: 2px;
|
||||
@@ -232,7 +207,6 @@
|
||||
background-color: #dedede;
|
||||
box-shadow: 1px 1px 3px rgba(255, 255, 255, 0.3);
|
||||
border-radius: 22px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.irs--shiny .irs-handle.state_hover, .irs--shiny .irs-handle:hover {
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1,5 +1,4 @@
|
||||
/* 'shiny' skin for Ion.RangeSlider, largely based on the 'big' skin, but with smaller dimensions, grayscale grid text, and without gradients
|
||||
© Posit, PBC, 2023
|
||||
© RStudio, Inc, 2014
|
||||
© Denis Ineshin, 2014 https://github.com/IonDen
|
||||
© guybowden, 2014 https://github.com/guybowden
|
||||
@@ -80,19 +79,6 @@ $font-family: $font-family-base !default;
|
||||
background-color: $line_bg_color;
|
||||
border: $line_border;
|
||||
@include border-radius-shim($line_height);
|
||||
|
||||
// Increase the touch target area of the slider line
|
||||
overflow: visible;
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: relative;
|
||||
cursor: s-resize; // downward arrow
|
||||
width: 100%;
|
||||
height: $handle_height;
|
||||
top: -(($handle_height - $line_height / 2) / 2);
|
||||
z-index: 1; // raise touch area above grid
|
||||
}
|
||||
}
|
||||
|
||||
.#{$name}-bar {
|
||||
@@ -101,23 +87,10 @@ $font-family: $font-family-base !default;
|
||||
border-top: 1px solid $bar_color;
|
||||
border-bottom: 1px solid $bar_color;
|
||||
background: $bar_color;
|
||||
cursor: s-resize; // downard arrow, overwritten when a range
|
||||
z-index: 2;
|
||||
|
||||
&--single {
|
||||
@include border-radius-shim($line_height 0 0 $line_height);
|
||||
}
|
||||
|
||||
// Increase the touch target area of the slider bar
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: $handle_height;
|
||||
top: -(($handle_height - $line_height / 2) / 2);
|
||||
z-index: 2; // raise touch area above line touch target
|
||||
}
|
||||
}
|
||||
|
||||
// sliderInput() doesn't currently support from_min/from_max, so this isn't relevant
|
||||
@@ -141,7 +114,6 @@ $font-family: $font-family-base !default;
|
||||
background-color: $handle_color;
|
||||
box-shadow: $handle_box_shadow;
|
||||
border-radius: $handle_width;
|
||||
z-index: 2;
|
||||
|
||||
&.state_hover,
|
||||
&:hover {
|
||||
|
||||
@@ -1 +1 @@
|
||||
Selectize.define("selectize-plugin-a11y",function(c){var t=this,l=13;typeof t.accessibility>"u"&&(t.accessibility={}),t.accessibility.helpers={randomId:function(e){for(var r="",s=e||10,i="abcdefghijklmnopqrstuvwxyz0123456789",n=i.length,a=0;a<s;a++)r+=i[Math.floor(n*Math.random())];return r}},t.accessibility.liveRegion={$region:"",speak:function(e){var r=$("<div></div>");r.text(e),this.$region.html(r)},domListener:function(){var e=new MutationObserver(function(r){r.forEach(function(s){var i=$(s.target);if(i.hasClass("items"))if(i.hasClass("dropdown-active")){t.$control_input.attr("aria-expanded","true");for(var n=t.$dropdown_content[0].children,a=0;a<n.length;a++){var o=n[a].attributes;o.role||n[a].setAttribute("role","option"),o.id||n[a].setAttribute("id",t.accessibility.helpers.randomId())}}else t.$control_input.attr("aria-expanded","false"),t.$control_input.removeAttr("aria-activedescendant");else i.hasClass("active")&&i.attr("data-value")&&(t.$control_input.attr("aria-activedescendant",i.attr("id")),t.accessibility.liveRegion.speak(i.text(),500))})});e.observe(t.$dropdown[0],{attributes:!0,attributeFilter:["class"],subtree:!0,attributeOldValue:!0}),e.observe(t.$control[0],{attributes:!0,attributeFilter:["class"]}),e.observe(t.$control_input[0],{attributes:!0,attributeFilter:["value"]})},setAttributes:function(){this.$region.attr({"aria-live":"assertive",role:"log","aria-relevant":"additions","aria-atomic":"true"})},setStyles:function(){this.$region.css({position:"absolute",width:"1px",height:"1px","margin-top":"-1px",clip:"rect(1px, 1px, 1px, 1px)",overflow:"hidden"})},init:function(){this.$region=$("<div>"),this.setAttributes(),this.setStyles(),$("body").append(this.$region),this.domListener()}},this.setup=function(){var e=t.setup;return function(){e.apply(this,arguments);var r=t.accessibility.helpers.randomId(),s=t.accessibility.helpers.randomId();t.$control.on("keydown",function(i){i.keyCode===l&&(t.settings.openOnFocus?(t.settings.openOnFocus=!1,t.focus(),setTimeout(function(){t.settings.openOnFocus=!0},0)):t.focus())}),t.$control_input.attr({role:"combobox","aria-expanded":"false",haspopup:"listbox","aria-owns":s,"aria-label":t.$wrapper.closest("[data-accessibility-selectize-label]").attr("data-accessibility-selectize-label")}),t.$dropdown_content.attr({role:"listbox",id:s}),t.accessibility.liveRegion.init()}}(),this.destroy=function(){var e=t.destroy;return function(){return t.accessibility.liveRegion.$region.remove(),e.apply(this,arguments)}}()});
|
||||
Selectize.define("selectize-plugin-a11y",function(c){var t=this,l=13;typeof t.accessibility=="undefined"&&(t.accessibility={}),t.accessibility.helpers={randomId:function(e){for(var r="",s=e||10,i="abcdefghijklmnopqrstuvwxyz0123456789",n=i.length,a=0;a<s;a++)r+=i[Math.floor(n*Math.random())];return r}},t.accessibility.liveRegion={$region:"",speak:function(e){var r=$("<div></div>");r.text(e),this.$region.html(r)},domListener:function(){var e=new MutationObserver(function(r){r.forEach(function(s){var i=$(s.target);if(i.hasClass("items"))if(i.hasClass("dropdown-active")){t.$control_input.attr("aria-expanded","true");for(var n=t.$dropdown_content[0].children,a=0;a<n.length;a++){var o=n[a].attributes;o.role||n[a].setAttribute("role","option"),o.id||n[a].setAttribute("id",t.accessibility.helpers.randomId())}}else t.$control_input.attr("aria-expanded","false"),t.$control_input.removeAttr("aria-activedescendant");else i.hasClass("active")&&i.attr("data-value")&&(t.$control_input.attr("aria-activedescendant",i.attr("id")),t.accessibility.liveRegion.speak(i.text(),500))})});e.observe(t.$dropdown[0],{attributes:!0,attributeFilter:["class"],subtree:!0,attributeOldValue:!0}),e.observe(t.$control[0],{attributes:!0,attributeFilter:["class"]}),e.observe(t.$control_input[0],{attributes:!0,attributeFilter:["value"]})},setAttributes:function(){this.$region.attr({"aria-live":"assertive",role:"log","aria-relevant":"additions","aria-atomic":"true"})},setStyles:function(){this.$region.css({position:"absolute",width:"1px",height:"1px","margin-top":"-1px",clip:"rect(1px, 1px, 1px, 1px)",overflow:"hidden"})},init:function(){this.$region=$("<div>"),this.setAttributes(),this.setStyles(),$("body").append(this.$region),this.domListener()}},this.setup=function(){var e=t.setup;return function(){e.apply(this,arguments);var r=t.accessibility.helpers.randomId(),s=t.accessibility.helpers.randomId();t.$control.on("keydown",function(i){i.keyCode===l&&(t.settings.openOnFocus?(t.settings.openOnFocus=!1,t.focus(),setTimeout(function(){t.settings.openOnFocus=!0},0)):t.focus())}),t.$control_input.attr({role:"combobox","aria-expanded":"false",haspopup:"listbox","aria-owns":s,"aria-label":t.$wrapper.closest("[data-accessibility-selectize-label]").attr("data-accessibility-selectize-label")}),t.$dropdown_content.attr({role:"listbox",id:s}),t.accessibility.liveRegion.init()}}(),this.destroy=function(){var e=t.destroy;return function(){return t.accessibility.liveRegion.$region.remove(),e.apply(this,arguments)}}()});
|
||||
|
||||
File diff suppressed because one or more lines are too long
35
inst/www/shared/selectize/js/selectize.min.js
vendored
35
inst/www/shared/selectize/js/selectize.min.js
vendored
File diff suppressed because one or more lines are too long
@@ -1,16 +0,0 @@
|
||||
.#{selectize}-dropdown.plugin-auto_position.#{$selectize}-position-top {
|
||||
border-top: 1px solid $select-color-border;
|
||||
border-bottom: 0 none;
|
||||
border-radius: 3px 3px 0 0;
|
||||
box-shadow: 0 -6px 12px rgba(var(--bs-body-color-rgb, 0,0,0), .18);
|
||||
}
|
||||
|
||||
.#{selectize}-control.plugin-auto_position .#{selectize}-input.#{$selectize}-position-top.dropdown-active {
|
||||
border-radius: 0 0 3px 3px;
|
||||
border-top: 0 none;
|
||||
|
||||
&::before {
|
||||
top: 0;
|
||||
bottom: unset;
|
||||
}
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
.#{$selectize}-control.plugin-clear_button {
|
||||
.clear {
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 25px;
|
||||
top: 0;
|
||||
right: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
color: var(--bs-body-color, black);
|
||||
opacity: 0.4;
|
||||
font-weight: bold;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
font-size: 21px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.clear:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&.single .clear {
|
||||
right: calc(#{$select-padding-x} - #{$select-padding-item-x} + 1.5rem);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,19 +1,16 @@
|
||||
.#{$selectize}-control.plugin-drag_drop {
|
||||
&.multi > .#{$selectize}-input.dragging {
|
||||
overflow: visible;
|
||||
}
|
||||
&.multi > .#{$selectize}-input > div.ui-sortable-placeholder {
|
||||
visibility: visible !important;
|
||||
background: #f2f2f2 !important;
|
||||
background: rgba(0, 0, 0, 0.06) !important;
|
||||
border: 0 none !important;
|
||||
box-shadow: inset 0 0 12px 4px #fff;
|
||||
.selectize-control.plugin-drag_drop {
|
||||
&.multi > .selectize-input > div.ui-sortable-placeholder {
|
||||
visibility: visible !important;
|
||||
background: #f2f2f2 !important;
|
||||
background: rgba(0,0,0,0.06) !important;
|
||||
border: 0 none !important;
|
||||
@include selectize-box-shadow(inset 0 0 12px 4px #fff);
|
||||
}
|
||||
.ui-sortable-placeholder::after {
|
||||
content: "!";
|
||||
visibility: hidden;
|
||||
content: '!';
|
||||
visibility: hidden;
|
||||
}
|
||||
.ui-sortable-helper {
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
||||
@include selectize-box-shadow(0 2px 5px rgba(0,0,0,0.2));
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,24 +1,20 @@
|
||||
.#{$selectize}-dropdown.plugin-dropdown_header {
|
||||
.#{$selectize}-dropdown-header {
|
||||
position: relative;
|
||||
padding: ($select-padding-dropdown-item-y * 2)
|
||||
$select-padding-dropdown-item-x;
|
||||
border-bottom: 1px solid $select-color-border;
|
||||
background: RGBA($select-color-dropdown, 0.15);
|
||||
border-radius: $select-border-radius $select-border-radius 0 0;
|
||||
}
|
||||
.#{$selectize}-dropdown-header-close {
|
||||
position: absolute;
|
||||
right: $select-padding-dropdown-item-x;
|
||||
top: 50%;
|
||||
color: $select-color-text;
|
||||
opacity: 0.4;
|
||||
margin-top: -12px;
|
||||
line-height: 20px;
|
||||
font-size: 20px !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
.#{$selectize}-dropdown-header-close:hover {
|
||||
color: RGB($select-color-rgb);
|
||||
}
|
||||
.selectize-dropdown-header {
|
||||
position: relative;
|
||||
padding: $selectize-padding-dropdown-item-y $selectize-padding-dropdown-item-x;
|
||||
border-bottom: 1px solid $selectize-color-border;
|
||||
background: mix($selectize-color-dropdown, $selectize-color-border, 85%);
|
||||
@include selectize-border-radius($selectize-border-radius $selectize-border-radius 0 0);
|
||||
}
|
||||
.selectize-dropdown-header-close {
|
||||
position: absolute;
|
||||
right: $selectize-padding-dropdown-item-x;
|
||||
top: 50%;
|
||||
color: $selectize-color-text;
|
||||
opacity: 0.4;
|
||||
margin-top: -12px;
|
||||
line-height: 20px;
|
||||
font-size: 20px !important;
|
||||
}
|
||||
.selectize-dropdown-header-close:hover {
|
||||
color: darken($selectize-color-text, 25%);
|
||||
}
|
||||
@@ -1,22 +1,17 @@
|
||||
.#{$selectize}-dropdown.plugin-optgroup_columns {
|
||||
.#{$selectize}-dropdown-content {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.selectize-dropdown.plugin-optgroup_columns {
|
||||
.optgroup {
|
||||
border-right: 1px solid #f2f2f2;
|
||||
border-top: 0 none;
|
||||
flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
min-width: 0;
|
||||
border-right: 1px solid #f2f2f2;
|
||||
border-top: 0 none;
|
||||
float: left;
|
||||
@include selectize-box-sizing(border-box);
|
||||
}
|
||||
.optgroup:last-child {
|
||||
border-right: 0 none;
|
||||
border-right: 0 none;
|
||||
}
|
||||
.optgroup:before {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
.optgroup-header {
|
||||
border-top: 0 none;
|
||||
border-top: 0 none;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,38 +1,43 @@
|
||||
.#{$selectize}-control.plugin-remove_button {
|
||||
.item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding-right: 0 !important;
|
||||
.selectize-control.plugin-remove_button {
|
||||
[data-value] {
|
||||
position: relative;
|
||||
padding-right: 24px !important;
|
||||
}
|
||||
|
||||
.item .remove {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
padding: $select-padding-item-y $select-padding-item-x;
|
||||
border-left: 1px solid $select-color-item-border;
|
||||
border-radius: 0 2px 2px 0;
|
||||
box-sizing: border-box;
|
||||
margin-left: $select-padding-item-x;
|
||||
[data-value] .remove {
|
||||
z-index: 1; /* fixes ie bug (see #392) */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 17px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
padding: $selectize-padding-item-y 0 0 0;
|
||||
border-left: 1px solid $selectize-color-item-border;
|
||||
@include selectize-border-radius(0 2px 2px 0);
|
||||
@include selectize-box-sizing(border-box);
|
||||
}
|
||||
|
||||
.item .remove:hover {
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
[data-value] .remove:hover {
|
||||
background: rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.item.active .remove {
|
||||
border-left-color: $select-color-item-active-border;
|
||||
[data-value].active .remove {
|
||||
border-left-color: $selectize-color-item-active-border;
|
||||
}
|
||||
|
||||
.disabled .item .remove:hover {
|
||||
background: none;
|
||||
.disabled [data-value] .remove:hover {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.disabled .item .remove {
|
||||
border-left-color: lighten(
|
||||
desaturate($select-color-item-border, 100%),
|
||||
$select-lighten-disabled-item-border
|
||||
);
|
||||
.disabled [data-value] .remove {
|
||||
border-left-color: lighten(desaturate($selectize-color-item-border, 100%), $selectize-lighten-disabled-item-border);
|
||||
}
|
||||
.remove-single {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
font-size: 23px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,136 +1,158 @@
|
||||
/**
|
||||
* selectize.bootstrap3.css (v0.12.3) - Bootstrap 3 Theme
|
||||
* Copyright (c) 2013–2015 Brian Reavis & contributors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
|
||||
* file except in compliance with the License. You may obtain a copy of the License at:
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software distributed under
|
||||
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
|
||||
* ANY KIND, either express or implied. See the License for the specific language
|
||||
* governing permissions and limitations under the License.
|
||||
*
|
||||
* @author Brian Reavis <brian@thirdroute.com>
|
||||
*/
|
||||
|
||||
$select-font-family: inherit;
|
||||
$select-font-size: inherit;
|
||||
$select-line-height: $line-height-computed;
|
||||
$selectize-font-family: inherit !default;
|
||||
$selectize-font-size: inherit !default;
|
||||
$selectize-line-height: $line-height-computed !default;
|
||||
|
||||
$select-color-text: $text-color;
|
||||
$select-color-highlight: rgba(255, 237, 40, 0.4);
|
||||
$select-color-input: $input-bg;
|
||||
$select-color-input-full: $input-bg;
|
||||
$select-color-input-error: $state-danger-text;
|
||||
$select-color-input-error-focus: darken($select-color-input-error, 10%);
|
||||
$select-color-disabled: $input-bg;
|
||||
$select-color-item: RGBA($select-color-text, 0.1);
|
||||
$select-color-item-border: rgba(0, 0, 0, 0);
|
||||
$select-color-item-active: $component-active-bg;
|
||||
$select-color-item-active-text: color-contrast($select-color-item-active);
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0);
|
||||
$select-color-optgroup: $dropdown-bg;
|
||||
$select-color-optgroup-text: $dropdown-header-color;
|
||||
$select-color-optgroup-border: $dropdown-divider-bg;
|
||||
$select-color-dropdown: $dropdown-bg;
|
||||
$select-color-dropdown-border-top: mix($input-border, $input-bg, 80%);
|
||||
$select-color-dropdown-item-active: $dropdown-link-hover-bg;
|
||||
$select-color-dropdown-item-active-text: $dropdown-link-hover-color;
|
||||
$select-color-dropdown-item-create-active-text: $dropdown-link-hover-color;
|
||||
$select-opacity-disabled: 0.5;
|
||||
$select-shadow-input: none;
|
||||
$select-shadow-input-focus: inset 0 1px 2px rgba(0, 0, 0, 0.15);
|
||||
$select-shadow-input-error: inset 0 1px 1px rgba(0, 0, 0, 0.075);
|
||||
$select-shadow-input-error-focus: inset 0 1px 1px rgba(0, 0, 0, 0.075),
|
||||
0 0 6px lighten($select-color-input-error, 20%);
|
||||
$select-border: 1px solid $input-border;
|
||||
$select-border-radius: $input-border-radius;
|
||||
$selectize-color-text: $input-color !default;
|
||||
$selectize-color-highlight: rgba(255,237,40,0.4) !default;
|
||||
$selectize-color-input: $input-bg !default;
|
||||
$selectize-color-input-full: $input-bg !default;
|
||||
$selectize-color-input-error: $state-danger-text !default;
|
||||
$selectize-color-input-error-focus: darken($selectize-color-input-error, 10%) !default;
|
||||
$selectize-color-disabled: $input-bg !default;
|
||||
$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
$selectize-color-item-border: rgba(black, 0) !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
$selectize-color-item-active-text: color-contrast($selectize-color-item-active) !default;
|
||||
$selectize-color-item-active-border: rgba(black, 0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
$selectize-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$selectize-color-dropdown: $dropdown-bg !default;
|
||||
$selectize-color-dropdown-text: $dropdown-link-color !default;
|
||||
$selectize-color-dropdown-border-top: mix($input-border, $input-bg, 0.8) !default;
|
||||
$selectize-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$selectize-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
$selectize-color-dropdown-item-create-active-text: $dropdown-link-hover-color !default;
|
||||
$selectize-opacity-disabled: 0.5 !default;
|
||||
$selectize-shadow-input: none !default;
|
||||
$selectize-shadow-input-focus: inset 0 1px 2px rgba(black, 0.15) !default;
|
||||
$selectize-shadow-input-error: inset 0 1px 1px rgba(black, .075) !default;
|
||||
$selectize-shadow-input-error-focus: inset 0 1px 1px rgba(black, .075), 0 0 6px lighten($selectize-color-input-error, 20%) !default;
|
||||
$selectize-border: 1px solid $input-border !default;
|
||||
$selectize-border-radius: $input-border-radius !default;
|
||||
|
||||
$select-width-item-border: 0px;
|
||||
$select-padding-x: $padding-base-horizontal;
|
||||
$select-padding-y: $padding-base-vertical;
|
||||
$select-padding-dropdown-item-x: $padding-base-horizontal;
|
||||
$select-padding-dropdown-item-y: 3px;
|
||||
$select-padding-item-x: 5px;
|
||||
$select-padding-item-y: 1px;
|
||||
$select-margin-item-x: 3px;
|
||||
$select-margin-item-y: 3px;
|
||||
$selectize-width-item-border: 0 !default;
|
||||
$selectize-padding-x: $padding-base-horizontal !default;
|
||||
$selectize-padding-y: $padding-base-vertical !default;
|
||||
$selectize-padding-dropdown-item-x: $padding-base-horizontal !default;
|
||||
$selectize-padding-dropdown-item-y: 3px !default;
|
||||
$selectize-padding-item-x: 3px !default;
|
||||
$selectize-padding-item-y: 1px !default;
|
||||
$selectize-margin-item-x: 3px !default;
|
||||
$selectize-margin-item-y: 3px !default;
|
||||
$selectize-caret-margin: 0 !default;
|
||||
|
||||
$select-arrow-size: 5px;
|
||||
$select-arrow-color: $select-color-text;
|
||||
$select-arrow-offset: $select-padding-x + 5px;
|
||||
$selectize-arrow-size: 5px !default;
|
||||
$selectize-arrow-color: $selectize-color-text !default;
|
||||
$selectize-arrow-offset: $selectize-padding-x + 5px !default;
|
||||
|
||||
@import "selectize";
|
||||
|
||||
.#{$selectize}-dropdown,
|
||||
.#{$selectize}-dropdown.form-control {
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $select-color-dropdown;
|
||||
border: 1px solid $dropdown-fallback-border;
|
||||
border: 1px solid $dropdown-border;
|
||||
border-radius: $border-radius-base;
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
//Import Plugins
|
||||
@import "plugins/drag_drop";
|
||||
@import "plugins/dropdown_header";
|
||||
@import "plugins/optgroup_columns";
|
||||
@import "plugins/remove_button";
|
||||
|
||||
.selectize-dropdown, .selectize-dropdown.form-control {
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $selectize-color-dropdown;
|
||||
color: $selectize-color-dropdown-text;
|
||||
border: 1px solid $dropdown-fallback-border;
|
||||
border: 1px solid $dropdown-border;
|
||||
@include selectize-border-radius ($border-radius-base);
|
||||
@include selectize-box-shadow (0 6px 12px rgba(black, .175));
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown {
|
||||
.optgroup-header {
|
||||
font-size: $font-size-small;
|
||||
line-height: $line-height-base;
|
||||
}
|
||||
.optgroup:first-child:before {
|
||||
display: none;
|
||||
}
|
||||
.optgroup:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
@include nav-divider();
|
||||
margin-left: $select-padding-dropdown-item-x * -1;
|
||||
margin-right: $select-padding-dropdown-item-x * -1;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-content {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-emptyoptionlabel {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.#{$selectize}-input {
|
||||
min-height: $input-height-base;
|
||||
|
||||
&.dropdown-active {
|
||||
border-radius: $select-border-radius;
|
||||
}
|
||||
&.dropdown-active::before {
|
||||
display: none;
|
||||
}
|
||||
&.focus {
|
||||
$color: $input-border-focus;
|
||||
$color-rgba: rgba(red($color), green($color), blue($color), 0.6);
|
||||
border-color: $color;
|
||||
outline: 0;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px $color-rgba;
|
||||
}
|
||||
}
|
||||
|
||||
.has-error .#{$selectize}-input {
|
||||
border-color: $select-color-input-error;
|
||||
box-shadow: $select-shadow-input-error;
|
||||
|
||||
&:focus {
|
||||
border-color: $select-color-input-error-focus;
|
||||
box-shadow: $select-shadow-input-error-focus;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control {
|
||||
&.multi {
|
||||
.#{$selectize}-input.has-items {
|
||||
padding-left: $select-padding-x - $select-padding-item-x;
|
||||
padding-right: $select-padding-x - $select-padding-item-x;
|
||||
.selectize-dropdown {
|
||||
.optgroup-header {
|
||||
font-size: $font-size-small;
|
||||
line-height: $line-height-base;
|
||||
}
|
||||
.#{$selectize}-input > div {
|
||||
border-radius: $select-border-radius - 1px;
|
||||
.optgroup:first-child:before {
|
||||
display: none;
|
||||
}
|
||||
.optgroup:before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
@include nav-divider;
|
||||
margin-left: $selectize-padding-dropdown-item-x * -1;
|
||||
margin-right: $selectize-padding-dropdown-item-x * -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-control.#{$selectize}-control {
|
||||
padding: 0;
|
||||
height: auto;
|
||||
border: none;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
.selectize-dropdown-content {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.selectize-dropdown-header {
|
||||
padding: $selectize-padding-dropdown-item-y * 2 $selectize-padding-dropdown-item-x;
|
||||
}
|
||||
|
||||
.selectize-input {
|
||||
min-height: $input-height-base;
|
||||
|
||||
&.dropdown-active {
|
||||
@include selectize-border-radius ($selectize-border-radius);
|
||||
}
|
||||
&.dropdown-active::before {
|
||||
display: none;
|
||||
}
|
||||
&.focus {
|
||||
$color: $input-border-focus;
|
||||
$color-rgba: rgba(red($color), green($color), blue($color), .6);
|
||||
border-color: $color;
|
||||
outline: 0;
|
||||
@include selectize-box-shadow ("inset 0 1px 1px rgba(black, .075), 0 0 8px #{$color-rgba}");
|
||||
}
|
||||
}
|
||||
|
||||
.has-error .selectize-input {
|
||||
border-color: $selectize-color-input-error;
|
||||
@include selectize-box-shadow ($selectize-shadow-input-error);
|
||||
|
||||
&:focus {
|
||||
border-color: $selectize-color-input-error-focus;
|
||||
@include selectize-box-shadow ($selectize-shadow-input-error-focus);
|
||||
}
|
||||
}
|
||||
|
||||
.selectize-control {
|
||||
&.multi {
|
||||
.selectize-input.has-items {
|
||||
padding-left: $selectize-padding-x - $selectize-padding-item-x;
|
||||
padding-right: $selectize-padding-x - $selectize-padding-item-x;
|
||||
}
|
||||
.selectize-input > div {
|
||||
@include selectize-border-radius ($selectize-border-radius - 1px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-control.selectize-control {
|
||||
padding: 0;
|
||||
height: auto;
|
||||
border: none;
|
||||
background: none;
|
||||
@include selectize-box-shadow (none);
|
||||
@include selectize-border-radius (0);
|
||||
}
|
||||
|
||||
@@ -1,112 +1,118 @@
|
||||
/**
|
||||
* Selectize bootstrap 4
|
||||
*/
|
||||
|
||||
//Import Boostrap 4 functions and variables
|
||||
|
||||
$enable-shadows: true !default;
|
||||
$select-font-family: inherit !default;
|
||||
$select-font-size: inherit !default;
|
||||
$select-line-height: $input-btn-line-height !default; //formerly line-height-computed
|
||||
$selectize-font-family: inherit !default;
|
||||
$selectize-font-size: inherit !default;
|
||||
$selectize-line-height: $input-btn-line-height !default; //formerly line-height-computed
|
||||
|
||||
$select-color-text: gray("800") !default; //$gray-800
|
||||
$select-color-highlight: rgba(255, 237, 40, 0.4) !default;
|
||||
$select-color-input: $input-bg !default;
|
||||
$select-color-input-full: $input-bg !default;
|
||||
$select-color-input-error: theme-color("danger") !default;
|
||||
$select-color-input-error-focus: darken(
|
||||
$select-color-input-error,
|
||||
10%
|
||||
) !default;
|
||||
$select-color-disabled: $input-bg !default;
|
||||
$select-color-item: RGBA($select-color-text, 0.1) !default;
|
||||
$select-color-item-border: $border-color !default;
|
||||
$select-color-item-active: $component-active-bg !default;
|
||||
$select-color-item-active-text: color-contrast($select-color-item-active) !default;
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0) !default;
|
||||
$select-color-optgroup: $dropdown-bg !default;
|
||||
$select-color-optgroup-text: $dropdown-header-color !default;
|
||||
$select-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$select-color-dropdown: $dropdown-bg !default;
|
||||
$select-color-dropdown-border-top: mix(
|
||||
$input-border-color,
|
||||
$input-bg,
|
||||
80%
|
||||
) !default;
|
||||
$select-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$select-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
$select-color-dropdown-item-create-active-text: $dropdown-link-hover-color !default;
|
||||
$select-opacity-disabled: 0.5 !default;
|
||||
$select-shadow-input: none !default;
|
||||
$select-shadow-input-focus: inset 0 1px 2px rgba(0, 0, 0, 0.15) !default;
|
||||
$select-shadow-input-error: inset 0 1px 1px rgba(0, 0, 0, 0.075) !default;
|
||||
$select-shadow-input-error-focus: inset 0 1px 1px rgba(0, 0, 0, 0.075),
|
||||
0 0 6px lighten($select-color-input-error, 20%) !default;
|
||||
$select-border: 1px solid $input-border-color !default;
|
||||
$select-border-radius: $input-border-radius !default;
|
||||
$selectize-color-text: $input-color !default;
|
||||
$selectize-color-highlight: rgba(255,237,40,0.4) !default;
|
||||
$selectize-color-input: $input-bg !default;
|
||||
$selectize-color-input-full: $input-bg !default;
|
||||
$selectize-color-input-error: $danger !default;
|
||||
$selectize-color-input-error-focus: darken($selectize-color-input-error, 10%) !default;
|
||||
$selectize-color-disabled: $input-bg !default;
|
||||
$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
$selectize-color-item-border: $input-border-color !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
$selectize-color-item-active-text: color-contrast($selectize-color-item-active) !default;
|
||||
$selectize-color-item-active-border: rgba(0,0,0,0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
$selectize-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$selectize-color-dropdown: $dropdown-bg !default;
|
||||
$selectize-color-dropdown-text: $dropdown-link-color !default;
|
||||
$selectize-color-dropdown-border-top: mix($input-border-color, $input-bg, 0.8) !default;
|
||||
$selectize-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$selectize-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
$selectize-color-dropdown-item-create-active-text: $dropdown-link-hover-color !default;
|
||||
$selectize-opacity-disabled: 0.5 !default;
|
||||
$selectize-shadow-input: none !default;
|
||||
$selectize-shadow-input-focus: inset 0 1px 2px rgba(0,0,0,0.15) !default;
|
||||
$selectize-shadow-input-error: inset 0 1px 1px rgba(0, 0, 0, .075) !default;
|
||||
$selectize-shadow-input-error-focus: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px lighten($selectize-color-input-error, 20%) !default;
|
||||
$selectize-border: 1px solid $input-border-color !default;
|
||||
$selectize-border-radius: $input-border-radius !default;
|
||||
|
||||
$select-width-item-border: 0px !default;
|
||||
$select-padding-x: $input-btn-padding-x !default;
|
||||
$select-padding-y: $input-btn-padding-y !default;
|
||||
$select-padding-dropdown-item-x: $input-btn-padding-x !default;
|
||||
$select-padding-dropdown-item-y: 3px !default;
|
||||
$select-padding-item-x: 5px !default;
|
||||
$select-padding-item-y: 1px !default;
|
||||
$select-margin-item-x: 3px !default;
|
||||
$select-margin-item-y: 3px !default;
|
||||
$selectize-width-item-border: 0px !default;
|
||||
$selectize-padding-x: $input-btn-padding-x !default;
|
||||
$selectize-padding-y: $input-btn-padding-y !default;
|
||||
$selectize-padding-dropdown-item-x: $input-btn-padding-x !default;
|
||||
$selectize-padding-dropdown-item-y: 3px !default;
|
||||
$selectize-padding-item-x: 3px !default;
|
||||
$selectize-padding-item-y: 1px !default;
|
||||
$selectize-margin-item-x: 3px !default;
|
||||
$selectize-margin-item-y: 3px !default;
|
||||
$selectize-caret-margin: 0 !default;
|
||||
|
||||
$selectize-arrow-size: 5px !default;
|
||||
$selectize-arrow-color: $selectize-color-text !default;
|
||||
$selectize-arrow-offset: calc(#{$selectize-padding-x} + 5px) !default;
|
||||
|
||||
$select-arrow-size: 5px !default;
|
||||
$select-arrow-color: $select-color-text !default;
|
||||
$select-arrow-offset: calc(#{$select-padding-x} + 5px) !default;
|
||||
|
||||
@import "selectize";
|
||||
|
||||
.#{$selectize}-dropdown,
|
||||
.#{$selectize}-dropdown.form-control {
|
||||
//Import Plugins
|
||||
@import "plugins/drag_drop";
|
||||
@import "plugins/dropdown_header";
|
||||
@import "plugins/optgroup_columns";
|
||||
@import "plugins/remove_button";
|
||||
|
||||
.selectize-dropdown, .selectize-dropdown.form-control {
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $select-color-dropdown;
|
||||
background: $selectize-color-dropdown;
|
||||
color: $selectize-color-dropdown-text;
|
||||
border: 1px solid $dropdown-border-color; //$dropdown-fallback-border
|
||||
border-radius: $border-radius;
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
@include selectize-border-radius($border-radius);
|
||||
@include selectize-box-shadow(0 6px 12px rgba(0,0,0,.175));
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown {
|
||||
.selectize-dropdown {
|
||||
.optgroup-header {
|
||||
font-size: $font-size-sm;
|
||||
line-height: $line-height-base;
|
||||
font-size: $font-size-sm;
|
||||
line-height: $line-height-base;
|
||||
}
|
||||
.optgroup:first-child:before {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
.optgroup:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 0;
|
||||
margin: $dropdown-divider-margin-y 0;
|
||||
overflow: hidden;
|
||||
border-top: 1px solid $dropdown-divider-bg;
|
||||
margin-left: $select-padding-dropdown-item-x * -1;
|
||||
margin-right: $select-padding-dropdown-item-x * -1;
|
||||
content: ' ';
|
||||
display: block;
|
||||
height: 0;
|
||||
margin: $dropdown-divider-margin-y 0;
|
||||
overflow: hidden;
|
||||
border-top: 1px solid $dropdown-divider-bg;
|
||||
margin-left: $selectize-padding-dropdown-item-x * -1;
|
||||
margin-right: $selectize-padding-dropdown-item-x * -1;
|
||||
}
|
||||
|
||||
.create {
|
||||
padding-left: $select-padding-dropdown-item-x;
|
||||
padding-left: $selectize-padding-dropdown-item-x;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-content {
|
||||
.selectize-dropdown-content {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-emptyoptionlabel {
|
||||
text-align: center;
|
||||
.selectize-dropdown-header {
|
||||
padding: $selectize-padding-dropdown-item-y * 2 $selectize-padding-dropdown-item-x;
|
||||
}
|
||||
|
||||
.#{$selectize}-input {
|
||||
.selectize-input {
|
||||
min-height: $input-height;
|
||||
@include box-shadow($input-box-shadow);
|
||||
@include transition($input-transition);
|
||||
|
||||
&.dropdown-active {
|
||||
border-radius: $select-border-radius;
|
||||
@include selectize-border-radius($selectize-border-radius);
|
||||
}
|
||||
&.dropdown-active::before {
|
||||
display: none;
|
||||
@@ -122,21 +128,22 @@ $select-arrow-offset: calc(#{$select-padding-x} + 5px) !default;
|
||||
}
|
||||
}
|
||||
|
||||
.is-invalid .#{$selectize}-input {
|
||||
border-color: $select-color-input-error;
|
||||
box-shadow: $select-shadow-input-error;
|
||||
.is-invalid .selectize-input {
|
||||
border-color: $selectize-color-input-error;
|
||||
@include selectize-box-shadow($selectize-shadow-input-error);
|
||||
|
||||
&:focus {
|
||||
border-color: $select-color-input-error-focus;
|
||||
box-shadow: $select-shadow-input-error-focus;
|
||||
border-color: $selectize-color-input-error-focus;
|
||||
// @include selectize-box-shadow(none)
|
||||
@include selectize-box-shadow($selectize-shadow-input-error-focus);
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control {
|
||||
&.form-control-sm {
|
||||
.#{$selectize}-input.has-items {
|
||||
.selectize-control {
|
||||
&.form-control-sm{
|
||||
.selectize-input.has-items{
|
||||
min-height: $input-height-sm !important;
|
||||
height: $input-height-sm;
|
||||
height: $input-height-sm !important;
|
||||
padding: $input-padding-y-sm $input-padding-x-sm !important;
|
||||
font-size: $input-font-size-sm;
|
||||
line-height: $input-line-height-sm;
|
||||
@@ -144,53 +151,26 @@ $select-arrow-offset: calc(#{$select-padding-x} + 5px) !default;
|
||||
}
|
||||
|
||||
&.multi {
|
||||
.#{$selectize}-input.has-items {
|
||||
height: auto;
|
||||
padding-left: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
padding-right: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
}
|
||||
.#{$selectize}-input > div {
|
||||
border-radius: calc(#{$select-border-radius} - 1px);
|
||||
}
|
||||
.selectize-input.has-items {
|
||||
padding-left: calc(#{$selectize-padding-x} - #{$selectize-padding-item-x});
|
||||
padding-right: calc(#{$selectize-padding-x} - #{$selectize-padding-item-x});
|
||||
}
|
||||
.selectize-input > div {
|
||||
@include selectize-border-radius(calc(#{$selectize-border-radius} - 1px));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-control.#{$selectize}-control {
|
||||
.form-control.selectize-control {
|
||||
padding: 0;
|
||||
height: auto;
|
||||
border: none;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
@include selectize-box-shadow(none);
|
||||
@include selectize-border-radius(0);
|
||||
}
|
||||
|
||||
.input-group .#{$selectize}-control:not(:last-child) {
|
||||
.#{$selectize}-input{
|
||||
overflow: unset;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group .#{$selectize}-control:not(:first-child) {
|
||||
.#{$selectize}-input{
|
||||
overflow: unset;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// .input-group .#{$selectize}-input {
|
||||
// overflow: unset;
|
||||
// border-radius: 0 $select-border-radius $select-border-radius 0;
|
||||
// }
|
||||
|
||||
.#{selectize}-dropdown.plugin-auto_position.#{$selectize}-position-top {
|
||||
border-top: $select-border!important;
|
||||
border-bottom: $select-border!important;
|
||||
border-radius: $select-border-radius!important;
|
||||
}
|
||||
.#{selectize}-control.plugin-auto_position .#{selectize}-input.#{$selectize}-position-top.dropdown-active {
|
||||
border-radius: $select-border-radius!important;
|
||||
border-top: $select-border!important;
|
||||
.input-group .selectize-input {
|
||||
overflow: unset;
|
||||
@include selectize-border-radius(0 $selectize-border-radius $selectize-border-radius 0);
|
||||
}
|
||||
|
||||
@@ -1,200 +1,3 @@
|
||||
|
||||
$enable-shadows: true !default;
|
||||
$select-font-family: if($input-btn-font-family, $input-btn-font-family, inherit) !default;
|
||||
$select-font-size: $input-btn-font-size !default;
|
||||
$select-line-height: $input-btn-line-height !default; //formerly line-height-computed
|
||||
|
||||
$select-color-rgb: var(--bs-emphasis-color-rgb, 0, 0, 0) !default;
|
||||
$select-color-text: RGBA($select-color-rgb, 0.83) !default;
|
||||
$select-color-highlight: rgba(255, 237, 40, 0.4) !default;
|
||||
$select-color-input: $input-bg !default;
|
||||
$select-color-input-full: $input-bg !default;
|
||||
$select-color-input-error: $danger !default;
|
||||
$select-color-input-error-focus: darken(
|
||||
$select-color-input-error,
|
||||
10%
|
||||
) !default;
|
||||
$select-color-disabled: $input-bg !default;
|
||||
$select-color-item: RGBA($select-color-rgb, 0.05) !default;
|
||||
$select-color-item-border: $border-color !default;
|
||||
$select-color-item-active: $component-active-bg !default;
|
||||
$select-color-item-active-text: color-contrast($select-color-item-active) !default;
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0) !default;
|
||||
$select-color-optgroup: $dropdown-bg !default;
|
||||
$select-color-optgroup-text: $dropdown-header-color !default;
|
||||
$select-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$select-color-dropdown: $dropdown-bg !default;
|
||||
$select-color-dropdown-border-top: rgba($input-border-color, 0.8) !default;
|
||||
$select-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$select-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
$select-color-dropdown-item-create-active-text: $dropdown-link-hover-color !default;
|
||||
$select-opacity-disabled: 0.5 !default;
|
||||
$select-shadow-input: none !default;
|
||||
$select-shadow-input-focus: inset 0 1px 2px rgba(0, 0, 0, 0.15) !default;
|
||||
$select-shadow-input-error: inset 0 1px 1px rgba(0, 0, 0, 0.075) !default;
|
||||
$select-shadow-input-error-focus: inset 0 1px 1px rgba(0, 0, 0, 0.075),
|
||||
0 0 6px lighten($select-color-input-error, 20%) !default;
|
||||
$select-border: 1px solid $input-border-color !default;
|
||||
$select-border-radius: $input-border-radius !default;
|
||||
|
||||
$select-width-item-border: 0px !default;
|
||||
$select-padding-x: $input-btn-padding-x !default;
|
||||
$select-padding-y: $input-btn-padding-y !default;
|
||||
$select-padding-dropdown-item-x: $input-btn-padding-x !default;
|
||||
$select-padding-dropdown-item-y: 3px !default;
|
||||
$select-padding-item-x: 5px !default;
|
||||
$select-padding-item-y: 1px !default;
|
||||
$select-margin-item-x: 3px !default;
|
||||
$select-margin-item-y: 3px !default;
|
||||
|
||||
$select-arrow-size: 5px !default;
|
||||
$select-arrow-color: $select-color-text !default;
|
||||
$select-arrow-offset: calc(#{$select-padding-x} + 5px) !default;
|
||||
|
||||
@import "selectize";
|
||||
|
||||
.#{$selectize}-dropdown,
|
||||
.#{$selectize}-dropdown.form-control {
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $select-color-dropdown;
|
||||
border: 1px solid $dropdown-border-color; //$dropdown-fallback-border
|
||||
border-radius: $border-radius;
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown {
|
||||
.optgroup-header {
|
||||
font-size: $font-size-sm;
|
||||
line-height: $line-height-base;
|
||||
}
|
||||
.optgroup:first-child:before {
|
||||
display: none;
|
||||
}
|
||||
.optgroup:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 0;
|
||||
margin: $dropdown-divider-margin-y 0;
|
||||
overflow: hidden;
|
||||
border-top: 1px solid $dropdown-divider-bg;
|
||||
margin-left: $select-padding-dropdown-item-x * -1;
|
||||
margin-right: $select-padding-dropdown-item-x * -1;
|
||||
}
|
||||
|
||||
.create {
|
||||
padding-left: $select-padding-dropdown-item-x;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-content {
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-emptyoptionlabel {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.#{$selectize}-input {
|
||||
min-height: $input-height;
|
||||
@include box-shadow($input-box-shadow);
|
||||
@include transition($input-transition);
|
||||
|
||||
&.dropdown-active {
|
||||
border-radius: $select-border-radius;
|
||||
}
|
||||
&.dropdown-active::before {
|
||||
display: none;
|
||||
}
|
||||
&.focus {
|
||||
border-color: $input-focus-border-color;
|
||||
outline: 0;
|
||||
@if $enable-shadows {
|
||||
box-shadow: $input-box-shadow, $input-focus-box-shadow;
|
||||
} @else {
|
||||
box-shadow: $input-focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-invalid .#{$selectize}-input {
|
||||
border-color: $select-color-input-error;
|
||||
box-shadow: $select-shadow-input-error;
|
||||
|
||||
&:focus {
|
||||
border-color: $select-color-input-error-focus;
|
||||
box-shadow: $select-shadow-input-error-focus;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control {
|
||||
&.form-control-sm {
|
||||
.#{$selectize}-input {
|
||||
min-height: $input-height-sm !important;
|
||||
height: $input-height-sm;
|
||||
padding: $input-padding-y-sm $input-padding-x-sm !important;
|
||||
font-size: $input-font-size-sm;
|
||||
line-height: $line-height-sm;
|
||||
}
|
||||
}
|
||||
|
||||
&.multi {
|
||||
.#{$selectize}-input {
|
||||
height: auto;
|
||||
padding-left: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
padding-right: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
}
|
||||
.#{$selectize}-input > div {
|
||||
border-radius: calc(#{$select-border-radius} - 1px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-select.#{$selectize}-control,
|
||||
.form-control.#{$selectize}-control {
|
||||
padding: 0;
|
||||
height: auto;
|
||||
border: none;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.input-group>.input-group-append>.btn, .input-group>.form-control:not(:first-child) {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.input-group>.input-group-prepend>.btn {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
|
||||
.input-group .#{$selectize}-control:not(:last-child) {
|
||||
.#{$selectize}-input{
|
||||
overflow: unset;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group .#{$selectize}-control:not(:first-child) {
|
||||
.#{$selectize}-input{
|
||||
overflow: unset;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.#{selectize}-dropdown.plugin-auto_position.#{$selectize}-position-top {
|
||||
border-top: $select-border!important;
|
||||
border-bottom: $select-border!important;
|
||||
border-radius: $select-border-radius!important;
|
||||
}
|
||||
.#{selectize}-control.plugin-auto_position .#{selectize}-input.#{$selectize}-position-top.dropdown-active {
|
||||
border-radius: $select-border-radius!important;
|
||||
border-top: $select-border!important;
|
||||
}
|
||||
$input-line-height-sm: $form-select-line-height !default;
|
||||
@import 'selectize.bootstrap4';
|
||||
.selectize-control{padding:0;}
|
||||
|
||||
@@ -1,71 +1,84 @@
|
||||
$select-color-item: #1da7ee;
|
||||
$select-color-item-text: #fff;
|
||||
$select-color-item-active-text: #fff;
|
||||
$select-color-item-border: #0073bb;
|
||||
$select-color-item-active: #92c836;
|
||||
$select-color-item-active-border: #00578d;
|
||||
$select-width-item-border: 1px;
|
||||
/**
|
||||
* selectize.default.css (v$$version) - Default Theme
|
||||
* Copyright (c) 2013–2015 Brian Reavis & contributors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
|
||||
* file except in compliance with the License. You may obtain a copy of the License at:
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software distributed under
|
||||
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
|
||||
* ANY KIND, either express or implied. See the License for the specific language
|
||||
* governing permissions and limitations under the License.
|
||||
*
|
||||
* $author Brian Reavis <brian$thirdroute.com>
|
||||
*/
|
||||
|
||||
@import "selectize.scss";
|
||||
@import "selectize";
|
||||
|
||||
.#{$selectize}-control {
|
||||
$selectize-color-item: #1da7ee;
|
||||
$selectize-color-item-text: #fff;
|
||||
$selectize-color-item-active-text: #fff;
|
||||
$selectize-color-item-border: #0073bb;
|
||||
$selectize-color-item-active: #92c836;
|
||||
$selectize-color-item-active-border: #00578d;
|
||||
$selectize-width-item-border: 1px;
|
||||
$selectize-caret-margin: 0 1px;
|
||||
|
||||
.selectize-control {
|
||||
&.multi {
|
||||
.#{$selectize}-input {
|
||||
&.has-items {
|
||||
$padding-x: $select-padding-x - 3px;
|
||||
padding-left: $padding-x;
|
||||
padding-right: $padding-x;
|
||||
}
|
||||
&.disabled [data-value] {
|
||||
color: #999;
|
||||
text-shadow: none;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
.selectize-input {
|
||||
&.has-items {
|
||||
$padding-x: $selectize-padding-x - 3px;
|
||||
padding-left: $padding-x;
|
||||
padding-right: $padding-x;
|
||||
}
|
||||
&.disabled [data-value] {
|
||||
color: #999;
|
||||
text-shadow: none;
|
||||
background: none;
|
||||
@include selectize-box-shadow(none);
|
||||
|
||||
&,
|
||||
.remove {
|
||||
border-color: #e6e6e6;
|
||||
}
|
||||
.remove {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
[data-value] {
|
||||
text-shadow: 0 1px 0 rgba(0, 51, 83, 0.3);
|
||||
border-radius: 3px;
|
||||
@include selectize-vertical-gradient(#1da7ee, #178ee9);
|
||||
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2),
|
||||
inset 0 1px rgba(255, 255, 255, 0.03);
|
||||
&.active {
|
||||
@include selectize-vertical-gradient(#008fd8, #0075cf);
|
||||
}
|
||||
}
|
||||
}
|
||||
&, .remove {
|
||||
border-color: #e6e6e6;
|
||||
}
|
||||
.remove {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
[data-value] {
|
||||
text-shadow: 0 1px 0 rgba(0,51,83,0.3);
|
||||
@include selectize-border-radius(3px);
|
||||
@include selectize-vertical-gradient(#1da7ee, #178ee9);
|
||||
@include selectize-box-shadow(#{"0 1px 0 rgba(0,0,0,0.2),inset 0 1px rgba(255,255,255,0.03)"});
|
||||
&.active {
|
||||
@include selectize-vertical-gradient(#008fd8, #0075cf);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.single {
|
||||
.#{$selectize}-input {
|
||||
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.8);
|
||||
@include selectize-vertical-gradient(#fefefe, #f2f2f2);
|
||||
}
|
||||
.selectize-input {
|
||||
@include selectize-box-shadow(#{"0 1px 0 rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8)"});
|
||||
@include selectize-vertical-gradient(#fefefe, #f2f2f2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control.single .#{$selectize}-input,
|
||||
.#{$selectize}-dropdown.single {
|
||||
.selectize-control.single .selectize-input, .selectize-dropdown.single {
|
||||
border-color: #b8b8b8;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown {
|
||||
.selectize-dropdown {
|
||||
.optgroup-header {
|
||||
padding-top: $select-padding-dropdown-item-y + 2px;
|
||||
font-weight: bold;
|
||||
font-size: 0.85em;
|
||||
padding-top: $selectize-padding-dropdown-item-y + 2px;
|
||||
font-weight: bold;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
.optgroup {
|
||||
border-top: 1px solid $select-color-dropdown-border-top;
|
||||
&:first-child {
|
||||
border-top: 0 none;
|
||||
}
|
||||
border-top: 1px solid $selectize-color-dropdown-border-top;
|
||||
&:first-child {
|
||||
border-top: 0 none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,364 +1,300 @@
|
||||
@use "sass:math";
|
||||
|
||||
// base styles
|
||||
$selectize: "selectize" !default;
|
||||
$select-font-family: inherit !default;
|
||||
$select-font-smoothing: inherit !default;
|
||||
$select-font-size: 13px !default;
|
||||
$select-line-height: 18px !default;
|
||||
|
||||
$select-color-rgb: 0,0,0 !default;
|
||||
$select-color-text: RGBA($select-color-rgb, 0.83) !default;
|
||||
$select-color-border: #d0d0d0 !default;
|
||||
$select-color-highlight: rgba(125, 168, 208, 0.2) !default;
|
||||
$select-color-input: #fff !default;
|
||||
$select-color-input-full: $select-color-input !default;
|
||||
$select-color-disabled: #fafafa !default;
|
||||
$select-color-item: #f2f2f2 !default;
|
||||
$select-color-item-text: $select-color-text !default;
|
||||
$select-color-item-border: #d0d0d0 !default;
|
||||
$select-color-item-active: #e8e8e8 !default;
|
||||
$select-color-item-active-text: $select-color-text !default;
|
||||
$select-color-item-active-border: #cacaca !default;
|
||||
$select-color-dropdown: #fff !default;
|
||||
$select-color-dropdown-border: $select-color-border !default;
|
||||
$select-color-dropdown-border-top: #f0f0f0 !default;
|
||||
$select-color-dropdown-item-active: #f5fafd !default;
|
||||
$select-color-dropdown-item-active-text: #495c68 !default;
|
||||
$select-color-dropdown-item-create-text: RGBA($select-color-rgb, 0.5) !default;
|
||||
$select-color-dropdown-item-create-active-text: $select-color-dropdown-item-active-text !default;
|
||||
$select-color-optgroup: $select-color-dropdown !default;
|
||||
$select-color-optgroup-text: $select-color-text !default;
|
||||
$select-lighten-disabled-item: 30% !default;
|
||||
$select-lighten-disabled-item-text: 30% !default;
|
||||
$select-lighten-disabled-item-border: 30% !default;
|
||||
$select-opacity-disabled: 0.5 !default;
|
||||
$selectize-font-family: inherit !default;
|
||||
$selectize-font-smoothing: inherit !default;
|
||||
$selectize-font-size: 13px !default;
|
||||
$selectize-line-height: 18px !default;
|
||||
|
||||
$select-shadow-input: inset 0 1px 1px rgba(0, 0, 0, 0.1) !default;
|
||||
$select-shadow-input-focus: inset 0 1px 2px rgba(0, 0, 0, 0.15) !default;
|
||||
$select-border: 1px solid $select-color-border !default;
|
||||
$select-dropdown-border: 1px solid $select-color-dropdown-border !default;
|
||||
$select-border-radius: 3px !default;
|
||||
$selectize-color-text: #303030 !default;
|
||||
$selectize-color-border: #d0d0d0 !default;
|
||||
$selectize-color-highlight: rgba(125,168,208,0.2) !default;
|
||||
$selectize-color-input: #fff !default;
|
||||
$selectize-color-input-full: $selectize-color-input !default;
|
||||
$selectize-color-disabled: #fafafa !default;
|
||||
$selectize-color-item: #f2f2f2 !default;
|
||||
$selectize-color-item-text: $selectize-color-text !default;
|
||||
$selectize-color-item-border: #d0d0d0 !default;
|
||||
$selectize-color-item-active: #e8e8e8 !default;
|
||||
$selectize-color-item-active-text: $selectize-color-text !default;
|
||||
$selectize-color-item-active-border: #cacaca !default;
|
||||
$selectize-color-dropdown: #fff !default;
|
||||
$selectize-color-dropdown-border: $selectize-color-border !default;
|
||||
$selectize-color-dropdown-border-top: #f0f0f0 !default;
|
||||
$selectize-color-dropdown-item-active: #f5fafd !default;
|
||||
$selectize-color-dropdown-item-active-text: #495c68 !default;
|
||||
$selectize-color-dropdown-item-create-text: rgba(red($selectize-color-text), green($selectize-color-text), blue($selectize-color-text), 0.5) !default;
|
||||
$selectize-color-dropdown-item-create-active-text: $selectize-color-dropdown-item-active-text !default;
|
||||
$selectize-color-optgroup: $selectize-color-dropdown !default;
|
||||
$selectize-color-optgroup-text: $selectize-color-text !default;
|
||||
$selectize-lighten-disabled-item: 30% !default;
|
||||
$selectize-lighten-disabled-item-text: 30% !default;
|
||||
$selectize-lighten-disabled-item-border: 30% !default;
|
||||
$selectize-opacity-disabled: 0.5 !default;
|
||||
|
||||
$select-width-item-border: 0px !default;
|
||||
$select-max-height-dropdown: 200px !default;
|
||||
$selectize-shadow-input: inset 0 1px 1px rgba(0,0,0,0.1) !default;
|
||||
$selectize-shadow-input-focus: inset 0 1px 2px rgba(0,0,0,0.15) !default;
|
||||
$selectize-border: 1px solid $selectize-color-border !default;
|
||||
$selectize-dropdown-border: 1px solid $selectize-color-dropdown-border !default;
|
||||
$selectize-border-radius: 3px !default;
|
||||
|
||||
$select-padding-x: 8px !default;
|
||||
$select-padding-y: 8px !default;
|
||||
$select-padding-item-x: 6px !default;
|
||||
$select-padding-item-y: 2px !default;
|
||||
$select-padding-dropdown-item-x: $select-padding-x !default;
|
||||
$select-padding-dropdown-item-y: 5px !default;
|
||||
$select-margin-item-x: 3px !default;
|
||||
$select-margin-item-y: 3px !default;
|
||||
$selectize-width-item-border: 0 !default;
|
||||
$selectize-max-height-dropdown: 200px !default;
|
||||
|
||||
$select-arrow-size: 5px !default;
|
||||
$select-arrow-color: #808080 !default;
|
||||
$select-arrow-offset: 15px !default;
|
||||
$selectize-padding-x: 8px !default;
|
||||
$selectize-padding-y: 8px !default;
|
||||
$selectize-padding-item-x: 6px !default;
|
||||
$selectize-padding-item-y: 2px !default;
|
||||
$selectize-padding-dropdown-item-x: $selectize-padding-x !default;
|
||||
$selectize-padding-dropdown-item-y: 5px !default;
|
||||
$selectize-margin-item-x: 3px !default;
|
||||
$selectize-margin-item-y: 3px !default;
|
||||
|
||||
$select-caret-margin: 0 0px !default;
|
||||
$select-caret-margin-rtl: 0 4px 0 -2px !default;
|
||||
$selectize-arrow-size: 5px !default;
|
||||
$selectize-arrow-color: #808080 !default;
|
||||
$selectize-arrow-offset: 15px !default;
|
||||
|
||||
$select-spinner-size: 30px;
|
||||
$select-spinner-border-size: 5px;
|
||||
$select-spinner-border-color: $select-color-border;
|
||||
$selectize-caret-margin: 0 2px 0 0 !default;
|
||||
$selectize-caret-margin-rtl: 0 4px 0 -2px !default;
|
||||
|
||||
@mixin selectize-vertical-gradient($color-top, $color-bottom) {
|
||||
@mixin selectize-border-radius($radii){
|
||||
@if mixin-exists("border-radius") {
|
||||
@include border-radius($radii)
|
||||
} @else {
|
||||
border-radius: $radii;
|
||||
}
|
||||
}
|
||||
@mixin selectize-unselectable(){
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
@mixin selectize-box-shadow($shadow){
|
||||
-webkit-box-shadow: $shadow;
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
@mixin selectize-box-sizing($type: border-box){
|
||||
-webkit-box-sizing: $type;
|
||||
-moz-box-sizing: $type;
|
||||
box-sizing: $type;
|
||||
}
|
||||
@mixin selectize-vertical-gradient($color-top, $color-bottom){
|
||||
background-color: mix($color-top, $color-bottom, 60%);
|
||||
background-image: linear-gradient(to bottom, $color-top, $color-bottom);
|
||||
background-image: -moz-linear-gradient(top, $color-top, $color-bottom); // FF 3.6+
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from($color-top), to($color-bottom)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(top, $color-top, $color-bottom); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(top, $color-top, $color-bottom); // Opera 11.10
|
||||
background-image: linear-gradient(to bottom, $color-top, $color-bottom); // Standard, IE10
|
||||
background-repeat: repeat-x;
|
||||
//filter: e(%("progid:DXImageTransform.Microsoft@include gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb($color-top),argb($color-bottom))); // IE9 and down
|
||||
}
|
||||
|
||||
@import "plugins/drag_drop.scss";
|
||||
@import "plugins/dropdown_header.scss";
|
||||
@import "plugins/optgroup_columns.scss";
|
||||
@import "plugins/remove_button.scss";
|
||||
@import "plugins/clear_button.scss";
|
||||
@import "plugins/auto_position.scss";
|
||||
|
||||
.#{$selectize}-control {
|
||||
.selectize-control {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown,
|
||||
.#{$selectize}-input,
|
||||
.#{$selectize}-input input {
|
||||
color: $select-color-text;
|
||||
font-family: $select-font-family;
|
||||
font-size: $select-font-size;
|
||||
line-height: $select-line-height;
|
||||
font-smoothing: $select-font-smoothing;
|
||||
.selectize-dropdown, .selectize-input, .selectize-input input {
|
||||
color: $selectize-color-text;
|
||||
font-family: $selectize-font-family;
|
||||
font-size: $selectize-font-size;
|
||||
line-height: $selectize-line-height;
|
||||
-webkit-font-smoothing: $selectize-font-smoothing;
|
||||
}
|
||||
|
||||
.#{$selectize}-input,
|
||||
.#{$selectize}-control.single .#{$selectize}-input.input-active {
|
||||
background: $select-color-input;
|
||||
.selectize-input, .selectize-control.single .selectize-input.input-active {
|
||||
background: $selectize-color-input;
|
||||
cursor: text;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.#{$selectize}-input {
|
||||
border: $select-border;
|
||||
padding: $select-padding-y $select-padding-x;
|
||||
.selectize-input {
|
||||
border: $selectize-border;
|
||||
padding: $selectize-padding-y $selectize-padding-x;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
// overflow: hidden;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
box-sizing: border-box;
|
||||
box-shadow: $select-shadow-input;
|
||||
border-radius: $select-border-radius;
|
||||
@include selectize-box-sizing(border-box);
|
||||
@include selectize-box-shadow($selectize-shadow-input);
|
||||
@include selectize-border-radius($selectize-border-radius);
|
||||
|
||||
.#{$selectize}-control.multi &.has-items {
|
||||
$padding-x: $select-padding-x;
|
||||
$padding-top: calc(
|
||||
#{$select-padding-y} - #{$select-padding-item-y} - #{$select-width-item-border}
|
||||
);
|
||||
$padding-bottom: calc(
|
||||
#{$select-padding-y} - #{$select-padding-item-y} - #{$select-margin-item-y} -
|
||||
#{$select-width-item-border}
|
||||
);
|
||||
padding: $padding-top $padding-x $padding-bottom;
|
||||
.selectize-control.multi &.has-items {
|
||||
$padding-x: $selectize-padding-x;
|
||||
$padding-top: calc(#{$selectize-padding-y} - #{$selectize-padding-item-y} - #{$selectize-width-item-border});
|
||||
$padding-bottom: calc(#{$selectize-padding-y} - #{$selectize-padding-item-y} - #{$selectize-margin-item-y} - #{$selectize-width-item-border});
|
||||
padding: $padding-top $padding-x $padding-bottom;
|
||||
}
|
||||
|
||||
&.full {
|
||||
background-color: $select-color-input-full;
|
||||
background-color: $selectize-color-input-full;
|
||||
}
|
||||
&.disabled,
|
||||
&.disabled * {
|
||||
cursor: default !important;
|
||||
&.disabled, &.disabled * {
|
||||
cursor: default !important;
|
||||
}
|
||||
&.focus {
|
||||
box-shadow: $select-shadow-input-focus;
|
||||
@include selectize-box-shadow($selectize-shadow-input-focus);
|
||||
}
|
||||
&.dropdown-active {
|
||||
border-radius: $select-border-radius $select-border-radius 0 0;
|
||||
@include selectize-border-radius($selectize-border-radius $selectize-border-radius 0 0);
|
||||
}
|
||||
|
||||
> * {
|
||||
vertical-align: baseline;
|
||||
display: inline-block;
|
||||
zoom: 1;
|
||||
vertical-align: baseline;
|
||||
display: -moz-inline-stack;
|
||||
display: inline-block;
|
||||
zoom: 1;
|
||||
*display: inline;
|
||||
}
|
||||
.#{$selectize}-control.multi & > div {
|
||||
cursor: pointer;
|
||||
margin: 0 $select-margin-item-x $select-margin-item-y 0;
|
||||
padding: $select-padding-item-y $select-padding-item-x;
|
||||
background: $select-color-item;
|
||||
color: $select-color-item-text;
|
||||
border: $select-width-item-border solid $select-color-item-border;
|
||||
.selectize-control.multi & > div {
|
||||
cursor: pointer;
|
||||
margin: 0 $selectize-margin-item-x $selectize-margin-item-y 0;
|
||||
padding: $selectize-padding-item-y $selectize-padding-item-x;
|
||||
background: $selectize-color-item;
|
||||
color: $selectize-color-item-text;
|
||||
border: $selectize-width-item-border solid $selectize-color-item-border;
|
||||
|
||||
&.active {
|
||||
background: $select-color-item-active;
|
||||
color: $select-color-item-active-text;
|
||||
border: $select-width-item-border solid $select-color-item-active-border;
|
||||
}
|
||||
&.active {
|
||||
background: $selectize-color-item-active;
|
||||
color: $selectize-color-item-active-text;
|
||||
border: $selectize-width-item-border solid $selectize-color-item-active-border;
|
||||
}
|
||||
}
|
||||
.#{$selectize}-control.multi &.disabled > div {
|
||||
&,
|
||||
&.active {
|
||||
color: lighten(gray, $select-lighten-disabled-item-text);
|
||||
background: lighten(gray, $select-lighten-disabled-item);
|
||||
border: $select-width-item-border solid
|
||||
lighten(gray, $select-lighten-disabled-item-border);
|
||||
}
|
||||
.selectize-control.multi &.disabled > div {
|
||||
&, &.active {
|
||||
color: lighten(desaturate($selectize-color-item-text, 100%), $selectize-lighten-disabled-item-text);
|
||||
background: lighten(desaturate($selectize-color-item, 100%), $selectize-lighten-disabled-item);
|
||||
border: $selectize-width-item-border solid lighten(desaturate($selectize-color-item-border, 100%), $selectize-lighten-disabled-item-border);
|
||||
}
|
||||
}
|
||||
> input {
|
||||
&::-ms-clear {
|
||||
display: none;
|
||||
}
|
||||
display: inline-block !important;
|
||||
padding: 0 !important;
|
||||
min-height: 0 !important;
|
||||
max-height: none !important;
|
||||
max-width: 100% !important;
|
||||
margin: 0 !important;
|
||||
text-indent: 0 !important;
|
||||
border: 0 none !important;
|
||||
background: none !important;
|
||||
line-height: inherit !important;
|
||||
user-select: auto !important;
|
||||
box-shadow: none !important;
|
||||
&:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
&[placeholder] {
|
||||
box-sizing: initial;
|
||||
}
|
||||
}
|
||||
&.has-items > input {
|
||||
margin: $select-caret-margin !important;
|
||||
&::-ms-clear {
|
||||
display: none;
|
||||
}
|
||||
display: inline-block !important;
|
||||
padding: 0 !important;
|
||||
min-height: 0 !important;
|
||||
max-height: none !important;
|
||||
max-width: 100% !important;
|
||||
margin: $selectize-caret-margin !important;
|
||||
text-indent: 0 !important;
|
||||
border: 0 none !important;
|
||||
background: none !important;
|
||||
line-height: inherit !important;
|
||||
-webkit-user-select: auto !important;
|
||||
@include selectize-box-shadow(none);
|
||||
&:focus { outline: none !important; }
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-input::after {
|
||||
content: " ";
|
||||
.selectize-input::after {
|
||||
content: ' ';
|
||||
display: block;
|
||||
clear: left;
|
||||
}
|
||||
|
||||
.#{$selectize}-input.dropdown-active::before {
|
||||
content: " ";
|
||||
.selectize-input.dropdown-active::before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
position: absolute;
|
||||
background: $select-color-dropdown-border-top;
|
||||
background: $selectize-color-dropdown-border-top;
|
||||
height: 1px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown {
|
||||
.selectize-dropdown {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
|
||||
border: $select-dropdown-border;
|
||||
background: $select-color-dropdown;
|
||||
border: $selectize-dropdown-border;
|
||||
background: $selectize-color-dropdown;
|
||||
margin: -1px 0 0 0;
|
||||
border-top: 0 none;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 0 0 $select-border-radius $select-border-radius;
|
||||
@include selectize-box-sizing(border-box);
|
||||
@include selectize-box-shadow(0 1px 3px rgba(0,0,0,0.1));
|
||||
@include selectize-border-radius(0 0 $selectize-border-radius $selectize-border-radius);
|
||||
|
||||
[data-selectable] {
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
.highlight {
|
||||
background: $select-color-highlight;
|
||||
border-radius: 1px;
|
||||
}
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
.highlight {
|
||||
background: $selectize-color-highlight;
|
||||
@include selectize-border-radius(1px);
|
||||
}
|
||||
}
|
||||
.option,
|
||||
.optgroup-header,
|
||||
.no-results,
|
||||
.create {
|
||||
padding: $select-padding-dropdown-item-y $select-padding-dropdown-item-x;
|
||||
.option, .optgroup-header {
|
||||
padding: $selectize-padding-dropdown-item-y $selectize-padding-dropdown-item-x;
|
||||
}
|
||||
.option,
|
||||
[data-disabled],
|
||||
[data-disabled] [data-selectable].option {
|
||||
cursor: inherit;
|
||||
opacity: 0.5;
|
||||
.option, [data-disabled], [data-disabled] [data-selectable].option {
|
||||
cursor: inherit;
|
||||
opacity: 0.5;
|
||||
}
|
||||
[data-selectable].option {
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
}
|
||||
.optgroup:first-child .optgroup-header {
|
||||
border-top: 0 none;
|
||||
border-top: 0 none;
|
||||
}
|
||||
.optgroup-header {
|
||||
color: $select-color-optgroup-text;
|
||||
background: $select-color-optgroup;
|
||||
cursor: default;
|
||||
color: $selectize-color-optgroup-text;
|
||||
background: $selectize-color-optgroup;
|
||||
cursor: default;
|
||||
}
|
||||
.active {
|
||||
background-color: $select-color-item-active;
|
||||
color: $select-color-item-active-text;
|
||||
&.create {
|
||||
color: $select-color-dropdown-item-create-active-text;
|
||||
}
|
||||
}
|
||||
|
||||
.selected {
|
||||
background-color: $select-color-item-active;
|
||||
color: $select-color-item-active-text;
|
||||
background-color: $selectize-color-dropdown-item-active;
|
||||
color: $selectize-color-dropdown-item-active-text;
|
||||
&.create {
|
||||
color: $selectize-color-dropdown-item-create-active-text;
|
||||
}
|
||||
}
|
||||
.create {
|
||||
color: $select-color-dropdown-item-create-text;
|
||||
}
|
||||
|
||||
.active:not(.selected) {
|
||||
background: $select-color-dropdown-item-active;
|
||||
color: $select-color-dropdown-item-active-text;
|
||||
color: $selectize-color-dropdown-item-create-text;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-content {
|
||||
.selectize-dropdown-content {
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
max-height: $select-max-height-dropdown;
|
||||
overflow-scrolling: touch;
|
||||
max-height: $selectize-max-height-dropdown;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown-emptyoptionlabel {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.#{$selectize}-dropdown .spinner {
|
||||
display: inline-block;
|
||||
width: $select-spinner-size;
|
||||
height: $select-spinner-size;
|
||||
margin: $select-padding-dropdown-item-y $select-padding-dropdown-item-x;
|
||||
.selectize-control.single .selectize-input {
|
||||
&, input { cursor: pointer; }
|
||||
&.input-active, &.input-active input { cursor: text; }
|
||||
|
||||
&:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
width: $select-spinner-size * 0.8;
|
||||
height: $select-spinner-size * 0.8;
|
||||
margin: $select-spinner-size * 0.1;
|
||||
border-radius: 50%;
|
||||
border: $select-spinner-border-size solid $select-spinner-border-color;
|
||||
border-color: $select-spinner-border-color transparent
|
||||
$select-spinner-border-color transparent;
|
||||
animation: lds-dual-ring 1.2s linear infinite;
|
||||
content: ' ';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: $selectize-arrow-offset;
|
||||
margin-top: round((-1 * $selectize-arrow-size / 2));
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
border-width: $selectize-arrow-size $selectize-arrow-size 0 $selectize-arrow-size;
|
||||
border-color: $selectize-arrow-color transparent transparent transparent;
|
||||
}
|
||||
@keyframes lds-dual-ring {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
&.dropdown-active:after {
|
||||
margin-top: $selectize-arrow-size * -0.8;
|
||||
border-width: 0 $selectize-arrow-size $selectize-arrow-size $selectize-arrow-size;
|
||||
border-color: transparent transparent $selectize-arrow-color transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control.single .#{$selectize}-input {
|
||||
&,
|
||||
input {
|
||||
cursor: pointer;
|
||||
.selectize-control.rtl {
|
||||
&.single .selectize-input:after {
|
||||
left: $selectize-arrow-offset;
|
||||
right: auto;
|
||||
}
|
||||
&.input-active,
|
||||
&.input-active input:not(:read-only) {
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
&:not(.no-arrow):after {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: $select-arrow-offset;
|
||||
margin-top: round(divide(-1 * $select-arrow-size, 2));
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
border-width: $select-arrow-size $select-arrow-size 0 $select-arrow-size;
|
||||
border-color: $select-arrow-color transparent transparent transparent;
|
||||
}
|
||||
&:not(.no-arrow).dropdown-active:after {
|
||||
margin-top: $select-arrow-size * -0.8;
|
||||
border-width: 0 $select-arrow-size $select-arrow-size $select-arrow-size;
|
||||
border-color: transparent transparent $select-arrow-color transparent;
|
||||
.selectize-input > input {
|
||||
margin: $selectize-caret-margin-rtl !important;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control.rtl {
|
||||
text-align: right;
|
||||
&.single .#{$selectize}-input:after {
|
||||
left: $select-arrow-offset;
|
||||
right: auto;
|
||||
}
|
||||
.#{$selectize}-input > input {
|
||||
margin: $select-caret-margin-rtl !important;
|
||||
}
|
||||
}
|
||||
|
||||
.#{$selectize}-control .#{$selectize}-input.disabled {
|
||||
opacity: $select-opacity-disabled;
|
||||
background-color: $select-color-disabled;
|
||||
.selectize-control .selectize-input.disabled {
|
||||
opacity: $selectize-opacity-disabled;
|
||||
background-color: $selectize-color-disabled;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,2 +1,2 @@
|
||||
/*! shiny 1.7.5.9000 | (c) 2012-2023 RStudio, PBC. | License: GPL-3 | file LICENSE */
|
||||
/*! shiny 1.7.4.9002 | (c) 2012-2023 RStudio, PBC. | License: GPL-3 | file LICENSE */
|
||||
#showcase-well{border-radius:0}.shiny-code{background-color:#fff;margin-bottom:0}.shiny-code code{font-family:Menlo,Consolas,Courier New,monospace}.shiny-code-container{margin-top:20px;clear:both}.shiny-code-container h3{display:inline;margin-right:15px}.showcase-header{font-size:16px;font-weight:400}.showcase-code-link{text-align:right;padding:15px}#showcase-app-container{vertical-align:top}#showcase-code-tabs{margin-right:15px}#showcase-code-tabs pre{border:none;line-height:1em}#showcase-code-tabs .nav,#showcase-code-tabs ul{margin-bottom:0}#showcase-code-tabs .tab-content{border-style:solid;border-color:#e5e5e5;border-width:0px 1px 1px 1px;overflow:auto;border-bottom-right-radius:4px;border-bottom-left-radius:4px}#showcase-app-code{width:100%}#showcase-code-position-toggle{float:right}#showcase-sxs-code{padding-top:20px;vertical-align:top}.showcase-code-license{display:block;text-align:right}#showcase-code-content pre{background-color:#fff}
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,3 +1,3 @@
|
||||
/*! shiny 1.7.5.9000 | (c) 2012-2023 RStudio, PBC. | License: GPL-3 | file LICENSE */
|
||||
"use strict";(()=>{var t=eval;window.addEventListener("message",function(a){let e=a.data;e.code&&t(e.code)});})();
|
||||
/*! shiny 1.7.4.9002 | (c) 2012-2023 RStudio, PBC. | License: GPL-3 | file LICENSE */
|
||||
"use strict";(function(){var a=eval;window.addEventListener("message",function(i){var e=i.data;e.code&&a(e.code)});})();
|
||||
//# sourceMappingURL=shiny-testmode.js.map
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../../srcts/src/utils/eval.ts", "../../../srcts/extras/shiny-testmode.ts"],
|
||||
"sourcesContent": ["//esbuild.github.io/content-types/#direct-eval\n//tl/dr;\n// * Direct usage of `eval(\"x\")` is bad with bundled code.\n// * Instead, use indirect calls to `eval` such as `indirectEval(\"x\")`\n// * Even just renaming the function works well enough.\n// > This is known as \"indirect eval\" because eval is not being called directly, and so does not trigger the grammatical special case for direct eval in the JavaScript VM. You can call indirect eval using any syntax at all except for an expression of the exact form eval('x'). For example, var eval2 = eval; eval2('x') and [eval][0]('x') and window.eval('x') are all indirect eval calls.\n// > When you use indirect eval, the code is evaluated in the global scope instead of in the inline scope of the caller.\n\nconst indirectEval = eval;\n\nexport { indirectEval };\n", "/* eslint-disable unicorn/filename-case */\nimport { indirectEval } from \"../src/utils/eval\";\n\n// Listen for messages from parent frame. This file is only added when the\n// shiny.testmode option is TRUE.\nwindow.addEventListener(\"message\", function (e: { data: { code: string } }) {\n const message = e.data;\n\n if (message.code) indirectEval(message.code);\n});\n"],
|
||||
"mappings": ";mBAQA,IAAMA,EAAe,KCHrB,OAAO,iBAAiB,UAAW,SAAUC,EAA+B,CAC1E,IAAMC,EAAUD,EAAE,KAEdC,EAAQ,MAAMC,EAAaD,EAAQ,IAAI,CAC7C,CAAC",
|
||||
"sourcesContent": ["//esbuild.github.io/content-types/#direct-eval\n//tl/dr;\n// * Direct usage of `eval(\"x\")` is bad with bundled code.\n// * Instead, use indirect calls to `eval` such as `indirectEval(\"x\")`\n// * Even just renaming the function works well enough.\n// > This is known as \"indirect eval\" because eval is not being called directly, and so does not trigger the grammatical special case for direct eval in the JavaScript VM. You can call indirect eval using any syntax at all except for an expression of the exact form eval('x'). For example, var eval2 = eval; eval2('x') and [eval][0]('x') and window.eval('x') are all indirect eval calls.\n// > When you use indirect eval, the code is evaluated in the global scope instead of in the inline scope of the caller.\n\nvar indirectEval = eval;\nexport { indirectEval };", "/* eslint-disable unicorn/filename-case */\nimport { indirectEval } from \"../src/utils/eval\";\n\n// Listen for messages from parent frame. This file is only added when the\n// shiny.testmode option is TRUE.\nwindow.addEventListener(\"message\", function (e) {\n var message = e.data;\n if (message.code) indirectEval(message.code);\n});"],
|
||||
"mappings": ";yBAQA,IAAIA,EAAe,KCHnB,OAAO,iBAAiB,UAAW,SAAUC,EAAG,CAC9C,IAAIC,EAAUD,EAAE,KACZC,EAAQ,MAAMC,EAAaD,EAAQ,IAAI,CAC7C,CAAC",
|
||||
"names": ["indirectEval", "e", "message", "indirectEval"]
|
||||
}
|
||||
|
||||
20625
inst/www/shared/shiny.js
20625
inst/www/shared/shiny.js
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
4
inst/www/shared/shiny.min.css
vendored
4
inst/www/shared/shiny.min.css
vendored
File diff suppressed because one or more lines are too long
13
inst/www/shared/shiny.min.js
vendored
13
inst/www/shared/shiny.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
69
inst/www/shared/shiny_scss/bootstrap.scss
vendored
69
inst/www/shared/shiny_scss/bootstrap.scss
vendored
@@ -1,46 +1,43 @@
|
||||
$prefix: bs- !default; // BS5 CSS variable prefix
|
||||
$bg: $body-bg !default;
|
||||
|
||||
// For BS3, which doesn't have these Sass variables (but has other, similar ones)
|
||||
$fg: null !default;
|
||||
$theme-colors: null !default;
|
||||
@if variable-exists('text-color') {
|
||||
$fg: $text-color !default; // BS3
|
||||
$theme-colors: ("primary": $brand-primary, "info": $brand-info, "warning": $brand-warning, "danger": $brand-danger) !default;
|
||||
} @else {
|
||||
$fg: $body-color !default; // BS4
|
||||
}
|
||||
// No $border-width, $border-color, or $border-radius in BS3
|
||||
$border-width: 1px !default;
|
||||
$border-color: mix($bg, $fg, 70%) !default;
|
||||
$border-radius: $border-radius-base !default;
|
||||
$border-color: mix($body-bg, $text-color, 70%) !default;
|
||||
$primary: $brand-primary !default;
|
||||
$info: $brand-info !default;
|
||||
$warning: $brand-warning !default;
|
||||
$danger: $brand-danger !default;
|
||||
|
||||
// No rgb CSS vars available in BS3-4
|
||||
$primary-rgb: var(--#{$prefix}primary-rgb, red($primary),green($primary),blue($primary)) !default;
|
||||
$info-rgb: var(--#{$prefix}info-rgb, red($info), green($info), blue($info)) !default;
|
||||
$warning-rgb: var(--#{$prefix}warning-rgb, red($warning), green($warning), blue($warning)) !default;
|
||||
$danger-rgb: var(--#{$prefix}danger-rgb, red($danger), green($danger), blue($danger)) !default;
|
||||
|
||||
|
||||
$shiny-emphasis-color-rgb: var(--#{$prefix}emphasis-color-rgb, 0,0,0) !default;
|
||||
$shiny-disconnected-bg: RGBA($shiny-emphasis-color-rgb, 0.42) !default;
|
||||
$shiny-table-na: RGBA($shiny-emphasis-color-rgb, 0.46) !default;
|
||||
$shiny-error-validated-color: RGBA($shiny-emphasis-color-rgb, 0.5) !default;
|
||||
$shiny-progress-text-bg-color: RGBA($primary-rgb, 0.05) !default;
|
||||
$shiny-input-panel-bg: RGBA($shiny-emphasis-color-rgb, 0.04) !default;
|
||||
$shiny-input-panel-border: $border-width solid var(--#{$prefix}border-color, $border-color) !default;
|
||||
$shiny-disconnected-bg: mix($bg, $fg, 58%) !default;
|
||||
$shiny-table-na: mix($bg, $fg, 54%) !default;
|
||||
$shiny-error-validated-color: mix($bg, $fg, 50%) !default;
|
||||
// TODO: what should this be? mix of primary and bg?
|
||||
$shiny-progress-text-bg-color: #eef8ff !default;
|
||||
$shiny-input-panel-bg: mix($bg, $fg, 96%) !default;
|
||||
$shiny-input-panel-border: $border-width solid $border-color !default;
|
||||
$shiny-input-panel-border-radius: $border-radius !default;
|
||||
$shiny-text-output-border-radius: $border-radius !default;
|
||||
$notification-bg-color: RGBA($shiny-emphasis-color-rgb, 0.05) !default;
|
||||
$notification-color: $shiny-emphasis-color-rgb !default;
|
||||
$notification-border: $border-width solid var(--#{$prefix}border-color, $border-color) !default;
|
||||
$notification-bg-color: mix($bg, $fg, 90%) !default;
|
||||
$notification-color: $fg !default;
|
||||
$notification-border: $border-width solid $border-color !default;
|
||||
$notification-border-radius: $border-radius !default;
|
||||
$notification-message-bg: RGBA($info-rgb, 0.05) !default;
|
||||
$notification-message-color: RGBA($info-rgb, 1) !default;
|
||||
$notification-message-border: $border-width solid RGBA($info-rgb, 0.5) !default;
|
||||
$notification-warning-bg: RGBA($warning-rgb, 0.05) !default;
|
||||
$notification-warning-color: RGBA($warning-rgb, 0.9) !default;
|
||||
$notification-warning-border: $border-width solid RGBA($warning-rgb, 0.3) !default;
|
||||
$notification-error-bg: RGBA($danger-rgb, 0.05) !default;
|
||||
$notification-error-color: RGBA($danger-rgb, 0.9) !default;
|
||||
$notification-error-border: $border-width solid RGBA($warning-rgb, 0.2) !default;
|
||||
$notification-close-color: RGBA($shiny-emphasis-color-rgb, 0.8) !default;
|
||||
$notification-close-hover-color: RGB($shiny-emphasis-color-rgb) !default;
|
||||
$notification-content-action-color: RGB($primary-rgb) !default;
|
||||
$notification-message-bg: mix($bg, map-get($theme-colors, "info"), 90%) !default;
|
||||
$notification-message-color: mix($fg, map-get($theme-colors, "info"), 10%) !default;
|
||||
$notification-message-border: $border-width solid mix($bg, map-get($theme-colors, "info"), 53%) !default;
|
||||
$notification-warning-bg: mix($bg, map-get($theme-colors, "warning"), 90%) !default;
|
||||
$notification-warning-color: mix($fg, map-get($theme-colors, "warning"), 10%) !default;
|
||||
$notification-warning-border: $border-width solid mix($bg, map-get($theme-colors, "warning"), 71%) !default;
|
||||
$notification-error-bg: mix($bg, map-get($theme-colors, "danger"), 90%) !default;
|
||||
$notification-error-color: mix($fg, map-get($theme-colors, "danger"), 10%) !default;
|
||||
$notification-error-border: $border-width solid mix($bg, map-get($theme-colors, "danger"), 79%) !default;
|
||||
$notification-close-color: mix($bg, $fg, 20%) !default;
|
||||
$notification-close-hover-color: $fg !default;
|
||||
$notification-content-action-color: map-get($theme-colors, "primary") !default;
|
||||
$datepicker-disabled-color: $dropdown-link-disabled-color !default;
|
||||
|
||||
// I don't think BS3 has a file input box shadow setting
|
||||
|
||||
@@ -157,9 +157,6 @@ pre.shiny-text-output {
|
||||
margin-top: -9px;
|
||||
}
|
||||
.slider-animate-button {
|
||||
/* Ensure controls above slider line touch target */
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
opacity: 0.5;
|
||||
.pause {
|
||||
display: none;
|
||||
@@ -184,12 +181,6 @@ pre.shiny-text-output {
|
||||
}
|
||||
}
|
||||
|
||||
// fileInput()'s button should never have a top-right or bottom-right border-radius
|
||||
.btn-file {
|
||||
border-top-right-radius: 0 !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
}
|
||||
|
||||
/* Make sure the filename doesn't extend past the bounds of the container */
|
||||
.shiny-input-container input[type=file] {
|
||||
overflow: hidden;
|
||||
@@ -313,6 +304,11 @@ pre.shiny-text-output {
|
||||
zoom: 1.0000001;
|
||||
}
|
||||
|
||||
/* consistency with bootstrap.css for selectize.js */
|
||||
.selectize-control {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.shiny-frame {
|
||||
border: none;
|
||||
}
|
||||
|
||||
@@ -166,8 +166,8 @@ instead of the default 200 MB:
|
||||
}\if{html}{\out{</div>}}
|
||||
|
||||
To use different settings for a session-scoped cache, you can set
|
||||
\code{session$cache} at the top of your server function. By default, it will
|
||||
create a 200 MB memory cache for each session, but you can replace it with
|
||||
\code{self$cache} at the top of your server function. By default, it will create
|
||||
a 200 MB memory cache for each session, but you can replace it with
|
||||
something different. To use the session-scoped cache, you must also call
|
||||
\code{bindCache()} with \code{cache="session"}. This will create a 100 MB cache for
|
||||
the session:
|
||||
|
||||
@@ -24,9 +24,9 @@ fileInput(
|
||||
multiple files at once. \strong{Does not work on older browsers, including
|
||||
Internet Explorer 9 and earlier.}}
|
||||
|
||||
\item{accept}{A character vector of "unique file type specifiers" which gives
|
||||
the browser a hint as to the type of file the server expects. Many browsers
|
||||
use this prevent the user from selecting an invalid file.
|
||||
\item{accept}{A character vector of "unique file type specifiers" which
|
||||
gives the browser a hint as to the type of file the server expects.
|
||||
Many browsers use this prevent the user from selecting an invalid file.
|
||||
|
||||
A unique file type specifier can be:
|
||||
\itemize{
|
||||
@@ -61,19 +61,12 @@ still photos only, also use \code{accept="image/*"}. For video only, use
|
||||
Create a file upload control that can be used to upload one or more files.
|
||||
}
|
||||
\details{
|
||||
Whenever a file upload completes, the corresponding input variable is set to
|
||||
a dataframe. See the \verb{Server value} section.
|
||||
|
||||
Each time files are uploaded, they are written to a new random subdirectory
|
||||
inside of R's process-level temporary directory. The Shiny user session keeps
|
||||
track of all uploads in the session, and when the session ends, Shiny deletes
|
||||
all of the subdirectories where files where uploaded to.
|
||||
Whenever a file upload completes, the corresponding input variable is set
|
||||
to a dataframe. See the \verb{Server value} section.
|
||||
}
|
||||
\section{Server value}{
|
||||
|
||||
|
||||
A \code{data.frame} that contains one row for each selected file, and following
|
||||
columns:
|
||||
A \code{data.frame} that contains one row for each selected file, and following columns:
|
||||
\describe{
|
||||
\item{\code{name}}{The filename provided by the web browser. This is
|
||||
\strong{not} the path to read to get at the actual data that was uploaded
|
||||
|
||||
@@ -58,7 +58,8 @@ tabPanels}
|
||||
navigation bar}
|
||||
|
||||
\item{collapsible}{\code{TRUE} to automatically collapse the navigation
|
||||
elements into an expandable menu on mobile devices or narrow window widths.}
|
||||
elements into a menu when the width of the browser is less than 940 pixels
|
||||
(useful for viewing on smaller touchscreen device)}
|
||||
|
||||
\item{fluid}{\code{TRUE} to use a fluid layout. \code{FALSE} to use a fixed
|
||||
layout.}
|
||||
|
||||
@@ -86,8 +86,8 @@ Positive, negative, and zero values are allowed.}
|
||||
automatically destroyed when its domain (if any) ends.}
|
||||
|
||||
\item{ignoreNULL}{Whether the action should be triggered (or value
|
||||
calculated, in the case of \code{eventReactive}) when the input event expression
|
||||
is \code{NULL}. See Details.}
|
||||
calculated, in the case of \code{eventReactive}) when the input is
|
||||
\code{NULL}. See Details.}
|
||||
|
||||
\item{ignoreInit}{If \code{TRUE}, then, when this \code{observeEvent} is
|
||||
first created/initialized, ignore the \code{handlerExpr} (the second
|
||||
|
||||
@@ -48,7 +48,7 @@ but when \code{size} is set, it will be a box instead.}
|
||||
|
||||
\item{...}{Arguments passed to \code{selectInput()}.}
|
||||
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}(\url{https://selectize.dev/docs/usage})
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}
|
||||
for possible options (character option values inside \code{\link[base:AsIs]{base::I()}} will
|
||||
be treated as literal JavaScript code; see \code{\link[=renderDataTable]{renderDataTable()}}
|
||||
for details).}
|
||||
@@ -62,7 +62,7 @@ from a list of values.
|
||||
}
|
||||
\details{
|
||||
By default, \code{selectInput()} and \code{selectizeInput()} use the JavaScript library
|
||||
\pkg{selectize.js} (\url{https://selectize.dev/}) instead of
|
||||
\pkg{selectize.js} (\url{https://github.com/selectize/selectize.js}) instead of
|
||||
the basic select input element. To use the standard HTML select input
|
||||
element, use \code{selectInput()} with \code{selectize=FALSE}.
|
||||
|
||||
|
||||
@@ -69,9 +69,8 @@ be done 100\% correctly.}
|
||||
\item{shiny.jquery.version (defaults to \code{3})}{The major version of jQuery to use.
|
||||
Currently only values of \code{3} or \code{1} are supported. If \code{1}, then jQuery 1.12.4 is used. If \code{3},
|
||||
then jQuery 3.6.0 is used.}
|
||||
\item{shiny.json.digits (defaults to \code{I(16)})}{Max number of digits to use when converting
|
||||
numbers to JSON format to send to the client web browser. Use \code{\link[=I]{I()}} to specify significant digits.
|
||||
Use \code{NA} for max precision.}
|
||||
\item{shiny.json.digits (defaults to \code{16})}{The number of digits to use when converting
|
||||
numbers to JSON format to send to the client web browser.}
|
||||
\item{shiny.launch.browser (defaults to \code{interactive()})}{A boolean which controls the default behavior
|
||||
when an app is run. See \code{\link[=runApp]{runApp()}} for more information.}
|
||||
\item{shiny.mathjax.url (defaults to \code{"https://mathjax.rstudio.com/latest/MathJax.js"})}{
|
||||
|
||||
@@ -62,7 +62,7 @@ the example section for a small demo of this feature.}
|
||||
\item{selected}{The initially selected value (or multiple values if \code{multiple = TRUE}). If not specified then defaults to the first value for
|
||||
single-select lists and no values for multiple select lists.}
|
||||
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}(\url{https://selectize.dev/docs/usage})
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}
|
||||
for possible options (character option values inside \code{\link[base:AsIs]{base::I()}} will
|
||||
be treated as literal JavaScript code; see \code{\link[=renderDataTable]{renderDataTable()}}
|
||||
for details).}
|
||||
|
||||
@@ -42,7 +42,7 @@ but when \code{size} is set, it will be a box instead.}
|
||||
|
||||
\item{...}{Arguments passed to \code{varSelectInput()}.}
|
||||
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}(\url{https://selectize.dev/docs/usage})
|
||||
\item{options}{A list of options. See the documentation of \pkg{selectize.js}
|
||||
for possible options (character option values inside \code{\link[base:AsIs]{base::I()}} will
|
||||
be treated as literal JavaScript code; see \code{\link[=renderDataTable]{renderDataTable()}}
|
||||
for details).}
|
||||
@@ -57,7 +57,7 @@ from the column names of a data frame.
|
||||
\details{
|
||||
By default, \code{varSelectInput()} and \code{selectizeInput()} use the
|
||||
JavaScript library \pkg{selectize.js}
|
||||
(\url{https://selectize.dev/}) to instead of the basic
|
||||
(\url{https://github.com/selectize/selectize.js}) to instead of the basic
|
||||
select input element. To use the standard HTML select input element, use
|
||||
\code{selectInput()} with \code{selectize=FALSE}.
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
"homepage": "https://shiny.rstudio.com",
|
||||
"repository": "github:rstudio/shiny",
|
||||
"name": "@types/rstudio-shiny",
|
||||
"version": "1.7.5-alpha.9000",
|
||||
"version": "1.7.4-alpha.9002",
|
||||
"license": "GPL-3.0-only",
|
||||
"main": "",
|
||||
"browser": "",
|
||||
@@ -19,6 +19,7 @@
|
||||
"yarn": ">= 1.22"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/plugin-transform-typescript": "^7.21.3",
|
||||
"@types/bootstrap": "3.4.0",
|
||||
"@types/bootstrap-datepicker": "0.0.14",
|
||||
"@types/datatables.net": "^1.10.19",
|
||||
@@ -33,7 +34,6 @@
|
||||
"@babel/preset-typescript": "^7.13.0",
|
||||
"@babel/runtime": "^7.14.0",
|
||||
"@deanc/esbuild-plugin-postcss": "^1.0.2",
|
||||
"@selectize/selectize": "https://github.com/selectize/selectize.js.git#e3f2e0b4aa251375bc21b5fcd8ca7d374a921f08",
|
||||
"@testing-library/dom": "^7.31.0",
|
||||
"@testing-library/jest-dom": "^5.12.0",
|
||||
"@testing-library/user-event": "^13.1.9",
|
||||
@@ -50,6 +50,7 @@
|
||||
"caniuse-lite": "^1.0.30001312",
|
||||
"core-js": "^3.13.0",
|
||||
"esbuild": "^0.15.10",
|
||||
"esbuild-plugin-babel": "https://github.com/schloerke/esbuild-plugin-babel#patch-2",
|
||||
"esbuild-plugin-globals": "^0.1.1",
|
||||
"esbuild-plugin-sass": "^1.0.1",
|
||||
"eslint": "^8.24.0",
|
||||
|
||||
@@ -1,28 +1,12 @@
|
||||
# Revdeps
|
||||
|
||||
## Failed to check (21)
|
||||
## Failed to check (5)
|
||||
|
||||
|package |version |error |warning |note |
|
||||
|:----------|:-------|:-----|:-------|:----|
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|ctsem |3.7.6 |1 | | |
|
||||
|disk.frame |0.8.2 |1 | | |
|
||||
|ctsem |3.6.0 |1 | | |
|
||||
|diveR |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|grandR |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|loon.shiny |? | | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|RQuantLib |0.4.18 |1 | | |
|
||||
|rstanarm |2.21.4 |1 | | |
|
||||
|NA |? | | | |
|
||||
|NA |? | | | |
|
||||
|SSVS |? | | | |
|
||||
|
||||
|
||||
@@ -1,18 +1,15 @@
|
||||
## revdepcheck results
|
||||
|
||||
We checked 1145 reverse dependencies (1131 from CRAN + 14 from Bioconductor), comparing R CMD check results across CRAN and dev versions of this package.
|
||||
We checked 1039 reverse dependencies (1038 from CRAN + 1 from Bioconductor), comparing R CMD check results across CRAN and dev versions of this package.
|
||||
|
||||
* We saw 0 new problems
|
||||
* We failed to check 7 packages
|
||||
* We failed to check 4 packages
|
||||
|
||||
Issues with CRAN packages are summarised below.
|
||||
|
||||
### Failed to check
|
||||
|
||||
* ctsem (NA)
|
||||
* disk.frame (NA)
|
||||
* diveR (NA)
|
||||
* grandR (NA)
|
||||
* loon.shiny (NA)
|
||||
* RQuantLib (NA)
|
||||
* rstanarm (NA)
|
||||
* SSVS (NA)
|
||||
|
||||
@@ -150,6 +150,12 @@ All config files are located in the root folder to avoid opening two separate VS
|
||||
* Used by `prettier` to know how to adjust code when a file is saved in VSCode or within `eslint`'s linting process.
|
||||
* `yarnrc.yml`
|
||||
* Notifies `yarn` to use `yarn` v2, install `./node_modules` folder for `esbuild`, and any CLI plugins.
|
||||
* `babel.config.json`
|
||||
* Used within `babel` transpilation of TypeScript -> JavaScript -> polyfilled JavaScript.
|
||||
* Noteable options set:
|
||||
* `"useBuiltIns": "usage"` - `core-js` polyfills are only added as they are _used_.
|
||||
* `"corejs": "3.9"` - This number should match the installed `core-js` number.
|
||||
* `"ignore":["node_modules/core-js"]` - The `core-js` library is directly ignored to [avoid being processed by `babel`](https://github.com/zloirock/core-js/issues/743#issuecomment-571983318).
|
||||
* `jest.config.js`
|
||||
* Used to configure [`jest` testing](https://jestjs.io/)
|
||||
* `package.json`
|
||||
@@ -162,6 +168,7 @@ All config files are located in the root folder to avoid opening two separate VS
|
||||
* `tsconfig.json` -
|
||||
* TypeScript config file
|
||||
* Notable options set:
|
||||
* `target: ES5` - Compile to es5, so babel has an easier job.
|
||||
* `preserveConstEnums: false` - Do no preserve enum values into the final code. (If true, produces bloat / unused code)
|
||||
* `isolatedModules: true` & `esModuleInterop: true` - Requested by `esbuild`. This [allows for `esbuild`](https://esbuild.github.io/content-types/#typescript) to safely compile the files in parallel
|
||||
|
||||
|
||||
@@ -14,6 +14,10 @@ import { basename } from "path";
|
||||
// @ts-ignore; Type definitions are not found. This occurs when `strict: true` in tsconfig.json
|
||||
import readcontrol from "readcontrol";
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore; Type definitions are not found. This occurs when `strict: true` in tsconfig.json
|
||||
import babelPlugin from "esbuild-plugin-babel";
|
||||
|
||||
const outDir = "./inst/www/shared/";
|
||||
|
||||
type ShinyDesc = { version: string; package: string; license: string };
|
||||
@@ -75,7 +79,7 @@ async function build(
|
||||
return esbuildBuild({
|
||||
incremental: incremental,
|
||||
watch: watch,
|
||||
target: "es2020",
|
||||
target: "es5",
|
||||
preserveSymlinks: true,
|
||||
...opts,
|
||||
}).then((x) => {
|
||||
@@ -84,4 +88,4 @@ async function build(
|
||||
});
|
||||
}
|
||||
|
||||
export { outDir, build, shinyDesc, banner };
|
||||
export { outDir, build, shinyDesc, banner, babelPlugin };
|
||||
|
||||
@@ -5,12 +5,13 @@
|
||||
|
||||
// - TypeScript -----------------------------------------------------------
|
||||
|
||||
import { banner, build, outDir } from "./_build";
|
||||
import { banner, build, outDir, babelPlugin } from "./_build";
|
||||
|
||||
build({
|
||||
bundle: true,
|
||||
sourcemap: true,
|
||||
minify: true,
|
||||
plugins: [babelPlugin()],
|
||||
banner: banner,
|
||||
entryPoints: [
|
||||
"srcts/extras/shiny-autoreload.ts",
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
// yarn build
|
||||
// ```
|
||||
|
||||
import { banner, build, outDir, shinyDesc } from "./_build";
|
||||
import { banner, build, outDir, shinyDesc, babelPlugin } from "./_build";
|
||||
import globalsPlugin from "esbuild-plugin-globals";
|
||||
import type { BuildOptions } from "esbuild";
|
||||
import { verifyJqueryImport } from "./_jquery";
|
||||
@@ -18,6 +18,7 @@ const opts: BuildOptions = {
|
||||
//// Loaded dynamically. MUST use `window.strftime` within code
|
||||
// strftime: "window.strftime",
|
||||
}),
|
||||
babelPlugin(),
|
||||
],
|
||||
define: {
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
|
||||
@@ -9,7 +9,6 @@ type CheckboxReceiveMessageData = { value?: CheckboxChecked; label?: string };
|
||||
|
||||
class CheckboxInputBinding extends InputBinding {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs also have .shiny-input-checkbox class
|
||||
return $(scope).find('input[type="checkbox"]');
|
||||
}
|
||||
getValue(el: CheckedHTMLElement): CheckboxChecked {
|
||||
|
||||
@@ -195,7 +195,6 @@ function fileInputBindingGetId(this: any, el: HTMLInputElement): string {
|
||||
|
||||
class FileInputBinding extends InputBinding {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs also have .shiny-input-file class
|
||||
return $(scope).find('input[type="file"]');
|
||||
}
|
||||
getId(el: HTMLInputElement): string {
|
||||
|
||||
@@ -20,7 +20,6 @@ function getLabelNode(el: NumberHTMLElement): JQuery<HTMLElement> {
|
||||
|
||||
class NumberInputBinding extends TextInputBindingBase {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs also have .shiny-input-number class
|
||||
return $(scope).find('input[type="number"]');
|
||||
}
|
||||
|
||||
|
||||
@@ -4,7 +4,6 @@ import { TextInputBinding } from "./text";
|
||||
|
||||
class PasswordInputBinding extends TextInputBinding {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs also have .shiny-input-password class
|
||||
return $(scope).find('input[type="password"]');
|
||||
}
|
||||
|
||||
|
||||
@@ -2,7 +2,6 @@ import $ from "jquery";
|
||||
import { InputBinding } from "./inputBinding";
|
||||
import { $escape, hasDefinedProperty, updateLabel } from "../../utils";
|
||||
import { indirectEval } from "../../utils/eval";
|
||||
import { shinyBindAll, shinyUnbindAll } from "../../shiny/initedMethods";
|
||||
import type { NotUndefined } from "../../utils/extraTypes";
|
||||
|
||||
type SelectHTMLElement = HTMLSelectElement & { nonempty: boolean };
|
||||
@@ -43,7 +42,6 @@ function isSelectize(el: HTMLElement): boolean {
|
||||
|
||||
class SelectInputBinding extends InputBinding {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs also have .shiny-input-select class
|
||||
return $(scope).find("select");
|
||||
}
|
||||
getType(el: HTMLElement): string | null {
|
||||
@@ -284,32 +282,15 @@ class SelectInputBinding extends InputBinding {
|
||||
// @ts-expect-error; Need to type `options` keys to know exactly which values are accessed.
|
||||
options[x] = indirectEval("(" + options[x] + ")");
|
||||
});
|
||||
|
||||
let control = this._newSelectize($el, options);
|
||||
|
||||
let control = $el.selectize(options)[0].selectize as SelectizeInfo;
|
||||
// .selectize() does not really update settings; must destroy and rebuild
|
||||
|
||||
if (update) {
|
||||
const settings = $.extend(control.settings, options);
|
||||
|
||||
control.destroy();
|
||||
control = this._newSelectize($el, settings);
|
||||
control = $el.selectize(settings)[0].selectize as SelectizeInfo;
|
||||
}
|
||||
|
||||
return control;
|
||||
}
|
||||
|
||||
protected _newSelectize(
|
||||
$el: JQuery<HTMLSelectElement>,
|
||||
options: SelectizeOptions
|
||||
): SelectizeInfo {
|
||||
// Starting with selectize v0.15.2, $el.selectize() can prune the <select>
|
||||
// element from the DOM, meaning that if we're already bound to it, we'll
|
||||
// lose the binding. So if we are bound, unbind first, then rebind after.
|
||||
// (Note this is quite similar to how Shiny.renderContent() works.)
|
||||
const binding = $el.data("shiny-input-binding");
|
||||
if (binding) shinyUnbindAll($el.parent());
|
||||
const control = $el.selectize(options)[0].selectize as SelectizeInfo;
|
||||
if (binding) shinyBindAll($el.parent());
|
||||
return control;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -197,16 +197,7 @@ class SliderInputBinding extends TextInputBindingBase {
|
||||
msg.to = data.value[1];
|
||||
} else {
|
||||
if (Array.isArray(data.value)) {
|
||||
const errorReason = [
|
||||
"an empty array.",
|
||||
"a single-value array.",
|
||||
"an array with more than two values.",
|
||||
];
|
||||
throw (
|
||||
"Slider requires two values to update with an array, " +
|
||||
"but message value was " +
|
||||
errorReason[Math.min(data.value.length, 2)]
|
||||
);
|
||||
throw "Slider only contains a single value and cannot be updated with an array";
|
||||
}
|
||||
msg.from = data.value;
|
||||
}
|
||||
|
||||
@@ -29,8 +29,7 @@ class TextInputBindingBase extends InputBinding {
|
||||
// id that ends in '-selectized'. The .not() selector below
|
||||
// is to prevent textInputBinding from accidentally picking up
|
||||
// this hidden element as a shiny input (#2396)
|
||||
//
|
||||
// Inputs also now have .shiny-input-text class
|
||||
|
||||
return $inputs.not('input[type="text"][id$="-selectized"]');
|
||||
}
|
||||
|
||||
|
||||
@@ -4,7 +4,6 @@ import { TextInputBinding } from "./text";
|
||||
|
||||
class TextareaInputBinding extends TextInputBinding {
|
||||
find(scope: HTMLElement): JQuery<HTMLElement> {
|
||||
// Inputs now also have the .shiny-input-textarea class
|
||||
return $(scope).find("textarea");
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,26 +0,0 @@
|
||||
import $ from "jquery";
|
||||
import type { FileInputBinding } from "../bindings/input/fileinput";
|
||||
import type { ShinyEventInputChanged } from "./shinyEvents";
|
||||
|
||||
function triggerFileInputChanged(
|
||||
name: string,
|
||||
value: unknown,
|
||||
binding: FileInputBinding,
|
||||
el: HTMLElement,
|
||||
inputType: string,
|
||||
onEl: typeof document
|
||||
): ShinyEventInputChanged {
|
||||
const evt = $.Event("shiny:inputchanged") as ShinyEventInputChanged;
|
||||
|
||||
evt.name = name;
|
||||
evt.value = value;
|
||||
evt.binding = binding;
|
||||
evt.el = el;
|
||||
evt.inputType = inputType;
|
||||
|
||||
$(onEl).trigger(evt);
|
||||
|
||||
return evt;
|
||||
}
|
||||
|
||||
export { triggerFileInputChanged };
|
||||
@@ -54,3 +54,5 @@ declare global {
|
||||
): this;
|
||||
}
|
||||
}
|
||||
|
||||
export type { EvtFn };
|
||||
|
||||
@@ -2,35 +2,589 @@ import type { InputBinding } from "../bindings/input/inputBinding";
|
||||
import type { OutputBindingAdapter } from "../bindings/outputAdapter";
|
||||
import type { EventPriority } from "../inputPolicies/inputPolicy";
|
||||
import type { ErrorsMessageValue } from "../shiny/shinyapp";
|
||||
import type { EvtFn } from "./jQueryEvents";
|
||||
import $ from "jquery";
|
||||
|
||||
/**
|
||||
* Shiny Event Base
|
||||
*
|
||||
* This class implements a common interface for all Shiny events, and provides a
|
||||
* layer of abstraction between the Shiny event and the underlying jQuery event
|
||||
* object. We use a new class, rather than extending JQuery.Event, because
|
||||
* JQuery.Event is an old function-style class. Each Event class has a
|
||||
* corresponding ShinyEvent interface that describes the event object that is
|
||||
* emitted. At the end of this file, we extend JQuery's `on()` method to
|
||||
* associate the ShinyEvent interfaces with their corresponding event string.
|
||||
*
|
||||
* @class EventBase
|
||||
* @typedef {EventBase}
|
||||
*/
|
||||
class EventBase {
|
||||
/**
|
||||
* The underlying jQuery event object wrapped by `EventBase`.
|
||||
* @type {JQuery.Event}
|
||||
*/
|
||||
event: JQuery.Event;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventBase.
|
||||
*
|
||||
* @constructor
|
||||
* @param {string} type - The event type.
|
||||
*/
|
||||
constructor(type: string) {
|
||||
this.event = $.Event(type);
|
||||
}
|
||||
|
||||
/**
|
||||
* Trigger the event on an element or the document.
|
||||
*
|
||||
* @example
|
||||
* // Instead of this...
|
||||
* el.trigger(shinyEvent);
|
||||
* // ...do this
|
||||
* shinyEvent.triggerOn(el);
|
||||
*
|
||||
* @param {(HTMLElement | JQuery<HTMLElement> | typeof document | null)} el -
|
||||
* The element to trigger the event on, or `null` to trigger on `document`.
|
||||
*/
|
||||
triggerOn(
|
||||
el: HTMLElement | JQuery<HTMLElement> | typeof document | null
|
||||
): void {
|
||||
$(el || window.document).trigger(this.event);
|
||||
}
|
||||
|
||||
/**
|
||||
* Proxy for `event.preventDefault()`.
|
||||
*
|
||||
* @returns {boolean} `true` if the default action was prevented, `false`
|
||||
* otherwise.
|
||||
*/
|
||||
isDefaultPrevented(): boolean {
|
||||
return this.event.isDefaultPrevented();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A common interface for most Shiny events.
|
||||
*
|
||||
* @interface ShinyEventCommon
|
||||
* @typedef {ShinyEventCommon}
|
||||
* @extends {JQuery.Event}
|
||||
*/
|
||||
interface ShinyEventCommon extends JQuery.Event {
|
||||
/**
|
||||
* The event name.
|
||||
* @type {string}
|
||||
*/
|
||||
name: string;
|
||||
value: unknown;
|
||||
el: HTMLElement | null;
|
||||
/**
|
||||
* Event value containing arbitrary event data.
|
||||
* @type {*}
|
||||
*/
|
||||
value: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a common Shiny event.
|
||||
*
|
||||
* @class EventCommon
|
||||
* @typedef {EventCommon}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
class EventCommon extends EventBase {
|
||||
/**
|
||||
* The actual event object.
|
||||
* @type {ShinyEventCommon}
|
||||
*/
|
||||
declare event: ShinyEventCommon;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventCommon.
|
||||
*
|
||||
* @constructor
|
||||
* @param {ShinyEventCommon["type"]} type - The Shiny custom event type, e.g.
|
||||
* `shiny:value`.
|
||||
* @param {ShinyEventCommon["name"]} name - The event name.
|
||||
* @param {ShinyEventCommon["value"]} value - The event value, or arbitrary
|
||||
* data included with the event.
|
||||
*/
|
||||
constructor(
|
||||
type: ShinyEventCommon["type"],
|
||||
name: ShinyEventCommon["name"],
|
||||
value: ShinyEventCommon["value"]
|
||||
) {
|
||||
super(type);
|
||||
this.event.name = name;
|
||||
this.event.value = value;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the event name.
|
||||
* @readonly
|
||||
* @type {ShinyEventCommon["name"]}
|
||||
*/
|
||||
get name(): ShinyEventCommon["name"] {
|
||||
return this.event.name;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the event value.
|
||||
* @readonly
|
||||
* @type {ShinyEventCommon["value"]}
|
||||
*/
|
||||
get value(): ShinyEventCommon["value"] {
|
||||
return this.event.value;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* An interface for the `shiny:inputchanged` event.
|
||||
*
|
||||
* @interface ShinyEventInputChanged
|
||||
* @typedef {ShinyEventInputChanged}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventInputChanged extends ShinyEventCommon {
|
||||
value: unknown;
|
||||
/**
|
||||
* The input element whose value has changed.
|
||||
* @type {(HTMLElement | null)}
|
||||
*/
|
||||
el: HTMLElement | null;
|
||||
/**
|
||||
* The input binding for the changed input.
|
||||
* @type {(InputBinding | null)}
|
||||
*/
|
||||
binding: InputBinding | null;
|
||||
/**
|
||||
* The input type.
|
||||
* @type {string}
|
||||
*/
|
||||
inputType: string;
|
||||
priority: EventPriority;
|
||||
/**
|
||||
* The input event priority.
|
||||
* @type {?EventPriority}
|
||||
*/
|
||||
priority?: EventPriority;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a custom `shiny:inputchanged` event as an instance of
|
||||
* EventInputChanged.
|
||||
*
|
||||
* @class EventInputChanged
|
||||
* @typedef {EventInputChanged}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
class EventInputChanged extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventInputChanged` event object.
|
||||
* @type {ShinyEventInputChanged}
|
||||
*/
|
||||
declare event: ShinyEventInputChanged;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventInputChanged.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventInputChanged["name"];
|
||||
value: ShinyEventInputChanged["value"];
|
||||
el: ShinyEventInputChanged["el"];
|
||||
binding: ShinyEventInputChanged["binding"];
|
||||
inputType: ShinyEventInputChanged["inputType"];
|
||||
priority?: ShinyEventInputChanged["priority"];
|
||||
}} {
|
||||
name,
|
||||
value,
|
||||
el,
|
||||
binding,
|
||||
inputType,
|
||||
priority,
|
||||
}
|
||||
*/
|
||||
constructor({
|
||||
name,
|
||||
value,
|
||||
el,
|
||||
binding,
|
||||
inputType,
|
||||
priority,
|
||||
}: {
|
||||
name: ShinyEventInputChanged["name"];
|
||||
value: ShinyEventInputChanged["value"];
|
||||
el: ShinyEventInputChanged["el"];
|
||||
binding: ShinyEventInputChanged["binding"];
|
||||
inputType: ShinyEventInputChanged["inputType"];
|
||||
priority?: ShinyEventInputChanged["priority"];
|
||||
}) {
|
||||
super("shiny:inputchanged", name, value);
|
||||
this.event.el = el;
|
||||
this.event.binding = binding;
|
||||
this.event.inputType = inputType;
|
||||
if (priority) {
|
||||
this.event.priority = priority;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the input element whose value has changed.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["el"]}
|
||||
*/
|
||||
get el(): ShinyEventInputChanged["el"] {
|
||||
return this.event.el;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the input binding for the changed input.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventInputChanged["binding"] {
|
||||
return this.event.binding;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the input type.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["inputType"]}
|
||||
*/
|
||||
get inputType(): ShinyEventInputChanged["inputType"] {
|
||||
return this.event.inputType;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the input event priority.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["priority"]}
|
||||
*/
|
||||
get priority(): ShinyEventInputChanged["priority"] {
|
||||
return this.event.priority;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A interface for the custom `shiny:updateinput` event.
|
||||
*
|
||||
* @interface ShinyEventUpdateInput
|
||||
* @typedef {ShinyEventUpdateInput}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventUpdateInput extends ShinyEventCommon {
|
||||
message: unknown;
|
||||
/**
|
||||
* Arbitrary message data, typically sent from the server, to be processed by
|
||||
* the `receiveMessage` method of the input binding.
|
||||
* @type {?*}
|
||||
*/
|
||||
message?: any;
|
||||
/**
|
||||
* The input binding for the input.
|
||||
* @type {InputBinding}
|
||||
*/
|
||||
binding: InputBinding;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a shiny custom `shiny:updateinput` event as an instance of
|
||||
* EventUpdateInput. This event carries message data from the server, sent via
|
||||
* `session$sendInputMessage()`, to the input binding's `receiveMessage` method.
|
||||
*
|
||||
* @class EventUpdateInput
|
||||
* @typedef {EventUpdateInput}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
class EventUpdateInput extends EventBase {
|
||||
/**
|
||||
* The `ShinyEventUpdateInput` event object.
|
||||
* @type {ShinyEventUpdateInput}
|
||||
*/
|
||||
declare event: ShinyEventUpdateInput;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventUpdateInput.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
message?: ShinyEventUpdateInput["message"];
|
||||
binding: ShinyEventUpdateInput["binding"];
|
||||
}} {
|
||||
message,
|
||||
binding,
|
||||
}
|
||||
*/
|
||||
constructor({
|
||||
message,
|
||||
binding,
|
||||
}: {
|
||||
message?: ShinyEventUpdateInput["message"];
|
||||
binding: ShinyEventUpdateInput["binding"];
|
||||
}) {
|
||||
super("shiny:updateinput");
|
||||
if (message) {
|
||||
this.event.message = message;
|
||||
}
|
||||
this.event.binding = binding;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the `shiny:updateinput` message data.
|
||||
* @readonly
|
||||
* @type {ShinyEventUpdateInput["message"]}
|
||||
*/
|
||||
get message(): ShinyEventUpdateInput["message"] {
|
||||
return this.event.message;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the input binding for the input.
|
||||
* @readonly
|
||||
* @type {ShinyEventUpdateInput["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventUpdateInput["binding"] {
|
||||
return this.event.binding;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A interface for the custom `shiny:value` event.
|
||||
*
|
||||
* @interface ShinyEventValue
|
||||
* @typedef {ShinyEventValue}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventValue extends ShinyEventCommon {
|
||||
value: unknown;
|
||||
/**
|
||||
* The output binding for the output that updated.
|
||||
* @type {OutputBindingAdapter}
|
||||
*/
|
||||
binding: OutputBindingAdapter;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a shiny custom `shiny:value` event as an instance of EventValue. This
|
||||
* event is triggered when an output's value changes.
|
||||
*
|
||||
* @class EventValue
|
||||
* @typedef {EventValue}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
class EventValue extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventValue` event object.
|
||||
* @type {ShinyEventValue}
|
||||
*/
|
||||
declare event: ShinyEventValue;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventValue.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventValue["name"];
|
||||
value: ShinyEventValue["value"];
|
||||
binding: ShinyEventValue["binding"];
|
||||
}} {
|
||||
name,
|
||||
value,
|
||||
binding,
|
||||
}
|
||||
*/
|
||||
constructor({
|
||||
name,
|
||||
value,
|
||||
binding,
|
||||
}: {
|
||||
name: ShinyEventValue["name"];
|
||||
value: ShinyEventValue["value"];
|
||||
binding: ShinyEventValue["binding"];
|
||||
}) {
|
||||
super("shiny:value", name, value);
|
||||
this.event.binding = binding;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the output binding for the output that updated.
|
||||
* @readonly
|
||||
* @type {ShinyEventValue["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventValue["binding"] {
|
||||
return this.event.binding;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A interface for the custom `shiny:error` event.
|
||||
*
|
||||
* @interface ShinyEventError
|
||||
* @typedef {ShinyEventError}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventError extends ShinyEventCommon {
|
||||
/**
|
||||
* The output binding for the output where the error occurred.
|
||||
* @type {OutputBindingAdapter}
|
||||
*/
|
||||
binding: OutputBindingAdapter;
|
||||
/**
|
||||
* The error message.
|
||||
* @type {ErrorsMessageValue}
|
||||
*/
|
||||
error: ErrorsMessageValue;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a shiny custom `shiny:error` event as an instance of EventError. This
|
||||
* event is triggered when an error occurs while processing the reactive
|
||||
* expression that produces the output.
|
||||
*
|
||||
* @class EventError
|
||||
* @typedef {EventError}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
class EventError extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventError` event object.
|
||||
* @type {ShinyEventError}
|
||||
*/
|
||||
declare event: ShinyEventError;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventError.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventError["name"];
|
||||
binding: ShinyEventError["binding"];
|
||||
error: ShinyEventError["error"];
|
||||
}} {
|
||||
name,
|
||||
binding,
|
||||
error,
|
||||
}
|
||||
*/
|
||||
constructor({
|
||||
name,
|
||||
binding,
|
||||
error,
|
||||
}: {
|
||||
name: ShinyEventError["name"];
|
||||
binding: ShinyEventError["binding"];
|
||||
error: ShinyEventError["error"];
|
||||
}) {
|
||||
super("shiny:error", name, null);
|
||||
this.event.binding = binding;
|
||||
this.event.error = error;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the output binding for the output where the error occurred.
|
||||
* @readonly
|
||||
* @type {ShinyEventError["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventError["binding"] {
|
||||
return this.event.binding;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the error message.
|
||||
* @readonly
|
||||
* @type {ShinyEventError["error"]}
|
||||
*/
|
||||
get error(): ShinyEventError["error"] {
|
||||
return this.event.error;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A interface for the custom `shiny:message` event.
|
||||
*
|
||||
* @interface ShinyEventMessage
|
||||
* @typedef {ShinyEventMessage}
|
||||
* @extends {JQuery.Event}
|
||||
*/
|
||||
interface ShinyEventMessage extends JQuery.Event {
|
||||
/**
|
||||
* Arbitrary message data from the server. This data will ultimately be
|
||||
* handled by the function provided to `Shiny.addCustomMessageHandler()` for
|
||||
* the given message type.
|
||||
*
|
||||
* @type {{ [key: string]: unknown }}
|
||||
*/
|
||||
message: { [key: string]: unknown };
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a shiny custom `shiny:message` event as an instance of EventMessage.
|
||||
* This message is triggered when the server sends a custom message to the app
|
||||
* via `session$sendCustomMessage()`.
|
||||
*
|
||||
* @class EventMessage
|
||||
* @typedef {EventMessage}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
class EventMessage extends EventBase {
|
||||
/**
|
||||
* The `ShinyEventMessage` event object.
|
||||
* @type {ShinyEventMessage}
|
||||
*/
|
||||
declare event: ShinyEventMessage;
|
||||
|
||||
/**
|
||||
* Creates an instance of EventMessage.
|
||||
*
|
||||
* @constructor
|
||||
* @param {ShinyEventMessage["message"]} message
|
||||
*/
|
||||
constructor(message: ShinyEventMessage["message"]) {
|
||||
super("shiny:message");
|
||||
this.event.message = message;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the message data from the event.
|
||||
* @readonly
|
||||
* @type {ShinyEventMessage["message"]}
|
||||
*/
|
||||
get message(): ShinyEventMessage["message"] {
|
||||
return this.event.message;
|
||||
}
|
||||
}
|
||||
|
||||
// Augment the JQuery interface ----------------------------------------------
|
||||
// This allows extensions to use .on() in Typescript with Shiny's custom events.
|
||||
// E.g. in {bslib}, we can use the following with complete type information:
|
||||
//
|
||||
// ```
|
||||
// $(document).on("shiny:value", function(event: ShinyEventValue) { })
|
||||
// ```
|
||||
declare global {
|
||||
interface JQuery {
|
||||
on(
|
||||
events: "shiny:inputchanged",
|
||||
handler: EvtFn<ShinyEventInputChanged>
|
||||
): this;
|
||||
|
||||
on(
|
||||
events: "shiny:updateinput",
|
||||
handler: EvtFn<ShinyEventUpdateInput>
|
||||
): this;
|
||||
|
||||
on(events: "shiny:value", handler: EvtFn<ShinyEventValue>): this;
|
||||
on(events: "shiny:error", handler: EvtFn<ShinyEventError>): this;
|
||||
on(events: "shiny:message", handler: EvtFn<ShinyEventMessage>): this;
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
EventCommon,
|
||||
EventInputChanged,
|
||||
EventUpdateInput,
|
||||
EventValue,
|
||||
EventError,
|
||||
EventMessage,
|
||||
};
|
||||
|
||||
export type {
|
||||
ShinyEventInputChanged,
|
||||
ShinyEventUpdateInput,
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import $ from "jquery";
|
||||
import { triggerFileInputChanged } from "../events/inputChanged";
|
||||
import { $escape } from "../utils";
|
||||
import type { ShinyApp } from "../shiny/shinyapp";
|
||||
import { getFileInputBinding } from "../shiny/initedMethods";
|
||||
import { EventInputChanged } from "../events/shinyEvents";
|
||||
|
||||
type JobId = string;
|
||||
type UploadUrl = string;
|
||||
@@ -227,14 +227,14 @@ class FileUploader extends FileProcessor {
|
||||
// Trigger shiny:inputchanged. Unlike a normal shiny:inputchanged event,
|
||||
// it's not possible to modify the information before the values get
|
||||
// sent to the server.
|
||||
const evt = triggerFileInputChanged(
|
||||
this.id,
|
||||
fileInfo,
|
||||
getFileInputBinding(),
|
||||
this.el,
|
||||
"shiny.fileupload",
|
||||
document
|
||||
);
|
||||
const inputChangedEvent = new EventInputChanged({
|
||||
name: this.id,
|
||||
value: fileInfo,
|
||||
el: this.el,
|
||||
binding: getFileInputBinding(),
|
||||
inputType: "shiny.fileupload",
|
||||
});
|
||||
inputChangedEvent.triggerOn(document);
|
||||
|
||||
this.makeRequest(
|
||||
"uploadEnd",
|
||||
@@ -245,7 +245,7 @@ class FileUploader extends FileProcessor {
|
||||
this.$bar().text("Upload complete");
|
||||
// Reset the file input's value to "". This allows the same file to be
|
||||
// uploaded again. https://stackoverflow.com/a/22521275
|
||||
$(evt.el as HTMLElement).val("");
|
||||
$(inputChangedEvent.el as HTMLElement).val("");
|
||||
},
|
||||
(error) => {
|
||||
this.onError(error);
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import $ from "jquery";
|
||||
import type { InputPolicy, InputPolicyOpts } from "./inputPolicy";
|
||||
import type { ShinyEventInputChanged } from "../events/shinyEvents";
|
||||
import { EventInputChanged } from "../events/shinyEvents";
|
||||
import { splitInputNameType } from "./splitInputNameType";
|
||||
|
||||
class InputEventDecorator implements InputPolicy {
|
||||
@@ -11,31 +10,34 @@ class InputEventDecorator implements InputPolicy {
|
||||
}
|
||||
|
||||
setInput(nameType: string, value: unknown, opts: InputPolicyOpts): void {
|
||||
const evt = $.Event("shiny:inputchanged") as ShinyEventInputChanged;
|
||||
|
||||
const input = splitInputNameType(nameType);
|
||||
|
||||
evt.name = input.name;
|
||||
evt.inputType = input.inputType;
|
||||
evt.value = value;
|
||||
evt.binding = opts.binding || null;
|
||||
evt.el = opts.el || null;
|
||||
evt.priority = opts.priority;
|
||||
const inputChangedEvent = new EventInputChanged({
|
||||
name: input.name,
|
||||
value,
|
||||
el: opts.el || null,
|
||||
binding: opts.binding || null,
|
||||
inputType: input.inputType,
|
||||
priority: opts.priority,
|
||||
});
|
||||
|
||||
// The `shiny:inputchanged` JavaScript event now triggers on the related
|
||||
// input element instead of `document`. Existing event listeners bound to
|
||||
// `document` will still detect the event due to event bubbling. #2446
|
||||
// If no `el` exists, use `document` instead. #3584
|
||||
$(opts.el || window.document).trigger(evt);
|
||||
inputChangedEvent.triggerOn(opts.el || window.document);
|
||||
|
||||
if (!evt.isDefaultPrevented()) {
|
||||
let name = evt.name;
|
||||
if (!inputChangedEvent.isDefaultPrevented()) {
|
||||
let name = inputChangedEvent.name;
|
||||
|
||||
if (evt.inputType !== "") name += ":" + evt.inputType;
|
||||
if (inputChangedEvent.inputType !== "")
|
||||
name += ":" + inputChangedEvent.inputType;
|
||||
|
||||
// Most opts aren't passed along to lower levels in the input decorator
|
||||
// stack.
|
||||
this.target.setInput(name, evt.value, { priority: opts.priority });
|
||||
this.target.setInput(name, inputChangedEvent.value, {
|
||||
priority: opts.priority,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -82,7 +82,6 @@ function bindInputs(
|
||||
|
||||
for (let j = 0; j < matches.length; j++) {
|
||||
const el = matches[j];
|
||||
if (el.hasAttribute("data-shiny-no-bind-input")) continue;
|
||||
const id = binding.getId(el);
|
||||
|
||||
// Check if ID is falsy, or if already bound
|
||||
|
||||
@@ -15,11 +15,11 @@ import type { HtmlDep } from "./render";
|
||||
import { hideReconnectDialog, showReconnectDialog } from "./reconnectDialog";
|
||||
import { resetBrush } from "../imageutils/resetBrush";
|
||||
import type { OutputBindingAdapter } from "../bindings/outputAdapter";
|
||||
import type {
|
||||
ShinyEventError,
|
||||
ShinyEventMessage,
|
||||
ShinyEventValue,
|
||||
ShinyEventUpdateInput,
|
||||
import {
|
||||
EventValue,
|
||||
EventUpdateInput,
|
||||
EventError,
|
||||
EventMessage,
|
||||
} from "../events/shinyEvents";
|
||||
import type { InputBinding } from "../bindings";
|
||||
import { indirectEval } from "../utils/eval";
|
||||
@@ -471,37 +471,31 @@ class ShinyApp {
|
||||
delete this.$values[name];
|
||||
|
||||
const binding = this.$bindings[name];
|
||||
const evt: ShinyEventError = $.Event("shiny:error");
|
||||
|
||||
evt.name = name;
|
||||
evt.error = error;
|
||||
evt.binding = binding;
|
||||
$(binding ? binding.el : document).trigger(evt);
|
||||
if (!evt.isDefaultPrevented() && binding && binding.onValueError) {
|
||||
binding.onValueError(evt.error);
|
||||
const errorEvent = new EventError({ name, error, binding });
|
||||
errorEvent.triggerOn(binding?.el);
|
||||
|
||||
if (!errorEvent.isDefaultPrevented() && binding && binding.onValueError) {
|
||||
binding.onValueError(errorEvent.error);
|
||||
}
|
||||
}
|
||||
|
||||
async receiveOutput<T>(name: string, value: T): Promise<T | undefined> {
|
||||
const binding = this.$bindings[name];
|
||||
const evt: ShinyEventValue = $.Event("shiny:value");
|
||||
|
||||
evt.name = name;
|
||||
evt.value = value;
|
||||
evt.binding = binding;
|
||||
const valueEvent = new EventValue({ name, value, binding });
|
||||
|
||||
if (this.$values[name] === value) {
|
||||
$(binding ? binding.el : document).trigger(evt);
|
||||
valueEvent.triggerOn(binding?.el);
|
||||
return undefined;
|
||||
}
|
||||
|
||||
this.$values[name] = value;
|
||||
delete this.$errors[name];
|
||||
|
||||
$(binding ? binding.el : document).trigger(evt);
|
||||
valueEvent.triggerOn(binding?.el);
|
||||
|
||||
if (!evt.isDefaultPrevented() && binding) {
|
||||
await binding.onValueChange(evt.value);
|
||||
if (!valueEvent.isDefaultPrevented() && binding) {
|
||||
await binding.onValueChange(valueEvent.value);
|
||||
}
|
||||
|
||||
return value;
|
||||
@@ -622,7 +616,7 @@ class ShinyApp {
|
||||
// Shiny.addCustomMessageHandler = addCustomMessageHandler;
|
||||
|
||||
async dispatchMessage(data: ArrayBufferLike | string): Promise<void> {
|
||||
let msgObj: ShinyEventMessage["message"] = {};
|
||||
let msgObj: EventMessage["message"] = {};
|
||||
|
||||
if (typeof data === "string") {
|
||||
msgObj = JSON.parse(data);
|
||||
@@ -643,15 +637,13 @@ class ShinyApp {
|
||||
msgObj.custom[type] = data;
|
||||
}
|
||||
|
||||
const evt: ShinyEventMessage = $.Event("shiny:message");
|
||||
|
||||
evt.message = msgObj;
|
||||
$(document).trigger(evt);
|
||||
if (evt.isDefaultPrevented()) return;
|
||||
const messageEvent = new EventMessage({ message: msgObj });
|
||||
messageEvent.triggerOn(document);
|
||||
if (messageEvent.isDefaultPrevented()) return;
|
||||
|
||||
// Send msgObj.foo and msgObj.bar to appropriate handlers
|
||||
await this._sendMessagesToHandlers(
|
||||
evt.message,
|
||||
messageEvent.message,
|
||||
messageHandlers,
|
||||
messageHandlerOrder
|
||||
);
|
||||
@@ -720,21 +712,13 @@ class ShinyApp {
|
||||
if ($obj.length > 0) {
|
||||
if (!$obj.attr("aria-live")) $obj.attr("aria-live", "polite");
|
||||
const el = $obj[0];
|
||||
const evt: ShinyEventUpdateInput = $.Event("shiny:updateinput");
|
||||
|
||||
evt.message = message[i].message;
|
||||
evt.binding = inputBinding;
|
||||
$(el).trigger(evt);
|
||||
if (!evt.isDefaultPrevented()) {
|
||||
try {
|
||||
inputBinding.receiveMessage(el, evt.message);
|
||||
} catch (error) {
|
||||
console.error(
|
||||
"[shiny] Error in inputBinding.receiveMessage()",
|
||||
{ error, binding: inputBinding, message: evt.message }
|
||||
);
|
||||
}
|
||||
}
|
||||
const updateInputEvent = new EventUpdateInput({
|
||||
message: message[i].message,
|
||||
binding: inputBinding,
|
||||
});
|
||||
updateInputEvent.triggerOn(el);
|
||||
if (!updateInputEvent.isDefaultPrevented())
|
||||
inputBinding.receiveMessage(el, updateInputEvent.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1233,10 +1217,10 @@ class ShinyApp {
|
||||
// value for the tabset gets updated (i.e. input$tabsetId
|
||||
// should be null if there are no tabs).
|
||||
const destTabValue = getFirstTab($tabset);
|
||||
const evt: ShinyEventUpdateInput = $.Event("shiny:updateinput");
|
||||
|
||||
evt.binding = inputBinding;
|
||||
$tabset.trigger(evt);
|
||||
const updateInputEvent = new EventUpdateInput({
|
||||
binding: inputBinding,
|
||||
});
|
||||
updateInputEvent.triggerOn($tabset);
|
||||
inputBinding.setValue($tabset[0], destTabValue);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -34,7 +34,6 @@ declare class SelectInputBinding extends InputBinding {
|
||||
unsubscribe(el: HTMLElement): void;
|
||||
initialize(el: SelectHTMLElement): void;
|
||||
protected _selectize(el: SelectHTMLElement, update?: boolean): SelectizeInfo | undefined;
|
||||
protected _newSelectize($el: JQuery<HTMLSelectElement>, options: SelectizeOptions): SelectizeInfo;
|
||||
}
|
||||
export { SelectInputBinding };
|
||||
export type { SelectInputReceiveMessageData };
|
||||
|
||||
2
srcts/types/src/events/jQueryEvents.d.ts
vendored
2
srcts/types/src/events/jQueryEvents.d.ts
vendored
@@ -17,4 +17,4 @@ declare global {
|
||||
on(events: `shown.bs.${string}.sendImageSize`, selector: string, handler: (this: HTMLElement, e: JQueryEventHandlerBase<HTMLElement, any>) => void): this;
|
||||
}
|
||||
}
|
||||
export {};
|
||||
export type { EvtFn };
|
||||
|
||||
427
srcts/types/src/events/shinyEvents.d.ts
vendored
427
srcts/types/src/events/shinyEvents.d.ts
vendored
@@ -3,32 +3,447 @@ import type { InputBinding } from "../bindings/input/inputBinding";
|
||||
import type { OutputBindingAdapter } from "../bindings/outputAdapter";
|
||||
import type { EventPriority } from "../inputPolicies/inputPolicy";
|
||||
import type { ErrorsMessageValue } from "../shiny/shinyapp";
|
||||
import type { EvtFn } from "./jQueryEvents";
|
||||
/**
|
||||
* Shiny Event Base
|
||||
*
|
||||
* This class implements a common interface for all Shiny events, and provides a
|
||||
* layer of abstraction between the Shiny event and the underlying jQuery event
|
||||
* object. We use a new class, rather than extending JQuery.Event, because
|
||||
* JQuery.Event is an old function-style class. Each Event class has a
|
||||
* corresponding ShinyEvent interface that describes the event object that is
|
||||
* emitted. At the end of this file, we extend JQuery's `on()` method to
|
||||
* associate the ShinyEvent interfaces with their corresponding event string.
|
||||
*
|
||||
* @class EventBase
|
||||
* @typedef {EventBase}
|
||||
*/
|
||||
declare class EventBase {
|
||||
/**
|
||||
* The underlying jQuery event object wrapped by `EventBase`.
|
||||
* @type {JQuery.Event}
|
||||
*/
|
||||
event: JQuery.Event;
|
||||
/**
|
||||
* Creates an instance of EventBase.
|
||||
*
|
||||
* @constructor
|
||||
* @param {string} type - The event type.
|
||||
*/
|
||||
constructor(type: string);
|
||||
/**
|
||||
* Trigger the event on an element or the document.
|
||||
*
|
||||
* @example
|
||||
* // Instead of this...
|
||||
* el.trigger(shinyEvent);
|
||||
* // ...do this
|
||||
* shinyEvent.triggerOn(el);
|
||||
*
|
||||
* @param {(HTMLElement | JQuery<HTMLElement> | typeof document | null)} el -
|
||||
* The element to trigger the event on, or `null` to trigger on `document`.
|
||||
*/
|
||||
triggerOn(el: HTMLElement | JQuery<HTMLElement> | typeof document | null): void;
|
||||
/**
|
||||
* Proxy for `event.preventDefault()`.
|
||||
*
|
||||
* @returns {boolean} `true` if the default action was prevented, `false`
|
||||
* otherwise.
|
||||
*/
|
||||
isDefaultPrevented(): boolean;
|
||||
}
|
||||
/**
|
||||
* A common interface for most Shiny events.
|
||||
*
|
||||
* @interface ShinyEventCommon
|
||||
* @typedef {ShinyEventCommon}
|
||||
* @extends {JQuery.Event}
|
||||
*/
|
||||
interface ShinyEventCommon extends JQuery.Event {
|
||||
/**
|
||||
* The event name.
|
||||
* @type {string}
|
||||
*/
|
||||
name: string;
|
||||
value: unknown;
|
||||
el: HTMLElement | null;
|
||||
/**
|
||||
* Event value containing arbitrary event data.
|
||||
* @type {*}
|
||||
*/
|
||||
value: any;
|
||||
}
|
||||
/**
|
||||
* Create a common Shiny event.
|
||||
*
|
||||
* @class EventCommon
|
||||
* @typedef {EventCommon}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
declare class EventCommon extends EventBase {
|
||||
/**
|
||||
* The actual event object.
|
||||
* @type {ShinyEventCommon}
|
||||
*/
|
||||
event: ShinyEventCommon;
|
||||
/**
|
||||
* Creates an instance of EventCommon.
|
||||
*
|
||||
* @constructor
|
||||
* @param {ShinyEventCommon["type"]} type - The Shiny custom event type, e.g.
|
||||
* `shiny:value`.
|
||||
* @param {ShinyEventCommon["name"]} name - The event name.
|
||||
* @param {ShinyEventCommon["value"]} value - The event value, or arbitrary
|
||||
* data included with the event.
|
||||
*/
|
||||
constructor(type: ShinyEventCommon["type"], name: ShinyEventCommon["name"], value: ShinyEventCommon["value"]);
|
||||
/**
|
||||
* Get the event name.
|
||||
* @readonly
|
||||
* @type {ShinyEventCommon["name"]}
|
||||
*/
|
||||
get name(): ShinyEventCommon["name"];
|
||||
/**
|
||||
* Get the event value.
|
||||
* @readonly
|
||||
* @type {ShinyEventCommon["value"]}
|
||||
*/
|
||||
get value(): ShinyEventCommon["value"];
|
||||
}
|
||||
/**
|
||||
* An interface for the `shiny:inputchanged` event.
|
||||
*
|
||||
* @interface ShinyEventInputChanged
|
||||
* @typedef {ShinyEventInputChanged}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventInputChanged extends ShinyEventCommon {
|
||||
value: unknown;
|
||||
/**
|
||||
* The input element whose value has changed.
|
||||
* @type {(HTMLElement | null)}
|
||||
*/
|
||||
el: HTMLElement | null;
|
||||
/**
|
||||
* The input binding for the changed input.
|
||||
* @type {(InputBinding | null)}
|
||||
*/
|
||||
binding: InputBinding | null;
|
||||
/**
|
||||
* The input type.
|
||||
* @type {string}
|
||||
*/
|
||||
inputType: string;
|
||||
priority: EventPriority;
|
||||
/**
|
||||
* The input event priority.
|
||||
* @type {?EventPriority}
|
||||
*/
|
||||
priority?: EventPriority;
|
||||
}
|
||||
/**
|
||||
* Create a custom `shiny:inputchanged` event as an instance of
|
||||
* EventInputChanged.
|
||||
*
|
||||
* @class EventInputChanged
|
||||
* @typedef {EventInputChanged}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
declare class EventInputChanged extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventInputChanged` event object.
|
||||
* @type {ShinyEventInputChanged}
|
||||
*/
|
||||
event: ShinyEventInputChanged;
|
||||
/**
|
||||
* Creates an instance of EventInputChanged.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventInputChanged["name"];
|
||||
value: ShinyEventInputChanged["value"];
|
||||
el: ShinyEventInputChanged["el"];
|
||||
binding: ShinyEventInputChanged["binding"];
|
||||
inputType: ShinyEventInputChanged["inputType"];
|
||||
priority?: ShinyEventInputChanged["priority"];
|
||||
}} {
|
||||
name,
|
||||
value,
|
||||
el,
|
||||
binding,
|
||||
inputType,
|
||||
priority,
|
||||
}
|
||||
*/
|
||||
constructor({ name, value, el, binding, inputType, priority, }: {
|
||||
name: ShinyEventInputChanged["name"];
|
||||
value: ShinyEventInputChanged["value"];
|
||||
el: ShinyEventInputChanged["el"];
|
||||
binding: ShinyEventInputChanged["binding"];
|
||||
inputType: ShinyEventInputChanged["inputType"];
|
||||
priority?: ShinyEventInputChanged["priority"];
|
||||
});
|
||||
/**
|
||||
* Get the input element whose value has changed.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["el"]}
|
||||
*/
|
||||
get el(): ShinyEventInputChanged["el"];
|
||||
/**
|
||||
* Get the input binding for the changed input.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventInputChanged["binding"];
|
||||
/**
|
||||
* Get the input type.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["inputType"]}
|
||||
*/
|
||||
get inputType(): ShinyEventInputChanged["inputType"];
|
||||
/**
|
||||
* Get the input event priority.
|
||||
* @readonly
|
||||
* @type {ShinyEventInputChanged["priority"]}
|
||||
*/
|
||||
get priority(): ShinyEventInputChanged["priority"];
|
||||
}
|
||||
/**
|
||||
* A interface for the custom `shiny:updateinput` event.
|
||||
*
|
||||
* @interface ShinyEventUpdateInput
|
||||
* @typedef {ShinyEventUpdateInput}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventUpdateInput extends ShinyEventCommon {
|
||||
message: unknown;
|
||||
/**
|
||||
* Arbitrary message data, typically sent from the server, to be processed by
|
||||
* the `receiveMessage` method of the input binding.
|
||||
* @type {?*}
|
||||
*/
|
||||
message?: any;
|
||||
/**
|
||||
* The input binding for the input.
|
||||
* @type {InputBinding}
|
||||
*/
|
||||
binding: InputBinding;
|
||||
}
|
||||
/**
|
||||
* Create a shiny custom `shiny:updateinput` event as an instance of
|
||||
* EventUpdateInput. This event carries message data from the server, sent via
|
||||
* `session$sendInputMessage()`, to the input binding's `receiveMessage` method.
|
||||
*
|
||||
* @class EventUpdateInput
|
||||
* @typedef {EventUpdateInput}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
declare class EventUpdateInput extends EventBase {
|
||||
/**
|
||||
* The `ShinyEventUpdateInput` event object.
|
||||
* @type {ShinyEventUpdateInput}
|
||||
*/
|
||||
event: ShinyEventUpdateInput;
|
||||
/**
|
||||
* Creates an instance of EventUpdateInput.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
message?: ShinyEventUpdateInput["message"];
|
||||
binding: ShinyEventUpdateInput["binding"];
|
||||
}} {
|
||||
message,
|
||||
binding,
|
||||
}
|
||||
*/
|
||||
constructor({ message, binding, }: {
|
||||
message?: ShinyEventUpdateInput["message"];
|
||||
binding: ShinyEventUpdateInput["binding"];
|
||||
});
|
||||
/**
|
||||
* Get the `shiny:updateinput` message data.
|
||||
* @readonly
|
||||
* @type {ShinyEventUpdateInput["message"]}
|
||||
*/
|
||||
get message(): ShinyEventUpdateInput["message"];
|
||||
/**
|
||||
* Get the input binding for the input.
|
||||
* @readonly
|
||||
* @type {ShinyEventUpdateInput["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventUpdateInput["binding"];
|
||||
}
|
||||
/**
|
||||
* A interface for the custom `shiny:value` event.
|
||||
*
|
||||
* @interface ShinyEventValue
|
||||
* @typedef {ShinyEventValue}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventValue extends ShinyEventCommon {
|
||||
value: unknown;
|
||||
/**
|
||||
* The output binding for the output that updated.
|
||||
* @type {OutputBindingAdapter}
|
||||
*/
|
||||
binding: OutputBindingAdapter;
|
||||
}
|
||||
/**
|
||||
* Create a shiny custom `shiny:value` event as an instance of EventValue. This
|
||||
* event is triggered when an output's value changes.
|
||||
*
|
||||
* @class EventValue
|
||||
* @typedef {EventValue}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
declare class EventValue extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventValue` event object.
|
||||
* @type {ShinyEventValue}
|
||||
*/
|
||||
event: ShinyEventValue;
|
||||
/**
|
||||
* Creates an instance of EventValue.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventValue["name"];
|
||||
value: ShinyEventValue["value"];
|
||||
binding: ShinyEventValue["binding"];
|
||||
}} {
|
||||
name,
|
||||
value,
|
||||
binding,
|
||||
}
|
||||
*/
|
||||
constructor({ name, value, binding, }: {
|
||||
name: ShinyEventValue["name"];
|
||||
value: ShinyEventValue["value"];
|
||||
binding: ShinyEventValue["binding"];
|
||||
});
|
||||
/**
|
||||
* Get the output binding for the output that updated.
|
||||
* @readonly
|
||||
* @type {ShinyEventValue["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventValue["binding"];
|
||||
}
|
||||
/**
|
||||
* A interface for the custom `shiny:error` event.
|
||||
*
|
||||
* @interface ShinyEventError
|
||||
* @typedef {ShinyEventError}
|
||||
* @extends {ShinyEventCommon}
|
||||
*/
|
||||
interface ShinyEventError extends ShinyEventCommon {
|
||||
/**
|
||||
* The output binding for the output where the error occurred.
|
||||
* @type {OutputBindingAdapter}
|
||||
*/
|
||||
binding: OutputBindingAdapter;
|
||||
/**
|
||||
* The error message.
|
||||
* @type {ErrorsMessageValue}
|
||||
*/
|
||||
error: ErrorsMessageValue;
|
||||
}
|
||||
/**
|
||||
* Create a shiny custom `shiny:error` event as an instance of EventError. This
|
||||
* event is triggered when an error occurs while processing the reactive
|
||||
* expression that produces the output.
|
||||
*
|
||||
* @class EventError
|
||||
* @typedef {EventError}
|
||||
* @extends {EventCommon}
|
||||
*/
|
||||
declare class EventError extends EventCommon {
|
||||
/**
|
||||
* The `ShinyEventError` event object.
|
||||
* @type {ShinyEventError}
|
||||
*/
|
||||
event: ShinyEventError;
|
||||
/**
|
||||
* Creates an instance of EventError.
|
||||
*
|
||||
* @constructor
|
||||
* @param {{
|
||||
name: ShinyEventError["name"];
|
||||
binding: ShinyEventError["binding"];
|
||||
error: ShinyEventError["error"];
|
||||
}} {
|
||||
name,
|
||||
binding,
|
||||
error,
|
||||
}
|
||||
*/
|
||||
constructor({ name, binding, error, }: {
|
||||
name: ShinyEventError["name"];
|
||||
binding: ShinyEventError["binding"];
|
||||
error: ShinyEventError["error"];
|
||||
});
|
||||
/**
|
||||
* Get the output binding for the output where the error occurred.
|
||||
* @readonly
|
||||
* @type {ShinyEventError["binding"]}
|
||||
*/
|
||||
get binding(): ShinyEventError["binding"];
|
||||
/**
|
||||
* Get the error message.
|
||||
* @readonly
|
||||
* @type {ShinyEventError["error"]}
|
||||
*/
|
||||
get error(): ShinyEventError["error"];
|
||||
}
|
||||
/**
|
||||
* A interface for the custom `shiny:message` event.
|
||||
*
|
||||
* @interface ShinyEventMessage
|
||||
* @typedef {ShinyEventMessage}
|
||||
* @extends {JQuery.Event}
|
||||
*/
|
||||
interface ShinyEventMessage extends JQuery.Event {
|
||||
/**
|
||||
* Arbitrary message data from the server. This data will ultimately be
|
||||
* handled by the function provided to `Shiny.addCustomMessageHandler()` for
|
||||
* the given message type.
|
||||
*
|
||||
* @type {{ [key: string]: unknown }}
|
||||
*/
|
||||
message: {
|
||||
[key: string]: unknown;
|
||||
};
|
||||
}
|
||||
/**
|
||||
* Create a shiny custom `shiny:message` event as an instance of EventMessage.
|
||||
* This message is triggered when the server sends a custom message to the app
|
||||
* via `session$sendCustomMessage()`.
|
||||
*
|
||||
* @class EventMessage
|
||||
* @typedef {EventMessage}
|
||||
* @extends {EventBase}
|
||||
*/
|
||||
declare class EventMessage extends EventBase {
|
||||
/**
|
||||
* The `ShinyEventMessage` event object.
|
||||
* @type {ShinyEventMessage}
|
||||
*/
|
||||
event: ShinyEventMessage;
|
||||
/**
|
||||
* Creates an instance of EventMessage.
|
||||
*
|
||||
* @constructor
|
||||
* @param {ShinyEventMessage["message"]} message
|
||||
*/
|
||||
constructor(message: ShinyEventMessage["message"]);
|
||||
/**
|
||||
* Get the message data from the event.
|
||||
* @readonly
|
||||
* @type {ShinyEventMessage["message"]}
|
||||
*/
|
||||
get message(): ShinyEventMessage["message"];
|
||||
}
|
||||
declare global {
|
||||
interface JQuery {
|
||||
on(events: "shiny:inputchanged", handler: EvtFn<ShinyEventInputChanged>): this;
|
||||
on(events: "shiny:updateinput", handler: EvtFn<ShinyEventUpdateInput>): this;
|
||||
on(events: "shiny:value", handler: EvtFn<ShinyEventValue>): this;
|
||||
on(events: "shiny:error", handler: EvtFn<ShinyEventError>): this;
|
||||
on(events: "shiny:message", handler: EvtFn<ShinyEventMessage>): this;
|
||||
}
|
||||
}
|
||||
export { EventCommon, EventInputChanged, EventUpdateInput, EventValue, EventError, EventMessage, };
|
||||
export type { ShinyEventInputChanged, ShinyEventUpdateInput, ShinyEventValue, ShinyEventError, ShinyEventMessage, };
|
||||
|
||||
1
tests/testthat/apps
Submodule
1
tests/testthat/apps
Submodule
Submodule tests/testthat/apps added at c471e6449e
@@ -22,7 +22,7 @@ test_that("Repeated names for selectInput and radioButtons choices", {
|
||||
# Select input
|
||||
x <- selectInput('id','label', choices = c(a='x1', a='x2', b='x3'), selectize = FALSE)
|
||||
expect_true(grepl(fixed = TRUE,
|
||||
'<select class="shiny-input-select form-control" id="id"><option value="x1" selected>a</option>\n<option value="x2">a</option>\n<option value="x3">b</option></select>',
|
||||
'<select id="id" class="form-control"><option value="x1" selected>a</option>\n<option value="x2">a</option>\n<option value="x3">b</option></select>',
|
||||
format(x)
|
||||
))
|
||||
|
||||
@@ -249,7 +249,7 @@ test_that("selectInput selects items by default", {
|
||||
|
||||
# Nothing selected when choices=NULL
|
||||
expect_true(grepl(fixed = TRUE,
|
||||
'<select class="shiny-input-select form-control" id="x"></select>',
|
||||
'<select id="x" class="form-control"></select>',
|
||||
format(selectInput('x', NULL, NULL, selectize = FALSE))
|
||||
))
|
||||
|
||||
|
||||
@@ -268,27 +268,3 @@ test_that("quoToFunction handles nested quosures", {
|
||||
func <- quoToFunction(quo_outer, "foo")
|
||||
expect_identical(func(), 2)
|
||||
})
|
||||
|
||||
|
||||
|
||||
test_that("toJSON can set digits using options - default", {
|
||||
withr::local_options(list(shiny.json.digits = NULL))
|
||||
expect_equal(
|
||||
as.character(toJSON(pi)),
|
||||
"[3.141592653589793]"
|
||||
)
|
||||
})
|
||||
test_that("toJSON can set digits using options - number", {
|
||||
withr::local_options(list(shiny.json.digits = 4))
|
||||
expect_equal(
|
||||
as.character(toJSON(pi)),
|
||||
"[3.1416]"
|
||||
)
|
||||
})
|
||||
test_that("toJSON can set digits using options - asis number", {
|
||||
withr::local_options(list(shiny.json.digits = I(4)))
|
||||
expect_equal(
|
||||
as.character(toJSON(pi)),
|
||||
"[3.142]"
|
||||
)
|
||||
})
|
||||
|
||||
@@ -3,9 +3,8 @@ new file mode 100644
|
||||
index 00000000..ba052f8b
|
||||
--- /dev/null
|
||||
+++ b/inst/www/shared/ionrangeslider/scss/shiny.scss
|
||||
@@ -0,0 +1,201 @@
|
||||
@@ -0,0 +1,173 @@
|
||||
+/* 'shiny' skin for Ion.RangeSlider, largely based on the 'big' skin, but with smaller dimensions, grayscale grid text, and without gradients
|
||||
+© Posit, PBC, 2023
|
||||
+© RStudio, Inc, 2014
|
||||
+© Denis Ineshin, 2014 https://github.com/IonDen
|
||||
+© guybowden, 2014 https://github.com/guybowden
|
||||
@@ -86,19 +85,6 @@ index 00000000..ba052f8b
|
||||
+ background-color: $line_bg_color;
|
||||
+ border: $line_border;
|
||||
+ @include border-radius-shim($line_height);
|
||||
+
|
||||
+ // Increase the touch target area of the slider line
|
||||
+ overflow: visible;
|
||||
+ &::before {
|
||||
+ content: "";
|
||||
+ display: block;
|
||||
+ position: relative;
|
||||
+ cursor: s-resize; // downward arrow
|
||||
+ width: 100%;
|
||||
+ height: $handle_height;
|
||||
+ top: -(($handle_height - $line_height / 2) / 2);
|
||||
+ z-index: 1; // raise touch area above grid
|
||||
+ }
|
||||
+ }
|
||||
+
|
||||
+ .#{$name}-bar {
|
||||
@@ -107,23 +93,10 @@ index 00000000..ba052f8b
|
||||
+ border-top: 1px solid $bar_color;
|
||||
+ border-bottom: 1px solid $bar_color;
|
||||
+ background: $bar_color;
|
||||
+ cursor: s-resize; // downard arrow, overwritten when a range
|
||||
+ z-index: 2;
|
||||
+
|
||||
+ &--single {
|
||||
+ @include border-radius-shim($line_height 0 0 $line_height);
|
||||
+ }
|
||||
+
|
||||
+ // Increase the touch target area of the slider bar
|
||||
+ &::before {
|
||||
+ content: "";
|
||||
+ display: block;
|
||||
+ position: relative;
|
||||
+ width: 100%;
|
||||
+ height: $handle_height;
|
||||
+ top: -(($handle_height - $line_height / 2) / 2);
|
||||
+ z-index: 2; // raise touch area above line touch target
|
||||
+ }
|
||||
+ }
|
||||
+
|
||||
+ // sliderInput() doesn't currently support from_min/from_max, so this isn't relevant
|
||||
@@ -147,7 +120,6 @@ index 00000000..ba052f8b
|
||||
+ background-color: $handle_color;
|
||||
+ box-shadow: $handle_box_shadow;
|
||||
+ border-radius: $handle_width;
|
||||
+ z-index: 2;
|
||||
+
|
||||
+ &.state_hover,
|
||||
+ &:hover {
|
||||
|
||||
91
tools/selectize-patches/002-better-sass-defaults.patch
Normal file
91
tools/selectize-patches/002-better-sass-defaults.patch
Normal file
@@ -0,0 +1,91 @@
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
index 81d018a8..88d042db 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
@@ -18,22 +18,23 @@ $selectize-font-family: inherit !default;
|
||||
$selectize-font-size: inherit !default;
|
||||
$selectize-line-height: $line-height-computed !default;
|
||||
|
||||
-$selectize-color-text: $text-color !default;
|
||||
+$selectize-color-text: $input-color !default;
|
||||
$selectize-color-highlight: rgba(255,237,40,0.4) !default;
|
||||
$selectize-color-input: $input-bg !default;
|
||||
$selectize-color-input-full: $input-bg !default;
|
||||
$selectize-color-input-error: $state-danger-text !default;
|
||||
$selectize-color-input-error-focus: darken($selectize-color-input-error, 10%) !default;
|
||||
$selectize-color-disabled: $input-bg !default;
|
||||
-$selectize-color-item: #efefef !default;
|
||||
+$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
$selectize-color-item-border: rgba(black, 0) !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
-$selectize-color-item-active-text: #fff !default;
|
||||
+$selectize-color-item-active-text: $component-active-color !default;
|
||||
$selectize-color-item-active-border: rgba(black, 0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
$selectize-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$selectize-color-dropdown: $dropdown-bg !default;
|
||||
+$selectize-color-dropdown-text: $dropdown-link-color !default;
|
||||
$selectize-color-dropdown-border-top: mix($input-border, $input-bg, 0.8) !default;
|
||||
$selectize-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$selectize-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
@@ -63,12 +64,19 @@ $selectize-arrow-offset: $selectize-padding-x + 5px !default;
|
||||
|
||||
@import "selectize";
|
||||
|
||||
+//Import Plugins
|
||||
+@import "plugins/drag_drop";
|
||||
+@import "plugins/dropdown_header";
|
||||
+@import "plugins/optgroup_columns";
|
||||
+@import "plugins/remove_button";
|
||||
+
|
||||
.selectize-dropdown, .selectize-dropdown.form-control {
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $selectize-color-dropdown;
|
||||
+ color: $selectize-color-dropdown-text;
|
||||
border: 1px solid $dropdown-fallback-border;
|
||||
border: 1px solid $dropdown-border;
|
||||
@include selectize-border-radius ($border-radius-base);
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
index 5eca2f3d..c8502847 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
@@ -9,22 +9,23 @@ $selectize-font-family: inherit !default;
|
||||
$selectize-font-size: inherit !default;
|
||||
$selectize-line-height: $input-btn-line-height !default; //formerly line-height-computed
|
||||
|
||||
-$selectize-color-text: gray("800") !default; //$gray-800
|
||||
+$selectize-color-text: $input-color !default;
|
||||
$selectize-color-highlight: rgba(255,237,40,0.4) !default;
|
||||
$selectize-color-input: $input-bg !default;
|
||||
$selectize-color-input-full: $input-bg !default;
|
||||
$selectize-color-input-error: theme-color("danger") !default;
|
||||
$selectize-color-input-error-focus: darken($selectize-color-input-error, 10%) !default;
|
||||
$selectize-color-disabled: $input-bg !default;
|
||||
-$selectize-color-item: #efefef !default;
|
||||
-$selectize-color-item-border: #999 !default;
|
||||
+$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
+$selectize-color-item-border: $input-border-color !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
-$selectize-color-item-active-text: #fff !default;
|
||||
+$selectize-color-item-active-text: $component-active-color !default;
|
||||
$selectize-color-item-active-border: rgba(0,0,0,0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
$selectize-color-optgroup-border: $dropdown-divider-bg !default;
|
||||
$selectize-color-dropdown: $dropdown-bg !default;
|
||||
+$selectize-color-dropdown-text: $dropdown-link-color !default;
|
||||
$selectize-color-dropdown-border-top: mix($input-border-color, $input-bg, 0.8) !default;
|
||||
$selectize-color-dropdown-item-active: $dropdown-link-hover-bg !default;
|
||||
$selectize-color-dropdown-item-active-text: $dropdown-link-hover-color !default;
|
||||
@@ -67,6 +68,7 @@ $selectize-arrow-offset: calc(#{$selectize-padding-x} + 5px) !default;
|
||||
margin: 2px 0 0 0;
|
||||
z-index: $zindex-dropdown;
|
||||
background: $selectize-color-dropdown;
|
||||
+ color: $selectize-color-dropdown-text;
|
||||
border: 1px solid $dropdown-border-color; //$dropdown-fallback-border
|
||||
@include selectize-border-radius($border-radius);
|
||||
@include selectize-box-shadow(0 6px 12px rgba(0,0,0,.175));
|
||||
@@ -1,39 +0,0 @@
|
||||
diff --git a/inst/www/shared/selectize/scss/plugins/auto_position.scss b/inst/www/shared/selectize/scss/plugins/auto_position.scss
|
||||
index 89c5cf008..01bd45cf6 100644
|
||||
--- a/inst/www/shared/selectize/scss/plugins/auto_position.scss
|
||||
+++ b/inst/www/shared/selectize/scss/plugins/auto_position.scss
|
||||
@@ -2,7 +2,7 @@
|
||||
border-top: 1px solid $select-color-border;
|
||||
border-bottom: 0 none;
|
||||
border-radius: 3px 3px 0 0;
|
||||
- box-shadow: 0 -6px 12px rgb(0 0 0 / 18%);
|
||||
+ box-shadow: 0 -6px 12px rgba(var(--bs-body-color-rgb, 0,0,0), .18);
|
||||
}
|
||||
|
||||
.#{selectize}-control.plugin-auto_position .#{selectize}-input.#{$selectize}-position-top.dropdown-active {
|
||||
diff --git a/inst/www/shared/selectize/scss/plugins/clear_button.scss b/inst/www/shared/selectize/scss/plugins/clear_button.scss
|
||||
index 4f0d1d815..566ffd281 100644
|
||||
--- a/inst/www/shared/selectize/scss/plugins/clear_button.scss
|
||||
+++ b/inst/www/shared/selectize/scss/plugins/clear_button.scss
|
||||
@@ -7,7 +7,7 @@
|
||||
width: 25px;
|
||||
top: 0;
|
||||
right: calc(#{$select-padding-x} - #{$select-padding-item-x});
|
||||
- color: rgba(0, 0, 0);
|
||||
+ color: var(--bs-body-color, black);
|
||||
opacity: 0.4;
|
||||
font-weight: bold;
|
||||
border: none;
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.scss b/inst/www/shared/selectize/scss/selectize.scss
|
||||
index aec43bb43..30619ba9b 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.scss
|
||||
@@ -346,7 +346,7 @@ $select-spinner-border-color: $select-color-border;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: $select-arrow-offset;
|
||||
- margin-top: round(math.div(-1 * $select-arrow-size, 2));
|
||||
+ margin-top: round(divide(-1 * $select-arrow-size, 2));
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
19
tools/selectize-patches/003-border-radius-mixin.patch
Normal file
19
tools/selectize-patches/003-border-radius-mixin.patch
Normal file
@@ -0,0 +1,19 @@
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.scss b/inst/www/shared/selectize/scss/selectize.scss
|
||||
index 240e3895..c20f529c 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.scss
|
||||
@@ -57,9 +57,11 @@ $selectize-caret-margin: 0 2px 0 0 !default;
|
||||
$selectize-caret-margin-rtl: 0 4px 0 -2px !default;
|
||||
|
||||
@mixin selectize-border-radius($radii){
|
||||
- -webkit-border-radius: $radii;
|
||||
- -moz-border-radius: $radii;
|
||||
- border-radius: $radii;
|
||||
+ @if mixin-exists("border-radius") {
|
||||
+ @include border-radius($radii)
|
||||
+ } @else {
|
||||
+ border-radius: $radii;
|
||||
+ }
|
||||
}
|
||||
@mixin selectize-unselectable(){
|
||||
-webkit-user-select: none;
|
||||
@@ -1,39 +0,0 @@
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
index 9f5ea2aea..cd4e21777 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
@@ -13,7 +13,7 @@ $select-color-disabled: $input-bg;
|
||||
$select-color-item: #efefef;
|
||||
$select-color-item-border: rgba(0, 0, 0, 0);
|
||||
$select-color-item-active: $component-active-bg;
|
||||
-$select-color-item-active-text: #fff;
|
||||
+$select-color-item-active-text: color-contrast($select-color-item-active);
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0);
|
||||
$select-color-optgroup: $dropdown-bg;
|
||||
$select-color-optgroup-text: $dropdown-header-color;
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
index 6518010b6..b8c35f14b 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
@@ -17,7 +17,7 @@ $select-color-disabled: $input-bg !default;
|
||||
$select-color-item: #efefef !default;
|
||||
$select-color-item-border: $border-color !default;
|
||||
$select-color-item-active: $component-active-bg !default;
|
||||
-$select-color-item-active-text: #fff !default;
|
||||
+$select-color-item-active-text: color-contrast($select-color-item-active) !default;
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0) !default;
|
||||
$select-color-optgroup: $dropdown-bg !default;
|
||||
$select-color-optgroup-text: $dropdown-header-color !default;
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap5.scss b/inst/www/shared/selectize/scss/selectize.bootstrap5.scss
|
||||
index c2f09fffc..4d991532d 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap5.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap5.scss
|
||||
@@ -17,7 +17,7 @@ $select-color-disabled: $input-bg !default;
|
||||
$select-color-item: #efefef !default;
|
||||
$select-color-item-border: $border-color !default;
|
||||
$select-color-item-active: $component-active-bg !default;
|
||||
-$select-color-item-active-text: #fff !default;
|
||||
+$select-color-item-active-text: color-contrast($select-color-item-active) !default;
|
||||
$select-color-item-active-border: rgba(0, 0, 0, 0) !default;
|
||||
$select-color-optgroup: $dropdown-bg !default;
|
||||
$select-color-optgroup-text: $dropdown-header-color !default;
|
||||
26
tools/selectize-patches/004-better-color-contrast.patch
Normal file
26
tools/selectize-patches/004-better-color-contrast.patch
Normal file
@@ -0,0 +1,26 @@
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
index 9f6c0398..2eb30361 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap3.scss
|
||||
@@ -28,7 +28,7 @@ $selectize-color-disabled: $input-bg !default;
|
||||
$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
$selectize-color-item-border: rgba(black, 0) !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
-$selectize-color-item-active-text: $component-active-color !default;
|
||||
+$selectize-color-item-active-text: color-contrast($selectize-color-item-active) !default;
|
||||
$selectize-color-item-active-border: rgba(black, 0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
diff --git a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
index 44dae201..689b38ef 100644
|
||||
--- a/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
+++ b/inst/www/shared/selectize/scss/selectize.bootstrap4.scss
|
||||
@@ -19,7 +19,7 @@ $selectize-color-disabled: $input-bg !default;
|
||||
$selectize-color-item: mix($selectize-color-input, $selectize-color-text, 90%) !default;
|
||||
$selectize-color-item-border: $input-border-color !default;
|
||||
$selectize-color-item-active: $component-active-bg !default;
|
||||
-$selectize-color-item-active-text: $component-active-color !default;
|
||||
+$selectize-color-item-active-text: color-contrast($selectize-color-item-active) !default;
|
||||
$selectize-color-item-active-border: rgba(0,0,0,0) !default;
|
||||
$selectize-color-optgroup: $dropdown-bg !default;
|
||||
$selectize-color-optgroup-text: $dropdown-header-color !default;
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user