@saschabrunnerch/arcgis-maps-sdk-js-ai-context 0.0.1

package/contexts/4.34/claude/arcgis-arcade/SKILL.md

@@ -0,0 +1,366 @@
+---
+name: arcgis-arcade
+description: Write Arcade expressions for dynamic calculations in popups, renderers, labels, and field calculations. Use for data-driven styling, custom labels, and computed fields.
+---
+
+# ArcGIS Arcade Expressions
+
+Use this skill for writing Arcade expressions for popups, renderers, labels, and calculations.
+
+## Arcade Basics
+
+Arcade is an expression language for ArcGIS. It's used for:
+- Dynamic popup content
+- Data-driven rendering
+- Custom labels
+- Field calculations
+- Form validation
+
+### Basic Syntax
+```arcade
+// Variables
+var population = $feature.population;
+var area = $feature.area_sqkm;
+
+// Calculations
+var density = population / area;
+
+// Return result
+return Round(density, 2);
+```
+
+## Arcade in PopupTemplates
+
+### Expression Infos
+```javascript
+const popupTemplate = {
+  title: "{name}",
+  expressionInfos: [
+    {
+      name: "population-density",
+      title: "Population Density",
+      expression: "Round($feature.population / $feature.area_sqkm, 2)"
+    },
+    {
+      name: "formatted-date",
+      title: "Formatted Date",
+      expression: "Text($feature.created_date, 'MMMM D, YYYY')"
+    }
+  ],
+  content: "Density: {expression/population-density} people/km²"
+};
+```
+
+### Complex Expressions
+```javascript
+const popupTemplate = {
+  title: "{name}",
+  expressionInfos: [{
+    name: "predominant-category",
+    title: "Predominant Category",
+    expression: `
+      var fields = [
+        { value: $feature.category_a, alias: "Category A" },
+        { value: $feature.category_b, alias: "Category B" },
+        { value: $feature.category_c, alias: "Category C" }
+      ];
+
+      var maxValue = -Infinity;
+      var maxCategory = "";
+
+      for (var i in fields) {
+        if (fields[i].value > maxValue) {
+          maxValue = fields[i].value;
+          maxCategory = fields[i].alias;
+        }
+      }
+
+      return maxCategory;
+    `
+  }],
+  content: [
+    {
+      type: "text",
+      text: "The predominant category is: {expression/predominant-category}"
+    },
+    {
+      type: "fields",
+      fieldInfos: [{
+        fieldName: "expression/predominant-category"
+      }]
+    }
+  ]
+};
+```
+
+## Arcade in Renderers
+
+### Value Expression
+```javascript
+const renderer = {
+  type: "unique-value",
+  valueExpression: `
+    var labor = $feature.labor_force;
+    var notLabor = $feature.not_in_labor_force;
+
+    if (labor > notLabor) {
+      return "In labor force";
+    } else {
+      return "Not in labor force";
+    }
+  `,
+  valueExpressionTitle: "Labor Force Status",
+  uniqueValueInfos: [
+    {
+      value: "In labor force",
+      symbol: { type: "simple-fill", color: "blue" }
+    },
+    {
+      value: "Not in labor force",
+      symbol: { type: "simple-fill", color: "orange" }
+    }
+  ]
+};
+```
+
+### Visual Variable Expression
+```javascript
+const renderer = {
+  type: "simple",
+  symbol: { type: "simple-marker", color: "red" },
+  visualVariables: [{
+    type: "size",
+    valueExpression: "Sqrt($feature.population) * 0.1",
+    valueExpressionTitle: "Population (scaled)",
+    stops: [
+      { value: 10, size: 4 },
+      { value: 100, size: 40 }
+    ]
+  }, {
+    type: "opacity",
+    valueExpression: "($feature.value / $feature.max_value) * 100",
+    valueExpressionTitle: "Percentage of max",
+    stops: [
+      { value: 20, opacity: 0.2 },
+      { value: 80, opacity: 1 }
+    ]
+  }]
+};
+```
+
+## Arcade in Labels
+
+```javascript
+layer.labelingInfo = [{
+  symbol: {
+    type: "text",
+    color: "black",
+    font: { size: 10 }
+  },
+  labelExpressionInfo: {
+    expression: `
+      var name = $feature.name;
+      var pop = $feature.population;
+
+      if (pop > 1000000) {
+        return name + " (" + Round(pop/1000000, 1) + "M)";
+      } else if (pop > 1000) {
+        return name + " (" + Round(pop/1000, 0) + "K)";
+      }
+      return name;
+    `
+  },
+  where: "population > 50000"
+}];
+```
+
+## Common Arcade Functions
+
+### Math Functions
+```arcade
+Round(3.14159, 2)        // 3.14
+Floor(3.9)               // 3
+Ceil(3.1)                // 4
+Abs(-5)                  // 5
+Sqrt(16)                 // 4
+Pow(2, 3)                // 8
+Min(1, 2, 3)             // 1
+Max(1, 2, 3)             // 3
+Sum([1, 2, 3])           // 6
+Mean([1, 2, 3])          // 2
+```
+
+### Text Functions
+```arcade
+Upper("hello")           // "HELLO"
+Lower("HELLO")           // "hello"
+Trim("  hello  ")        // "hello"
+Left("hello", 2)         // "he"
+Right("hello", 2)        // "lo"
+Mid("hello", 2, 2)       // "ll"
+Find("l", "hello")       // 2
+Replace("hello", "l", "L") // "heLLo"
+Split("a,b,c", ",")      // ["a", "b", "c"]
+Concatenate(["a", "b"])  // "ab"
+```
+
+### Date Functions
+```arcade
+Now()                                    // Current date/time
+Today()                                  // Current date
+Year($feature.date_field)               // Extract year
+Month($feature.date_field)              // Extract month (1-12)
+Day($feature.date_field)                // Extract day
+DateDiff(Now(), $feature.date, "days")  // Days between dates
+Text($feature.date, "MMMM D, YYYY")     // Format date
+```
+
+### Geometry Functions
+```arcade
+Area($feature, "square-kilometers")
+Length($feature, "kilometers")
+Centroid($feature)
+Buffer($feature, 100, "meters")
+Intersects($feature, $otherFeature)
+Contains($feature, $point)
+```
+
+### Conditional Functions
+```arcade
+// IIf (inline if)
+IIf($feature.value > 100, "High", "Low")
+
+// When (multiple conditions)
+When(
+  $feature.type == "A", "Type A",
+  $feature.type == "B", "Type B",
+  "Other"
+)
+
+// Decode (value matching)
+Decode($feature.code,
+  1, "One",
+  2, "Two",
+  3, "Three",
+  "Unknown"
+)
+```
+
+### Array Functions
+```arcade
+var arr = [1, 2, 3, 4, 5];
+
+Count(arr)               // 5
+First(arr)               // 1
+Last(arr)                // 5
+IndexOf(arr, 3)          // 2
+Includes(arr, 3)         // true
+Push(arr, 6)             // [1, 2, 3, 4, 5, 6]
+Reverse(arr)             // [5, 4, 3, 2, 1]
+Sort(arr)                // [1, 2, 3, 4, 5]
+Slice(arr, 1, 3)         // [2, 3]
+```
+
+## Feature Access
+
+```arcade
+// Current feature
+$feature.fieldName
+
+// All features in layer (for aggregation)
+var allFeatures = FeatureSet($layer);
+var filtered = Filter(allFeatures, "type = 'A'");
+var total = Sum(filtered, "value");
+
+// Related records
+var related = FeatureSetByRelationshipName($feature, "relationshipName");
+
+// Global variables
+$map                     // Reference to map
+$view                    // Reference to view
+$datastore               // Reference to data store
+```
+
+## Execute Arcade Programmatically
+
+```javascript
+import Arcade from "@arcgis/core/arcade/Arcade.js";
+
+// Create profile
+const profile = {
+  variables: [{
+    name: "$feature",
+    type: "feature"
+  }]
+};
+
+// Compile expression
+const executor = await Arcade.createArcadeExecutor(
+  "Round($feature.value * 100, 2)",
+  profile
+);
+
+// Execute with feature
+const result = executor.execute({
+  $feature: graphic
+});
+
+console.log("Result:", result);
+```
+
+## Arcade in HTML (Script Tags)
+
+```html
+<script type="text/plain" id="my-expression">
+  var total = $feature.value_a + $feature.value_b;
+  var percentage = Round((total / $feature.max_value) * 100, 1);
+  return percentage + "%";
+</script>
+
+<script type="module">
+  const expression = document.getElementById("my-expression").text;
+
+  const popupTemplate = {
+    expressionInfos: [{
+      name: "my-calc",
+      expression: expression
+    }],
+    content: "Value: {expression/my-calc}"
+  };
+</script>
+```
+
+## TypeScript Usage
+
+Arcade expression configurations use autocasting. For TypeScript safety, use `as const`:
+
+```typescript
+// Use 'as const' for expression-based visualizations
+layer.renderer = {
+  type: "simple",
+  symbol: { type: "simple-marker" },
+  visualVariables: [{
+    type: "size",
+    valueExpression: "$feature.population / $feature.area",
+    stops: [
+      { value: 50, size: 4 },
+      { value: 500, size: 20 }
+    ]
+  }]
+} as const;
+```
+
+> **Tip:** See [arcgis-core-maps skill](../arcgis-core-maps/SKILL.md) for detailed guidance on autocasting vs explicit classes.
+
+## Common Pitfalls
+
+1. **Null values**: Check for nulls with `IsEmpty($feature.field)`
+
+2. **Type coercion**: Use `Number()` or `Text()` for explicit conversion
+
+3. **Case sensitivity**: Arcade is case-insensitive for functions but field names match exactly
+
+4. **Performance**: Complex expressions in renderers can slow performance
+
+5. **Debugging**: Use `Console()` function to debug expressions
+

package/contexts/4.34/claude/arcgis-authentication/SKILL.md

@@ -0,0 +1,301 @@
+---
+name: arcgis-authentication
+description: Implement authentication with ArcGIS using OAuth 2.0, API keys, and identity management. Use for accessing secured services, portal items, and user-specific content.
+---
+
+# ArcGIS Authentication
+
+Use this skill for implementing authentication, OAuth, API keys, and identity management.
+
+## OAuth 2.0 Authentication
+
+### Basic OAuth Setup
+```javascript
+import OAuthInfo from "@arcgis/core/identity/OAuthInfo.js";
+import esriId from "@arcgis/core/identity/IdentityManager.js";
+import Portal from "@arcgis/core/portal/Portal.js";
+
+// Create OAuthInfo with your app ID
+const oauthInfo = new OAuthInfo({
+  appId: "YOUR_APP_ID", // Register at developers.arcgis.com
+  popup: false // false = redirect, true = popup window
+});
+
+// Register with IdentityManager
+esriId.registerOAuthInfos([oauthInfo]);
+```
+
+### Check Sign-In Status
+```javascript
+async function checkSignIn() {
+  try {
+    await esriId.checkSignInStatus(oauthInfo.portalUrl + "/sharing");
+    // User is signed in
+    const portal = new Portal({ authMode: "immediate" });
+    await portal.load();
+    console.log("Signed in as:", portal.user.username);
+    return portal;
+  } catch {
+    // User is not signed in
+    console.log("Not signed in");
+    return null;
+  }
+}
+```
+
+### Sign In
+```javascript
+async function signIn() {
+  try {
+    const credential = await esriId.getCredential(
+      oauthInfo.portalUrl + "/sharing"
+    );
+    console.log("Credential obtained:", credential);
+    return credential;
+  } catch (error) {
+    console.error("Sign in failed:", error);
+  }
+}
+```
+
+### Sign Out
+```javascript
+function signOut() {
+  esriId.destroyCredentials();
+  window.location.reload();
+}
+```
+
+### Complete OAuth Flow
+```javascript
+import OAuthInfo from "@arcgis/core/identity/OAuthInfo.js";
+import esriId from "@arcgis/core/identity/IdentityManager.js";
+import Portal from "@arcgis/core/portal/Portal.js";
+
+const oauthInfo = new OAuthInfo({
+  appId: "YOUR_APP_ID"
+});
+
+esriId.registerOAuthInfos([oauthInfo]);
+
+// Check if already signed in
+esriId.checkSignInStatus(oauthInfo.portalUrl + "/sharing")
+  .then(() => {
+    // Already signed in, load portal
+    const portal = new Portal({ authMode: "immediate" });
+    return portal.load();
+  })
+  .then((portal) => {
+    console.log("Welcome,", portal.user.fullName);
+    displayUserContent(portal);
+  })
+  .catch(() => {
+    // Not signed in, show sign-in button
+    showSignInButton();
+  });
+
+function showSignInButton() {
+  const btn = document.getElementById("signInBtn");
+  btn.onclick = () => {
+    esriId.getCredential(oauthInfo.portalUrl + "/sharing")
+      .then(() => {
+        window.location.reload();
+      });
+  };
+}
+```
+
+## OAuth Component
+
+```html
+<!-- Using OAuth component -->
+<arcgis-oauth app-id="YOUR_APP_ID"></arcgis-oauth>
+
+<script type="module">
+  const oauthComponent = document.querySelector("arcgis-oauth");
+
+  oauthComponent.addEventListener("arcgisSignIn", (event) => {
+    console.log("Signed in:", event.detail.credential);
+  });
+
+  oauthComponent.addEventListener("arcgisSignOut", () => {
+    console.log("Signed out");
+  });
+</script>
+```
+
+## API Keys
+
+### Configure API Key
+```javascript
+import esriConfig from "@arcgis/core/config.js";
+
+// Set API key for accessing services
+esriConfig.apiKey = "YOUR_API_KEY";
+
+// Now basemaps and services will use the API key
+const map = new Map({
+  basemap: "arcgis/streets" // Requires API key
+});
+```
+
+### API Key in HTML
+```html
+<script>
+  // Set before loading the SDK
+  window.esriConfig = {
+    apiKey: "YOUR_API_KEY"
+  };
+</script>
+<script src="https://js.arcgis.com/4.34/"></script>
+```
+
+## Enterprise Portal Authentication
+
+### Configure for Enterprise Portal
+```javascript
+const oauthInfo = new OAuthInfo({
+  appId: "YOUR_APP_ID",
+  portalUrl: "https://your-portal.com/portal",
+  popup: true
+});
+
+esriId.registerOAuthInfos([oauthInfo]);
+```
+
+### Set Portal URL Globally
+```javascript
+import esriConfig from "@arcgis/core/config.js";
+
+esriConfig.portalUrl = "https://your-portal.com/portal";
+```
+
+## Token-Based Authentication
+
+### Get Token Manually
+```javascript
+const credential = await esriId.getCredential("https://services.arcgis.com/...");
+console.log("Token:", credential.token);
+console.log("Expires:", new Date(credential.expires));
+```
+
+### Register Token
+```javascript
+esriId.registerToken({
+  server: "https://services.arcgis.com/",
+  token: "YOUR_TOKEN"
+});
+```
+
+## Portal User Information
+
+```javascript
+import Portal from "@arcgis/core/portal/Portal.js";
+
+const portal = new Portal({ authMode: "immediate" });
+await portal.load();
+
+// User info
+console.log("Username:", portal.user.username);
+console.log("Full name:", portal.user.fullName);
+console.log("Email:", portal.user.email);
+console.log("Role:", portal.user.role);
+console.log("Thumbnail:", portal.user.thumbnailUrl);
+
+// Organization info
+console.log("Org name:", portal.name);
+console.log("Org ID:", portal.id);
+```
+
+## Query User Items
+
+```javascript
+import Portal from "@arcgis/core/portal/Portal.js";
+import PortalQueryParams from "@arcgis/core/portal/PortalQueryParams.js";
+
+const portal = new Portal({ authMode: "immediate" });
+await portal.load();
+
+// Query user's items
+const queryParams = new PortalQueryParams({
+  query: `owner:${portal.user.username}`,
+  sortField: "modified",
+  sortOrder: "desc",
+  num: 20
+});
+
+const result = await portal.queryItems(queryParams);
+
+result.results.forEach(item => {
+  console.log(item.title, item.type, item.id);
+});
+```
+
+## Credential Persistence
+
+```javascript
+// Credentials are stored in localStorage by default
+// Disable persistence
+esriId.useSignInPage = false;
+
+// Clear stored credentials
+esriId.destroyCredentials();
+
+// Check for stored credentials on load
+const credentials = esriId.credentials;
+```
+
+## Handling Authentication Errors
+
+```javascript
+// Global handler for authentication challenges
+esriId.on("credential-create", (event) => {
+  console.log("New credential created:", event.credential);
+});
+
+// Handle layer authentication errors
+layer.on("layerview-create-error", (event) => {
+  if (event.error.name === "identity-manager:not-authorized") {
+    console.log("Authentication required for this layer");
+    signIn();
+  }
+});
+```
+
+## Trusted Servers
+
+```javascript
+import esriConfig from "@arcgis/core/config.js";
+
+// Add servers that should receive credentials automatically
+esriConfig.request.trustedServers.push("https://services.arcgis.com");
+esriConfig.request.trustedServers.push("https://your-server.com");
+```
+
+## CORS and Proxy
+
+```javascript
+import esriConfig from "@arcgis/core/config.js";
+
+// Configure proxy for cross-origin requests
+esriConfig.request.proxyUrl = "/proxy/";
+
+// Configure proxy rules
+esriConfig.request.proxyRules.push({
+  urlPrefix: "https://services.arcgis.com",
+  proxyUrl: "/proxy/"
+});
+```
+
+## Common Pitfalls
+
+1. **App ID registration**: App ID must be registered with correct redirect URIs
+
+2. **Popup blockers**: OAuth popups may be blocked - use redirect flow as fallback
+
+3. **Token expiration**: Tokens expire - handle refresh or re-authentication
+
+4. **CORS errors**: Configure trusted servers or use proxy for cross-origin
+
+5. **Portal URL mismatch**: Ensure portal URL matches exactly (trailing slashes matter)
+