@ifloppy/maxcraftmc-ui-svelte 0.1.0

package/types/ProgressBar/ProgressBar.svelte.d.ts

@@ -0,0 +1,70 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  /**
+   * Specify the current value
+   * @default undefined
+   */
+  value?: number;
+
+  /**
+   * Specify the maximum value
+   * @default 100
+   */
+  max?: number;
+
+  /**
+   * Specify the kind of progress bar
+   * @default "default"
+   */
+  kind?: "default" | "inline" | "indented";
+
+  /**
+   * Specify the status
+   * @default "active"
+   */
+  status?: "active" | "finished" | "error";
+
+  /**
+   * Specify the size
+   * @default "md"
+   */
+  size?: "sm" | "md";
+
+  /**
+   * Specify the label text
+   * @default ""
+   */
+  labelText?: string;
+
+  /**
+   * Set to `true` to visually hide the label text
+   * @default false
+   */
+  hideLabel?: boolean;
+
+  /**
+   * Specify the helper text
+   * @default ""
+   */
+  helperText?: string;
+
+  /**
+   * Set an id for the progress bar element
+   * @default "ccs-" + Math.random().toString(36)
+   */
+  id?: string;
+
+  [key: `data-${string}`]: any;
+};
+
+export type ProgressBarProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class ProgressBar extends SvelteComponentTyped<
+  ProgressBarProps,
+  Record<string, any>,
+  { labelText: {} }
+> {}

package/types/ProgressIndicator/ProgressIndicator.svelte.d.ts

@@ -0,0 +1,46 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["ul"];
+
+type $Props = {
+  /**
+   * Specify the current step index
+   * @default 0
+   */
+  currentIndex?: number;
+
+  /**
+   * Set to `true` to use the vertical variant
+   * @default false
+   */
+  vertical?: boolean;
+
+  /**
+   * Set to `true` to specify whether the progress steps should be split equally in size in the div
+   * @default false
+   */
+  spaceEqually?: boolean;
+
+  /**
+   * Set to `true` to prevent `currentIndex` from updating
+   * @default false
+   */
+  preventChangeOnClick?: boolean;
+
+  [key: `data-${string}`]: any;
+};
+
+export type ProgressIndicatorProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class ProgressIndicator extends SvelteComponentTyped<
+  ProgressIndicatorProps,
+  {
+    change: CustomEvent<number>;
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+  },
+  { default: {} }
+> {}

package/types/ProgressIndicator/ProgressIndicatorSkeleton.svelte.d.ts

@@ -0,0 +1,34 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["ul"];
+
+type $Props = {
+  /**
+   * Set to `true` to use the vertical variant
+   * @default false
+   */
+  vertical?: boolean;
+
+  /**
+   * Specify the number of steps to render
+   * @default 4
+   */
+  count?: number;
+
+  [key: `data-${string}`]: any;
+};
+
+export type ProgressIndicatorSkeletonProps = Omit<$RestProps, keyof $Props> &
+  $Props;
+
+export default class ProgressIndicatorSkeleton extends SvelteComponentTyped<
+  ProgressIndicatorSkeletonProps,
+  {
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+  },
+  {}
+> {}

package/types/ProgressIndicator/ProgressStep.svelte.d.ts

@@ -0,0 +1,70 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["li"];
+
+type $Props = {
+  /**
+   * Set to `true` for the complete variant
+   * @default false
+   */
+  complete?: boolean;
+
+  /**
+   * Set to `true` to use the current variant
+   * @default false
+   */
+  current?: boolean;
+
+  /**
+   * Set to `true` to disable the progress step
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Set to `true` to indicate an invalid state
+   * @default false
+   */
+  invalid?: boolean;
+
+  /**
+   * Specify the step description
+   * @default ""
+   */
+  description?: string;
+
+  /**
+   * Specify the step label
+   * @default ""
+   */
+  label?: string;
+
+  /**
+   * Specify the step secondary label
+   * @default ""
+   */
+  secondaryLabel?: string;
+
+  /**
+   * Set an id for the top-level element
+   * @default "ccs-" + Math.random().toString(36)
+   */
+  id?: string;
+
+  [key: `data-${string}`]: any;
+};
+
+export type ProgressStepProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class ProgressStep extends SvelteComponentTyped<
+  ProgressStepProps,
+  {
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+    keydown: WindowEventMap["keydown"];
+  },
+  { default: { props: { class: "bx--progress-label" } } }
+> {}

package/types/RadioButton/RadioButton.svelte.d.ts

@@ -0,0 +1,80 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  /**
+   * Specify the value of the radio button
+   * @default ""
+   */
+  value?: string | number;
+
+  /**
+   * Set to `true` to check the radio button
+   * @default false
+   */
+  checked?: boolean;
+
+  /**
+   * Set to `true` to disable the radio button
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Set to `true` to mark the field as required
+   * @default false
+   */
+  required?: boolean;
+
+  /**
+   * Specify the label position
+   * @default "right"
+   */
+  labelPosition?: "right" | "left";
+
+  /**
+   * Specify the label text
+   * @default ""
+   */
+  labelText?: string;
+
+  /**
+   * Set to `true` to visually hide the label text
+   * @default false
+   */
+  hideLabel?: boolean;
+
+  /**
+   * Set an id for the input element
+   * @default "ccs-" + Math.random().toString(36)
+   */
+  id?: string;
+
+  /**
+   * Specify a name attribute for the radio button input
+   * @default undefined
+   */
+  name?: string;
+
+  /**
+   * Obtain a reference to the input HTML element
+   * @default null
+   */
+  ref?: null | HTMLInputElement;
+
+  [key: `data-${string}`]: any;
+};
+
+export type RadioButtonProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class RadioButton extends SvelteComponentTyped<
+  RadioButtonProps,
+  {
+    focus: WindowEventMap["focus"];
+    blur: WindowEventMap["blur"];
+    change: WindowEventMap["change"];
+  },
+  { labelText: {} }
+> {}

package/types/RadioButton/RadioButtonSkeleton.svelte.d.ts

@@ -0,0 +1,21 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  [key: `data-${string}`]: any;
+};
+
+export type RadioButtonSkeletonProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class RadioButtonSkeleton extends SvelteComponentTyped<
+  RadioButtonSkeletonProps,
+  {
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+  },
+  {}
+> {}

package/types/RadioButtonGroup/RadioButtonGroup.svelte.d.ts

@@ -0,0 +1,76 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  /**
+   * Set the selected radio button value
+   * @default undefined
+   */
+  selected?: string | number;
+
+  /**
+   * Set to `true` to disable the radio buttons
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Set to `true` to require the selection of a radio button
+   * @default undefined
+   */
+  required?: boolean;
+
+  /**
+   * Specify a name attribute for the radio button inputs
+   * @default undefined
+   */
+  name?: string;
+
+  /**
+   * Specify the legend text
+   * @default ""
+   */
+  legendText?: string;
+
+  /**
+   * Set to `true` to visually hide the legend
+   * @default false
+   */
+  hideLegend?: boolean;
+
+  /**
+   * Specify the label position
+   * @default "right"
+   */
+  labelPosition?: "right" | "left";
+
+  /**
+   * Specify the orientation of the radio buttons
+   * @default "horizontal"
+   */
+  orientation?: "horizontal" | "vertical";
+
+  /**
+   * Set an id for the container div element
+   * @default undefined
+   */
+  id?: string;
+
+  [key: `data-${string}`]: any;
+};
+
+export type RadioButtonGroupProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class RadioButtonGroup extends SvelteComponentTyped<
+  RadioButtonGroupProps,
+  {
+    change: CustomEvent<string | number>;
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+  },
+  { default: {}; legendText: {} }
+> {}

package/types/RecursiveList/RecursiveList.svelte.d.ts

@@ -0,0 +1,34 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+export interface RecursiveListNode {
+  text?: string;
+  href?: string;
+  html?: string;
+}
+
+type $RestProps = SvelteHTMLElements["ul"] & SvelteHTMLElements["ol"];
+
+type $Props = {
+  /**
+   * Specify the nodes to render
+   * @default []
+   */
+  nodes?: Array<RecursiveListNode & { nodes?: RecursiveListNode[] }>;
+
+  /**
+   * Specify the type of list to render
+   * @default "unordered"
+   */
+  type?: "unordered" | "ordered" | "ordered-native";
+
+  [key: `data-${string}`]: any;
+};
+
+export type RecursiveListProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class RecursiveList extends SvelteComponentTyped<
+  RecursiveListProps,
+  Record<string, any>,
+  {}
+> {}

package/types/Search/Search.svelte.d.ts

@@ -0,0 +1,128 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["input"];
+
+type $Props = {
+  /**
+   * Specify the value of the search input
+   * @default ""
+   */
+  value?: any;
+
+  /**
+   * Specify the size of the search input
+   * @default "xl"
+   */
+  size?: "sm" | "lg" | "xl";
+
+  /**
+   * Specify the class name passed to the outer div element
+   * @default ""
+   */
+  searchClass?: string;
+
+  /**
+   * Set to `true` to display the skeleton state
+   * @default false
+   */
+  skeleton?: boolean;
+
+  /**
+   * Set to `true` to enable the light variant
+   * @default false
+   */
+  light?: boolean;
+
+  /**
+   * Set to `true` to disable the search input
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Set to `true` to enable the expandable variant
+   * @default false
+   */
+  expandable?: boolean;
+
+  /**
+   * Set to `true to expand the search input
+   * @default false
+   */
+  expanded?: boolean;
+
+  /**
+   * Specify the `placeholder` attribute of the search input
+   * @default "Search..."
+   */
+  placeholder?: string;
+
+  /**
+   * Specify the `autocomplete` attribute
+   * @default "off"
+   */
+  autocomplete?: "on" | "off";
+
+  /**
+   * Set to `true` to auto focus the search element
+   * @default false
+   */
+  autofocus?: boolean;
+
+  /**
+   * Specify the close button label text
+   * @default "Clear search input"
+   */
+  closeButtonLabelText?: string;
+
+  /**
+   * Specify the label text
+   * @default ""
+   */
+  labelText?: string;
+
+  /**
+   * Specify the icon to render.
+   * Defaults to `<Search />`
+   * @default undefined
+   */
+  icon?: any;
+
+  /**
+   * Set an id for the input element
+   * @default "ccs-" + Math.random().toString(36)
+   */
+  id?: string;
+
+  /**
+   * Obtain a reference to the input HTML element
+   * @default null
+   */
+  ref?: null | HTMLInputElement;
+
+  [key: `data-${string}`]: any;
+};
+
+export type SearchProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class Search extends SvelteComponentTyped<
+  SearchProps,
+  {
+    expand: CustomEvent<null>;
+    collapse: CustomEvent<null>;
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+    change: WindowEventMap["change"];
+    input: WindowEventMap["input"];
+    focus: WindowEventMap["focus"];
+    blur: WindowEventMap["blur"];
+    keydown: WindowEventMap["keydown"];
+    keyup: WindowEventMap["keyup"];
+    paste: WindowEventMap["paste"];
+    clear: CustomEvent<null>;
+  },
+  { labelText: {} }
+> {}

package/types/Search/SearchSkeleton.svelte.d.ts

@@ -0,0 +1,27 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  /**
+   * Specify the size of the search input
+   * @default "xl"
+   */
+  size?: "sm" | "lg" | "xl";
+
+  [key: `data-${string}`]: any;
+};
+
+export type SearchSkeletonProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class SearchSkeleton extends SvelteComponentTyped<
+  SearchSkeletonProps,
+  {
+    click: WindowEventMap["click"];
+    mouseover: WindowEventMap["mouseover"];
+    mouseenter: WindowEventMap["mouseenter"];
+    mouseleave: WindowEventMap["mouseleave"];
+  },
+  {}
+> {}

package/types/Select/Select.svelte.d.ts

@@ -0,0 +1,124 @@
+import type { SvelteComponentTyped } from "svelte";
+import type { SvelteHTMLElements } from "svelte/elements";
+
+type $RestProps = SvelteHTMLElements["div"];
+
+type $Props = {
+  /**
+   * Specify the selected item value
+   * @default undefined
+   */
+  selected?: string | number;
+
+  /**
+   * Set the size of the select input
+   * @default undefined
+   */
+  size?: "sm" | "xl";
+
+  /**
+   * Set to `true` to use the inline variant
+   * @default false
+   */
+  inline?: boolean;
+
+  /**
+   * Set to `true` to enable the light variant
+   * @default false
+   */
+  light?: boolean;
+
+  /**
+   * Set to `true` to disable the select element
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Set an id for the select element
+   * @default "ccs-" + Math.random().toString(36)
+   */
+  id?: string;
+
+  /**
+   * Specify a name attribute for the select element
+   * @default undefined
+   */
+  name?: string;
+
+  /**
+   * Set to `true` to indicate an invalid state
+   * @default false
+   */
+  invalid?: boolean;
+
+  /**
+   * Specify the invalid state text
+   * @default ""
+   */
+  invalidText?: string;
+
+  /**
+   * Set to `true` to indicate an warning state
+   * @default false
+   */
+  warn?: boolean;
+
+  /**
+   * Specify the warning state text
+   * @default ""
+   */
+  warnText?: string;
+
+  /**
+   * Specify the helper text
+   * @default ""
+   */
+  helperText?: string;
+
+  /**
+   * Set to `true` to not render a label
+   * @default false
+   */
+  noLabel?: boolean;
+
+  /**
+   * Specify the label text
+   * @default ""
+   */
+  labelText?: string;
+
+  /**
+   * Set to `true` to visually hide the label text
+   * @default false
+   */
+  hideLabel?: boolean;
+
+  /**
+   * Obtain a reference to the select HTML element
+   * @default null
+   */
+  ref?: null | HTMLSelectElement;
+
+  /**
+   * Set to `true` to mark the field as required
+   * @default false
+   */
+  required?: boolean;
+
+  [key: `data-${string}`]: any;
+};
+
+export type SelectProps = Omit<$RestProps, keyof $Props> & $Props;
+
+export default class Select extends SvelteComponentTyped<
+  SelectProps,
+  {
+    /** The selected value. */ update: CustomEvent<string | number>;
+    change: WindowEventMap["change"];
+    input: WindowEventMap["input"];
+    focus: WindowEventMap["focus"];
+    blur: WindowEventMap["blur"];
+  },
+  { default: {}; labelText: {} }
+> {}