slexkit 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/README.md +4 -3
- package/README.zh-CN.md +4 -3
- package/dist/ai/llms-components.txt +2 -1
- package/dist/ai/llms-full.txt +73 -42
- package/dist/ai/llms-runtime.txt +11 -12
- package/dist/ai/llms.txt +1 -1
- package/dist/ai/slexkit-ai-manifest.json +77 -73
- package/dist/components/checkbox.js +1 -0
- package/dist/components/choice.css +2 -2
- package/dist/components/display.css +1 -1
- package/dist/components/index.js +56 -153
- package/dist/components/input.css +53 -119
- package/dist/components/input.js +33 -143
- package/dist/components/radio-group.js +1 -0
- package/dist/components/select.css +0 -6
- package/dist/components/slider.css +27 -18
- package/dist/components/specs.js +2 -1
- package/dist/components/switch.css +3 -3
- package/dist/components/switch.js +1 -0
- package/dist/components/text-input.css +21 -90
- package/dist/components/text.js +12 -0
- package/dist/components/tooling.css +0 -1
- package/dist/runtime.cjs +22 -5
- package/dist/runtime.js +22 -5
- package/dist/slexkit.cjs +78 -158
- package/dist/slexkit.css +54 -121
- package/dist/slexkit.js +78 -158
- package/dist/types/version.d.ts +2 -2
- package/dist/umd/slexkit.tooling.umd.js +77 -158
- package/dist/umd/slexkit.umd.js +78 -158
- package/package.json +3 -2
- package/skills/slexkit-host-integration/SKILL.md +1 -1
- package/src/components/svelte/display/Text.svelte +14 -1
- package/src/components/svelte/input/Checkbox.svelte +1 -1
- package/src/components/svelte/input/Input.svelte +0 -110
- package/src/components/svelte/input/RadioGroup.svelte +1 -1
- package/src/components/svelte/input/Switch.svelte +1 -1
- package/src/styles/components/choice.css +2 -2
- package/src/styles/components/select.css +0 -6
- package/src/styles/components/slider.css +27 -18
- package/src/styles/components/switch.css +3 -3
- package/src/styles/components/text-input.css +21 -90
- package/src/styles/display.css +1 -1
- package/src/styles/tooling.css +0 -1
package/dist/slexkit.js
CHANGED
|
@@ -689,6 +689,9 @@ function isWritableComponent(type) {
|
|
|
689
689
|
const mode = getComponentStateMode(type);
|
|
690
690
|
return mode === "value" || mode === "checked" || mode === "enabled";
|
|
691
691
|
}
|
|
692
|
+
function isReadableComponent(type) {
|
|
693
|
+
return getComponentStateMode(type) === "readable";
|
|
694
|
+
}
|
|
692
695
|
function isStatefulComponent(type) {
|
|
693
696
|
return getComponentStateMode(type) !== "none";
|
|
694
697
|
}
|
|
@@ -805,7 +808,10 @@ function createGProxy(g, components, componentTypes) {
|
|
|
805
808
|
function ensureComponentState(name, type, components, componentTypes) {
|
|
806
809
|
if (!components[name])
|
|
807
810
|
components[name] = {};
|
|
808
|
-
componentTypes[name]
|
|
811
|
+
const previousType = componentTypes[name] ?? "";
|
|
812
|
+
if (!(isWritableComponent(previousType) && isReadableComponent(type))) {
|
|
813
|
+
componentTypes[name] = type;
|
|
814
|
+
}
|
|
809
815
|
return components[name];
|
|
810
816
|
}
|
|
811
817
|
function syncReadableComponentProp(type, state, propName, value) {
|
|
@@ -833,6 +839,9 @@ function syncReadableComponentProp(type, state, propName, value) {
|
|
|
833
839
|
function syncComponentProps(type, name, props, components, componentTypes) {
|
|
834
840
|
if (!name || !isStatefulComponent(type))
|
|
835
841
|
return;
|
|
842
|
+
const previousType = componentTypes[name] ?? "";
|
|
843
|
+
if (isWritableComponent(previousType) && isReadableComponent(type))
|
|
844
|
+
return;
|
|
836
845
|
const state = ensureComponentState(name, type, components, componentTypes);
|
|
837
846
|
if (type === "input" && typeof props.type === "string") {
|
|
838
847
|
assignInputType(state, props.type);
|
|
@@ -897,7 +906,7 @@ function seedStaticComponentState(type, state, props) {
|
|
|
897
906
|
function warnDuplicateState(ns, name, currentType, currentPath, previous) {
|
|
898
907
|
console.warn(`[SlexKit][${ns}] Component state '${name}' is declared more than once at ${previous.path} and ${currentPath}; state is shared by namespace and component name.`);
|
|
899
908
|
if (previous.type !== currentType) {
|
|
900
|
-
console.warn(`[SlexKit][${ns}] Component state '${name}' is used by multiple component types (${previous.type}, ${currentType});
|
|
909
|
+
console.warn(`[SlexKit][${ns}] Component state '${name}' is used by multiple component types (${previous.type}, ${currentType}); use distinct names when components should not share state.`);
|
|
901
910
|
}
|
|
902
911
|
}
|
|
903
912
|
function dynamicStateBinding(type, props) {
|
|
@@ -909,6 +918,9 @@ function isMirroredValueControlPair(previousType, currentType) {
|
|
|
909
918
|
return previousType === "input" && currentType === "slider" || previousType === "slider" && currentType === "input";
|
|
910
919
|
}
|
|
911
920
|
function shouldWarnDuplicateState(currentType, currentBinding, previous) {
|
|
921
|
+
if (isReadableComponent(previous.type) && isReadableComponent(currentType)) {
|
|
922
|
+
return false;
|
|
923
|
+
}
|
|
912
924
|
if (currentBinding && previous.stateBinding === currentBinding && isMirroredValueControlPair(previous.type, currentType)) {
|
|
913
925
|
return false;
|
|
914
926
|
}
|
|
@@ -1719,7 +1731,7 @@ ${parseSource}
|
|
|
1719
1731
|
var parseSlexKitDsl = parseSlexSource;
|
|
1720
1732
|
|
|
1721
1733
|
// src/version.ts
|
|
1722
|
-
var SLEXKIT_VERSION = "0.3.
|
|
1734
|
+
var SLEXKIT_VERSION = "0.3.1";
|
|
1723
1735
|
var SLEX_PROTOCOL_VERSION = "0.1";
|
|
1724
1736
|
var SLEXKIT_COMPONENTS_VERSION = SLEXKIT_VERSION;
|
|
1725
1737
|
function getSlexKitInfo() {
|
|
@@ -2847,7 +2859,6 @@ var inputSpec = component({
|
|
|
2847
2859
|
min: { type: "string | number", dynamic: true, description: "Minimum value used by numeric input controls." },
|
|
2848
2860
|
max: { type: "string | number", dynamic: true, description: "Maximum value used by numeric input controls." },
|
|
2849
2861
|
step: { type: "string | number", dynamic: true, description: "Step size used by numeric input controls." },
|
|
2850
|
-
controls: { type: "boolean", default: true, dynamic: true, description: "Show decrement and increment buttons for numeric inputs." },
|
|
2851
2862
|
onchange: { type: "write-expression", description: "Write expression invoked when the value changes." }
|
|
2852
2863
|
},
|
|
2853
2864
|
children: noChildren,
|
|
@@ -3355,6 +3366,8 @@ var textSpec = component({
|
|
|
3355
3366
|
content: { type: "string", dynamic: true, description: "Alias for text." },
|
|
3356
3367
|
label: { type: "string", dynamic: true, description: "Alias for text." },
|
|
3357
3368
|
variant: { type: "string", values: ["default", "muted"], default: "default", description: "Text visual variant." },
|
|
3369
|
+
color: { type: "string", dynamic: true, description: "Optional CSS color for controlled previews." },
|
|
3370
|
+
size: { type: "string | number", dynamic: true, description: "Optional font size. Numbers are treated as px." },
|
|
3358
3371
|
class: { type: "string", description: "Additional host-controlled CSS class." }
|
|
3359
3372
|
},
|
|
3360
3373
|
children: noChildren,
|
|
@@ -3725,7 +3738,11 @@ function isRenderableSource(value) {
|
|
|
3725
3738
|
return Object.keys(value).some((key) => key.includes(":"));
|
|
3726
3739
|
}
|
|
3727
3740
|
function bareLayoutFromSource(value) {
|
|
3728
|
-
const
|
|
3741
|
+
const layout = { ...value };
|
|
3742
|
+
delete layout.slex;
|
|
3743
|
+
delete layout.namespace;
|
|
3744
|
+
delete layout.g;
|
|
3745
|
+
delete layout.layout;
|
|
3729
3746
|
return layout;
|
|
3730
3747
|
}
|
|
3731
3748
|
function isStateOnlySource(value) {
|
|
@@ -12496,6 +12513,7 @@ function Checkbox($$anchor, $$props) {
|
|
|
12496
12513
|
reset(label2);
|
|
12497
12514
|
reset(span);
|
|
12498
12515
|
template_effect(($0, $1) => {
|
|
12516
|
+
set_attribute2(label2, "data-disabled", get2(p).disabled ? "true" : undefined);
|
|
12499
12517
|
input.disabled = !!get2(p).disabled;
|
|
12500
12518
|
set_attribute2(input, "data-state", get2(checked) ? "checked" : "unchecked");
|
|
12501
12519
|
set_attribute2(input, "aria-label", $0);
|
|
@@ -12571,6 +12589,7 @@ function Switch($$anchor, $$props) {
|
|
|
12571
12589
|
reset(span);
|
|
12572
12590
|
template_effect(($0, $1) => {
|
|
12573
12591
|
set_attribute2(label2, "data-state", get2(enabled) ? "on" : "off");
|
|
12592
|
+
set_attribute2(label2, "data-disabled", get2(p).disabled ? "true" : undefined);
|
|
12574
12593
|
input.disabled = !!get2(p).disabled;
|
|
12575
12594
|
set_attribute2(input, "aria-label", $0);
|
|
12576
12595
|
set_text(text_1, $1);
|
|
@@ -12591,26 +12610,11 @@ delegate(["pointerdown", "click", "change"]);
|
|
|
12591
12610
|
var nextInputId = 0;
|
|
12592
12611
|
var root_14 = from_html(`<label class="slex-input-label"> </label>`);
|
|
12593
12612
|
var root_2 = from_html(`<span class="slex-input-unit" aria-hidden="true"> </span>`);
|
|
12594
|
-
var root_33 = from_html(`<
|
|
12595
|
-
var root_4 = from_html(`<div class="slex-input-
|
|
12596
|
-
var
|
|
12597
|
-
var root8 = from_html(`<div class="slex-input-field"><!> <div class="slex-input-control"><input class="slex-input"/> <!> <!></div> <!> <!></div>`);
|
|
12613
|
+
var root_33 = from_html(`<div class="slex-input-description"> </div>`);
|
|
12614
|
+
var root_4 = from_html(`<div class="slex-input-error" role="alert"> </div>`);
|
|
12615
|
+
var root8 = from_html(`<div class="slex-input-field"><!> <div class="slex-input-control"><input class="slex-input"/> <!></div> <!> <!></div>`);
|
|
12598
12616
|
function Input($$anchor, $$props) {
|
|
12599
12617
|
push($$props, true);
|
|
12600
|
-
const engineeringPrefixFactors = {
|
|
12601
|
-
p: 0.000000000001,
|
|
12602
|
-
n: 0.000000001,
|
|
12603
|
-
u: 0.000001,
|
|
12604
|
-
"µ": 0.000001,
|
|
12605
|
-
"碌": 0.000001,
|
|
12606
|
-
m: 0.001,
|
|
12607
|
-
k: 1000,
|
|
12608
|
-
K: 1000,
|
|
12609
|
-
M: 1e6,
|
|
12610
|
-
meg: 1e6,
|
|
12611
|
-
G: 1e9,
|
|
12612
|
-
T: 1000000000000
|
|
12613
|
-
};
|
|
12614
12618
|
let p = state(proxy({}));
|
|
12615
12619
|
let value = state("");
|
|
12616
12620
|
const fallbackId = `slex-input-${++nextInputId}`;
|
|
@@ -12622,8 +12626,6 @@ function Input($$anchor, $$props) {
|
|
|
12622
12626
|
const readonly = user_derived(() => bool(get2(p).readonly) || bool(get2(p).readOnly));
|
|
12623
12627
|
const required = user_derived(() => bool(get2(p).required));
|
|
12624
12628
|
const invalid2 = user_derived(() => bool(get2(p).invalid) || !!get2(errorText));
|
|
12625
|
-
const steppable = user_derived(isSteppableInput);
|
|
12626
|
-
const controls = user_derived(() => get2(steppable) && get2(p).controls !== false && get2(p).controls !== "false");
|
|
12627
12629
|
const componentId = user_derived(() => safeId($$props.componentName));
|
|
12628
12630
|
const inputId = user_derived(() => text2(get2(p).id) || (get2(componentId) ? `slex-input-${get2(componentId)}` : fallbackId));
|
|
12629
12631
|
const descriptionId = user_derived(() => `${get2(inputId)}-description`);
|
|
@@ -12634,10 +12636,6 @@ function Input($$anchor, $$props) {
|
|
|
12634
12636
|
get2(descriptionText) ? get2(descriptionId) : "",
|
|
12635
12637
|
get2(errorText) ? get2(errorId) : ""
|
|
12636
12638
|
].filter(Boolean).join(" "));
|
|
12637
|
-
const numericValue = user_derived(readNumericValue);
|
|
12638
|
-
const controlLabel = user_derived(() => get2(labelText) || text2(get2(p).placeholder) || $$props.componentName || "input");
|
|
12639
|
-
const decrementDisabled = user_derived(() => !canStep(-1));
|
|
12640
|
-
const incrementDisabled = user_derived(() => !canStep(1));
|
|
12641
12639
|
user_effect(() => bindPropStore($$props.props, (next2) => {
|
|
12642
12640
|
set(p, next2, true);
|
|
12643
12641
|
set(value, text2(next2.value), true);
|
|
@@ -12648,72 +12646,6 @@ function Input($$anchor, $$props) {
|
|
|
12648
12646
|
function inputType() {
|
|
12649
12647
|
return text2(get2(p).type, "text") === "engineering" ? "text" : text2(get2(p).type, "text");
|
|
12650
12648
|
}
|
|
12651
|
-
function isSteppableInput() {
|
|
12652
|
-
const kind = text2(get2(p).type, "text");
|
|
12653
|
-
return kind === "number" || kind === "engineering" || get2(p).min !== undefined || get2(p).max !== undefined || get2(p).step !== undefined;
|
|
12654
|
-
}
|
|
12655
|
-
function numericProp(input) {
|
|
12656
|
-
if (input === undefined || input === null || input === "")
|
|
12657
|
-
return;
|
|
12658
|
-
const next2 = Number(input);
|
|
12659
|
-
return Number.isFinite(next2) ? next2 : undefined;
|
|
12660
|
-
}
|
|
12661
|
-
function stepSize() {
|
|
12662
|
-
const next2 = numericProp(get2(p).step);
|
|
12663
|
-
if (next2 !== undefined && next2 > 0)
|
|
12664
|
-
return next2;
|
|
12665
|
-
if (text2(get2(p).type, "text") !== "engineering")
|
|
12666
|
-
return 1;
|
|
12667
|
-
const parsed = parseEngineeringNumber(get2(value));
|
|
12668
|
-
if (!parsed.valid || !parsed.prefix)
|
|
12669
|
-
return 1;
|
|
12670
|
-
return engineeringPrefixFactors[parsed.prefix] ?? 1;
|
|
12671
|
-
}
|
|
12672
|
-
function readNumericValue() {
|
|
12673
|
-
if (text2(get2(p).type, "text") === "engineering") {
|
|
12674
|
-
const parsed = parseEngineeringNumber(get2(value));
|
|
12675
|
-
return parsed.valid && parsed.number !== null ? parsed.number : null;
|
|
12676
|
-
}
|
|
12677
|
-
const next2 = Number(get2(value));
|
|
12678
|
-
return Number.isFinite(next2) ? next2 : null;
|
|
12679
|
-
}
|
|
12680
|
-
function clamp(next2) {
|
|
12681
|
-
const min = numericProp(get2(p).min);
|
|
12682
|
-
const max = numericProp(get2(p).max);
|
|
12683
|
-
let clamped = next2;
|
|
12684
|
-
if (min !== undefined)
|
|
12685
|
-
clamped = Math.max(min, clamped);
|
|
12686
|
-
if (max !== undefined)
|
|
12687
|
-
clamped = Math.min(max, clamped);
|
|
12688
|
-
return clamped;
|
|
12689
|
-
}
|
|
12690
|
-
function canStep(direction) {
|
|
12691
|
-
if (!get2(controls) || get2(disabled) || get2(readonly) || get2(numericValue) === null)
|
|
12692
|
-
return false;
|
|
12693
|
-
return clamp(get2(numericValue) + direction * stepSize()) !== get2(numericValue);
|
|
12694
|
-
}
|
|
12695
|
-
function formatSteppedValue(next2) {
|
|
12696
|
-
if (text2(get2(p).type, "text") !== "engineering")
|
|
12697
|
-
return text2(next2);
|
|
12698
|
-
const parsed = parseEngineeringNumber(get2(value));
|
|
12699
|
-
if (!parsed.valid)
|
|
12700
|
-
return text2(next2);
|
|
12701
|
-
const factor = parsed.prefix ? engineeringPrefixFactors[parsed.prefix] : undefined;
|
|
12702
|
-
const visibleNumber = factor ? next2 / factor : next2;
|
|
12703
|
-
return `${formatNumber2(visibleNumber)}${parsed.prefix}${parsed.unit}`;
|
|
12704
|
-
}
|
|
12705
|
-
function formatNumber2(next2) {
|
|
12706
|
-
return text2(Number(next2.toPrecision(12)));
|
|
12707
|
-
}
|
|
12708
|
-
function emitValue(nextValue) {
|
|
12709
|
-
set(value, nextValue, true);
|
|
12710
|
-
emit($$props.ctx, "change", text2(get2(p).type, "text") === "engineering" ? parseEngineeringNumber(get2(value)) : get2(value));
|
|
12711
|
-
}
|
|
12712
|
-
function stepBy(direction) {
|
|
12713
|
-
if (!canStep(direction) || get2(numericValue) === null)
|
|
12714
|
-
return;
|
|
12715
|
-
emitValue(formatSteppedValue(clamp(get2(numericValue) + direction * stepSize())));
|
|
12716
|
-
}
|
|
12717
12649
|
function update2(event2) {
|
|
12718
12650
|
if (get2(disabled) || get2(readonly))
|
|
12719
12651
|
return;
|
|
@@ -12739,9 +12671,9 @@ function Input($$anchor, $$props) {
|
|
|
12739
12671
|
});
|
|
12740
12672
|
}
|
|
12741
12673
|
var div_1 = sibling(node, 2);
|
|
12742
|
-
var
|
|
12743
|
-
remove_input_defaults(
|
|
12744
|
-
var node_1 = sibling(
|
|
12674
|
+
var input = child(div_1);
|
|
12675
|
+
remove_input_defaults(input);
|
|
12676
|
+
var node_1 = sibling(input, 2);
|
|
12745
12677
|
{
|
|
12746
12678
|
var consequent_1 = ($$anchor2) => {
|
|
12747
12679
|
var span = root_2();
|
|
@@ -12755,33 +12687,11 @@ function Input($$anchor, $$props) {
|
|
|
12755
12687
|
$$render(consequent_1);
|
|
12756
12688
|
});
|
|
12757
12689
|
}
|
|
12758
|
-
var node_2 = sibling(node_1, 2);
|
|
12759
|
-
{
|
|
12760
|
-
var consequent_2 = ($$anchor2) => {
|
|
12761
|
-
var span_1 = root_33();
|
|
12762
|
-
var button = child(span_1);
|
|
12763
|
-
var button_1 = sibling(button, 2);
|
|
12764
|
-
reset(span_1);
|
|
12765
|
-
template_effect(() => {
|
|
12766
|
-
set_attribute2(button, "aria-label", `Increase ${get2(controlLabel)}`);
|
|
12767
|
-
button.disabled = get2(incrementDisabled);
|
|
12768
|
-
set_attribute2(button_1, "aria-label", `Decrease ${get2(controlLabel)}`);
|
|
12769
|
-
button_1.disabled = get2(decrementDisabled);
|
|
12770
|
-
});
|
|
12771
|
-
delegated("click", button, () => stepBy(1));
|
|
12772
|
-
delegated("click", button_1, () => stepBy(-1));
|
|
12773
|
-
append($$anchor2, span_1);
|
|
12774
|
-
};
|
|
12775
|
-
if_block(node_2, ($$render) => {
|
|
12776
|
-
if (get2(controls))
|
|
12777
|
-
$$render(consequent_2);
|
|
12778
|
-
});
|
|
12779
|
-
}
|
|
12780
12690
|
reset(div_1);
|
|
12781
|
-
var
|
|
12691
|
+
var node_2 = sibling(div_1, 2);
|
|
12782
12692
|
{
|
|
12783
|
-
var
|
|
12784
|
-
var div_2 =
|
|
12693
|
+
var consequent_2 = ($$anchor2) => {
|
|
12694
|
+
var div_2 = root_33();
|
|
12785
12695
|
var text_3 = child(div_2, true);
|
|
12786
12696
|
reset(div_2);
|
|
12787
12697
|
template_effect(() => {
|
|
@@ -12790,15 +12700,15 @@ function Input($$anchor, $$props) {
|
|
|
12790
12700
|
});
|
|
12791
12701
|
append($$anchor2, div_2);
|
|
12792
12702
|
};
|
|
12793
|
-
if_block(
|
|
12703
|
+
if_block(node_2, ($$render) => {
|
|
12794
12704
|
if (get2(descriptionText))
|
|
12795
|
-
$$render(
|
|
12705
|
+
$$render(consequent_2);
|
|
12796
12706
|
});
|
|
12797
12707
|
}
|
|
12798
|
-
var
|
|
12708
|
+
var node_3 = sibling(node_2, 2);
|
|
12799
12709
|
{
|
|
12800
|
-
var
|
|
12801
|
-
var div_3 =
|
|
12710
|
+
var consequent_3 = ($$anchor2) => {
|
|
12711
|
+
var div_3 = root_4();
|
|
12802
12712
|
var text_4 = child(div_3, true);
|
|
12803
12713
|
reset(div_3);
|
|
12804
12714
|
template_effect(() => {
|
|
@@ -12807,9 +12717,9 @@ function Input($$anchor, $$props) {
|
|
|
12807
12717
|
});
|
|
12808
12718
|
append($$anchor2, div_3);
|
|
12809
12719
|
};
|
|
12810
|
-
if_block(
|
|
12720
|
+
if_block(node_3, ($$render) => {
|
|
12811
12721
|
if (get2(errorText))
|
|
12812
|
-
$$render(
|
|
12722
|
+
$$render(consequent_3);
|
|
12813
12723
|
});
|
|
12814
12724
|
}
|
|
12815
12725
|
reset(div);
|
|
@@ -12818,21 +12728,20 @@ function Input($$anchor, $$props) {
|
|
|
12818
12728
|
set_attribute2(div, "data-required", get2(required) ? "true" : undefined);
|
|
12819
12729
|
set_attribute2(div, "data-readonly", get2(readonly) ? "true" : undefined);
|
|
12820
12730
|
set_attribute2(div_1, "data-has-unit", get2(unitText) ? "true" : undefined);
|
|
12821
|
-
set_attribute2(
|
|
12822
|
-
set_attribute2(
|
|
12823
|
-
set_attribute2(
|
|
12824
|
-
set_attribute2(
|
|
12825
|
-
set_attribute2(
|
|
12826
|
-
|
|
12827
|
-
|
|
12828
|
-
|
|
12829
|
-
|
|
12830
|
-
set_attribute2(
|
|
12831
|
-
set_attribute2(
|
|
12832
|
-
set_attribute2(
|
|
12833
|
-
set_attribute2(
|
|
12834
|
-
set_attribute2(
|
|
12835
|
-
set_attribute2(input_1, "aria-invalid", get2(invalid2) ? "true" : undefined);
|
|
12731
|
+
set_attribute2(input, "id", get2(inputId));
|
|
12732
|
+
set_attribute2(input, "type", $0);
|
|
12733
|
+
set_attribute2(input, "inputmode", $1);
|
|
12734
|
+
set_attribute2(input, "name", $2);
|
|
12735
|
+
set_attribute2(input, "placeholder", $3);
|
|
12736
|
+
input.disabled = get2(disabled);
|
|
12737
|
+
input.readOnly = get2(readonly);
|
|
12738
|
+
input.required = get2(required);
|
|
12739
|
+
set_attribute2(input, "min", $4);
|
|
12740
|
+
set_attribute2(input, "max", $5);
|
|
12741
|
+
set_attribute2(input, "step", $6);
|
|
12742
|
+
set_attribute2(input, "aria-label", get2(computedAriaLabel) || undefined);
|
|
12743
|
+
set_attribute2(input, "aria-describedby", get2(describedBy) || undefined);
|
|
12744
|
+
set_attribute2(input, "aria-invalid", get2(invalid2) ? "true" : undefined);
|
|
12836
12745
|
}, [
|
|
12837
12746
|
() => inputType(),
|
|
12838
12747
|
() => text2(get2(p).type, "text") === "engineering" ? "decimal" : undefined,
|
|
@@ -12842,12 +12751,12 @@ function Input($$anchor, $$props) {
|
|
|
12842
12751
|
() => get2(p).max === undefined ? undefined : text2(get2(p).max),
|
|
12843
12752
|
() => get2(p).step === undefined ? undefined : text2(get2(p).step)
|
|
12844
12753
|
]);
|
|
12845
|
-
delegated("input",
|
|
12846
|
-
bind_value(
|
|
12754
|
+
delegated("input", input, update2);
|
|
12755
|
+
bind_value(input, () => get2(value), ($$value) => set(value, $$value));
|
|
12847
12756
|
append($$anchor, div);
|
|
12848
12757
|
pop();
|
|
12849
12758
|
}
|
|
12850
|
-
delegate(["input"
|
|
12759
|
+
delegate(["input"]);
|
|
12851
12760
|
|
|
12852
12761
|
// src/components/svelte/input/RadioGroup.svelte
|
|
12853
12762
|
var root_34 = from_html(`<span> </span>`);
|
|
@@ -12963,6 +12872,7 @@ function RadioGroup($$anchor, $$props) {
|
|
|
12963
12872
|
reset(label2);
|
|
12964
12873
|
reset(span_1);
|
|
12965
12874
|
template_effect(($0, $1, $2) => {
|
|
12875
|
+
set_attribute2(label2, "data-disabled", get2(disabled) ? "true" : undefined);
|
|
12966
12876
|
set_attribute2(input, "name", $0);
|
|
12967
12877
|
set_value(input, $1);
|
|
12968
12878
|
set_checked(input, get2(itemValue) === get2(value));
|
|
@@ -12998,7 +12908,7 @@ var root_35 = from_html(`<span> </span>`);
|
|
|
12998
12908
|
var root_16 = from_html(`<label class="slex-select-label"><!> <!></label>`);
|
|
12999
12909
|
var root_8 = from_html(`<span class="slex-select-check" aria-hidden="true"></span>`);
|
|
13000
12910
|
var root_6 = from_html(`<li role="option"><span class="slex-select-option-label"><!> <span> </span></span> <!></li>`);
|
|
13001
|
-
var
|
|
12911
|
+
var root_52 = from_html(`<ul class="slex-select-menu" role="listbox"></ul>`);
|
|
13002
12912
|
var root_9 = from_html(`<option> </option>`);
|
|
13003
12913
|
var root10 = from_html(`<div class="slex-select"><!> <button type="button" class="slex-select-trigger" aria-haspopup="listbox"><span class="slex-select-value"><!> <span> </span></span> <span class="slex-select-icon" aria-hidden="true"></span></button> <!> <select class="slex-select-native" tabindex="-1" aria-hidden="true"><option> </option><!></select></div>`);
|
|
13004
12914
|
function Select($$anchor, $$props) {
|
|
@@ -13202,7 +13112,7 @@ function Select($$anchor, $$props) {
|
|
|
13202
13112
|
var node_4 = sibling(button, 2);
|
|
13203
13113
|
{
|
|
13204
13114
|
var consequent_6 = ($$anchor2) => {
|
|
13205
|
-
var ul =
|
|
13115
|
+
var ul = root_52();
|
|
13206
13116
|
each(ul, 21, () => get2(options), index, ($$anchor3, item, index2) => {
|
|
13207
13117
|
const isSelected = user_derived(() => get2(item).value === text2(get2(value)));
|
|
13208
13118
|
const isActive = user_derived(() => index2 === get2(activeIndex));
|
|
@@ -16053,7 +15963,7 @@ function TabItem($$anchor, $$props) {
|
|
|
16053
15963
|
delegate(["click"]);
|
|
16054
15964
|
|
|
16055
15965
|
// src/components/svelte/input/Tabs.svelte
|
|
16056
|
-
var
|
|
15966
|
+
var root_53 = from_html(`<span class="slex-sr-only"> </span>`);
|
|
16057
15967
|
var root_36 = from_html(`<!> <!>`, 1);
|
|
16058
15968
|
var root_82 = from_html(`<div></div>`);
|
|
16059
15969
|
var root_18 = from_html(`<!> <span class="slex-tabs-selected-indicator" aria-hidden="true"></span>`, 1);
|
|
@@ -16231,7 +16141,7 @@ function Tabs2($$anchor, $$props) {
|
|
|
16231
16141
|
var node_4 = sibling(node_3, 2);
|
|
16232
16142
|
{
|
|
16233
16143
|
var consequent_1 = ($$anchor5) => {
|
|
16234
|
-
var span =
|
|
16144
|
+
var span = root_53();
|
|
16235
16145
|
var text_1 = child(span, true);
|
|
16236
16146
|
reset(span);
|
|
16237
16147
|
template_effect(() => set_text(text_1, get2(label2)));
|
|
@@ -16671,7 +16581,7 @@ var root_43 = from_svg(`<svg fill="currentColor" viewBox="0 0 20 20" xmlns="http
|
|
|
16671
16581
|
var root_111 = from_html(`<button><!> <!></button>`);
|
|
16672
16582
|
var root_62 = from_html(`<span class="sr-only"> </span>`);
|
|
16673
16583
|
var root_83 = from_svg(`<svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>`);
|
|
16674
|
-
var
|
|
16584
|
+
var root_54 = from_html(`<a><!> <!></a>`);
|
|
16675
16585
|
function CloseButton($$anchor, $$props) {
|
|
16676
16586
|
push($$props, true);
|
|
16677
16587
|
let color = prop($$props, "color", 3, "gray"), name = prop($$props, "name", 3, "Close"), size = prop($$props, "size", 3, "md"), restProps = rest_props($$props, [
|
|
@@ -16745,7 +16655,7 @@ function CloseButton($$anchor, $$props) {
|
|
|
16745
16655
|
append($$anchor2, button);
|
|
16746
16656
|
};
|
|
16747
16657
|
var alternate_2 = ($$anchor2) => {
|
|
16748
|
-
var a =
|
|
16658
|
+
var a = root_54();
|
|
16749
16659
|
attribute_effect(a, ($0) => ({
|
|
16750
16660
|
...restProps,
|
|
16751
16661
|
onclick,
|
|
@@ -17378,11 +17288,21 @@ function Text2($$anchor, $$props) {
|
|
|
17378
17288
|
push($$props, true);
|
|
17379
17289
|
let p = state(proxy({}));
|
|
17380
17290
|
user_effect(() => bindPropStore($$props.props, (next2) => set(p, next2, true)));
|
|
17291
|
+
const color = user_derived(() => get2(p).color == null || get2(p).color === "" ? undefined : text2(get2(p).color));
|
|
17292
|
+
const size = user_derived(() => cssLength(get2(p).size));
|
|
17293
|
+
function cssLength(value) {
|
|
17294
|
+
if (value == null || value === "")
|
|
17295
|
+
return;
|
|
17296
|
+
const rendered = text2(value);
|
|
17297
|
+
return /^-?\d+(\.\d+)?$/.test(rendered) ? `${rendered}px` : rendered;
|
|
17298
|
+
}
|
|
17381
17299
|
var div = root20();
|
|
17300
|
+
let styles;
|
|
17382
17301
|
var text_1 = child(div, true);
|
|
17383
17302
|
reset(div);
|
|
17384
17303
|
template_effect(($0, $1) => {
|
|
17385
17304
|
set_class(div, 1, $0);
|
|
17305
|
+
styles = set_style(div, "", styles, { color: get2(color), "font-size": get2(size) });
|
|
17386
17306
|
set_text(text_1, $1);
|
|
17387
17307
|
}, [
|
|
17388
17308
|
() => `slex-text${get2(p).variant ? ` slex-text--${text2(get2(p).variant)}` : ""}${get2(p).class ? ` ${text2(get2(p).class)}` : ""}`,
|
|
@@ -17554,7 +17474,7 @@ var root_311 = from_html(`<span> </span>`);
|
|
|
17554
17474
|
var root_45 = from_html(`<span class="slex-code-block-language"> </span>`);
|
|
17555
17475
|
var root_114 = from_html(`<figcaption class="slex-code-block-header"><span class="slex-code-block-title"><!> <!></span> <!></figcaption>`);
|
|
17556
17476
|
var root_72 = from_html(`<span> </span>`);
|
|
17557
|
-
var
|
|
17477
|
+
var root_55 = from_html(`<span class="slex-code-line"><span class="slex-code-line-content"></span></span>`);
|
|
17558
17478
|
var root22 = from_html(`<figure class="slex-code-block"><!> <pre class="slex-code-block-pre"><code></code></pre></figure>`);
|
|
17559
17479
|
function CodeBlock($$anchor, $$props) {
|
|
17560
17480
|
push($$props, true);
|
|
@@ -17723,7 +17643,7 @@ function CodeBlock($$anchor, $$props) {
|
|
|
17723
17643
|
var pre = sibling(node, 2);
|
|
17724
17644
|
var code_1 = child(pre);
|
|
17725
17645
|
each(code_1, 21, () => get2(lines), index, ($$anchor2, line) => {
|
|
17726
|
-
var span_3 =
|
|
17646
|
+
var span_3 = root_55();
|
|
17727
17647
|
var span_4 = child(span_3);
|
|
17728
17648
|
each(span_4, 21, () => get2(line), index, ($$anchor3, token) => {
|
|
17729
17649
|
var fragment_1 = comment();
|
|
@@ -31863,7 +31783,7 @@ function Table($$anchor, $$props) {
|
|
|
31863
31783
|
|
|
31864
31784
|
// src/components/svelte/content/Section.svelte
|
|
31865
31785
|
var root_28 = from_html(`<div class="slex-section-eyebrow"> </div>`);
|
|
31866
|
-
var
|
|
31786
|
+
var root_56 = from_html(`<span> </span>`);
|
|
31867
31787
|
var root_313 = from_html(`<h2 class="slex-section-title"><!><!></h2>`);
|
|
31868
31788
|
var root_65 = from_html(`<p class="slex-section-subtitle"> </p>`);
|
|
31869
31789
|
var root_73 = from_html(`<a class="slex-section-action"> </a>`);
|
|
@@ -31914,7 +31834,7 @@ function Section($$anchor, $$props) {
|
|
|
31914
31834
|
var node_4 = sibling(node_3);
|
|
31915
31835
|
{
|
|
31916
31836
|
var consequent_2 = ($$anchor4) => {
|
|
31917
|
-
var span =
|
|
31837
|
+
var span = root_56();
|
|
31918
31838
|
var text_2 = child(span, true);
|
|
31919
31839
|
reset(span);
|
|
31920
31840
|
template_effect(($0) => set_text(text_2, $0), [() => text2(get2(p).title)]);
|
package/dist/types/version.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare const SLEXKIT_VERSION = "0.3.
|
|
1
|
+
export declare const SLEXKIT_VERSION = "0.3.1";
|
|
2
2
|
export declare const SLEX_PROTOCOL_VERSION = "0.1";
|
|
3
|
-
export declare const SLEXKIT_COMPONENTS_VERSION = "0.3.
|
|
3
|
+
export declare const SLEXKIT_COMPONENTS_VERSION = "0.3.1";
|
|
4
4
|
export declare function getSlexKitInfo(): {
|
|
5
5
|
version: string;
|
|
6
6
|
protocolVersion: string;
|