npm - @idealyst/components - Versions diffs - 1.0.24 → 1.0.25 - Mend

@idealyst/components 1.0.24 → 1.0.25

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.

Files changed (110) hide show

package/README.md +567 -567
package/package.json +2 -2
package/plugin/web.js +319 -185
package/src/Avatar/Avatar.native.tsx +43 -43
package/src/Avatar/Avatar.styles.tsx +66 -66
package/src/Avatar/Avatar.web.tsx +50 -50
package/src/Avatar/index.native.ts +1 -1
package/src/Avatar/index.ts +1 -1
package/src/Avatar/index.web.ts +1 -1
package/src/Avatar/types.ts +42 -42
package/src/Badge/Badge.native.tsx +42 -42
package/src/Badge/Badge.styles.tsx +153 -153
package/src/Badge/Badge.web.tsx +44 -44
package/src/Badge/index.native.ts +1 -1
package/src/Badge/index.ts +1 -1
package/src/Badge/index.web.ts +1 -1
package/src/Badge/types.ts +33 -33
package/src/Button/Button.native.tsx +38 -38
package/src/Button/Button.styles.tsx +214 -214
package/src/Button/Button.types.ts +11 -11
package/src/Button/Button.web.tsx +55 -55
package/src/Button/index.native.ts +2 -2
package/src/Button/index.ts +4 -4
package/src/Button/index.web.ts +2 -2
package/src/Button/types.ts +48 -48
package/src/Card/Card.native.tsx +51 -51
package/src/Card/Card.styles.tsx +239 -239
package/src/Card/Card.web.tsx +61 -61
package/src/Card/index.native.ts +2 -2
package/src/Card/index.ts +4 -4
package/src/Card/index.web.ts +2 -2
package/src/Card/types.ts +58 -58
package/src/Checkbox/Checkbox.native.tsx +98 -98
package/src/Checkbox/Checkbox.styles.tsx +291 -291
package/src/Checkbox/Checkbox.web.tsx +130 -130
package/src/Checkbox/index.native.ts +2 -2
package/src/Checkbox/index.ts +4 -4
package/src/Checkbox/index.web.ts +2 -2
package/src/Checkbox/types.ts +78 -78
package/src/Divider/Divider.native.tsx +144 -144
package/src/Divider/Divider.styles.tsx +601 -601
package/src/Divider/Divider.web.tsx +72 -72
package/src/Divider/index.native.ts +2 -2
package/src/Divider/index.ts +4 -4
package/src/Divider/index.web.ts +2 -2
package/src/Divider/types.ts +53 -53
package/src/Icon/Icon.native.tsx +38 -38
package/src/Icon/Icon.styles.tsx +49 -49
package/src/Icon/Icon.web.tsx +46 -46
package/src/Icon/icon-types.ts +7452 -7452
package/src/Icon/index.native.ts +2 -2
package/src/Icon/index.ts +4 -4
package/src/Icon/index.web.ts +2 -2
package/src/Icon/types.ts +35 -35
package/src/Input/Input.native.tsx +74 -74
package/src/Input/Input.styles.tsx +176 -176
package/src/Input/Input.web.tsx +70 -70
package/src/Input/index.native.ts +2 -2
package/src/Input/index.ts +4 -4
package/src/Input/index.web.ts +2 -2
package/src/Input/types.ts +68 -68
package/src/Screen/Screen.native.tsx +40 -40
package/src/Screen/Screen.styles.tsx +59 -59
package/src/Screen/Screen.web.tsx +32 -32
package/src/Screen/index.native.ts +1 -1
package/src/Screen/index.ts +1 -1
package/src/Screen/index.web.ts +1 -1
package/src/Screen/types.ts +37 -37
package/src/Text/Text.native.tsx +35 -35
package/src/Text/Text.styles.tsx +66 -66
package/src/Text/Text.web.tsx +40 -40
package/src/Text/index.native.ts +2 -2
package/src/Text/index.ts +4 -4
package/src/Text/index.web.ts +2 -2
package/src/Text/types.ts +38 -38
package/src/View/View.native.tsx +55 -55
package/src/View/View.styles.tsx +102 -102
package/src/View/View.web.tsx +59 -59
package/src/View/index.native.ts +2 -2
package/src/View/index.ts +4 -4
package/src/View/index.web.ts +2 -2
package/src/View/types.ts +72 -72
package/src/examples/AllExamples.tsx +71 -71
package/src/examples/AvatarExamples.tsx +96 -96
package/src/examples/BadgeExamples.tsx +199 -199
package/src/examples/ButtonExamples.tsx +149 -149
package/src/examples/CardExamples.tsx +175 -175
package/src/examples/CheckboxExamples.tsx +216 -216
package/src/examples/DividerExamples.tsx +217 -217
package/src/examples/IconExamples.tsx +341 -341
package/src/examples/InputExamples.tsx +133 -133
package/src/examples/README.md +135 -135
package/src/examples/ScreenExamples.tsx +153 -153
package/src/examples/TextExamples.tsx +88 -88
package/src/examples/ThemeExtensionExamples.tsx +90 -90
package/src/examples/ValidationExamples.tsx +94 -94
package/src/examples/ViewExamples.tsx +128 -128
package/src/examples/extendedTheme.ts +328 -328
package/src/examples/index.ts +14 -14
package/src/index.native.ts +48 -48
package/src/index.ts +47 -47
package/src/theme/breakpoints.ts +8 -8
package/src/theme/colorResolver.ts +217 -217
package/src/theme/colors.ts +314 -314
package/src/theme/defaultThemes.ts +325 -325
package/src/theme/index.ts +187 -187
package/src/theme/themeBuilder.ts +601 -601
package/src/theme/unistyles.d.ts +5 -5
package/src/theme/variantHelpers.ts +583 -583
package/src/theme/variants.ts +55 -55

package/src/examples/CheckboxExamples.tsx CHANGED Viewed

@@ -1,217 +1,217 @@
-import React, { useState } from 'react';
-import { Screen, View, Text, Checkbox } from '../index';
-export const CheckboxExamples = () => {
-  const [basicChecked, setBasicChecked] = useState(false);
-  const [primaryChecked, setPrimaryChecked] = useState(true);
-  const [successChecked, setSuccessChecked] = useState(false);
-  const [errorChecked, setErrorChecked] = useState(false);
-  const [indeterminateChecked, setIndeterminateChecked] = useState(false);
-  return (
-    <Screen background="primary" padding="lg">
-      <View spacing="none">
-      <Text size="large" weight="bold" align="center">
-        Checkbox Examples
-      </Text>
-      {/* Basic Checkbox */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">Basic Checkbox</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            checked={basicChecked}
-            onCheckedChange={setBasicChecked}
-            label="Basic checkbox"
-          />
-          <Checkbox
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Checked checkbox"
-          />
-          <Checkbox
-            checked={false}
-            onCheckedChange={() => {}}
-            label="Unchecked checkbox"
-          />
-        </View>
-      </View>
-      {/* Checkbox Sizes */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">Sizes</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            size="small"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Small checkbox"
-          />
-          <Checkbox
-            size="medium"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Medium checkbox"
-          />
-          <Checkbox
-            size="large"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Large checkbox"
-          />
-        </View>
-      </View>
-      {/* Checkbox Intents */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">Intents</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            intent="primary"
-            checked={primaryChecked}
-            onCheckedChange={setPrimaryChecked}
-            label="Primary checkbox"
-          />
-          <Checkbox
-            intent="neutral"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Neutral checkbox"
-          />
-          <Checkbox
-            intent="success"
-            checked={successChecked}
-            onCheckedChange={setSuccessChecked}
-            label="Success checkbox"
-          />
-          <Checkbox
-            intent="error"
-            checked={errorChecked}
-            onCheckedChange={setErrorChecked}
-            label="Error checkbox"
-          />
-          <Checkbox
-            intent="warning"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Warning checkbox"
-          />
-          <Checkbox
-            intent="info"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Info checkbox"
-          />
-        </View>
-      </View>
-      {/* Checkbox Variants */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">Variants</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            variant="default"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Default variant"
-          />
-          <Checkbox
-            variant="outlined"
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Outlined variant"
-          />
-        </View>
-      </View>
-      {/* Checkbox States */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">States</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            checked={false}
-            onCheckedChange={() => {}}
-            label="Normal state"
-          />
-          <Checkbox
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Checked state"
-          />
-          <Checkbox
-            indeterminate={true}
-            checked={indeterminateChecked}
-            onCheckedChange={setIndeterminateChecked}
-            label="Indeterminate state"
-          />
-          <Checkbox
-            checked={true}
-            disabled
-            onCheckedChange={() => {}}
-            label="Disabled checked"
-          />
-          <Checkbox
-            checked={false}
-            disabled
-            onCheckedChange={() => {}}
-            label="Disabled unchecked"
-          />
-        </View>
-      </View>
-      {/* Checkbox with Custom Children */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">Custom Content</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            checked={true}
-            onCheckedChange={() => {}}
-          >
-            <Text>Custom label with </Text>
-            <Text weight="bold" color="primary">styled text</Text>
-          </Checkbox>
-          <Checkbox
-            checked={false}
-            onCheckedChange={() => {}}
-          >
-            <View>
-              <Text weight="semibold">Multi-line Label</Text>
-              <Text size="small" color="secondary">
-                This checkbox has a more complex label with multiple lines
-              </Text>
-            </View>
-          </Checkbox>
-        </View>
-      </View>
-      {/* Checkbox with Helper Text and Errors */}
-      <View spacing="md">
-        <Text size="medium" weight="semibold">With Helper Text</Text>
-        <View spacing="sm" style={{ gap: 10 }}>
-          <Checkbox
-            checked={true}
-            onCheckedChange={() => {}}
-            label="Checkbox with helper text"
-            helperText="This is some helpful information"
-          />
-          <Checkbox
-            checked={false}
-            onCheckedChange={() => {}}
-            label="Checkbox with error"
-            error="This field is required"
-            intent="error"
-          />
-          <Checkbox
-            checked={false}
-            onCheckedChange={() => {}}
-            label="Required checkbox"
-            required
-            helperText="This checkbox is required"
-          />
-        </View>
-      </View>
-    </View>
-    </Screen>
-  );
+import React, { useState } from 'react';
+import { Screen, View, Text, Checkbox } from '../index';
+export const CheckboxExamples = () => {
+  const [basicChecked, setBasicChecked] = useState(false);
+  const [primaryChecked, setPrimaryChecked] = useState(true);
+  const [successChecked, setSuccessChecked] = useState(false);
+  const [errorChecked, setErrorChecked] = useState(false);
+  const [indeterminateChecked, setIndeterminateChecked] = useState(false);
+  return (
+    <Screen background="primary" padding="lg">
+      <View spacing="none">
+      <Text size="large" weight="bold" align="center">
+        Checkbox Examples
+      </Text>
+      {/* Basic Checkbox */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">Basic Checkbox</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            checked={basicChecked}
+            onCheckedChange={setBasicChecked}
+            label="Basic checkbox"
+          />
+          <Checkbox
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Checked checkbox"
+          />
+          <Checkbox
+            checked={false}
+            onCheckedChange={() => {}}
+            label="Unchecked checkbox"
+          />
+        </View>
+      </View>
+      {/* Checkbox Sizes */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">Sizes</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            size="small"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Small checkbox"
+          />
+          <Checkbox
+            size="medium"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Medium checkbox"
+          />
+          <Checkbox
+            size="large"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Large checkbox"
+          />
+        </View>
+      </View>
+      {/* Checkbox Intents */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">Intents</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            intent="primary"
+            checked={primaryChecked}
+            onCheckedChange={setPrimaryChecked}
+            label="Primary checkbox"
+          />
+          <Checkbox
+            intent="neutral"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Neutral checkbox"
+          />
+          <Checkbox
+            intent="success"
+            checked={successChecked}
+            onCheckedChange={setSuccessChecked}
+            label="Success checkbox"
+          />
+          <Checkbox
+            intent="error"
+            checked={errorChecked}
+            onCheckedChange={setErrorChecked}
+            label="Error checkbox"
+          />
+          <Checkbox
+            intent="warning"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Warning checkbox"
+          />
+          <Checkbox
+            intent="info"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Info checkbox"
+          />
+        </View>
+      </View>
+      {/* Checkbox Variants */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">Variants</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            variant="default"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Default variant"
+          />
+          <Checkbox
+            variant="outlined"
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Outlined variant"
+          />
+        </View>
+      </View>
+      {/* Checkbox States */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">States</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            checked={false}
+            onCheckedChange={() => {}}
+            label="Normal state"
+          />
+          <Checkbox
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Checked state"
+          />
+          <Checkbox
+            indeterminate={true}
+            checked={indeterminateChecked}
+            onCheckedChange={setIndeterminateChecked}
+            label="Indeterminate state"
+          />
+          <Checkbox
+            checked={true}
+            disabled
+            onCheckedChange={() => {}}
+            label="Disabled checked"
+          />
+          <Checkbox
+            checked={false}
+            disabled
+            onCheckedChange={() => {}}
+            label="Disabled unchecked"
+          />
+        </View>
+      </View>
+      {/* Checkbox with Custom Children */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">Custom Content</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            checked={true}
+            onCheckedChange={() => {}}
+          >
+            <Text>Custom label with </Text>
+            <Text weight="bold" color="primary">styled text</Text>
+          </Checkbox>
+          <Checkbox
+            checked={false}
+            onCheckedChange={() => {}}
+          >
+            <View>
+              <Text weight="semibold">Multi-line Label</Text>
+              <Text size="small" color="secondary">
+                This checkbox has a more complex label with multiple lines
+              </Text>
+            </View>
+          </Checkbox>
+        </View>
+      </View>
+      {/* Checkbox with Helper Text and Errors */}
+      <View spacing="md">
+        <Text size="medium" weight="semibold">With Helper Text</Text>
+        <View spacing="sm" style={{ gap: 10 }}>
+          <Checkbox
+            checked={true}
+            onCheckedChange={() => {}}
+            label="Checkbox with helper text"
+            helperText="This is some helpful information"
+          />
+          <Checkbox
+            checked={false}
+            onCheckedChange={() => {}}
+            label="Checkbox with error"
+            error="This field is required"
+            intent="error"
+          />
+          <Checkbox
+            checked={false}
+            onCheckedChange={() => {}}
+            label="Required checkbox"
+            required
+            helperText="This checkbox is required"
+          />
+        </View>
+      </View>
+    </View>
+    </Screen>
+  );
 };