Josh Comments - Answer Overflow

I was hoping not to use anything internal if I could help it for future proofing concerns but also I couldn't really figure out just by looking at the docs how to do this most efficiently

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

Interesting, it might be easier to iterate through these regexes to get schema properties rather than do it myself? There are so many ways I could do this now that I'll have to think about it haha

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

The schema will always be static and known at compile time but I hope to make the UI components generic over any schema and hopefully as type-safe as possible

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

Hmm props does seem like another good option. I was also thinking about just converting it to a JSON schema and doing it that way but I guess props keeps more arktype specific information?

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

I was thinking .get was nice for it's type safe object path Parameters<typeof schema.get> 🤔 not sure that's a good idea though

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

My plan was to make a vue library, kind of similar to vee-validate, for a personal project of mine. API would be something like this:

<template>
  <Form :schema>
    <FormControl :schema :path="['color', 'r']" />
    <FormControl :schema :path="['color', 'g']" />
    <FormControl :schema :path="['color', 'b']" />
  </Form>
</template>

<script setup lang="ts">
const { type } from 'arktype';

const schema = type({
  color: {
    r: '0 <= number.integer <= 255',
    g: '0 <= number.integer <= 255',
    b: '0 <= number.integer <= 255',
  }
})
</script>

<template>
  <Form :schema>
    <FormControl :schema :path="['color', 'r']" />
    <FormControl :schema :path="['color', 'g']" />
    <FormControl :schema :path="['color', 'b']" />
  </Form>
</template>

<script setup lang="ts">
const { type } from 'arktype';

const schema = type({
  color: {
    r: '0 <= number.integer <= 255',
    g: '0 <= number.integer <= 255',
    b: '0 <= number.integer <= 255',
  }
})
</script>

Each <FormControl> would render label, input and description HTML elements that take from info from arktype schema. Since the path leads to a number type, it would automatically render as a slider with the min, max and default values taken from the arktype validation. My project is basically an editor for a decently large and nested JSON object so I thought this would be a nice way to avoid specifying things like min and max values multiple times throughout the project.

37 replies

Aarktype

•Created by Josh on 3/24/2025 in #questions

Trying to index an array type with .get(...path)

Thinking about it some more I guess the behaviour isn't black and white. I thought it was nice that you could pass through path as if it were using optional chaining:

const schema = type({
  people: type({
    'names?': type({
      first: 'string | undefined',
    }).array(),
  }).array(),
});
// Prints string | undefined
console.log(schema.get('people', 0, 'names', 0, 'first').expression);

const schema = type({
  people: type({
    'names?': type({
      first: 'string | undefined',
    }).array(),
  }).array(),
});
// Prints string | undefined
console.log(schema.get('people', 0, 'names', 0, 'first').expression);

But then you don't know where the | undefined comes from. Also TS errors when .get has more than 3 arguments, lol I guess I'm using the wrong tool for the job I'm also using the select function, it seemed perfect for this and its the reason I chose arktype :) Although I didn't know it was powerful enough to traverse the whole structure which is why I was using it in conjunction with .get(). I'll take a look through the source!

37 replies

Gaming

Programming